Merge branch 'main' of http://192.168.110.2:3000/taoge/mk_system into szq
@ -5,11 +5,13 @@ VITE_APP_TITLE = 煤科建管平台
|
|||||||
VITE_APP_ENV = 'development'
|
VITE_APP_ENV = 'development'
|
||||||
|
|
||||||
# 开发环境
|
# 开发环境
|
||||||
VITE_APP_BASE_API = 'http://192.168.110.180:8899'
|
# VITE_APP_BASE_API = 'http://192.168.110.180:8899'
|
||||||
# 李陈杰 209
|
# 李陈杰 209
|
||||||
# VITE_APP_BASE_API = 'http://192.168.110.209:8899'
|
# VITE_APP_BASE_API = 'http://192.168.110.209:8899'
|
||||||
|
# 李陈杰 209
|
||||||
|
VITE_APP_BASE_API = 'http://192.168.110.180:8899'
|
||||||
# 曾涛
|
# 曾涛
|
||||||
# VITE_APP_BASE_API = 'http://192.168.110.180:8899'
|
# VITE_APP_BASE_API = 'http://192.168.110.149:8899'
|
||||||
# 罗成
|
# 罗成
|
||||||
# VITE_APP_BASE_API = 'http://192.168.110.188:8899'
|
# VITE_APP_BASE_API = 'http://192.168.110.188:8899'
|
||||||
# 朱银
|
# 朱银
|
||||||
@ -17,8 +19,10 @@ VITE_APP_BASE_API = 'http://192.168.110.180:8899'
|
|||||||
#曾涛
|
#曾涛
|
||||||
# VITE_APP_BASE_API = 'http://192.168.110.171:8899'
|
# VITE_APP_BASE_API = 'http://192.168.110.171:8899'
|
||||||
|
|
||||||
# 无人机接口地址
|
# ws
|
||||||
|
VITE_APP_BASE_WS_API = 'ws://192.168.110.149:8899/resource/websocket'
|
||||||
|
|
||||||
|
# 无人机接口地址
|
||||||
VITE_APP_BASE_DRONE_API = 'http://58.17.134.85:9512'
|
VITE_APP_BASE_DRONE_API = 'http://58.17.134.85:9512'
|
||||||
|
|
||||||
# 应用访问路径 例如使用前缀 /admin/
|
# 应用访问路径 例如使用前缀 /admin/
|
||||||
|
BIN
public/assets/demo/Weather.png
Normal file
After Width: | Height: | Size: 9.2 KiB |
BIN
public/assets/demo/beUnder.png
Normal file
After Width: | Height: | Size: 4.5 KiB |
BIN
public/assets/demo/bigRain.png
Normal file
After Width: | Height: | Size: 7.3 KiB |
BIN
public/assets/demo/bigSnow.png
Normal file
After Width: | Height: | Size: 7.1 KiB |
BIN
public/assets/demo/cloudy.png
Normal file
After Width: | Height: | Size: 7.1 KiB |
BIN
public/assets/demo/contract.png
Normal file
After Width: | Height: | Size: 4.3 KiB |
BIN
public/assets/demo/fog.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
public/assets/demo/haze.png
Normal file
After Width: | Height: | Size: 6.9 KiB |
BIN
public/assets/demo/manyCloud.png
Normal file
After Width: | Height: | Size: 9.7 KiB |
BIN
public/assets/demo/nightSunny.png
Normal file
After Width: | Height: | Size: 5.1 KiB |
BIN
public/assets/demo/rainSnow.png
Normal file
After Width: | Height: | Size: 7.2 KiB |
BIN
public/assets/demo/sandstorm.png
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
public/assets/demo/smallRain.png
Normal file
After Width: | Height: | Size: 7.1 KiB |
BIN
public/assets/demo/smallSnow.png
Normal file
After Width: | Height: | Size: 7.1 KiB |
BIN
public/assets/demo/sunny copy.png
Normal file
After Width: | Height: | Size: 4.2 KiB |
BIN
public/assets/demo/thunderstorm.png
Normal file
After Width: | Height: | Size: 8.4 KiB |
BIN
public/assets/demo/todayConstruction.png
Normal file
After Width: | Height: | Size: 3.9 KiB |
BIN
public/assets/demo/totalCapacity.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
1
public/vite.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
After Width: | Height: | Size: 1.5 KiB |
BIN
public/xx.xlsx
Normal file
44
src/api/enterpriseLarge/index.ts
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
import request from '@/utils/request';
|
||||||
|
import { AxiosPromise } from 'axios';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询企业关键指标
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const keyIndex = () => {
|
||||||
|
return request({
|
||||||
|
url: '/enterprise/big/screen/keyIndex',
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 每个项目的出勤人数
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const projectAttendanceCount = () => {
|
||||||
|
return request({
|
||||||
|
url: '/enterprise/big/screen/projectAttendanceCount',
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 人数统计
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const peopleCount = () => {
|
||||||
|
return request({
|
||||||
|
url: '/enterprise/big/screen/peopleCount',
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 出勤人数统计
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const allAttendanceCount = () => {
|
||||||
|
return request({
|
||||||
|
url: '/enterprise/big/screen/allAttendanceCount',
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
};
|
@ -98,3 +98,18 @@ export const cashTotal = () => {
|
|||||||
method: 'get'
|
method: 'get'
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
//安全天数
|
||||||
|
export const getSafetyDay = (projectId) => {
|
||||||
|
return request({
|
||||||
|
url: '/money/big/screen/safetyDay/' + projectId,
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
//安全天数
|
||||||
|
export const getWeather = (projectId) => {
|
||||||
|
return request({
|
||||||
|
url: '/money/big/screen/weather/' + projectId,
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
};
|
@ -53,7 +53,6 @@ export interface MaterialReceiveVO {
|
|||||||
* 备注
|
* 备注
|
||||||
*/
|
*/
|
||||||
remark: string;
|
remark: string;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface MaterialReceiveForm extends BaseEntity {
|
export interface MaterialReceiveForm extends BaseEntity {
|
||||||
@ -156,11 +155,13 @@ export interface MaterialReceiveForm extends BaseEntity {
|
|||||||
* 备注
|
* 备注
|
||||||
*/
|
*/
|
||||||
remark?: string;
|
remark?: string;
|
||||||
|
/**
|
||||||
|
* 附件
|
||||||
|
*/
|
||||||
|
attachmentId?: string | number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface MaterialReceiveQuery extends PageQuery {
|
export interface MaterialReceiveQuery extends PageQuery {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 项目id
|
* 项目id
|
||||||
*/
|
*/
|
||||||
@ -201,11 +202,8 @@ export interface MaterialReceiveQuery extends PageQuery {
|
|||||||
*/
|
*/
|
||||||
supplierUnit?: string;
|
supplierUnit?: string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 日期范围参数
|
* 日期范围参数
|
||||||
*/
|
*/
|
||||||
params?: any;
|
params?: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
43
src/api/outputApi/index.ts
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
import request from '@/utils/request';
|
||||||
|
import { AxiosPromise } from 'axios';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询项目数据
|
||||||
|
* @param query
|
||||||
|
* @returns {*}
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const projectProgress = (query?: any): any => {
|
||||||
|
return request({
|
||||||
|
url: '/enterprise/big/screen/projectProgress',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 产值
|
||||||
|
* @param query
|
||||||
|
* @returns {*}
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const outpuProgress = (query?: any): any => {
|
||||||
|
return request({
|
||||||
|
url: '/enterprise/big/screen/projectOutputValueComparison',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
});
|
||||||
|
};
|
||||||
|
/**
|
||||||
|
* 预警
|
||||||
|
* @param query
|
||||||
|
* @returns {*}
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const earlyWarning = (query?: any): any => {
|
||||||
|
return request({
|
||||||
|
url: '/enterprise/big/screen/riskEarlyWarning',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
});
|
||||||
|
};
|
@ -64,3 +64,27 @@ export const getScreenGeneralize = (projectId: number | string) => {
|
|||||||
method: 'get',
|
method: 'get',
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 获取gps数据
|
||||||
|
export const getGps = (projectId) => {
|
||||||
|
return request({
|
||||||
|
url: '/project/big/screen/getClientList/' + projectId,
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
};
|
||||||
|
// 选中列表
|
||||||
|
export const getSelectList = (params) => {
|
||||||
|
return request({
|
||||||
|
url: '/project/big/screen/getList',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
});
|
||||||
|
};
|
||||||
|
// 设置选中
|
||||||
|
export const setSelect = (data) => {
|
||||||
|
return request({
|
||||||
|
url: '/project/big/screen/setList',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
};
|
@ -61,3 +61,22 @@ export const delSupplierInput = (id: string | number | Array<string | number>) =
|
|||||||
method: 'delete'
|
method: 'delete'
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
//导入供商入库
|
||||||
|
export const leadingIn = (formData: FormData, projectId) => {
|
||||||
|
return request({
|
||||||
|
url: '/supplierInput/supplierInput/import?projectId=' + projectId,
|
||||||
|
method: 'post',
|
||||||
|
data: formData,
|
||||||
|
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'multipart/form-data'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
//导入供商出库
|
||||||
|
export const leadingOut = () => {
|
||||||
|
return request({
|
||||||
|
url: '/supplierInput/supplierInput/export',
|
||||||
|
method: 'post'
|
||||||
|
});
|
||||||
|
};
|
||||||
|
@ -31,3 +31,20 @@ export function delOss(ossId: string | number | Array<string | number>) {
|
|||||||
export function downLoadOss(ossId: { id?: string | number; idList?: string | number | Array<string | number> }, url: string, fileName: string) {
|
export function downLoadOss(ossId: { id?: string | number; idList?: string | number | Array<string | number> }, url: string, fileName: string) {
|
||||||
return download(url, ossId, fileName);
|
return download(url, ossId, fileName);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//识别身份证
|
||||||
|
export function recognizeidCard(data: any, type: any) {
|
||||||
|
return request({
|
||||||
|
url: '/contractor/constructionUser/idCard?idCardSide=' + type,
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//识别银行卡
|
||||||
|
export function recognizeBankCard(data: any) {
|
||||||
|
return request({
|
||||||
|
url: '/contractor/constructionUser/bankCard',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
@ -31,6 +31,7 @@ export interface FlowTaskVO {
|
|||||||
version?: string;
|
version?: string;
|
||||||
applyNode?: boolean;
|
applyNode?: boolean;
|
||||||
buttonList?: buttonList[];
|
buttonList?: buttonList[];
|
||||||
|
projectName?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface buttonList {
|
export interface buttonList {
|
||||||
|
@ -12,7 +12,8 @@ export default {
|
|||||||
businessId: routerJumpVo.businessId,
|
businessId: routerJumpVo.businessId,
|
||||||
type: routerJumpVo.type,
|
type: routerJumpVo.type,
|
||||||
planMonth: routerJumpVo.planMonth,
|
planMonth: routerJumpVo.planMonth,
|
||||||
taskId: routerJumpVo.taskId
|
taskId: routerJumpVo.taskId,
|
||||||
|
projectName: routerJumpVo.projectName
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -4,6 +4,7 @@ export interface RouterJumpVo {
|
|||||||
type: string;
|
type: string;
|
||||||
formCustom: string;
|
formCustom: string;
|
||||||
formPath: string;
|
formPath: string;
|
||||||
|
projectName?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface StartProcessBo {
|
export interface StartProcessBo {
|
||||||
|
BIN
src/assets/images/beUnder.png
Normal file
After Width: | Height: | Size: 4.5 KiB |
BIN
src/assets/images/break.png
Normal file
After Width: | Height: | Size: 1.7 KiB |
BIN
src/assets/images/constructor.png
Normal file
After Width: | Height: | Size: 40 KiB |
BIN
src/assets/images/contract.png
Normal file
After Width: | Height: | Size: 4.3 KiB |
BIN
src/assets/images/man.png
Normal file
After Width: | Height: | Size: 26 KiB |
BIN
src/assets/images/manager.png
Normal file
After Width: | Height: | Size: 37 KiB |
BIN
src/assets/images/map.png
Normal file
After Width: | Height: | Size: 360 KiB |
BIN
src/assets/images/subcontractor.png
Normal file
After Width: | Height: | Size: 35 KiB |
BIN
src/assets/images/todayConstruction.png
Normal file
After Width: | Height: | Size: 3.9 KiB |
BIN
src/assets/images/totalCapacity.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
src/assets/large/actual.png
Normal file
After Width: | Height: | Size: 23 KiB |
BIN
src/assets/large/capacity.png
Normal file
After Width: | Height: | Size: 24 KiB |
BIN
src/assets/large/delay.png
Normal file
After Width: | Height: | Size: 26 KiB |
BIN
src/assets/large/plan.png
Normal file
After Width: | Height: | Size: 26 KiB |
@ -1,29 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="upload-file">
|
<div class="upload-file">
|
||||||
<el-upload
|
<el-upload ref="fileUploadRef" multiple :action="realUploadUrl" :before-upload="handleBeforeUpload"
|
||||||
ref="fileUploadRef"
|
:file-list="fileList" :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed"
|
||||||
multiple
|
:on-success="handleUploadSuccess" :show-file-list="showFileList" :on-preview="handlePreview" :headers="headers"
|
||||||
:action="realUploadUrl"
|
class="upload-file-uploader" :list-type="isConstruction ? 'picture-card' : 'text'" :accept="accept" :drag="isDarg"
|
||||||
:before-upload="handleBeforeUpload"
|
:data="data" :auto-upload="autoUpload" :on-change="handleChange" :on-remove="handleRemove" :method="method"
|
||||||
:file-list="fileList"
|
:http-request="customUpload">
|
||||||
:limit="limit"
|
|
||||||
:on-error="handleUploadError"
|
|
||||||
:on-exceed="handleExceed"
|
|
||||||
:on-success="handleUploadSuccess"
|
|
||||||
:show-file-list="showFileList"
|
|
||||||
:on-preview="handlePreview"
|
|
||||||
:headers="headers"
|
|
||||||
class="upload-file-uploader"
|
|
||||||
:list-type="isConstruction ? 'picture-card' : 'text'"
|
|
||||||
:accept="accept"
|
|
||||||
:drag="isDarg"
|
|
||||||
:data="data"
|
|
||||||
:auto-upload="autoUpload"
|
|
||||||
:on-change="handleChange"
|
|
||||||
:on-remove="handleRemove"
|
|
||||||
:method="method"
|
|
||||||
:http-request="customUpload"
|
|
||||||
>
|
|
||||||
<slot>
|
<slot>
|
||||||
<div>
|
<div>
|
||||||
<!-- 上传按钮 -->
|
<!-- 上传按钮 -->
|
||||||
@ -42,20 +24,10 @@
|
|||||||
的文件
|
的文件
|
||||||
</div>
|
</div>
|
||||||
<!-- 文件列表 -->
|
<!-- 文件列表 -->
|
||||||
<transition-group
|
<transition-group v-if="!isConstruction && !isImportInfo"
|
||||||
v-if="!isConstruction && !isImportInfo"
|
class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul" @click.stop>
|
||||||
class="upload-file-list el-upload-list el-upload-list--text"
|
<li style="margin-top: 10px" v-for="(file, index) in fileList" :key="file.uid"
|
||||||
name="el-fade-in-linear"
|
class="el-upload-list__item ele-upload-list__item-content" v-if="autoUpload">
|
||||||
tag="ul"
|
|
||||||
@click.stop
|
|
||||||
>
|
|
||||||
<li
|
|
||||||
style="margin-top: 10px"
|
|
||||||
v-for="(file, index) in fileList"
|
|
||||||
:key="file.uid"
|
|
||||||
class="el-upload-list__item ele-upload-list__item-content"
|
|
||||||
v-if="autoUpload"
|
|
||||||
>
|
|
||||||
<el-link :href="`${file.url}`" :underline="false" target="_blank">
|
<el-link :href="`${file.url}`" :underline="false" target="_blank">
|
||||||
<span class="el-icon-document"> {{ getFileName(file.name) }} </span>
|
<span class="el-icon-document"> {{ getFileName(file.name) }} </span>
|
||||||
</el-link>
|
</el-link>
|
||||||
@ -305,8 +277,6 @@ const handleChange = (file: any, filelist: any) => {
|
|||||||
|
|
||||||
// 删除文件
|
// 删除文件
|
||||||
const handleRemove = (file: any, fileList: any) => {
|
const handleRemove = (file: any, fileList: any) => {
|
||||||
console.log(11);
|
|
||||||
|
|
||||||
emit('handleRemove', file, fileList);
|
emit('handleRemove', file, fileList);
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -470,7 +440,7 @@ defineExpose({ submitUpload });
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> span {
|
>span {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -41,7 +41,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { listByIds, delOss } from '@/api/system/oss';
|
import { listByIds, delOss, recognizeidCard, recognizeBankCard } from '@/api/system/oss';
|
||||||
import { OssVO } from '@/api/system/oss/types';
|
import { OssVO } from '@/api/system/oss/types';
|
||||||
import { propTypes } from '@/utils/propTypes';
|
import { propTypes } from '@/utils/propTypes';
|
||||||
import { globalHeaders } from '@/utils/request';
|
import { globalHeaders } from '@/utils/request';
|
||||||
@ -69,11 +69,15 @@ const props = defineProps({
|
|||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
// 压缩目标大小,单位KB。默认300KB以上文件才压缩,并压缩至300KB以内
|
// 压缩目标大小,单位KB。默认300KB以上文件才压缩,并压缩至300KB以内
|
||||||
compressTargetSize: propTypes.number.def(300)
|
compressTargetSize: propTypes.number.def(300),
|
||||||
|
idCardType: {
|
||||||
|
type: String,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
const emit = defineEmits(['update:modelValue']);
|
const emit = defineEmits(['update:modelValue', 'success']);
|
||||||
const number = ref(0);
|
const number = ref(0);
|
||||||
const uploadList = ref<any[]>([]);
|
const uploadList = ref<any[]>([]);
|
||||||
const dialogImageUrl = ref('');
|
const dialogImageUrl = ref('');
|
||||||
@ -121,7 +125,7 @@ watch(
|
|||||||
);
|
);
|
||||||
|
|
||||||
/** 上传前loading加载 */
|
/** 上传前loading加载 */
|
||||||
const handleBeforeUpload = (file: any) => {
|
const handleBeforeUpload = async (file: any) => {
|
||||||
let isImg = false;
|
let isImg = false;
|
||||||
if (props.fileType.length) {
|
if (props.fileType.length) {
|
||||||
let fileExtension = '';
|
let fileExtension = '';
|
||||||
@ -169,10 +173,32 @@ const handleExceed = () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// 上传成功回调
|
// 上传成功回调
|
||||||
const handleUploadSuccess = (res: any, file: UploadFile) => {
|
const handleUploadSuccess = async (res: any, file: UploadFile) => {
|
||||||
if (res.code === 200) {
|
if (res.code === 200) {
|
||||||
uploadList.value.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
|
uploadList.value.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
|
||||||
uploadedSuccessfully();
|
uploadedSuccessfully();
|
||||||
|
if (props.idCardType) {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file.raw); // 假设后端接收的字段名为file
|
||||||
|
if (props.idCardType === 'front' || props.idCardType === 'back') {
|
||||||
|
const res = await recognizeidCard(formData, props.idCardType);
|
||||||
|
if (res.code === 200) {
|
||||||
|
proxy?.$modal.msgSuccess('身份证识别成功');
|
||||||
|
emit('success', res.data);
|
||||||
|
} else {
|
||||||
|
proxy?.$modal.msgError('身份证识别失败');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (props.idCardType === 'bank') {
|
||||||
|
const res = await recognizeBankCard(formData);
|
||||||
|
if (res.code === 200) {
|
||||||
|
proxy?.$modal.msgSuccess('银行卡识别成功');
|
||||||
|
emit('success', res.data);
|
||||||
|
} else {
|
||||||
|
proxy?.$modal.msgError('银行卡识别失败');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
number.value--;
|
number.value--;
|
||||||
proxy?.$modal.closeLoading();
|
proxy?.$modal.closeLoading();
|
||||||
@ -201,8 +227,7 @@ const uploadedSuccessfully = () => {
|
|||||||
fileList.value = fileList.value.filter((f) => f.url !== undefined).concat(uploadList.value);
|
fileList.value = fileList.value.filter((f) => f.url !== undefined).concat(uploadList.value);
|
||||||
uploadList.value = [];
|
uploadList.value = [];
|
||||||
number.value = 0;
|
number.value = 0;
|
||||||
console.log(fileList.value);
|
console.log(listToString(fileList.value));
|
||||||
|
|
||||||
emit('update:modelValue', listToString(fileList.value));
|
emit('update:modelValue', listToString(fileList.value));
|
||||||
proxy?.$modal.closeLoading();
|
proxy?.$modal.closeLoading();
|
||||||
}
|
}
|
||||||
|
@ -1,15 +1,18 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="display: flex; justify-content: space-between">
|
<div>
|
||||||
<div>
|
<div style="display: flex; justify-content: space-between">
|
||||||
<el-button v-if="submitButtonShow" :loading="props.buttonLoading" type="info" @click="submitForm('draft')">暂存</el-button>
|
<div>
|
||||||
<el-button v-if="submitButtonShow" :loading="props.buttonLoading" type="primary" @click="submitForm('submit')">提 交</el-button>
|
<el-button v-if="submitButtonShow" :loading="props.buttonLoading" type="info" @click="submitForm('draft')">暂存</el-button>
|
||||||
<el-button v-if="approvalButtonShow" :loading="props.buttonLoading" type="primary" @click="approvalVerifyOpen">审批</el-button>
|
<el-button v-if="submitButtonShow" :loading="props.buttonLoading" type="primary" @click="submitForm('submit')">提 交</el-button>
|
||||||
<el-button v-if="props.id && props.status !== 'draft'" type="primary" @click="handleApprovalRecord">流程进度</el-button>
|
<el-button v-if="approvalButtonShow" :loading="props.buttonLoading" type="primary" @click="approvalVerifyOpen">审批</el-button>
|
||||||
<slot />
|
<el-button v-if="props.id && props.status !== 'draft'" type="primary" @click="handleApprovalRecord">流程进度</el-button>
|
||||||
</div>
|
<slot />
|
||||||
<div>
|
</div>
|
||||||
<el-button style="float: right" @click="goBack()">返回</el-button>
|
<div>
|
||||||
|
<el-button style="float: right" @click="goBack()">返回</el-button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<h3 v-if="props.projectName" class="text-lg font-semibold text-gray-800">项目名称:{{ props.projectName }}</h3>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
@ -22,7 +25,8 @@ const props = defineProps({
|
|||||||
status: propTypes.string.def(''),
|
status: propTypes.string.def(''),
|
||||||
pageType: propTypes.string.def(''),
|
pageType: propTypes.string.def(''),
|
||||||
buttonLoading: propTypes.bool.def(false),
|
buttonLoading: propTypes.bool.def(false),
|
||||||
id: propTypes.string.def('') || propTypes.number.def()
|
id: propTypes.string.def('') || propTypes.number.def(),
|
||||||
|
projectName: propTypes.string.def('')
|
||||||
});
|
});
|
||||||
const emits = defineEmits(['submitForm', 'approvalVerifyOpen', 'handleApprovalRecord']);
|
const emits = defineEmits(['submitForm', 'approvalVerifyOpen', 'handleApprovalRecord']);
|
||||||
//暂存,提交
|
//暂存,提交
|
||||||
|
@ -9,7 +9,7 @@ import animate from '@/animate';
|
|||||||
import { download as dl } from '@/utils/request';
|
import { download as dl } from '@/utils/request';
|
||||||
import { useDict } from '@/utils/dict';
|
import { useDict } from '@/utils/dict';
|
||||||
import { getConfigKey, updateConfigByKey } from '@/api/system/config';
|
import { getConfigKey, updateConfigByKey } from '@/api/system/config';
|
||||||
import { parseTime, addDateRange, handleTree, selectDictLabel, selectDictLabels } from '@/utils/ruoyi';
|
import { parseTime, addDateRange, handleTree, selectDictLabel, selectDictLabels,formatPrice } from '@/utils/ruoyi';
|
||||||
import { downloadFile } from '@/utils/useFileDownload';
|
import { downloadFile } from '@/utils/useFileDownload';
|
||||||
|
|
||||||
import { App } from 'vue';
|
import { App } from 'vue';
|
||||||
@ -42,4 +42,5 @@ export default function installPlugin(app: App) {
|
|||||||
app.config.globalProperties.selectDictLabels = selectDictLabels;
|
app.config.globalProperties.selectDictLabels = selectDictLabels;
|
||||||
app.config.globalProperties.animate = animate;
|
app.config.globalProperties.animate = animate;
|
||||||
app.config.globalProperties.downloadFile = downloadFile;
|
app.config.globalProperties.downloadFile = downloadFile;
|
||||||
|
app.config.globalProperties.formatPrice = formatPrice;
|
||||||
}
|
}
|
||||||
|
@ -72,9 +72,15 @@ export const constantRoutes: RouteRecordRaw[] = [
|
|||||||
component: () => import('@/views/error/401.vue'),
|
component: () => import('@/views/error/401.vue'),
|
||||||
hidden: true
|
hidden: true
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
path: '/ProjectScreen',
|
path: '/ProjectScreen',
|
||||||
component: () => import('@/views/ProjectScreen/index.vue'),
|
component: () => import('@/views/projectLarge/ProjectScreen/index.vue'),
|
||||||
|
hidden: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/digitalizationScreen',
|
||||||
|
component: () => import('@/views/enterpriseLarge/digitalizationScreen/index.vue'),
|
||||||
hidden: true
|
hidden: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -62,7 +62,23 @@ export const addDateRange = (params: any, dateRange: any[], propName?: string) =
|
|||||||
}
|
}
|
||||||
return search;
|
return search;
|
||||||
};
|
};
|
||||||
|
// 价格格式化函数
|
||||||
|
export const formatPrice = (price, show = true) => {
|
||||||
|
if ((!show && price == 0) || price == '' || price == undefined || price == null) return '';
|
||||||
|
if (!price && price !== 0) return '0.0000';
|
||||||
|
|
||||||
|
// 转换为数字并保留四位小数
|
||||||
|
const num = Number(price);
|
||||||
|
if (isNaN(num)) return '0.0000';
|
||||||
|
|
||||||
|
const fixedNum = num.toFixed(4);
|
||||||
|
const [integer, decimal] = fixedNum.split('.');
|
||||||
|
|
||||||
|
// 千分位处理
|
||||||
|
const formattedInteger = integer.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
||||||
|
|
||||||
|
return `${formattedInteger}.${decimal}`;
|
||||||
|
};
|
||||||
// 回显数据字典
|
// 回显数据字典
|
||||||
export const selectDictLabel = (datas: any, value: number | string) => {
|
export const selectDictLabel = (datas: any, value: number | string) => {
|
||||||
if (value === undefined) {
|
if (value === undefined) {
|
||||||
|
@ -58,18 +58,18 @@
|
|||||||
<el-card shadow="never" class="mb8">
|
<el-card shadow="never" class="mb8">
|
||||||
<el-table ref="tableRef" v-loading="loading" :data="tableData" row-key="id" border lazy default-expand-all>
|
<el-table ref="tableRef" v-loading="loading" :data="tableData" row-key="id" border lazy default-expand-all>
|
||||||
<el-table-column prop="num" label="编号" />
|
<el-table-column prop="num" label="编号" />
|
||||||
<el-table-column prop="name" label="工程或费用名称" />
|
<el-table-column prop="name" label="工程或费用名称" />
|
||||||
<el-table-column prop="unit" label="单位" align="center" />
|
<el-table-column prop="unit" label="单位" align="center" />
|
||||||
<el-table-column prop="quantity" label="数量" align="center" />
|
<el-table-column prop="quantity" label="数量" align="center" />
|
||||||
<el-table-column prop="specification" label="规格" align="center" />
|
<el-table-column prop="specification" label="规格" align="center" />
|
||||||
<el-table-column prop="remark" label="单价" align="center">
|
<el-table-column label="单价" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ scope.row.unitPrice }}</span>
|
{{ proxy.formatPrice(scope.row.unitPrice) }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="price" label="总价" align="center">
|
<el-table-column prop="price" label="总价" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
{{ scope.row.price }}
|
{{ proxy.formatPrice(scope.row.price) }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<!-- <el-table-column prop="price" label="操作" align="center">
|
<!-- <el-table-column prop="price" label="操作" align="center">
|
||||||
@ -92,7 +92,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useUserStoreHook } from '@/store/modules/user';
|
import { useUserStoreHook } from '@/store/modules/user';
|
||||||
import { BiddingImportExcelFile, getTreeLimit, biddingLimitListUpdate, sheetList, obtainAllVersionNumbers } from '@/api/bidding/biddingLimit';
|
import { BiddingImportExcelFile, getTreeLimit, biddingLimitListUpdate, sheetList, obtainAllVersionNumbers } from '@/api/bidding/biddingLimit';
|
||||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { proxy } = getCurrentInstance() as any;
|
||||||
|
|
||||||
const userStore = useUserStoreHook();
|
const userStore = useUserStoreHook();
|
||||||
const currentProject = computed(() => userStore.selectedProject);
|
const currentProject = computed(() => userStore.selectedProject);
|
||||||
|
@ -167,7 +167,7 @@ const reset = () => {
|
|||||||
form.value = { ...initFormData };
|
form.value = { ...initFormData };
|
||||||
leaveFormRef.value?.resetFields();
|
leaveFormRef.value?.resetFields();
|
||||||
};
|
};
|
||||||
|
const projectId = ref('');
|
||||||
/** 获取详情 */
|
/** 获取详情 */
|
||||||
const getInfo = () => {
|
const getInfo = () => {
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
@ -175,6 +175,7 @@ const getInfo = () => {
|
|||||||
nextTick(async () => {
|
nextTick(async () => {
|
||||||
const res = await getVersionDetail(routeParams.value.id);
|
const res = await getVersionDetail(routeParams.value.id);
|
||||||
console.log(res);
|
console.log(res);
|
||||||
|
projectId.value = res.data.projectId;
|
||||||
Object.assign(form.value, res.data);
|
Object.assign(form.value, res.data);
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
buttonLoading.value = false;
|
buttonLoading.value = false;
|
||||||
@ -186,7 +187,7 @@ const sheets = ref([]);
|
|||||||
const getSheetName = async () => {
|
const getSheetName = async () => {
|
||||||
try {
|
try {
|
||||||
const params = {
|
const params = {
|
||||||
projectId: currentProject.value?.id,
|
projectId: projectId.value,
|
||||||
versions: form.value.versions
|
versions: form.value.versions
|
||||||
};
|
};
|
||||||
const res = await sheetList(params);
|
const res = await sheetList(params);
|
||||||
@ -208,7 +209,7 @@ const tableData = ref([]);
|
|||||||
//获取列表
|
//获取列表
|
||||||
const getListTable = async () => {
|
const getListTable = async () => {
|
||||||
const res = await getTreeLimit({
|
const res = await getTreeLimit({
|
||||||
projectId: currentProject.value?.id,
|
projectId: projectId.value,
|
||||||
versions: form.value.versions,
|
versions: form.value.versions,
|
||||||
sheet: form.value.sheet,
|
sheet: form.value.sheet,
|
||||||
type: '0'
|
type: '0'
|
||||||
|
@ -66,7 +66,7 @@
|
|||||||
{{ scope.row.children.length > 0 ? '' : scope.row.quantity }}
|
{{ scope.row.children.length > 0 ? '' : scope.row.quantity }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="remark" label="单价" align="center">
|
<el-table-column prop="remark" label="单价" align="center" width="200px">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-input-number
|
<el-input-number
|
||||||
:disabled="versionObj.status != 'draft'"
|
:disabled="versionObj.status != 'draft'"
|
||||||
@ -77,16 +77,17 @@
|
|||||||
changePrice(scope.row);
|
changePrice(scope.row);
|
||||||
}
|
}
|
||||||
"
|
"
|
||||||
:precision="2"
|
:min="0"
|
||||||
:step="0.1"
|
:precision="4"
|
||||||
:controls="false"
|
:controls="false"
|
||||||
v-if="scope.row.quantity && scope.row.quantity != 0"
|
v-if="scope.row.quantity && scope.row.quantity != 0"
|
||||||
|
width="200px"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="price" label="总价" align="center">
|
<el-table-column prop="price" label="总价" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
{{ scope.row.price != 0 ? Number(scope.row.price).toFixed(2) : null }}
|
{{ proxy.formatPrice(scope.row.price) }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="operate" label="操作" align="center">
|
<el-table-column prop="operate" label="操作" align="center">
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -25,8 +25,12 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="name" label="名称" align="center" />
|
<el-table-column prop="name" label="名称" align="center" />
|
||||||
<el-table-column prop="content" label="内容" align="center" />
|
<el-table-column prop="content" label="内容" align="center" />
|
||||||
<el-table-column prop="price" label="限价" align="center" />
|
<el-table-column prop="price" label="限价" align="center">
|
||||||
<el-table-column prop="plannedBiddingTime" align="center">
|
<template #default="scope">
|
||||||
|
{{ proxy.formatPrice(scope.row.price) }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="plannedBiddingTime" align="center" width="250px">
|
||||||
<template #header> <span style="color: red">*</span>计划招标时间 </template>
|
<template #header> <span style="color: red">*</span>计划招标时间 </template>
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
@ -35,6 +39,7 @@
|
|||||||
value-format="YYYY-MM-DD"
|
value-format="YYYY-MM-DD"
|
||||||
placeholder="选择时间"
|
placeholder="选择时间"
|
||||||
:disabled="scope.row.status == 0"
|
:disabled="scope.row.status == 0"
|
||||||
|
style="width: 200px"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@ -122,7 +127,7 @@
|
|||||||
<el-table-column prop="unit" label="单位" />
|
<el-table-column prop="unit" label="单位" />
|
||||||
<!-- <el-table-column prop="quantity" label="数量" /> -->
|
<!-- <el-table-column prop="quantity" label="数量" /> -->
|
||||||
<el-table-column prop="quantity" label="计划量" align="center" />
|
<el-table-column prop="quantity" label="计划量" align="center" />
|
||||||
<el-table-column prop="selectNum" label="设计量" align="center">
|
<el-table-column prop="selectNum" label="设计量" align="center" width="200px">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-input-number
|
<el-input-number
|
||||||
:model-value="scope.row.selectNum"
|
:model-value="scope.row.selectNum"
|
||||||
@ -137,6 +142,7 @@
|
|||||||
:controls="false"
|
:controls="false"
|
||||||
:max="Math.floor(scope.row.quantity)"
|
:max="Math.floor(scope.row.quantity)"
|
||||||
v-if="scope.row.quantity && scope.row.quantity != 0 && scope.row.unitPrice"
|
v-if="scope.row.quantity && scope.row.quantity != 0 && scope.row.unitPrice"
|
||||||
|
width="150px"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@ -158,22 +164,28 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
||||||
<el-table-column prop="unitPrice" label="单价" align="center" />
|
<el-table-column prop="unitPrice" label="单价" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ proxy.formatPrice(scope.row.unitPrice) }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
<el-table-column prop="price" label="总价" align="center">
|
<el-table-column prop="price" label="总价" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
{{
|
{{
|
||||||
((scope.row.quantity ? Number(scope.row.quantity) : 0) -
|
proxy.formatPrice(
|
||||||
(scope.row.useQuantity ? Number(scope.row.useQuantity) : 0) -
|
((scope.row.quantity ? Number(scope.row.quantity) : 0) -
|
||||||
(scope.row.selectNum ? Number(scope.row.selectNum) : 0)) *
|
(scope.row.useQuantity ? Number(scope.row.useQuantity) : 0) -
|
||||||
Number(scope.row.unitPrice) ==
|
(scope.row.selectNum ? Number(scope.row.selectNum) : 0)) *
|
||||||
0
|
Number(scope.row.unitPrice) ==
|
||||||
? ''
|
0
|
||||||
: (
|
? ''
|
||||||
((scope.row.quantity ? Number(scope.row.quantity) : 0) -
|
: ((scope.row.quantity ? Number(scope.row.quantity) : 0) -
|
||||||
(scope.row.useQuantity ? Number(scope.row.useQuantity) : 0) -
|
(scope.row.useQuantity ? Number(scope.row.useQuantity) : 0) -
|
||||||
(scope.row.selectNum ? Number(scope.row.selectNum) : 0)) *
|
(scope.row.selectNum ? Number(scope.row.selectNum) : 0)) *
|
||||||
Number(scope.row.unitPrice)
|
Number(scope.row.unitPrice),
|
||||||
).toFixed(2)
|
false
|
||||||
|
)
|
||||||
}}
|
}}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@ -207,6 +219,7 @@ import { useUserStoreHook } from '@/store/modules/user';
|
|||||||
import { getDicts } from '@/api/system/dict/data';
|
import { getDicts } from '@/api/system/dict/data';
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
import { Plus } from '@element-plus/icons-vue';
|
||||||
import { FormInstance } from 'element-plus';
|
import { FormInstance } from 'element-plus';
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
import {
|
import {
|
||||||
treeList,
|
treeList,
|
||||||
sheetList,
|
sheetList,
|
||||||
|
@ -5,7 +5,7 @@
|
|||||||
<el-form :model="queryForm" :inline="true">
|
<el-form :model="queryForm" :inline="true">
|
||||||
<el-form-item label="版本号" prop="versions">
|
<el-form-item label="版本号" prop="versions">
|
||||||
<el-select v-model="queryForm.versions" placeholder="选择版本号" @change="changeVersions">
|
<el-select v-model="queryForm.versions" placeholder="选择版本号" @change="changeVersions">
|
||||||
<el-option v-for="item in options" :key="item.versions" :label="item.versions" :value="item.versions" />
|
<el-option v-for="item in options" :key="item.versions" :label="item.versionsName" :value="item.versions" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="表名" prop="sheet">
|
<el-form-item label="表名" prop="sheet">
|
||||||
@ -79,18 +79,16 @@
|
|||||||
changePrice(scope.row);
|
changePrice(scope.row);
|
||||||
}
|
}
|
||||||
"
|
"
|
||||||
:precision="2"
|
:min="0"
|
||||||
:step="0.1"
|
:precision="4"
|
||||||
:controls="false"
|
:controls="false"
|
||||||
v-if="scope.row.quantity && scope.row.quantity != 0"
|
v-if="scope.row.quantity && scope.row.quantity != 0"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="price" label="总价" align="center" >
|
<el-table-column prop="price" label="总价" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<!-- {{ scope.row.children.length > 0 ? scope.row.children.reduce((sum, child) => sum + child.price, 0) : scope.row.price }} -->
|
{{ proxy.formatPrice(scope.row.price) }}
|
||||||
{{ scope.row.price != 0 ? Number(scope.row.price).toFixed(2) : null }}
|
|
||||||
<!-- {{ scope.row.price }} -->
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="operate" label="操作" align="center">
|
<el-table-column prop="operate" label="操作" align="center">
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.versions"
|
:id="form.versions"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
@ -41,10 +42,14 @@
|
|||||||
<el-table-column prop="specification" label="规格" />
|
<el-table-column prop="specification" label="规格" />
|
||||||
<el-table-column prop="unit" label="单位" />
|
<el-table-column prop="unit" label="单位" />
|
||||||
<el-table-column prop="quantity" label="数量" />
|
<el-table-column prop="quantity" label="数量" />
|
||||||
<el-table-column prop="unitPrice" label="单价" align="center" />
|
<el-table-column prop="unitPrice" label="单价" align="center">
|
||||||
<el-table-column prop="price" label="总价" align="center">
|
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
{{ scope.row.price != 0 ? Number(scope.row.price).toFixed(2) : null }}
|
{{ proxy.formatPrice(scope.row.unitPrice, false) }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="price" label="总价" align="center" width="150">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ proxy.formatPrice(scope.row.price) }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
@ -70,8 +75,12 @@
|
|||||||
</div>
|
</div>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
|
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
|
||||||
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors">取消</el-button>
|
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
|
||||||
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors">确认</el-button>
|
>取消</el-button
|
||||||
|
>
|
||||||
|
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
|
||||||
|
>确认</el-button
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
@ -154,7 +163,7 @@ const reset = () => {
|
|||||||
form.value = { ...initFormData };
|
form.value = { ...initFormData };
|
||||||
leaveFormRef.value?.resetFields();
|
leaveFormRef.value?.resetFields();
|
||||||
};
|
};
|
||||||
|
const projectId = ref('');
|
||||||
/** 获取详情 */
|
/** 获取详情 */
|
||||||
const getInfo = () => {
|
const getInfo = () => {
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
@ -162,6 +171,7 @@ const getInfo = () => {
|
|||||||
nextTick(async () => {
|
nextTick(async () => {
|
||||||
const res = await getVersionDetails(routeParams.value.id);
|
const res = await getVersionDetails(routeParams.value.id);
|
||||||
console.log(res);
|
console.log(res);
|
||||||
|
projectId.value = res.data.projectId;
|
||||||
Object.assign(form.value, res.data);
|
Object.assign(form.value, res.data);
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
buttonLoading.value = false;
|
buttonLoading.value = false;
|
||||||
@ -173,7 +183,7 @@ const sheets = ref([]);
|
|||||||
const getSheetName = async () => {
|
const getSheetName = async () => {
|
||||||
try {
|
try {
|
||||||
const params = {
|
const params = {
|
||||||
projectId: currentProject.value?.id,
|
projectId: projectId.value,
|
||||||
versions: form.value.versions
|
versions: form.value.versions
|
||||||
};
|
};
|
||||||
const res = await sheetList(params);
|
const res = await sheetList(params);
|
||||||
@ -193,7 +203,7 @@ const changeSheet = () => {
|
|||||||
//获取列表
|
//获取列表
|
||||||
const getListTable = async () => {
|
const getListTable = async () => {
|
||||||
const res = await listBillofquantitiesLimitList({
|
const res = await listBillofquantitiesLimitList({
|
||||||
projectId: currentProject.value?.id,
|
projectId: projectId.value,
|
||||||
versions: form.value.versions,
|
versions: form.value.versions,
|
||||||
sheet: form.value.sheet
|
sheet: form.value.sheet
|
||||||
});
|
});
|
||||||
|
@ -1,54 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="p-2">
|
<div class="p-2">
|
||||||
<el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
|
<el-card shadow="never">
|
||||||
<el-tab-pane label="变更单" name="1"
|
<template #header>
|
||||||
><el-card shadow="never">
|
<el-row :gutter="10" class="mb8">
|
||||||
<template #header>
|
<el-col :span="1.5">
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAdd" v-hasPermi="['quality:qualityInspection:add']"
|
||||||
<el-col :span="1.5">
|
>上传外部联系单模版</el-button
|
||||||
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAddApp" v-hasPermi="['quality:qualityInspection:add']"
|
>
|
||||||
>上传变更单模版</el-button
|
</el-col>
|
||||||
>
|
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
</el-col>
|
</el-row>
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
</template>
|
||||||
</el-row>
|
<Contactform @selection-change="handleSelectionChange" :data="tableData" @delete="handleDelete"></Contactform>
|
||||||
</template>
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
<EngineeringChangeApplicationForm
|
</el-card>
|
||||||
@selection-change="handleSelectionChange"
|
|
||||||
:data="tableData"
|
|
||||||
:thumbnail="projectTypeOptions[1].thumbnail"
|
|
||||||
@delete="handleDelete"
|
|
||||||
></EngineeringChangeApplicationForm>
|
|
||||||
<pagination
|
|
||||||
v-show="total > 0"
|
|
||||||
:total="total"
|
|
||||||
v-model:page="queryParams.pageNum"
|
|
||||||
v-model:limit="queryParams.pageSize"
|
|
||||||
@pagination="getList"
|
|
||||||
/> </el-card
|
|
||||||
></el-tab-pane>
|
|
||||||
<el-tab-pane label="外部联系单" name="0"
|
|
||||||
><el-card shadow="never">
|
|
||||||
<template #header>
|
|
||||||
<el-row :gutter="10" class="mb8">
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAdd" v-hasPermi="['quality:qualityInspection:add']"
|
|
||||||
>上传外部联系单模版</el-button
|
|
||||||
>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
|
||||||
</template>
|
|
||||||
<Contactform @selection-change="handleSelectionChange" :data="tableData" @delete="handleDelete"></Contactform>
|
|
||||||
<pagination
|
|
||||||
v-show="total > 0"
|
|
||||||
:total="total"
|
|
||||||
v-model:page="queryParams.pageNum"
|
|
||||||
v-model:limit="queryParams.pageSize"
|
|
||||||
@pagination="getList"
|
|
||||||
/> </el-card
|
|
||||||
></el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
<el-dialog title="新增模板" v-model="dialogVisible" width="800">
|
<el-dialog title="新增模板" v-model="dialogVisible" width="800">
|
||||||
<el-form :model="form" :rules="rules" ref="formRef" label-width="110px">
|
<el-form :model="form" :rules="rules" ref="formRef" label-width="110px">
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
@ -109,14 +74,11 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useUserStoreHook } from '@/store/modules/user';
|
import { useUserStoreHook } from '@/store/modules/user';
|
||||||
import type { FormInstance, FormRules } from 'element-plus';
|
import type { FormInstance } from 'element-plus';
|
||||||
import Contactform from './components/contactform.vue';
|
import Contactform from './components/contactform.vue';
|
||||||
import EngineeringChangeApplicationForm from './components/engineeringChangeApplicationForm.vue';
|
|
||||||
import { listContactTypeformtemplate } from '@/api/cory/contactformtemplate';
|
import { listContactTypeformtemplate } from '@/api/cory/contactformtemplate';
|
||||||
import { addContactnotice, delContactnotice, listContactnotice } from '@/api/cory/contactnotice';
|
import { addContactnotice, delContactnotice, listContactnotice } from '@/api/cory/contactnotice';
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
const { wf_business_status } = toRefs(proxy?.useDict('wf_business_status'));
|
|
||||||
// 获取用户 store
|
// 获取用户 store
|
||||||
const userStore = useUserStoreHook();
|
const userStore = useUserStoreHook();
|
||||||
// 从 store 中获取项目列表和当前选中的项目
|
// 从 store 中获取项目列表和当前选中的项目
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
|
@ -1,79 +1,80 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<el-steps style="max-width: 100%" :active="active" finish-status="success" align-center>
|
<el-steps style="max-width: 100%" :active="active" finish-status="success" align-center>
|
||||||
<el-step title="选择合同类型" />
|
<el-step title="选择合同类型" />
|
||||||
<el-step title="修改合同内容" />
|
<el-step title="修改合同内容" />
|
||||||
<el-step title="修改收款方式" />
|
<el-step title="修改收款方式" />
|
||||||
</el-steps>
|
</el-steps>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<template v-if="active == 1">
|
<template v-if="active == 1">
|
||||||
<h1>修改收入合同</h1>
|
<h1>修改收入合同</h1>
|
||||||
<el-form ref="incomeContractFormRef" :model="form" :rules="incomeContractFormRules" label-width="80px">
|
<el-form ref="incomeContractFormRef" :model="form" :rules="incomeContractFormRules" label-width="80px">
|
||||||
<el-form-item label="合同编号" prop="contractCode">
|
<el-form-item label="合同编号" prop="contractCode">
|
||||||
<el-input v-model="form.contractCode" placeholder="请输入合同编号" />
|
<el-input v-model="form.contractCode" placeholder="请输入合同编号" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="合同类型" prop="contractType">
|
<el-form-item label="合同类型" prop="contractType">
|
||||||
<el-select v-model="form.contractType" placeholder="请选择合同类型">
|
<el-select v-model="form.contractType" placeholder="请选择合同类型">
|
||||||
<el-option v-for="item in income_contract_type" :key="item.value" :label="item.label"
|
<el-option v-for="item in income_contract_type" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
:value="item.value" />
|
</el-select>
|
||||||
</el-select>
|
</el-form-item>
|
||||||
</el-form-item>
|
<el-form-item label="业主单位" prop="contractOwner">
|
||||||
<el-form-item label="业主单位" prop="contractOwner">
|
<el-input v-model="form.contractOwner" placeholder="请输入业主单位" disabled />
|
||||||
<el-input v-model="form.contractOwner" placeholder="请输入业主单位" disabled />
|
</el-form-item>
|
||||||
</el-form-item>
|
<el-form-item label="承包内容" v-if="contract_type !== 'income'">
|
||||||
<el-form-item label="承包内容" v-if="contract_type !== 'income'">
|
<editor v-model="form.contractedContent" :min-height="192" />
|
||||||
<editor v-model="form.contractedContent" :min-height="192" />
|
</el-form-item>
|
||||||
</el-form-item>
|
<el-form-item label="合同内容" v-else>
|
||||||
<el-form-item label="合同内容" v-else>
|
<editor v-model="form.contractedContent" :min-height="192" />
|
||||||
<editor v-model="form.contractedContent" :min-height="192" />
|
</el-form-item>
|
||||||
</el-form-item>
|
<el-form-item label="合同金额" prop="amount">
|
||||||
<el-form-item label="合同金额" prop="amount">
|
<el-input
|
||||||
<el-input v-model="form.amount" placeholder="请输入合同金额"
|
v-model="form.amount"
|
||||||
oninput="value=value.replace(/[^0-9.]/g,'').replace(/\.{2,}/g,'.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')" />
|
placeholder="请输入合同金额"
|
||||||
</el-form-item>
|
oninput="value=value.replace(/[^0-9.]/g,'').replace(/\.{2,}/g,'.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')"
|
||||||
<el-form-item label="备注" prop="remark">
|
/>
|
||||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
</el-form-item>
|
||||||
</el-form-item>
|
<el-form-item label="备注" prop="remark">
|
||||||
<el-form-item label="附件">
|
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||||
<FileUpload :multiple="true" :fileType="['pdf']" :onUploadSuccess="onUploadSuccess"
|
</el-form-item>
|
||||||
:ref="fileRef" :defaultFileList="tempFileList" />
|
<el-form-item label="附件">
|
||||||
</el-form-item>
|
<FileUpload :multiple="true" :fileType="['pdf']" :onUploadSuccess="onUploadSuccess" :ref="fileRef" :defaultFileList="tempFileList" />
|
||||||
</el-form>
|
</el-form-item>
|
||||||
<div>
|
</el-form>
|
||||||
<el-button type="primary" @click="next">下一步</el-button>
|
<div>
|
||||||
</div>
|
<el-button type="primary" @click="next">下一步</el-button>
|
||||||
</template>
|
|
||||||
<template v-else-if="active == 2">
|
|
||||||
<h1>修改收入合同</h1>
|
|
||||||
<el-form :model="form" :rules="payMentRules" label-width="150" ref="payMentRef">
|
|
||||||
<el-form-item label="支付方式" placeholder="请选择支付方式" prop="payType">
|
|
||||||
<el-select v-model="form.payType">
|
|
||||||
<el-option :value="1" label="月结算">月结算</el-option>
|
|
||||||
<el-option :value="2" label="形象节点">形象节点</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="预付款比例(%)" prop="advancePayRatio">
|
|
||||||
<el-input-number v-model="form.advancePayRatio" :max="100" :min="0" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="尾款比例(%)" prop="balancePayRatio">
|
|
||||||
<el-input-number v-model="form.balancePayRatio" :max="100" :min="0" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="质保金比例(%)" prop="assuranceDepositRatio">
|
|
||||||
<el-input-number v-model="form.assuranceDepositRatio" :max="100" :min="0" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="付款比例(%)" prop="payRatio">
|
|
||||||
<el-input-number v-model="payRatioComputed" disabled />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<div>
|
|
||||||
<el-button @click="back(false)">上一步</el-button>
|
|
||||||
<el-button type="success" @click="submitForm">提交</el-button>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</template>
|
|
||||||
</div>
|
</div>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="active == 2">
|
||||||
|
<h1>修改收入合同</h1>
|
||||||
|
<el-form :model="form" :rules="payMentRules" label-width="150" ref="payMentRef">
|
||||||
|
<el-form-item label="支付方式" placeholder="请选择支付方式" prop="payType">
|
||||||
|
<el-select v-model="form.payType">
|
||||||
|
<el-option :value="1" label="月结算">月结算</el-option>
|
||||||
|
<el-option :value="2" label="形象节点">形象节点</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="预付款比例(%)" prop="advancePayRatio">
|
||||||
|
<el-input-number v-model="form.advancePayRatio" :max="100" :min="0" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="尾款比例(%)" prop="balancePayRatio">
|
||||||
|
<el-input-number v-model="form.balancePayRatio" :max="100" :min="0" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="质保金比例(%)" prop="assuranceDepositRatio">
|
||||||
|
<el-input-number v-model="form.assuranceDepositRatio" :max="100" :min="0" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="付款比例(%)" prop="payRatio">
|
||||||
|
<el-input-number v-model="payRatioComputed" disabled />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<div>
|
||||||
|
<el-button @click="back(false)">上一步</el-button>
|
||||||
|
<el-button type="success" @click="submitForm">提交</el-button>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import FileUpload from '@/components/FileUpload';
|
import FileUpload from '@/components/FileUpload';
|
||||||
@ -95,140 +96,140 @@ const incomeContractFormRef = ref(null);
|
|||||||
const expensesContractFormRef = ref(null);
|
const expensesContractFormRef = ref(null);
|
||||||
const payMentRef = ref(null);
|
const payMentRef = ref(null);
|
||||||
const incomeContractFormRules = {
|
const incomeContractFormRules = {
|
||||||
contractCode: [{ required: true, message: '请输入合同编号', trigger: 'blur' }],
|
contractCode: [{ required: true, message: '请输入合同编号', trigger: 'blur' }],
|
||||||
contractType: [{ required: true, message: '请选择合同类型', trigger: 'change' }],
|
contractType: [{ required: true, message: '请选择合同类型', trigger: 'change' }],
|
||||||
contractOwner: [{ required: true, message: '请输入业主单位', trigger: 'blur' }],
|
contractOwner: [{ required: true, message: '请输入业主单位', trigger: 'blur' }],
|
||||||
amount: [{ required: true, message: '请输入合同金额', trigger: 'blur' }],
|
amount: [{ required: true, message: '请输入合同金额', trigger: 'blur' }],
|
||||||
remark: [{ required: false, message: '请输入备注', trigger: 'blur' }]
|
remark: [{ required: false, message: '请输入备注', trigger: 'blur' }]
|
||||||
};
|
};
|
||||||
const expensesContractFormRules = {
|
const expensesContractFormRules = {
|
||||||
contractCode: [{ required: true, message: '请输入合同编号', trigger: 'blur' }],
|
contractCode: [{ required: true, message: '请输入合同编号', trigger: 'blur' }],
|
||||||
contractType: [{ required: true, message: '请选择合同类型', trigger: 'change' }],
|
contractType: [{ required: true, message: '请选择合同类型', trigger: 'change' }],
|
||||||
|
|
||||||
contractSupplier: [{ required: true, message: '请输入供应商', trigger: 'blur' }],
|
contractSupplier: [{ required: true, message: '请输入供应商', trigger: 'blur' }],
|
||||||
amount: [{ required: true, message: '请输入合同金额', trigger: 'blur' }],
|
amount: [{ required: true, message: '请输入合同金额', trigger: 'blur' }],
|
||||||
tenderId: [{ required: true, message: '请选择招标计划', trigger: 'blur' }],
|
tenderId: [{ required: true, message: '请选择招标计划', trigger: 'blur' }],
|
||||||
|
|
||||||
remark: [{ required: false, message: '请输入备注', trigger: 'blur' }]
|
remark: [{ required: false, message: '请输入备注', trigger: 'blur' }]
|
||||||
};
|
};
|
||||||
const payMentRules = {
|
const payMentRules = {
|
||||||
payType: [{ required: true, message: '请选择支付方式', trigger: 'change' }],
|
payType: [{ required: true, message: '请选择支付方式', trigger: 'change' }],
|
||||||
advancePayRatio: [{ required: true, message: '请输入预付款比例', trigger: 'blur' }],
|
advancePayRatio: [{ required: true, message: '请输入预付款比例', trigger: 'blur' }],
|
||||||
balancePayRatio: [{ required: true, message: '请输入尾款比例', trigger: 'blur' }],
|
balancePayRatio: [{ required: true, message: '请输入尾款比例', trigger: 'blur' }],
|
||||||
assuranceDepositRatio: [{ required: true, message: '请输入质保金比例', trigger: 'blur' }]
|
assuranceDepositRatio: [{ required: true, message: '请输入质保金比例', trigger: 'blur' }]
|
||||||
};
|
};
|
||||||
|
|
||||||
const project = computed(() => {
|
const project = computed(() => {
|
||||||
return JSON.parse(localStorage.getItem('selectedProject'));
|
return JSON.parse(localStorage.getItem('selectedProject'));
|
||||||
});
|
});
|
||||||
|
|
||||||
const payRatioComputed = computed({
|
const payRatioComputed = computed({
|
||||||
get: () => {
|
get: () => {
|
||||||
const { advancePayRatio = 0, balancePayRatio = 0, assuranceDepositRatio = 0 } = form.value;
|
const { advancePayRatio = 0, balancePayRatio = 0, assuranceDepositRatio = 0 } = form.value;
|
||||||
const total = 100 - (advancePayRatio + balancePayRatio + assuranceDepositRatio);
|
const total = 100 - (advancePayRatio + balancePayRatio + assuranceDepositRatio);
|
||||||
// form.value.payRatio = total;
|
// form.value.payRatio = total;
|
||||||
return total;
|
return total;
|
||||||
},
|
},
|
||||||
// 只读
|
// 只读
|
||||||
set: () => { }
|
set: () => {}
|
||||||
});
|
});
|
||||||
|
|
||||||
const onUploadSuccess = (data) => {
|
const onUploadSuccess = (data) => {
|
||||||
fileList.value = data;
|
fileList.value = data;
|
||||||
};
|
};
|
||||||
|
|
||||||
const next = async () => {
|
const next = async () => {
|
||||||
if (contract_type.value === 'income') {
|
if (contract_type.value === 'income') {
|
||||||
await incomeContractFormRef.value.validate((valid) => {
|
await incomeContractFormRef.value.validate((valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
active.value++;
|
active.value++;
|
||||||
} else {
|
} else {
|
||||||
ElMessage.error('请填写完整的收入合同信息');
|
ElMessage.error('请填写完整的收入合同信息');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} else if (contract_type.value === 'expenses') {
|
} else if (contract_type.value === 'expenses') {
|
||||||
await expensesContractFormRef.value.validate((valid) => {
|
await expensesContractFormRef.value.validate((valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
active.value++;
|
active.value++;
|
||||||
} else {
|
} else {
|
||||||
ElMessage.error('请填写完整的支出合同信息');
|
ElMessage.error('请填写完整的支出合同信息');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
console.log(active.value);
|
console.log(active.value);
|
||||||
|
|
||||||
form.value.step = active.value;
|
form.value.step = active.value;
|
||||||
};
|
};
|
||||||
const submitForm = async () => {
|
const submitForm = async () => {
|
||||||
await payMentRef.value.validate(async (valid) => {
|
await payMentRef.value.validate(async (valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
if (payRatioComputed.value < 0) {
|
if (payRatioComputed.value < 0) {
|
||||||
ElMessage.error('四项付款比例之和必须等于100%');
|
ElMessage.error('四项付款比例之和必须等于100%');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
form.value.payRatio = payRatioComputed.value;
|
form.value.payRatio = payRatioComputed.value;
|
||||||
|
|
||||||
// 提交付款信息逻辑
|
// 提交付款信息逻辑
|
||||||
console.log('提交付款信息', form.value, fileList.value);
|
console.log('提交付款信息', form.value, fileList.value);
|
||||||
// 这里可以调用API提交数据
|
// 这里可以调用API提交数据
|
||||||
form.value.projectId = project.value.id;
|
form.value.projectId = project.value.id;
|
||||||
form.value.fileList = fileList.value.map((data) => {
|
form.value.fileList = fileList.value.map((data) => {
|
||||||
return {
|
return {
|
||||||
...data,
|
...data,
|
||||||
fileName: data.name,
|
fileName: data.name,
|
||||||
fileUrl: data.url
|
fileUrl: data.url
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
if (contract_type.value === 'income') {
|
if (contract_type.value === 'income') {
|
||||||
await updateIncomeContract({ ...form.value });
|
await updateIncomeContract({ ...form.value });
|
||||||
}
|
}
|
||||||
ElMessage.success('合同修改成功');
|
ElMessage.success('合同修改成功');
|
||||||
} else {
|
} else {
|
||||||
ElMessage.error('请填写完整的付款信息');
|
ElMessage.error('请填写完整的付款信息');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
const handleChoose = async () => {
|
const handleChoose = async () => {
|
||||||
if (!form.value.contractType) {
|
if (!form.value.contractType) {
|
||||||
ElMessage.error('请先选择合同类型');
|
ElMessage.error('请先选择合同类型');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const formData = {
|
const formData = {
|
||||||
projectId: userStore.selectedProject.id,
|
projectId: userStore.selectedProject.id,
|
||||||
dictName: form.value.contractType,
|
dictName: form.value.contractType,
|
||||||
status: 1
|
status: 1
|
||||||
};
|
};
|
||||||
const { data } = await getTenderPlan(formData);
|
const { data } = await getTenderPlan(formData);
|
||||||
if (data.length === 0) {
|
if (data.length === 0) {
|
||||||
ElMessage.warning('当前没有招标计划,请先创建招标计划');
|
ElMessage.warning('当前没有招标计划,请先创建招标计划');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
planList.value = data;
|
planList.value = data;
|
||||||
dialogVisible.value = true;
|
dialogVisible.value = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const id = route.query.id;
|
const id = route.query.id;
|
||||||
if (id) {
|
if (id) {
|
||||||
const { data } = await getIncomeContract(id);
|
const { data } = await getIncomeContract(id);
|
||||||
form.value.id = data.id;
|
form.value.id = data.id;
|
||||||
form.value.contractOwner = data.contractOwner
|
form.value.contractOwner = data.contractOwner;
|
||||||
} else {
|
} else {
|
||||||
router.push('/ctr/incomeContract');
|
router.push('/ctr/incomeContract');
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.container {
|
.container {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
padding: 30px;
|
padding: 30px;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
<el-form :model="state.queryForm" :inline="true">
|
<el-form :model="state.queryForm" :inline="true">
|
||||||
<el-form-item label="版本号" prop="versions">
|
<el-form-item label="版本号" prop="versions">
|
||||||
<el-select v-model="state.queryForm.versions" placeholder="选择版本号" @change="handleChangeVersion">
|
<el-select v-model="state.queryForm.versions" placeholder="选择版本号" @change="handleChangeVersion">
|
||||||
<el-option v-for="item in state.options" :key="item.versions" :label="item.versions" :value="item.versions" />
|
<el-option v-for="item in state.options" :key="item.versions" :label="item.versionsName" :value="item.versions" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="表名" prop="sheet">
|
<el-form-item label="表名" prop="sheet">
|
||||||
@ -48,7 +48,7 @@
|
|||||||
<el-form :model="state.queryForm" :inline="true">
|
<el-form :model="state.queryForm" :inline="true">
|
||||||
<el-form-item label="版本号" prop="versions">
|
<el-form-item label="版本号" prop="versions">
|
||||||
<el-select v-model="state.queryForm.versions" placeholder="选择版本号" @change="handleChangeVersion">
|
<el-select v-model="state.queryForm.versions" placeholder="选择版本号" @change="handleChangeVersion">
|
||||||
<el-option v-for="item in state.options" :key="item.versions" :label="item.versions" :value="item.versions" />
|
<el-option v-for="item in state.options" :key="item.versions" :label="item.versionsName" :value="item.versions" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.versions"
|
:id="form.versions"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.versions"
|
:id="form.versions"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.versions"
|
:id="form.versions"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.versions"
|
:id="form.versions"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
@ -145,7 +146,13 @@
|
|||||||
></el-col>
|
></el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="费用" prop="costEstimation">
|
<el-form-item label="费用" prop="costEstimation">
|
||||||
<el-input min="0" v-model="form.costEstimation" type="number" placeholder="请输入费用" /> </el-form-item
|
<el-input-number
|
||||||
|
:min="0"
|
||||||
|
:precision="4"
|
||||||
|
v-model="form.costEstimation"
|
||||||
|
:controls="false"
|
||||||
|
placeholder="请输入费用"
|
||||||
|
/> </el-form-item
|
||||||
></el-col>
|
></el-col>
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<el-form-item label="变更费用估算表" label-width="110px" prop="costEstimationFile">
|
<el-form-item label="变更费用估算表" label-width="110px" prop="costEstimationFile">
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.design"
|
:id="form.design"
|
||||||
:status="form.auditStatus"
|
:status="form.auditStatus"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
|
@ -0,0 +1,396 @@
|
|||||||
|
<template>
|
||||||
|
<div class="content-box">
|
||||||
|
<el-table :data="data" style="width: 100%" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="index" width="55" label="序号" align="center" />
|
||||||
|
<el-table-column align="center" prop="projectName" label="工程名称" />
|
||||||
|
<el-table-column align="center" prop="submitUnit" label="提出单位" />
|
||||||
|
<el-table-column align="center" prop="specialty" label="专业">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<dict-tag :options="des_user_major" :value="row.specialty" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" prop="submitDate" label="提出日期">
|
||||||
|
<template #default="{ row }">
|
||||||
|
{{ formatDate(row.submitDate) }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" prop="volumeName" label="卷册名称" />
|
||||||
|
<el-table-column align="center" prop="volumeNumber" label="卷册号" />
|
||||||
|
<el-table-column align="center" prop="content" label="变更内容" />
|
||||||
|
<el-table-column align="center" prop="costEstimation" label="变更费用估算" />
|
||||||
|
<el-table-column label="流程状态" align="center" prop="status">
|
||||||
|
<template #default="scope">
|
||||||
|
<dict-tag :options="wf_business_status" :value="scope.row.status" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" prop="content" label="操作" width="240">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button link type="warning" v-if="scope.row.status === 'draft'" icon="Edit" @click="handleUpdate(scope.row)" class="ml-3"
|
||||||
|
>审批
|
||||||
|
</el-button>
|
||||||
|
<el-button link type="primary" icon="View" @click="handleViewInfo(scope.row)" class="ml-3"> 查看流程 </el-button>
|
||||||
|
<el-button link type="success" icon="View" @click="handleDetail(scope.row)" class="ml-3"> 详情 </el-button>
|
||||||
|
<!-- <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)"> 删除 </el-button> -->
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<!-- 详情 -->
|
||||||
|
<el-dialog title="变更单详情" v-model="detailVisible" width="1000">
|
||||||
|
<div class="w[850px] ma word-export-wrapper" ref="exportRef">
|
||||||
|
<div class="w80% ma">
|
||||||
|
<h2 style="text-align: center; margin-top: 5px; font-weight: bold">变更单</h2>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">编号:{{ tableDetail.id }}</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-descriptions :column="2" border style="margin-top: 8px" label-width="160px" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="工程名称" class-name="zebra"> {{ tableDetail.projectName }} </el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="提出单位" class-name="zebra"> {{ tableDetail.submitUnit }} </el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="专业" label-class-name="white"
|
||||||
|
><dict-tag :options="des_user_major" :value="tableDetail.specialty" />
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="提出日期" label-class-name="white">
|
||||||
|
{{ dayjs(tableDetail.submitDate).format('YYYY-MM-DD') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="卷册名称" class-name="zebra"> {{ tableDetail.volumeName }} </el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="卷册号" class-name="zebra"> {{ tableDetail.volumeNumber }} </el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="附图" :span="2" label-class-name="white">
|
||||||
|
<img :src="item.url" v-for="item in tableDetail.attachmentsImgList" alt="" style="width: 200px; height: auto" />
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="变更原因" :span="2" class-name="zebra">
|
||||||
|
<el-checkbox-group v-model="tableDetail.changeReasons">
|
||||||
|
<el-checkbox
|
||||||
|
v-for="(item, index) in radioList"
|
||||||
|
:class="index % 2 == 0 ? 'w45%' : ''"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.label"
|
||||||
|
disabled
|
||||||
|
/>
|
||||||
|
</el-checkbox-group>
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="内容" :span="2" label-class-name="white">
|
||||||
|
{{ tableDetail.content }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="附件" :span="2" label-class-name="white">
|
||||||
|
<el-link type="primary" :underline="false" :href="tableDetail.attachmentsList?.url" target="_blank">{{
|
||||||
|
tableDetail.attachmentsList?.originalName
|
||||||
|
}}</el-link>
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="变更费用估算" :span="2" class-name="zebra">
|
||||||
|
{{ tableDetail.costEstimation }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<el-descriptions border direction="vertical" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="施工承包单位" class-name="none"></el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<el-descriptions :column="2" border label-width="160px" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="项目经理 " label-class-name="white">
|
||||||
|
{{ tableDetail.contractorLeader }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="日期" label-class-name="white">
|
||||||
|
{{ dayjs(tableDetail.contractorDate).format('YYYY-MM-DD') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<!-- <el-descriptions border direction="vertical" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="总承包单位" class-name="none"></el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<el-descriptions :column="2" border label-width="160px" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="项目技术负责人" label-class-name="white">{{
|
||||||
|
tableDetail.bsupervisorLeader
|
||||||
|
}}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="日期" label-class-name="white">
|
||||||
|
{{ dayjs(tableDetail.bsupervisorDate).format('YYYY-MM-DD') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<el-descriptions border direction="vertical" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="设计单位" class-name="none"></el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<el-descriptions :column="2" border label-width="160px" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="设计代表" label-class-name="white">{{
|
||||||
|
tableDetail.csupervisorLeader
|
||||||
|
}}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="日期" label-class-name="white">
|
||||||
|
{{ dayjs(tableDetail.csupervisorDate).format('YYYY-MM-DD') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions> -->
|
||||||
|
<el-descriptions border direction="vertical" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="项目监理单位" class-name="none"></el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
|
||||||
|
<!-- 单独插入整行占用的内容 -->
|
||||||
|
<el-descriptions :column="2" border label-width="160px" size="large">
|
||||||
|
<el-descriptions-item label="总监理工程师" label-align="center" label-class-name="white">
|
||||||
|
{{ tableDetail.supervisorLeader }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="日期" label-align="center" label-class-name="white">
|
||||||
|
{{ dayjs(tableDetail.supervisorDate).format('YYYY-MM-DD') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<!-- 一组完整两列 -->
|
||||||
|
<!-- <el-descriptions :column="2" border label-width="160px" size="large">
|
||||||
|
<el-descriptions-item label="监理工程师" label-align="center" label-class-name="white">
|
||||||
|
{{ tableDetail.dsupervisorLeader }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="日期" label-align="center" label-class-name="white">
|
||||||
|
{{ dayjs(tableDetail.supervisorDate).format('YYYY-MM-DD') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions> -->
|
||||||
|
<el-descriptions border direction="vertical" size="large">
|
||||||
|
<el-descriptions-item label-align="center" label="建设单位" class-name="none"></el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<el-descriptions :column="2" border label-width="160px" size="large">
|
||||||
|
<!-- <el-descriptions-item label-align="center" label="会签" :span="2" label-class-name="white"> {{ tableDetail.esupervisorLeader }} </el-descriptions-item> -->
|
||||||
|
<el-descriptions-item label-align="center" label="负责人" label-class-name="white">
|
||||||
|
{{ tableDetail.ownerRep }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label-align="center" label="日期" label-class-name="white">
|
||||||
|
{{ dayjs(tableDetail.ownerDate).format('YYYY-MM-DD') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</div>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<div class="btn-item" @click="handleDownload">
|
||||||
|
<img src="@/assets/icons/svg/derived.png" />
|
||||||
|
<span>下载</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { listByIds } from '@/api/system/oss';
|
||||||
|
import { dayjs } from 'element-plus';
|
||||||
|
import { saveAs } from 'file-saver';
|
||||||
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
|
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
|
||||||
|
const props = defineProps({
|
||||||
|
data: {
|
||||||
|
type: Array,
|
||||||
|
default: () => []
|
||||||
|
},
|
||||||
|
thumbnail: {
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const tableDetail = ref<any>({ attachmentsImgList: [], attachmentsList: [] });
|
||||||
|
|
||||||
|
const exportRef = ref<HTMLElement>();
|
||||||
|
const radioList = ref([
|
||||||
|
{ value: 0, label: '设计漏项' },
|
||||||
|
{ value: 1, label: '设计改进' },
|
||||||
|
{ value: 2, label: '设计差错' },
|
||||||
|
{ value: 3, label: '接口差错' },
|
||||||
|
{ value: 4, label: '业主要求' },
|
||||||
|
{ value: 5, label: '施工承包商要求' },
|
||||||
|
{ value: 6, label: '外部资料与最终情况不符' },
|
||||||
|
{ value: 7, label: '材料代用及其他' }
|
||||||
|
]);
|
||||||
|
const detailVisible = ref(false);
|
||||||
|
const formatDate = (val: string | Date) => (val ? dayjs(val).format('YYYY-MM-DD') : '');
|
||||||
|
const { des_user_major } = toRefs<any>(proxy?.useDict('des_user_major'));
|
||||||
|
|
||||||
|
const handleDetail = async (row) => {
|
||||||
|
tableDetail.value = { ...row };
|
||||||
|
|
||||||
|
if (row.attachmentsImg) {
|
||||||
|
const res = await listByIds(row.attachmentsImg);
|
||||||
|
tableDetail.value.attachmentsImgList = res.data;
|
||||||
|
}
|
||||||
|
if (row.attachments) {
|
||||||
|
const res = await listByIds(row.attachments);
|
||||||
|
tableDetail.value.attachmentsList = res.data[0];
|
||||||
|
}
|
||||||
|
|
||||||
|
// tableDetail.value = {
|
||||||
|
// ...row,
|
||||||
|
// hasAttachmentList: res.data
|
||||||
|
// };
|
||||||
|
detailVisible.value = true;
|
||||||
|
};
|
||||||
|
/** 多选框选中数据 */
|
||||||
|
const emit = defineEmits(['selection-change', 'delete']);
|
||||||
|
const handleSelectionChange = (selection: any) => {
|
||||||
|
emit('selection-change', selection);
|
||||||
|
};
|
||||||
|
const handleDelete = (row) => {
|
||||||
|
emit('delete', row.id);
|
||||||
|
};
|
||||||
|
const handleUpdate = (row) => {
|
||||||
|
// 添加审批
|
||||||
|
proxy.$tab.closePage(proxy.$route);
|
||||||
|
proxy.$router.push({
|
||||||
|
path: `/approval/changeContact/indexEdit`,
|
||||||
|
query: {
|
||||||
|
thumbnailUrl: props.thumbnail,
|
||||||
|
row: JSON.stringify(row),
|
||||||
|
id: row.id,
|
||||||
|
type: 'update'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const handleViewInfo = (row) => {
|
||||||
|
// 添加审批
|
||||||
|
proxy.$tab.closePage(proxy.$route);
|
||||||
|
proxy.$router.push({
|
||||||
|
path: `/approval/changeContact/indexEdit`,
|
||||||
|
query: {
|
||||||
|
thumbnailUrl: props.thumbnail,
|
||||||
|
row: JSON.stringify(row),
|
||||||
|
id: row.id,
|
||||||
|
type: 'view'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const handleDownload = async () => {
|
||||||
|
const style = `
|
||||||
|
<style>
|
||||||
|
.white { background: #fff !important; }
|
||||||
|
.none { display: none !important; }
|
||||||
|
.zebra { background: #f5f7fa !important; }
|
||||||
|
.el-descriptions__table { table-layout: fixed !important; }
|
||||||
|
table { border-collapse: collapse; width: 100%; }
|
||||||
|
th, td { border: 1px solid #333; padding: 6px; font-size: 14px; }
|
||||||
|
</style>
|
||||||
|
`;
|
||||||
|
|
||||||
|
const el = exportRef.value;
|
||||||
|
if (!el) return;
|
||||||
|
|
||||||
|
// 拷贝 DOM,避免影响原内容
|
||||||
|
const clone = el.cloneNode(true) as HTMLElement;
|
||||||
|
|
||||||
|
// 删除 .dialog-footer
|
||||||
|
const footer = clone.querySelector('.dialog-footer');
|
||||||
|
if (footer) {
|
||||||
|
footer.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 工具函数:图片转成指定宽度的 base64
|
||||||
|
const resizeImageToBase64 = (img: HTMLImageElement, maxWidth = 500) => {
|
||||||
|
return new Promise<string>((resolve) => {
|
||||||
|
const image = new Image();
|
||||||
|
image.crossOrigin = 'anonymous';
|
||||||
|
image.src = img.src;
|
||||||
|
image.onload = () => {
|
||||||
|
const scale = Math.min(1, maxWidth / image.naturalWidth);
|
||||||
|
const canvas = document.createElement('canvas');
|
||||||
|
canvas.width = image.naturalWidth * scale;
|
||||||
|
canvas.height = image.naturalHeight * scale;
|
||||||
|
const ctx = canvas.getContext('2d');
|
||||||
|
ctx!.drawImage(image, 0, 0, canvas.width, canvas.height);
|
||||||
|
resolve(canvas.toDataURL('image/png'));
|
||||||
|
};
|
||||||
|
image.onerror = () => {
|
||||||
|
resolve(img.src); // 如果加载失败就用原地址
|
||||||
|
};
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 找到所有图片并替换成 base64(顺序执行以避免并发问题)
|
||||||
|
const imgs = Array.from(clone.querySelectorAll('img'));
|
||||||
|
for (let img of imgs) {
|
||||||
|
const base64 = await resizeImageToBase64(img, 200);
|
||||||
|
img.src = base64;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 应用表格的内联样式
|
||||||
|
applyInlineTableStyles(clone);
|
||||||
|
|
||||||
|
// 拼接 HTML
|
||||||
|
const html = `
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
${style}
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
${clone.innerHTML}
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
`;
|
||||||
|
|
||||||
|
const blob = (window as any).htmlDocx.asBlob(html);
|
||||||
|
saveAs(blob, '变更单.docx');
|
||||||
|
};
|
||||||
|
|
||||||
|
const applyInlineTableStyles = (rootEl: HTMLElement) => {
|
||||||
|
rootEl.querySelectorAll('table').forEach((table) => {
|
||||||
|
table.setAttribute('style', 'width:100%; border-collapse:collapse; table-layout:fixed; border:1px solid #333;');
|
||||||
|
});
|
||||||
|
|
||||||
|
rootEl.querySelectorAll('th, td').forEach((cell) => {
|
||||||
|
cell.setAttribute('style', 'border:1px solid #333; padding:6px; font-size:14px; word-break:break-all;');
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
:deep(.white) {
|
||||||
|
background: #fff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.none) {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.zebra) {
|
||||||
|
background: #f5f7fa;
|
||||||
|
}
|
||||||
|
:deep(.el-descriptions__table) {
|
||||||
|
table-layout: fixed !important;
|
||||||
|
}
|
||||||
|
.word-export-wrapper {
|
||||||
|
table {
|
||||||
|
width: 100% !important;
|
||||||
|
border-collapse: collapse;
|
||||||
|
table-layout: fixed;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
border: 1px solid #333;
|
||||||
|
padding: 8px;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: left;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 确保不超出 Word 页边距 */
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-descriptions__label {
|
||||||
|
font-weight: bold;
|
||||||
|
background-color: #f2f2f2;
|
||||||
|
}
|
||||||
|
.dialog-footer {
|
||||||
|
height: 100px;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
position: absolute;
|
||||||
|
top: 14%;
|
||||||
|
right: 6%;
|
||||||
|
background: #fff;
|
||||||
|
box-shadow: 0 0 10px #ddd;
|
||||||
|
text-align: center;
|
||||||
|
padding: 20px 10px;
|
||||||
|
|
||||||
|
.btn-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
img {
|
||||||
|
transform: rotateZ(180deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
279
src/views/design/shijibiangeng/index.vue
Normal file
@ -0,0 +1,279 @@
|
|||||||
|
<template>
|
||||||
|
<div class="p-2">
|
||||||
|
<el-card shadow="never">
|
||||||
|
<template #header>
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAddApp" v-hasPermi="['quality:qualityInspection:add']"
|
||||||
|
>上传设计变更单</el-button
|
||||||
|
>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
</template>
|
||||||
|
<EngineeringChangeApplicationForm
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
|
:data="tableData"
|
||||||
|
:thumbnail="projectTypeOptions[1].thumbnail"
|
||||||
|
@delete="handleDelete"
|
||||||
|
></EngineeringChangeApplicationForm>
|
||||||
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
|
</el-card>
|
||||||
|
<el-dialog title="新增模板" v-model="dialogVisible" width="800">
|
||||||
|
<el-form :model="form" :rules="rules" ref="formRef" label-width="110px">
|
||||||
|
<div class="flex">
|
||||||
|
<div><image-preview :src="thumbnailUrl" width="150px"></image-preview></div>
|
||||||
|
<div>
|
||||||
|
<el-form-item label="工程名称" prop="projectName">
|
||||||
|
<el-input v-model="form.projectName" placeholder="请输入工程名称" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="编号" prop="serialNumber">
|
||||||
|
<el-input v-model="form.serialNumber" placeholder="请输入编号" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="致" prop="to">
|
||||||
|
<el-input v-model="form.to" placeholder="致:" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="主题" prop="subject">
|
||||||
|
<el-input v-model="form.subject" placeholder="请输入主题" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="内容" prop="content">
|
||||||
|
<el-input v-model="form.content" type="textarea" :rows="6" placeholder="请输入内容" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="附件" prop="attachments">
|
||||||
|
<file-upload v-model="form.attachments" :limit="1" :file-type="['pdf', 'png', 'jpg', 'jpeg', 'gif', 'bmp']"></file-upload>
|
||||||
|
</el-form-item>
|
||||||
|
<el-divider class="mb-10! mt-10!">施工项目部</el-divider>
|
||||||
|
<el-form-item label="项目负责人" prop="contractorLeader">
|
||||||
|
<el-input v-model="form.contractorLeader" placeholder="请输入负责人姓名" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="日期" prop="contractorDate">
|
||||||
|
<el-date-picker v-model="form.contractorDate" type="date" placeholder="选择日期" style="width: 100%" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-divider class="mb-10! mt-10!">项目监理机构</el-divider>
|
||||||
|
|
||||||
|
<el-form-item label="总监理工程师" prop="supervisorLeader">
|
||||||
|
<el-input v-model="form.supervisorLeader" placeholder="请输入总监理工程师姓名" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="日期" prop="supervisorDate">
|
||||||
|
<el-date-picker v-model="form.supervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-divider class="mb-10! mt-10!">建设单位</el-divider>
|
||||||
|
<el-form-item label="业主代表" prop="ownerRep">
|
||||||
|
<el-input v-model="form.ownerRep" placeholder="请输入业主代表" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="日期" prop="ownerDate">
|
||||||
|
<el-date-picker v-model="form.ownerDate" type="date" placeholder="选择日期" style="width: 100%" />
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<span>
|
||||||
|
<el-button @click="dialogVisible = false">取消</el-button>
|
||||||
|
<el-button type="primary" @click="submitForm">确定</el-button>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { useUserStoreHook } from '@/store/modules/user';
|
||||||
|
import type { FormInstance, FormRules } from 'element-plus';
|
||||||
|
import EngineeringChangeApplicationForm from './components/engineeringChangeApplicationForm.vue';
|
||||||
|
import { listContactTypeformtemplate } from '@/api/cory/contactformtemplate';
|
||||||
|
import { addContactnotice, delContactnotice, listContactnotice } from '@/api/cory/contactnotice';
|
||||||
|
|
||||||
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
|
const { wf_business_status } = toRefs(proxy?.useDict('wf_business_status'));
|
||||||
|
// 获取用户 store
|
||||||
|
const userStore = useUserStoreHook();
|
||||||
|
// 从 store 中获取项目列表和当前选中的项目
|
||||||
|
const currentProject = computed(() => userStore.selectedProject);
|
||||||
|
const thumbnailUrl = ref('');
|
||||||
|
const tableData = ref([]);
|
||||||
|
const total = ref(0);
|
||||||
|
const activeName = ref('1');
|
||||||
|
const formRef = ref<FormInstance>();
|
||||||
|
const dialogVisible = ref<boolean>(false);
|
||||||
|
const showSearch = ref(true);
|
||||||
|
const multiple = ref<boolean>(true);
|
||||||
|
const addSingle = ref<boolean>(false);
|
||||||
|
const single = ref<boolean>(true);
|
||||||
|
const ids = ref<Array<string | number>>([]);
|
||||||
|
|
||||||
|
const projectTypeOptions = ref<any>([
|
||||||
|
{
|
||||||
|
value: '0',
|
||||||
|
label: '外部联系单'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '1',
|
||||||
|
label: '变更单'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '2',
|
||||||
|
label: '通知单'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '3',
|
||||||
|
label: '回复单'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '4',
|
||||||
|
label: '签证单'
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
|
||||||
|
const initFormData = {
|
||||||
|
projectType: '',
|
||||||
|
projectName: '',
|
||||||
|
serialNumber: '',
|
||||||
|
to: '',
|
||||||
|
subject: '',
|
||||||
|
content: '',
|
||||||
|
attachments: '',
|
||||||
|
contractorLeader: '',
|
||||||
|
contractorDate: '',
|
||||||
|
supervisorLeader: '',
|
||||||
|
supervisorDate: '',
|
||||||
|
ownerRep: '',
|
||||||
|
ownerDate: '',
|
||||||
|
unitName: '',
|
||||||
|
profession: '',
|
||||||
|
applyDate: '',
|
||||||
|
bookName: '',
|
||||||
|
bookNo: '',
|
||||||
|
hasAttachment: '',
|
||||||
|
changeReasons: [],
|
||||||
|
changeContent: '',
|
||||||
|
costEstimate: ''
|
||||||
|
};
|
||||||
|
const data = reactive<PageData<any, any>>({
|
||||||
|
form: { ...initFormData },
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
projectId: currentProject.value?.id,
|
||||||
|
inspectionType: undefined,
|
||||||
|
inspectionStatus: undefined,
|
||||||
|
teamId: undefined,
|
||||||
|
type: undefined,
|
||||||
|
params: {},
|
||||||
|
// ids: ['1942107830848872449', '1942107931415699457'],
|
||||||
|
projectType: undefined
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
projectName: [{ required: true, message: '请输入工程名称', trigger: 'blur' }],
|
||||||
|
projectType: [{ required: true, message: '请选择模板类型', trigger: 'blur' }],
|
||||||
|
serialNumber: [{ required: true, message: '请输入编号', trigger: 'blur' }],
|
||||||
|
to: [{ required: true, message: '请输入接收方', trigger: 'blur' }],
|
||||||
|
subject: [{ required: true, message: '请输入主题', trigger: 'blur' }],
|
||||||
|
content: [{ required: true, message: '请输入内容', trigger: 'blur' }]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const { queryParams, form, rules } = toRefs(data);
|
||||||
|
|
||||||
|
const submitForm = () => {
|
||||||
|
formRef.value?.validate(async (valid) => {
|
||||||
|
if (valid) {
|
||||||
|
let data = {
|
||||||
|
type: queryParams.value.type,
|
||||||
|
projectId: currentProject.value?.id,
|
||||||
|
detail: JSON.stringify(form.value)
|
||||||
|
};
|
||||||
|
console.log('提交表单:', form);
|
||||||
|
const res = await addContactnotice(data);
|
||||||
|
if (res.code == 200) {
|
||||||
|
proxy.$modal.msgSuccess('添加成功');
|
||||||
|
dialogVisible.value = false;
|
||||||
|
formRef.value.resetFields();
|
||||||
|
getList();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleAdd = () => {
|
||||||
|
dialogVisible.value = true;
|
||||||
|
};
|
||||||
|
|
||||||
|
const getList = async () => {
|
||||||
|
if (!queryParams.value.projectType) {
|
||||||
|
const res = await listContactTypeformtemplate(queryParams.value);
|
||||||
|
projectTypeOptions.value = res.data;
|
||||||
|
queryParams.value.projectType = res.data[1].name;
|
||||||
|
thumbnailUrl.value = res.data[1].thumbnail;
|
||||||
|
queryParams.value.type = res.data[1].id as string;
|
||||||
|
}
|
||||||
|
const res = await listContactnotice(queryParams.value);
|
||||||
|
res.rows = res.rows.map((item) => {
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
...JSON.parse(item.detail),
|
||||||
|
status: item.status
|
||||||
|
};
|
||||||
|
});
|
||||||
|
tableData.value = res.rows;
|
||||||
|
console.log('🚀 ~ getList ~ tableData.value:', tableData.value);
|
||||||
|
total.value = res.total || 0;
|
||||||
|
};
|
||||||
|
const handleDelete = async (id?: string) => {
|
||||||
|
const _ids = id || ids.value;
|
||||||
|
await proxy?.$modal.confirm('是否确认删除识别记录编号为"' + _ids + '"的数据项?').finally();
|
||||||
|
const res = await delContactnotice(_ids);
|
||||||
|
if (res.code == 200) {
|
||||||
|
proxy.$modal.msgSuccess('删除成功');
|
||||||
|
getList();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
/** 多选框选中数据 */
|
||||||
|
const handleSelectionChange = (selection: any) => {
|
||||||
|
ids.value = selection.map((item) => item.id);
|
||||||
|
single.value = selection.length != 1;
|
||||||
|
multiple.value = !selection.length;
|
||||||
|
};
|
||||||
|
|
||||||
|
const selectType = (value: string) => {
|
||||||
|
queryParams.value.projectType = value;
|
||||||
|
thumbnailUrl.value = projectTypeOptions.value.filter((item) => item.name == value)[0].thumbnail;
|
||||||
|
queryParams.value.type = projectTypeOptions.value.filter((item) => item.name == value)[0].id;
|
||||||
|
getList();
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleClick = (val) => {
|
||||||
|
console.log(val);
|
||||||
|
queryParams.value.projectType = val.props.name;
|
||||||
|
getList();
|
||||||
|
};
|
||||||
|
const handleAddApp = (row) => {
|
||||||
|
// 添加审批
|
||||||
|
proxy.$tab.closePage(proxy.$route);
|
||||||
|
proxy.$router.push({
|
||||||
|
path: `/approval/changeContact/indexEdit`,
|
||||||
|
query: {
|
||||||
|
thumbnailUrl: projectTypeOptions.value[1].thumbnail,
|
||||||
|
id: projectTypeOptions.value[1].id,
|
||||||
|
row,
|
||||||
|
type: 'add'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
onMounted(() => {
|
||||||
|
getList();
|
||||||
|
});
|
||||||
|
|
||||||
|
//监听项目id刷新数据
|
||||||
|
const listeningProject = watch(
|
||||||
|
() => currentProject.value?.id,
|
||||||
|
(nid, oid) => {
|
||||||
|
queryParams.value.projectId = nid;
|
||||||
|
getList();
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
listeningProject();
|
||||||
|
});
|
||||||
|
</script>
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.status"
|
:status="form.status"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.auditStatus"
|
:status="form.auditStatus"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -10,6 +10,13 @@
|
|||||||
<el-form-item label="资料名称" prop="documentName">
|
<el-form-item label="资料名称" prop="documentName">
|
||||||
<el-input v-model="queryParams.documentName" placeholder="请输入资料名称" clearable @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.documentName" placeholder="请输入资料名称" clearable @keyup.enter="handleQuery" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
<el-form-item label="是否文件上传" prop="isUpload" label-width="110px">
|
||||||
|
<el-select v-model="queryParams.isUpload" placeholder="请选择" clearable @keyup.enter="handleQuery">
|
||||||
|
<el-option value="1" label="是" />
|
||||||
|
<el-option value="0" label="否" />
|
||||||
|
<el-option value="2" label="全部" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery" v-hasPermi="['design:volumeCatalog:query']">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery" v-hasPermi="['design:volumeCatalog:query']">搜索</el-button>
|
||||||
<el-button icon="Refresh" @click="resetQuery" v-hasPermi="['design:volumeCatalog:query']">重置</el-button>
|
<el-button icon="Refresh" @click="resetQuery" v-hasPermi="['design:volumeCatalog:query']">重置</el-button>
|
||||||
@ -154,14 +161,14 @@
|
|||||||
<el-form-item v-if="uploadForm.type == '3'" label="蓝图" prop="fileIds">
|
<el-form-item v-if="uploadForm.type == '3'" label="蓝图" prop="fileIds">
|
||||||
<file-upload :fileType="['pdf']" :isShowTip="false" :fileSize="100" v-model="uploadForm.fileIds"></file-upload>
|
<file-upload :fileType="['pdf']" :isShowTip="false" :fileSize="100" v-model="uploadForm.fileIds"></file-upload>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="uploadForm.type == '3'" label="通知人">
|
<el-form-item v-if="uploadForm.type == '1'" label="过程图纸" prop="cancellationIds">
|
||||||
|
<file-upload :fileType="['pdf']" :isShowTip="false" :fileSize="100" v-model="uploadForm.cancellationIds"></file-upload>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="通知人">
|
||||||
<el-select multiple filterable clearable v-model="form.userIds" placeholder="请选择通知人">
|
<el-select multiple filterable clearable v-model="form.userIds" placeholder="请选择通知人">
|
||||||
<el-option :value="item.userId" v-for="item in userCoryList" :key="item.userId" :label="item.nickName + '-' + item.phonenumber" />
|
<el-option :value="item.userId" v-for="item in userCoryList" :key="item.userId" :label="item.nickName + '-' + item.phonenumber" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="uploadForm.type == '1'" label="过程图纸" prop="cancellationIds">
|
|
||||||
<file-upload :fileType="['pdf']" :isShowTip="false" :fileSize="100" v-model="uploadForm.cancellationIds"></file-upload>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
</el-form>
|
||||||
<span style="font-size: 12px; color: #999999">注意:请上传pdf格式文件</span>
|
<span style="font-size: 12px; color: #999999">注意:请上传pdf格式文件</span>
|
||||||
<div style="display: flex; justify-content: flex-end">
|
<div style="display: flex; justify-content: flex-end">
|
||||||
@ -360,7 +367,8 @@ const data = reactive({
|
|||||||
designSubitemId: undefined,
|
designSubitemId: undefined,
|
||||||
volumeNumber: undefined,
|
volumeNumber: undefined,
|
||||||
documentName: undefined,
|
documentName: undefined,
|
||||||
params: {}
|
params: {},
|
||||||
|
isUpload: '2'
|
||||||
},
|
},
|
||||||
rules: {
|
rules: {
|
||||||
design: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }],
|
design: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }],
|
||||||
@ -585,7 +593,6 @@ const handleUploadSuccess = async (flieList: any, res: any) => {
|
|||||||
};
|
};
|
||||||
/** 审核蓝图按钮操作 */
|
/** 审核蓝图按钮操作 */
|
||||||
const handleAuditLantu = async (row) => {
|
const handleAuditLantu = async (row) => {
|
||||||
proxy.$tab.closePage(proxy.$route);
|
|
||||||
proxy.$router.push({
|
proxy.$router.push({
|
||||||
path: `/approval/volumeCatalog/blueprintEdit`,
|
path: `/approval/volumeCatalog/blueprintEdit`,
|
||||||
query: {
|
query: {
|
||||||
@ -596,7 +603,6 @@ const handleAuditLantu = async (row) => {
|
|||||||
};
|
};
|
||||||
/** 查看蓝图按钮操作 */
|
/** 查看蓝图按钮操作 */
|
||||||
const handleAuditViewLantu = async (row) => {
|
const handleAuditViewLantu = async (row) => {
|
||||||
proxy.$tab.closePage(proxy.$route);
|
|
||||||
proxy.$router.push({
|
proxy.$router.push({
|
||||||
path: `/approval/volumeCatalog/blueprintEdit`,
|
path: `/approval/volumeCatalog/blueprintEdit`,
|
||||||
query: {
|
query: {
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.auditStatus"
|
:status="form.auditStatus"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -0,0 +1,328 @@
|
|||||||
|
<template>
|
||||||
|
<div class="centerPage">
|
||||||
|
<div class="centerPage_map">
|
||||||
|
<div ref="mapRef" class="map-container" style="width: 100%; height: 100%" />
|
||||||
|
</div>
|
||||||
|
<div class="centerPage_bottom">
|
||||||
|
<Title title="风险预警" style="font-size: 22px">
|
||||||
|
<img src="@/assets/projectLarge/robot.svg" alt="" height="20px" width="20px" />
|
||||||
|
</Title>
|
||||||
|
<div class="centerPage_bottom_table">
|
||||||
|
<el-table v-loading="loading" :data="tableData" show-overflow-tooltip>
|
||||||
|
<el-table-column label="时间" align="center" prop="date" />
|
||||||
|
<el-table-column label="类型" align="center" prop="riskType">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ safety_inspection_type[scope.row.riskType] }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="报警内容" align="center" prop="alarmContent" />
|
||||||
|
<el-table-column label="危险等级" align="center" prop="dangerLevel" />
|
||||||
|
<el-table-column label="来源" align="center" prop="source" />
|
||||||
|
<el-table-column label="警告等级" align="center" prop="alarmLevel">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ risk_level_type[scope.row.alarmLevel] }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import * as echarts from 'echarts';
|
||||||
|
import china from '@/assets/china.json';
|
||||||
|
import RevenueContractCard from './RevenueContractCard.vue';
|
||||||
|
import bottomboxconpoent from './bottomboxconpoent.vue';
|
||||||
|
import { totalAmount, projectGis } from '@/api/largeScreen/index'; // 导入projectGis接口
|
||||||
|
import { ref, onMounted, onUnmounted, nextTick } from 'vue';
|
||||||
|
import Title from './title.vue';
|
||||||
|
import { earlyWarning } from '@/api/outputApi';
|
||||||
|
import { useDict } from '@/utils/dict';
|
||||||
|
import { getDicts } from '@/api/system/dict/data';
|
||||||
|
// 地图相关变量
|
||||||
|
const mapRef = ref<HTMLDivElement | null>(null);
|
||||||
|
let myChart: any = null;
|
||||||
|
const projectData = ref<any[]>([]); // 存储项目地理信息数据
|
||||||
|
const loading = ref(false);
|
||||||
|
const tableData = ref([]);
|
||||||
|
const risk_level_type = ref();
|
||||||
|
const safety_inspection_type = ref();
|
||||||
|
// 新增:获取项目地理信息数据
|
||||||
|
const getProjectGisData = async () => {
|
||||||
|
try {
|
||||||
|
const response = await projectGis();
|
||||||
|
if (response.code === 200) {
|
||||||
|
// 过滤掉没有经纬度的项目
|
||||||
|
projectData.value = response.data.filter((item: any) => item.lng !== null && item.lat !== null && item.lng !== '' && item.lat !== '');
|
||||||
|
console.log('项目地理数据:', projectData.value);
|
||||||
|
} else {
|
||||||
|
console.error('项目地理数据请求失败:', response.msg);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('项目地理数据调用异常:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
//获取字典
|
||||||
|
const getDictsType = async () => {
|
||||||
|
const res = await getDicts('risk_level_type');
|
||||||
|
if (res.code === 200) {
|
||||||
|
risk_level_type.value = res.data.reduce((acc, item) => {
|
||||||
|
acc[item.dictValue] = item.dictLabel;
|
||||||
|
return acc;
|
||||||
|
}, {});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const getDictsType2 = async () => {
|
||||||
|
const res = await getDicts('safety_inspection_type');
|
||||||
|
if (res.code === 200) {
|
||||||
|
safety_inspection_type.value = res.data.reduce((acc, item) => {
|
||||||
|
acc[item.dictValue] = item.dictLabel;
|
||||||
|
return acc;
|
||||||
|
}, {});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
//获取表格数据
|
||||||
|
const getTableList = async () => {
|
||||||
|
const res = await earlyWarning();
|
||||||
|
if (res.code === 200) {
|
||||||
|
tableData.value = res.data;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 地图resize处理
|
||||||
|
const handleResize = () => {
|
||||||
|
if (myChart) myChart.resize();
|
||||||
|
};
|
||||||
|
|
||||||
|
// 初始化地图(修改为使用接口数据)
|
||||||
|
const initEcharts = () => {
|
||||||
|
if (!mapRef.value || projectData.value.length === 0) {
|
||||||
|
console.error('未找到地图容器或项目数据');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
echarts.registerMap('china', china as any);
|
||||||
|
|
||||||
|
// 从接口数据生成散点数据
|
||||||
|
const scatterData = projectData.value.map((item) => ({
|
||||||
|
name: item.projectName,
|
||||||
|
value: [parseFloat(item.lng), parseFloat(item.lat)], // 转换为数值类型
|
||||||
|
shortName: item.shortName,
|
||||||
|
projectSite: item.projectSite,
|
||||||
|
symbol: 'diamond',
|
||||||
|
itemStyle: { color: '#0166d6' },
|
||||||
|
symbolSize: [20, 20],
|
||||||
|
label: {
|
||||||
|
show: true,
|
||||||
|
formatter: '{b}', // 显示项目名称
|
||||||
|
position: 'top',
|
||||||
|
color: '#fff',
|
||||||
|
fontSize: 12,
|
||||||
|
backgroundColor: 'rgba(3, 26, 52, 0.7)',
|
||||||
|
padding: [3, 6],
|
||||||
|
borderRadius: 3
|
||||||
|
}
|
||||||
|
}));
|
||||||
|
|
||||||
|
myChart = echarts.init(mapRef.value, null, {
|
||||||
|
renderer: 'canvas',
|
||||||
|
useDirtyRect: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const option: any = {
|
||||||
|
roam: true, // 允许缩放和平移
|
||||||
|
geo: {
|
||||||
|
type: 'map',
|
||||||
|
map: 'china',
|
||||||
|
zoom: 2, // 调整初始缩放级别
|
||||||
|
center: [108.95, 34.27], // 中国中心位置经纬度
|
||||||
|
label: { show: false, color: '#fff' },
|
||||||
|
itemStyle: {
|
||||||
|
areaColor: '#031a34',
|
||||||
|
borderColor: '#1e3a6e',
|
||||||
|
borderWidth: 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'item',
|
||||||
|
backgroundColor: 'rgba(3, 26, 52, 0.8)',
|
||||||
|
borderColor: '#1e3a6e',
|
||||||
|
textStyle: {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
formatter: function (params: any) {
|
||||||
|
if (params.data) {
|
||||||
|
// 处理散点数据
|
||||||
|
const data = params.data;
|
||||||
|
return `
|
||||||
|
<div style="font-weight: bold;">${data.name}</div>
|
||||||
|
<div>地点:${data.projectSite}</div>
|
||||||
|
<div>经纬度:${data.value[0].toFixed(6)}, ${data.value[1].toFixed(6)}</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
if (params.seriesType === 'map') {
|
||||||
|
// console.log(params, 111111);
|
||||||
|
return `
|
||||||
|
<div style="font-weight: bold;">${params.name}</div>
|
||||||
|
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
type: 'map',
|
||||||
|
map: 'china',
|
||||||
|
geoIndex: 0,
|
||||||
|
emphasis: {
|
||||||
|
areaColor: '#fff',
|
||||||
|
label: { show: true, color: '#fff' },
|
||||||
|
itemStyle: { areaColor: '#02417e' }
|
||||||
|
},
|
||||||
|
select: { itemStyle: { areaColor: '#02417e' } },
|
||||||
|
data: [] // 可以留空,或根据需要添加区域数据
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'scatter',
|
||||||
|
coordinateSystem: 'geo',
|
||||||
|
data: scatterData,
|
||||||
|
emphasis: {
|
||||||
|
scale: true, // 鼠标悬停时放大
|
||||||
|
symbolSize: [25, 25]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
myChart.setOption(option);
|
||||||
|
};
|
||||||
|
const risk_level_type1 = ref([]);
|
||||||
|
const safety_inspection_type1 = ref([]);
|
||||||
|
// 组件生命周期
|
||||||
|
onMounted(() => {
|
||||||
|
nextTick(async () => {
|
||||||
|
// 先获取合同数据和项目地理数据,再初始化地图
|
||||||
|
getDictsType();
|
||||||
|
getDictsType2();
|
||||||
|
await Promise.all([getProjectGisData()]);
|
||||||
|
initEcharts();
|
||||||
|
getTableList();
|
||||||
|
window.addEventListener('resize', handleResize);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
window.removeEventListener('resize', handleResize);
|
||||||
|
if (myChart) {
|
||||||
|
myChart.dispose();
|
||||||
|
myChart = null;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.centerPage {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
// justify-content: space-between;
|
||||||
|
padding: 0 10px 10px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.centerPage_map {
|
||||||
|
width: 100%;
|
||||||
|
height: 65vh;
|
||||||
|
}
|
||||||
|
.centerPage_bottom {
|
||||||
|
width: 100%;
|
||||||
|
height: 25vh;
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
padding: 10px 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
.centerPage_bottom_table {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
:deep(.el-table, .el-table__expanded-cell) {
|
||||||
|
background: rgba(0, 0, 0, 0);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-table tr) {
|
||||||
|
background: rgba(0, 0, 0, 0);
|
||||||
|
// border: 1px solid rgba(0, 255, 255, 0.5) !important;
|
||||||
|
}
|
||||||
|
:deep(.el-table .el-table__header-wrapper th, .el-table .el-table__fixed-header-wrapper th) {
|
||||||
|
background: rgba(0, 0, 0, 0) !important;
|
||||||
|
}
|
||||||
|
:deep(.el-table th.el-table__cell) {
|
||||||
|
background: rgba(0, 0, 0, 0);
|
||||||
|
color: #fff;
|
||||||
|
border-bottom: 1px solid transparent !important;
|
||||||
|
border-right: 1px solid transparent !important;
|
||||||
|
}
|
||||||
|
:deep(.el-table--enable-row-transition .el-table__body td.el-table__cell) {
|
||||||
|
border-right: 1px solid transparent !important;
|
||||||
|
border-bottom: 1px solid transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-table__body tr:hover > td) {
|
||||||
|
background-color: rgba(40, 75, 91, 0.9) !important;
|
||||||
|
}
|
||||||
|
/* 表格边框颜色 */
|
||||||
|
:deep(.el-table, .el-table__header-wrapper, .el-table__body-wrapper, .el-table__footer-wrapper, .el-table th, .el-table td) {
|
||||||
|
border: 1px solid transparent !important;
|
||||||
|
background: rgba(0, 0, 0, 0);
|
||||||
|
}
|
||||||
|
:deep(.el-table__inner-wrapper:before) {
|
||||||
|
background-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 固定列的边框 */
|
||||||
|
:deep(.el-table__fixed, .el-table__fixed-right) {
|
||||||
|
border: 1px solid transparent !important;
|
||||||
|
}
|
||||||
|
:deep(.el-table__body-wrapper::-webkit-scrollbar) {
|
||||||
|
width: 4px;
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
|
||||||
|
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
||||||
|
opacity: 0.2;
|
||||||
|
background: #00c0ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-table__body-wrapper::-webkit-scrollbar-track) {
|
||||||
|
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
||||||
|
border-radius: 0;
|
||||||
|
background: rgba(220, 228, 245, 0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-icon-arrow-right:before) {
|
||||||
|
color: #0ff;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 滚动条优化
|
||||||
|
.centerPage_bottom_table::-webkit-scrollbar {
|
||||||
|
width: 5px;
|
||||||
|
height: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.centerPage_bottom_table::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #0ff;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.centerPage_bottom_table::-webkit-scrollbar-track {
|
||||||
|
background-color: rgba(0, 255, 255, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
@ -0,0 +1,327 @@
|
|||||||
|
<template>
|
||||||
|
<div class="header">
|
||||||
|
<div class="header_left">
|
||||||
|
<div class="header_left_img">
|
||||||
|
<img src="@/assets/large/secure.png" style="width: 100%; height: 100%" />
|
||||||
|
</div>
|
||||||
|
<div style="font-size: 12px; padding-left: 10px">安全生产天数:</div>
|
||||||
|
<div class="header_left_text">
|
||||||
|
{{ safetyDay }}
|
||||||
|
<span style="font-size: 12px">天</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title">
|
||||||
|
<div>煤科建管-新能源项目数智化管理平台</div>
|
||||||
|
<div>Coal Science Construction Management - New Energy Project Digital Intelligent Management Platform</div>
|
||||||
|
</div>
|
||||||
|
<div class="header_right">
|
||||||
|
<div class="top-bar">
|
||||||
|
<!-- 左侧:天气图标 + 日期文字 -->
|
||||||
|
<div class="left-section">
|
||||||
|
<div class="weather-list" @mouseenter="requestPause" @mouseleave="resumeScroll">
|
||||||
|
<div
|
||||||
|
v-for="(item, i) in weatherList"
|
||||||
|
:key="i"
|
||||||
|
class="weather-item"
|
||||||
|
:style="{ transform: `translateY(-${offsetY}px)`, transition: transition }"
|
||||||
|
>
|
||||||
|
<img :src="`/assets/demo/${item.icon}.png`" alt="" />
|
||||||
|
<div>{{ item.weather }}{{ item.tempMin }}°/{{ item.tempMax }}°</div>
|
||||||
|
<div>{{ item.week }}({{ item.date }})</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 分割线 -->
|
||||||
|
<div class="divider">
|
||||||
|
<div class="top-block"></div>
|
||||||
|
<div class="bottom-block"></div>
|
||||||
|
</div>
|
||||||
|
<!-- 右侧:管理系统图标 + 文字 -->
|
||||||
|
<div class="right-section">
|
||||||
|
<img src="@/assets/large/setting.png" alt="设置图标" />
|
||||||
|
<span>管理系统</span>
|
||||||
|
</div>
|
||||||
|
<!-- 分割线 -->
|
||||||
|
<div class="divider">
|
||||||
|
<div class="top-block"></div>
|
||||||
|
<div class="bottom-block"></div>
|
||||||
|
</div>
|
||||||
|
<!-- -->
|
||||||
|
<div class="change" @click="emit('changePage')">
|
||||||
|
<el-icon size="20" v-if="!isFull">
|
||||||
|
<Expand />
|
||||||
|
</el-icon>
|
||||||
|
<el-icon size="20" v-else>
|
||||||
|
<Fold />
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, onMounted, onUnmounted } from 'vue';
|
||||||
|
import { getScreenSafetyDay, getScreenWeather } from '@/api/projectScreen';
|
||||||
|
|
||||||
|
interface Weather {
|
||||||
|
week: string;
|
||||||
|
date: string;
|
||||||
|
icon: string;
|
||||||
|
weather: string;
|
||||||
|
tempMax: string;
|
||||||
|
tempMin: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
projectId: {
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
isFull: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const emit = defineEmits(['changePage']);
|
||||||
|
|
||||||
|
const safetyDay = ref<number>(0);
|
||||||
|
const weatherList = ref<Weather[]>([]);
|
||||||
|
const timer = ref<number | null>(0);
|
||||||
|
const offsetY = ref<number>(0);
|
||||||
|
const curIndex = ref(0);
|
||||||
|
const transition = ref('transform 0.5s ease');
|
||||||
|
const pendingPause = ref(false);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 判断当前时间是白天/夜晚
|
||||||
|
*/
|
||||||
|
function judgeDayOrNight(sunRise: string, sunSet: string) {
|
||||||
|
// 将 "HH:MM" 格式转为分钟数(便于计算)
|
||||||
|
const timeToMinutes = (timeStr: any) => {
|
||||||
|
const [hours, minutes] = timeStr.split(':').map(Number);
|
||||||
|
return isNaN(hours) || isNaN(minutes) ? 0 : hours * 60 + minutes;
|
||||||
|
};
|
||||||
|
// 转换日出、日落时间为分钟数
|
||||||
|
const sunRiseMinutes = timeToMinutes(sunRise);
|
||||||
|
const sunSetMinutes = timeToMinutes(sunSet);
|
||||||
|
// 获取当前时间并转为分钟数
|
||||||
|
const now = new Date();
|
||||||
|
const currentMinutes = now.getHours() * 60 + now.getMinutes();
|
||||||
|
// true 白天 false 夜晚
|
||||||
|
return currentMinutes >= sunRiseMinutes && currentMinutes <= sunSetMinutes ? true : false;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 设置天气周期滑动
|
||||||
|
*/
|
||||||
|
const setWeatherScroll = () => {
|
||||||
|
curIndex.value += 1;
|
||||||
|
transition.value = 'transform 0.3s ease';
|
||||||
|
offsetY.value = curIndex.value * 60;
|
||||||
|
|
||||||
|
if (curIndex.value === weatherList.value.length - 1) {
|
||||||
|
setTimeout(() => {
|
||||||
|
transition.value = 'none';
|
||||||
|
curIndex.value = 0;
|
||||||
|
offsetY.value = 0;
|
||||||
|
}, 350);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function startScroll() {
|
||||||
|
if (timer.value) clearInterval(timer.value);
|
||||||
|
timer.value = window.setInterval(setWeatherScroll, 5000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function requestPause() {
|
||||||
|
if (timer.value) {
|
||||||
|
clearInterval(timer.value);
|
||||||
|
timer.value = null;
|
||||||
|
}
|
||||||
|
pendingPause.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function resumeScroll() {
|
||||||
|
console.log('resumeScroll');
|
||||||
|
pendingPause.value = false;
|
||||||
|
startScroll();
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
/**
|
||||||
|
* 获取安全生产天数
|
||||||
|
*/
|
||||||
|
getScreenSafetyDay(props.projectId).then((res) => {
|
||||||
|
const { data, code } = res;
|
||||||
|
if (code === 200) {
|
||||||
|
safetyDay.value = data.safetyDay;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 获取近三天天气
|
||||||
|
*/
|
||||||
|
getScreenWeather(props.projectId).then((res) => {
|
||||||
|
const { data, code } = res;
|
||||||
|
if (code === 200) {
|
||||||
|
data.forEach((item) => {
|
||||||
|
if (judgeDayOrNight(item.sunRise, item.sunSet)) {
|
||||||
|
item.weather = item.dayStatus;
|
||||||
|
item.icon = item.dayIcon;
|
||||||
|
} else {
|
||||||
|
item.weather = item.nightStatus;
|
||||||
|
item.icon = item.nightIcon;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
weatherList.value = data;
|
||||||
|
// 多添加第一项 实现无缝衔接
|
||||||
|
weatherList.value = [...weatherList.value, weatherList.value[0]];
|
||||||
|
startScroll();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
if (timer.value) {
|
||||||
|
clearInterval(timer.value);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.header {
|
||||||
|
width: 100%;
|
||||||
|
height: 80px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 10px;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 2fr 1fr;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header_left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.header_left_img {
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
// padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header_left_text {
|
||||||
|
font-weight: 500;
|
||||||
|
text-shadow: 0px 1.24px 6.21px rgba(25, 179, 250, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header_right {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
color: #fff;
|
||||||
|
font-family: 'AlimamaShuHeiTi', sans-serif;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title > div:first-child {
|
||||||
|
/* 第一个子元素的样式 */
|
||||||
|
font-size: 38px;
|
||||||
|
letter-spacing: 0.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title > div:last-child {
|
||||||
|
/* 最后一个子元素的样式 */
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 顶部栏容器:Flex 水平布局 + 垂直居中 */
|
||||||
|
.top-bar {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
|
color: #fff;
|
||||||
|
padding: 8px 16px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 左侧区域(天气 + 日期):自身也用 Flex 水平排列,确保元素在一行 */
|
||||||
|
.left-section {
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.weather-list {
|
||||||
|
height: 60px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.weather-item {
|
||||||
|
height: 60px;
|
||||||
|
line-height: 60px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
& > div:last-child {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 分割线(视觉分隔,可根据需求调整样式) */
|
||||||
|
.divider {
|
||||||
|
display: grid;
|
||||||
|
grid-template-rows: 1fr 1fr;
|
||||||
|
gap: 2px;
|
||||||
|
padding: 14px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divider .top-block {
|
||||||
|
width: 2px;
|
||||||
|
height: 7px;
|
||||||
|
background: #19b5fb;
|
||||||
|
align-self: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divider .bottom-block {
|
||||||
|
width: 2px;
|
||||||
|
height: 7px;
|
||||||
|
background: #19b5fb;
|
||||||
|
align-self: end;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 右侧区域(管理系统):图标 + 文字水平排列 */
|
||||||
|
.right-section {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-family: 'AlimamaShuHeiTi', sans-serif;
|
||||||
|
font-size: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-section img {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 6px;
|
||||||
|
/* 图标与文字间距 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.change {
|
||||||
|
display: grid;
|
||||||
|
place-items: center;
|
||||||
|
margin-right: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
</style>
|
@ -0,0 +1,960 @@
|
|||||||
|
<template>
|
||||||
|
<div class="leftPage">
|
||||||
|
<div class="topPage">
|
||||||
|
<Title style="font-size: 22px" title="企业关键指标" />
|
||||||
|
<div class="indicators">
|
||||||
|
<div class="indicator-card" v-for="indicator in indicators" :key="indicator.id">
|
||||||
|
<div style="display: flex; align-items: baseline; gap: 4px; margin-bottom: 5px">
|
||||||
|
<div class="indicator-value">{{ indicator.value }}</div>
|
||||||
|
<div class="indicator-unit">{{ indicator.unit }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="indicator-name">{{ indicator.name }}</div>
|
||||||
|
<div class="indicator-icon">
|
||||||
|
<img :src="indicator.iconPath" :alt="indicator.name" v-if="indicator.iconPath" style="width: 50px; height: 50px" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="endPage">
|
||||||
|
<Title style="font-size: 22px" title="人员情况" />
|
||||||
|
<!-- 人员总览区域 -->
|
||||||
|
<div class="people_overview">
|
||||||
|
<div class="people_overview_content">
|
||||||
|
<div class="people_image">
|
||||||
|
<!-- 本地图片占位,后续可替换为实际图片路径 -->
|
||||||
|
<img src="@/assets/images/man.png" alt="人员总览" class="placeholder_image" />
|
||||||
|
</div>
|
||||||
|
<div class="people_stats">
|
||||||
|
<div class="stat_item">
|
||||||
|
<div class="stat_label">出勤人数</div>
|
||||||
|
<div class="stat_value">{{ attendanceCount }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="stat_item">
|
||||||
|
<div class="stat_label">出勤率</div>
|
||||||
|
<div class="stat_rate">{{ attendanceRate }}%</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 点阵地图 -->
|
||||||
|
<div class="people_map">
|
||||||
|
<div class="map_container">
|
||||||
|
<img src="@/assets/images/map.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 人员分类统计 -->
|
||||||
|
<div class="people_categories">
|
||||||
|
<div class="category_item">
|
||||||
|
<div class="category_icon">
|
||||||
|
<!-- 本地图片占位,后续可替换为实际图片路径 -->
|
||||||
|
<img src="@/assets/images/constructor.png" alt="施工人员" class="category_image" />
|
||||||
|
</div>
|
||||||
|
<div class="category_info">
|
||||||
|
<div class="category_label">施工人员</div>
|
||||||
|
<div class="category_count">{{ constructionPersonnelCount }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="category_item">
|
||||||
|
<div class="category_icon">
|
||||||
|
<!-- 本地图片占位,后续可替换为实际图片路径 -->
|
||||||
|
<img src="@/assets/images/subcontractor.png" alt="分包人员" class="category_image" />
|
||||||
|
</div>
|
||||||
|
<div class="category_info">
|
||||||
|
<div class="category_label">分包人员</div>
|
||||||
|
<div class="category_count">{{ subcontractorsCount }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="category_item">
|
||||||
|
<div class="category_icon">
|
||||||
|
<!-- 本地图片占位,后续可替换为实际图片路径 -->
|
||||||
|
<img src="@/assets/images/manager.png" alt="管理人员" class="category_image" />
|
||||||
|
</div>
|
||||||
|
<div class="category_info">
|
||||||
|
<div class="category_label">管理人员</div>
|
||||||
|
<div class="category_count">{{ managersCount }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 项目出勤率柱状图 -->
|
||||||
|
<div class="project_attendance_chart">
|
||||||
|
<Title style="font-size: 22px" title="项目出勤率统计" />
|
||||||
|
|
||||||
|
<div class="chart_content" ref="attendanceChartRef"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref } from 'vue';
|
||||||
|
import Title from './title.vue';
|
||||||
|
import { getScreenNews, getScreenPeople } from '@/api/projectScreen';
|
||||||
|
import { keyIndex, projectAttendanceCount, peopleCount, allAttendanceCount } from '@/api/enterpriseLarge/index';
|
||||||
|
import { mapOption } from './optionList';
|
||||||
|
import * as echarts from 'echarts';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
projectId: {
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let mapChart = null;
|
||||||
|
const mapChartRef = ref<HTMLDivElement | null>(null);
|
||||||
|
const indicators = ref([
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
name: '在建项目',
|
||||||
|
value: '28',
|
||||||
|
unit: '个',
|
||||||
|
iconPath: '/assets/demo/beUnder.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
name: '合同总额',
|
||||||
|
value: '288.88',
|
||||||
|
unit: '亿元',
|
||||||
|
iconPath: '/assets/demo/contract.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
name: '总容量',
|
||||||
|
value: '158.88',
|
||||||
|
unit: '个',
|
||||||
|
iconPath: '/assets/demo/totalCapacity.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '4',
|
||||||
|
name: '今日施工',
|
||||||
|
value: '18',
|
||||||
|
unit: '个',
|
||||||
|
iconPath: '/assets/demo/todayConstruction.png'
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
|
||||||
|
const news = ref([]);
|
||||||
|
const newDetail = ref({
|
||||||
|
title: '',
|
||||||
|
content: ''
|
||||||
|
});
|
||||||
|
const newId = ref('');
|
||||||
|
const attendanceCount = ref(0);
|
||||||
|
const attendanceRate = ref(0);
|
||||||
|
const totalPeopleCount = ref(0);
|
||||||
|
const teamAttendanceList = ref([{ id: '', teamName: '', attendanceNumber: 0, allNumber: 0, attendanceRate: 0, attendanceTime: '' }]);
|
||||||
|
|
||||||
|
// 人员分类统计数据
|
||||||
|
const constructionPersonnelCount = ref(0);
|
||||||
|
const managersCount = ref(0);
|
||||||
|
const subcontractorsCount = ref(0);
|
||||||
|
|
||||||
|
// 项目出勤率数据
|
||||||
|
const projectAttendanceData = ref([
|
||||||
|
{ name: 'A项目', value: 62 },
|
||||||
|
{ name: 'B项目', value: 56 },
|
||||||
|
{ name: 'C项目', value: 95 },
|
||||||
|
{ name: 'D项目', value: 64 },
|
||||||
|
{ name: 'E项目', value: 97.5 }
|
||||||
|
]);
|
||||||
|
|
||||||
|
let attendanceChart = null;
|
||||||
|
const attendanceChartRef = ref<HTMLDivElement | null>(null);
|
||||||
|
|
||||||
|
// 滚动相关状态
|
||||||
|
const scrollInterval = ref<number | null>(null);
|
||||||
|
const currentScrollIndex = ref(0);
|
||||||
|
const scrollSpeed = 1000; // 滚动间隔时间(ms)
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取项目人员出勤数据
|
||||||
|
*/
|
||||||
|
const getPeopleData = async () => {
|
||||||
|
const res = await getScreenPeople(props.projectId);
|
||||||
|
const { data, code } = res;
|
||||||
|
if (code === 200) {
|
||||||
|
totalPeopleCount.value = data.peopleCount;
|
||||||
|
teamAttendanceList.value = data.teamAttendanceList;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取人员分类统计数据
|
||||||
|
*/
|
||||||
|
const getPeopleCategoryData = async () => {
|
||||||
|
try {
|
||||||
|
const res = await peopleCount();
|
||||||
|
const { data, code } = res;
|
||||||
|
if (code === 200 && data) {
|
||||||
|
constructionPersonnelCount.value = data.constructionPersonnelCount || 0;
|
||||||
|
managersCount.value = data.managersCount || 0;
|
||||||
|
subcontractorsCount.value = data.subcontractorsCount || 0;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取人员分类统计数据失败:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取人员总览数据 - 通过allAttendanceCount接口
|
||||||
|
*/
|
||||||
|
const getProjectAttendanceCount = async () => {
|
||||||
|
try {
|
||||||
|
const res = await allAttendanceCount();
|
||||||
|
const { data, code } = res;
|
||||||
|
if (code === 0 && data) {
|
||||||
|
// 直接使用接口返回的数据
|
||||||
|
attendanceCount.value = data.attendanceCount || 0;
|
||||||
|
attendanceRate.value = data.attendanceRate || 0;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取人员总览数据失败:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 滚动到指定项目
|
||||||
|
*/
|
||||||
|
const scrollToProject = (index: number) => {
|
||||||
|
if (!attendanceChart || projectAttendanceData.value.length === 0) return;
|
||||||
|
|
||||||
|
// 计算实际索引
|
||||||
|
const realIndex = index % projectAttendanceData.value.length;
|
||||||
|
currentScrollIndex.value = realIndex;
|
||||||
|
|
||||||
|
// 获取项目名称
|
||||||
|
const projectName = projectAttendanceData.value[realIndex].name;
|
||||||
|
|
||||||
|
// 触发tooltip显示
|
||||||
|
attendanceChart.dispatchAction({
|
||||||
|
type: 'showTip',
|
||||||
|
seriesIndex: 0,
|
||||||
|
dataIndex: realIndex
|
||||||
|
});
|
||||||
|
|
||||||
|
// 高亮当前项目的柱子
|
||||||
|
attendanceChart.dispatchAction({
|
||||||
|
type: 'highlight',
|
||||||
|
seriesIndex: 0,
|
||||||
|
dataIndex: realIndex
|
||||||
|
});
|
||||||
|
|
||||||
|
// 取消高亮其他项目的柱子
|
||||||
|
attendanceChart.dispatchAction({
|
||||||
|
type: 'downplay',
|
||||||
|
seriesIndex: 0,
|
||||||
|
dataIndex: Array.from({ length: projectAttendanceData.value.length }, (_, i) => i).filter((i) => i !== realIndex)
|
||||||
|
});
|
||||||
|
|
||||||
|
// 更新滚动条位置,确保滚动时滚动条同步移动
|
||||||
|
// 无论项目数量多少,都应该同步滚动条
|
||||||
|
if (projectAttendanceData.value.length > 0) {
|
||||||
|
// 计算滚动条应该移动到的位置
|
||||||
|
// 确保当前项目居中显示
|
||||||
|
const totalProjects = projectAttendanceData.value.length;
|
||||||
|
const visiblePercentage = 15; // 与dataZoom的end值保持一致
|
||||||
|
const itemPercentage = 100 / totalProjects; // 每个项目所占总宽度的百分比
|
||||||
|
|
||||||
|
// 计算新的start值,使当前项目尽量居中显示
|
||||||
|
let newStart = realIndex * itemPercentage - visiblePercentage / 2 + itemPercentage / 2;
|
||||||
|
|
||||||
|
// 确保start值在有效范围内
|
||||||
|
newStart = Math.max(0, Math.min(100 - visiblePercentage, newStart));
|
||||||
|
|
||||||
|
// 更新dataZoom组件的位置
|
||||||
|
attendanceChart.dispatchAction({
|
||||||
|
type: 'dataZoom',
|
||||||
|
start: newStart,
|
||||||
|
end: newStart + visiblePercentage
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 开始自动滚动
|
||||||
|
*/
|
||||||
|
const startScroll = () => {
|
||||||
|
if (scrollInterval.value) return;
|
||||||
|
|
||||||
|
scrollInterval.value = window.setInterval(() => {
|
||||||
|
currentScrollIndex.value++;
|
||||||
|
scrollToProject(currentScrollIndex.value);
|
||||||
|
}, scrollSpeed);
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 停止自动滚动
|
||||||
|
*/
|
||||||
|
const stopScroll = () => {
|
||||||
|
if (scrollInterval.value) {
|
||||||
|
clearInterval(scrollInterval.value);
|
||||||
|
scrollInterval.value = null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取项目出勤率统计数据 - 保持项目出勤率图表功能
|
||||||
|
*/
|
||||||
|
const getProjectAttendanceStats = async () => {
|
||||||
|
try {
|
||||||
|
const res = await projectAttendanceCount();
|
||||||
|
const { data, code } = res;
|
||||||
|
|
||||||
|
// 添加日志信息以便调试
|
||||||
|
console.log('projectAttendanceCount接口返回数据:', res);
|
||||||
|
|
||||||
|
if (code === 200 && data && data.length > 0) {
|
||||||
|
console.log('有效数据:', data);
|
||||||
|
|
||||||
|
// 更新项目出勤率图表数据
|
||||||
|
projectAttendanceData.value = data.map((project) => ({
|
||||||
|
name: project.projectName,
|
||||||
|
value: project.attendanceRate
|
||||||
|
}));
|
||||||
|
|
||||||
|
console.log('处理后的数据:', projectAttendanceData.value);
|
||||||
|
|
||||||
|
// 如果图表已初始化,重新设置数据
|
||||||
|
if (attendanceChart) {
|
||||||
|
console.log('更新图表数据');
|
||||||
|
attendanceChart.setOption({
|
||||||
|
xAxis: {
|
||||||
|
data: projectAttendanceData.value.map((item) => item.name)
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
data: projectAttendanceData.value.map((item) => item.value)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.warn('数据不符合预期:', { code, data });
|
||||||
|
// 使用默认数据确保图表有内容显示
|
||||||
|
if (!projectAttendanceData.value.length) {
|
||||||
|
projectAttendanceData.value = [
|
||||||
|
{ name: 'A项目', value: 62 },
|
||||||
|
{ name: 'B项目', value: 56 },
|
||||||
|
{ name: 'C项目', value: 95 },
|
||||||
|
{ name: 'D项目', value: 64 },
|
||||||
|
{ name: 'E项目', value: 97.5 }
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取项目出勤率数据失败:', error);
|
||||||
|
// 发生错误时使用默认数据
|
||||||
|
if (!projectAttendanceData.value.length) {
|
||||||
|
projectAttendanceData.value = [
|
||||||
|
{ name: 'A项目', value: 62 },
|
||||||
|
{ name: 'B项目', value: 56 },
|
||||||
|
{ name: 'C项目', value: 95 },
|
||||||
|
{ name: 'D项目', value: 64 },
|
||||||
|
{ name: 'E项目', value: 97.5 }
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取企业关键指标数据
|
||||||
|
*/
|
||||||
|
const getKeyIndexData = async () => {
|
||||||
|
const res = await keyIndex();
|
||||||
|
const { data, code } = res;
|
||||||
|
if (code === 200) {
|
||||||
|
// 更新指标数据,使用接口返回的指定字段
|
||||||
|
indicators.value[0].value = data.ongoingProject || 0;
|
||||||
|
indicators.value[1].value = data.totalContractAmount || 0;
|
||||||
|
indicators.value[2].value = data.totalCapacity || 0;
|
||||||
|
indicators.value[3].value = data.todayProject || 0;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 初始化项目出勤率柱状图(美化版)
|
||||||
|
*/
|
||||||
|
const initAttendanceChart = () => {
|
||||||
|
if (!attendanceChartRef.value) {
|
||||||
|
console.warn('attendanceChartRef不存在');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 确保有数据可显示
|
||||||
|
if (!projectAttendanceData.value || !projectAttendanceData.value.length) {
|
||||||
|
console.log('使用默认数据初始化图表');
|
||||||
|
projectAttendanceData.value = [
|
||||||
|
{ name: 'A项目', value: 62 },
|
||||||
|
{ name: 'B项目', value: 56 },
|
||||||
|
{ name: 'C项目', value: 95 },
|
||||||
|
{ name: 'D项目', value: 64 },
|
||||||
|
{ name: 'E项目', value: 97.5 }
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('开始初始化图表,当前数据:', projectAttendanceData.value);
|
||||||
|
attendanceChart = echarts.init(attendanceChartRef.value);
|
||||||
|
|
||||||
|
const option = {
|
||||||
|
backgroundColor: 'transparent',
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
axisPointer: {
|
||||||
|
type: 'shadow',
|
||||||
|
shadowStyle: {
|
||||||
|
color: 'rgba(29, 214, 255, 0.1)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
backgroundColor: 'rgba(10, 24, 45, 0.8)',
|
||||||
|
borderColor: 'rgba(29, 214, 255, 0.3)',
|
||||||
|
borderWidth: 1,
|
||||||
|
textStyle: {
|
||||||
|
color: '#e6f7ff'
|
||||||
|
},
|
||||||
|
formatter: (params) => {
|
||||||
|
const data = params[0];
|
||||||
|
return `${data.name}<br/>出勤率: ${data.value}%`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
top: 40,
|
||||||
|
right: 30,
|
||||||
|
bottom: 60, // 增加底部空间以确保标签完全显示
|
||||||
|
left: 30,
|
||||||
|
containLabel: true,
|
||||||
|
backgroundColor: 'rgba(10, 24, 45, 0.1)',
|
||||||
|
borderColor: 'rgba(29, 214, 255, 0.1)',
|
||||||
|
borderWidth: 1
|
||||||
|
},
|
||||||
|
// 添加dataZoom组件实现水平滚动
|
||||||
|
dataZoom: [
|
||||||
|
{
|
||||||
|
type: 'slider',
|
||||||
|
show: true,
|
||||||
|
xAxisIndex: [0],
|
||||||
|
start: 0,
|
||||||
|
end: 20, // 固定为20%,与visiblePercentage保持一致
|
||||||
|
height: 20,
|
||||||
|
bottom: 10,
|
||||||
|
backgroundColor: 'rgba(10, 24, 45, 0.2)',
|
||||||
|
fillerColor: 'rgba(29, 214, 255, 0.2)',
|
||||||
|
borderColor: 'rgba(29, 214, 255, 0.3)',
|
||||||
|
textStyle: {
|
||||||
|
color: '#e6f7ff'
|
||||||
|
},
|
||||||
|
handleStyle: {
|
||||||
|
color: 'rgba(29, 214, 255, 0.6)',
|
||||||
|
borderColor: 'rgba(255, 255, 255, 0.3)'
|
||||||
|
},
|
||||||
|
moveHandleStyle: {
|
||||||
|
color: 'rgba(29, 214, 255, 0.8)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 支持鼠标滚轮缩放
|
||||||
|
{
|
||||||
|
type: 'inside',
|
||||||
|
xAxisIndex: [0],
|
||||||
|
start: 0,
|
||||||
|
end: 20 // 固定为20%,与visiblePercentage保持一致
|
||||||
|
}
|
||||||
|
],
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
data: projectAttendanceData.value.map((item) => item.name),
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: 'rgba(29, 214, 255, 0.3)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#e6f7ff',
|
||||||
|
fontSize: 14,
|
||||||
|
interval: 0, // 强制显示所有标签
|
||||||
|
fontWeight: 'bold',
|
||||||
|
padding: [10, 0, 0, 0],
|
||||||
|
// 防止标签重叠,旋转角度调整
|
||||||
|
rotate: 0,
|
||||||
|
// 添加formatter函数,当名称超过6个汉字时显示省略号
|
||||||
|
formatter: function (value) {
|
||||||
|
if (value.length > 6) {
|
||||||
|
return value.substring(0, 6) + '...';
|
||||||
|
}
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: true,
|
||||||
|
length: 5,
|
||||||
|
lineStyle: {
|
||||||
|
color: 'rgba(29, 214, 255, 0.5)'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
type: 'value',
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
interval: 20,
|
||||||
|
axisLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: 'rgba(29, 214, 255, 0.3)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#e6f7ff',
|
||||||
|
fontSize: 12,
|
||||||
|
formatter: '{value}%',
|
||||||
|
padding: [0, 10, 0, 0]
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: 'rgba(29, 214, 255, 0.15)',
|
||||||
|
type: 'dashed'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
data: projectAttendanceData.value.map((item) => item.value),
|
||||||
|
type: 'bar',
|
||||||
|
itemStyle: {
|
||||||
|
color: function (params) {
|
||||||
|
// 根据数值动态调整渐变效果
|
||||||
|
const value = params.value;
|
||||||
|
const baseColor = new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
|
{ offset: 0, color: 'rgba(29, 214, 255, 1)' },
|
||||||
|
{ offset: 1, color: 'rgba(10, 120, 200, 0.8)' }
|
||||||
|
]);
|
||||||
|
return baseColor;
|
||||||
|
},
|
||||||
|
borderRadius: [5, 5, 0, 0],
|
||||||
|
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||||
|
borderWidth: 1
|
||||||
|
},
|
||||||
|
barWidth: '45%',
|
||||||
|
label: {
|
||||||
|
show: true,
|
||||||
|
position: 'top',
|
||||||
|
color: '#e6f7ff',
|
||||||
|
fontSize: 14,
|
||||||
|
fontWeight: 'bold',
|
||||||
|
formatter: '{c}%',
|
||||||
|
offset: [0, -10]
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
itemStyle: {
|
||||||
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
|
{ offset: 0, color: 'rgba(29, 214, 255, 1)' },
|
||||||
|
{ offset: 1, color: 'rgba(10, 120, 200, 1)' }
|
||||||
|
]),
|
||||||
|
shadowBlur: 10,
|
||||||
|
shadowColor: 'rgba(29, 214, 255, 0.5)',
|
||||||
|
borderColor: 'rgba(255, 255, 255, 0.5)'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
color: '#ffffff',
|
||||||
|
textShadowBlur: 2,
|
||||||
|
textShadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
animationDelay: function (idx) {
|
||||||
|
// 动画延迟,使柱子依次出现
|
||||||
|
return idx * 100;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 添加动画效果
|
||||||
|
animationEasing: 'elasticOut',
|
||||||
|
animationDelayUpdate: function (idx) {
|
||||||
|
return idx * 5;
|
||||||
|
},
|
||||||
|
// 添加单位标签
|
||||||
|
graphic: [
|
||||||
|
{
|
||||||
|
type: 'text',
|
||||||
|
left: 10,
|
||||||
|
top: 10,
|
||||||
|
style: {
|
||||||
|
text: '单位: %',
|
||||||
|
fill: '#8ab2ff',
|
||||||
|
fontSize: 12
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
attendanceChart.setOption(option);
|
||||||
|
|
||||||
|
// 添加鼠标悬浮事件监听
|
||||||
|
if (attendanceChartRef.value) {
|
||||||
|
// 鼠标进入图表区域时停止滚动
|
||||||
|
attendanceChartRef.value.addEventListener('mouseenter', () => {
|
||||||
|
stopScroll();
|
||||||
|
});
|
||||||
|
|
||||||
|
// 鼠标离开图表区域时重新开始滚动
|
||||||
|
attendanceChartRef.value.addEventListener('mouseleave', () => {
|
||||||
|
startScroll();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 添加窗口大小变化时的图表更新
|
||||||
|
const handleResize = () => {
|
||||||
|
if (attendanceChart) {
|
||||||
|
attendanceChart.resize();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
window.addEventListener('resize', handleResize);
|
||||||
|
|
||||||
|
// 清理函数
|
||||||
|
onUnmounted(() => {
|
||||||
|
window.removeEventListener('resize', handleResize);
|
||||||
|
|
||||||
|
// 移除鼠标事件监听
|
||||||
|
if (attendanceChartRef.value) {
|
||||||
|
attendanceChartRef.value.removeEventListener('mouseenter', stopScroll);
|
||||||
|
attendanceChartRef.value.removeEventListener('mouseleave', startScroll);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 初始化地图
|
||||||
|
*/
|
||||||
|
const initMapChart = () => {
|
||||||
|
if (!mapChartRef.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
mapChart = echarts.init(mapChartRef.value);
|
||||||
|
mapChart.setOption(mapOption);
|
||||||
|
};
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
// nextTick(() => {
|
||||||
|
// initMapChart();
|
||||||
|
// });
|
||||||
|
getPeopleData();
|
||||||
|
getKeyIndexData();
|
||||||
|
getProjectAttendanceCount(); // 获取人员总览数据
|
||||||
|
getPeopleCategoryData();
|
||||||
|
|
||||||
|
// 先等待获取项目出勤率数据
|
||||||
|
await getProjectAttendanceStats(); // 获取项目出勤率图表数据
|
||||||
|
|
||||||
|
// 再初始化图表
|
||||||
|
initAttendanceChart();
|
||||||
|
|
||||||
|
// 图表初始化后自动开始滚动
|
||||||
|
startScroll();
|
||||||
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
// if (mapChart) {
|
||||||
|
// mapChart.dispose();
|
||||||
|
// mapChart = null;
|
||||||
|
// }
|
||||||
|
|
||||||
|
if (attendanceChart) {
|
||||||
|
attendanceChart.dispose();
|
||||||
|
attendanceChart = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 清理滚动计时器
|
||||||
|
stopScroll();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.leftPage {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.topPage,
|
||||||
|
.endPage {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
height: 250;
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.endPage {
|
||||||
|
height: auto;
|
||||||
|
flex: 1;
|
||||||
|
min-height: 550px;
|
||||||
|
}
|
||||||
|
.project_attendance_chart {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 15px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
|
||||||
|
.chart_title {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #e6f7ff;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll_controls {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control_btn {
|
||||||
|
padding: 5px 15px;
|
||||||
|
background: rgba(10, 24, 45, 0.8);
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.3);
|
||||||
|
color: #e6f7ff;
|
||||||
|
font-size: 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control_btn:hover {
|
||||||
|
background: rgba(29, 214, 255, 0.2);
|
||||||
|
border-color: rgba(29, 214, 255, 0.6);
|
||||||
|
}
|
||||||
|
|
||||||
|
.chart_content {
|
||||||
|
width: 100%;
|
||||||
|
height: 320px; /* 增加高度以容纳滚动条 */
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicators {
|
||||||
|
width: 100%;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 10px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator-card {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 80px;
|
||||||
|
background: rgba(10, 24, 45, 0.7);
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.2);
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator-card::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 2px;
|
||||||
|
background: linear-gradient(90deg, rgba(29, 214, 255, 0.2) 0%, rgba(29, 214, 255, 0.6) 50%, rgba(29, 214, 255, 0.2) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator-value {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #e6f7ff;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator-unit {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #8ab2ff;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator-name {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #e6f7ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator-icon {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 10px;
|
||||||
|
right: 10px;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator-icon img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 人员总览样式 */
|
||||||
|
.people_overview {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 5px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
background: rgba(10, 24, 45, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.people_overview_title {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #e6f7ff;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
border-bottom: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.people_overview_content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.people_image {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
background: linear-gradient(135deg, rgba(29, 214, 255, 0.1) 0%, rgba(29, 214, 255, 0.05) 100%);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.placeholder_image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
.people_stats {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat_item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat_label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #8ab2ff;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat_value {
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #e6f7ff;
|
||||||
|
text-shadow: 0px 1.24px 6.21px rgba(0, 190, 247, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat_rate {
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00c853;
|
||||||
|
text-shadow: 0px 1.24px 6.21px rgba(0, 200, 83, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 点阵地图样式 */
|
||||||
|
.people_map {
|
||||||
|
width: 100%;
|
||||||
|
height: 120px;
|
||||||
|
margin-top: 8px;
|
||||||
|
background: rgba(10, 24, 45, 0.5);
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
border-radius: 4px;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.map_background {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-image: radial-gradient(circle, rgba(29, 214, 255, 0.3) 1px, transparent 1px),
|
||||||
|
radial-gradient(circle, rgba(29, 214, 255, 0.3) 1px, transparent 1px);
|
||||||
|
background-size: 40px 40px;
|
||||||
|
background-position:
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
20px 20px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 人员分类统计样式 */
|
||||||
|
.people_categories {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category_item {
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
margin: 10px, 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category_icon {
|
||||||
|
margin-left: 15px;
|
||||||
|
margin-top: 10px;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
background: linear-gradient(135deg, rgba(29, 214, 255, 0.1) 0%, rgba(10, 120, 200, 0.1) 100%);
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.2);
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category_image {
|
||||||
|
width: 45px;
|
||||||
|
height: 45px;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category_info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-left: 8px;
|
||||||
|
margin-top: 8px;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category_label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #8ab2ff;
|
||||||
|
margin-bottom: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category_count {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #e6f7ff;
|
||||||
|
text-shadow: 0px 1.24px 6.21px rgba(0, 190, 247, 0.3);
|
||||||
|
}
|
||||||
|
</style>
|
@ -0,0 +1,216 @@
|
|||||||
|
export let pieOption = {
|
||||||
|
// 定义中心文字
|
||||||
|
graphic: [
|
||||||
|
// {
|
||||||
|
// type: 'text',
|
||||||
|
// left: 'center',
|
||||||
|
// top: '40%',
|
||||||
|
// style: {
|
||||||
|
// // 需要从接口替换
|
||||||
|
// text: '70%',
|
||||||
|
// fontSize: 24,
|
||||||
|
// fontWeight: 'bold',
|
||||||
|
// fill: '#fff'
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// {
|
||||||
|
// type: 'text',
|
||||||
|
// left: 'center',
|
||||||
|
// top: '50%',
|
||||||
|
// style: {
|
||||||
|
// text: '111',
|
||||||
|
// fontSize: 14,
|
||||||
|
// fill: '#fff'
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
],
|
||||||
|
// legend: {
|
||||||
|
// show: true,
|
||||||
|
// type: 'plain',
|
||||||
|
// bottom: 20,
|
||||||
|
// itemWidth: 12,
|
||||||
|
// itemHeight: 12,
|
||||||
|
// textStyle: {
|
||||||
|
// color: '#fff'
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
series: {
|
||||||
|
type: 'pie',
|
||||||
|
data: [],
|
||||||
|
radius: [50, 80],
|
||||||
|
center: ['50%', '45%'],
|
||||||
|
// itemStyle: {
|
||||||
|
// borderColor: '#fff',
|
||||||
|
// borderWidth: 1
|
||||||
|
// },
|
||||||
|
label: {
|
||||||
|
alignTo: 'edge',
|
||||||
|
formatter: function (params) {
|
||||||
|
// 只显示前三个数据项
|
||||||
|
return `{name|${params.data.name}}\n{percent|${params.data.completionRate}MW}`;
|
||||||
|
},
|
||||||
|
minMargin: 10,
|
||||||
|
edgeDistance: 20,
|
||||||
|
lineHeight: 15,
|
||||||
|
rich: {
|
||||||
|
name: {
|
||||||
|
fontSize: 12,
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
percent: {
|
||||||
|
fontSize: 12,
|
||||||
|
color: '#fff'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
top: 'bottom'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export let barOption = {
|
||||||
|
legend: {
|
||||||
|
icon: 'rect',
|
||||||
|
itemWidth: 12,
|
||||||
|
itemHeight: 12,
|
||||||
|
// 调整文字与图标间距
|
||||||
|
data: ['计划产值', '实际产值'],
|
||||||
|
top: 0,
|
||||||
|
right: 10,
|
||||||
|
bottom: 10,
|
||||||
|
textStyle: {
|
||||||
|
color: '#fff'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
tooltip: {
|
||||||
|
show: true,
|
||||||
|
backgroundColor: '',
|
||||||
|
trigger: 'axis',
|
||||||
|
// formatter: '{b0}:{c0}万元',
|
||||||
|
formatter: (params: any) => {
|
||||||
|
// params 是数组,对应每条柱子
|
||||||
|
return params
|
||||||
|
.map((p: any) => `${p.seriesName}:${Number(p.value).toFixed(2)} 亿元`)
|
||||||
|
|
||||||
|
.join('<br/>');
|
||||||
|
},
|
||||||
|
textStyle: {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
axisPointer: {
|
||||||
|
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow',
|
||||||
|
}
|
||||||
|
// borderColor: 'rgba(252, 217, 18, 1)'
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
data: [],
|
||||||
|
|
||||||
|
axisLabel: {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
name: '单位:亿元',
|
||||||
|
type: 'value',
|
||||||
|
axisLabel: {
|
||||||
|
formatter: '{value}'
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: false // 不显示分割线
|
||||||
|
}
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
left: '12%',
|
||||||
|
top: '15%', // 顶部留一点空间给 legend
|
||||||
|
bottom: '8%',
|
||||||
|
right: '2%'
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '计划产值',
|
||||||
|
type: 'bar',
|
||||||
|
data: [],
|
||||||
|
barWidth: '10',
|
||||||
|
itemStyle: {
|
||||||
|
color: {
|
||||||
|
type: 'linear',
|
||||||
|
x: 0,
|
||||||
|
y: 1, // 修改y为1表示从底部开始
|
||||||
|
x2: 0,
|
||||||
|
y2: 0, // 修改y2为0表示渐变到顶部
|
||||||
|
colorStops: [
|
||||||
|
{
|
||||||
|
offset: 0,
|
||||||
|
color: 'rgba(255, 209, 92, 0.1)' // 底部透明度0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 1,
|
||||||
|
color: 'rgba(255, 209, 92, 1)' // 顶部透明度1
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '实际产值',
|
||||||
|
type: 'bar',
|
||||||
|
data: [],
|
||||||
|
barWidth: '10',
|
||||||
|
itemStyle: {
|
||||||
|
color: {
|
||||||
|
type: 'linear',
|
||||||
|
x: 0,
|
||||||
|
y: 1, // 从底部开始
|
||||||
|
x2: 0,
|
||||||
|
y2: 0, // 到顶部结束
|
||||||
|
colorStops: [
|
||||||
|
{
|
||||||
|
offset: 0,
|
||||||
|
color: 'rgba(7, 209, 250, 0.1)' // 底部透明度0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 1,
|
||||||
|
color: 'rgba(7, 209, 250, 1)' // 顶部透明度1
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
export let mapOption = {
|
||||||
|
geo: {
|
||||||
|
map: 'ch',
|
||||||
|
roam: true,
|
||||||
|
aspectScale: Math.cos((47 * Math.PI) / 180)
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
type: 'graph',
|
||||||
|
coordinateSystem: 'geo',
|
||||||
|
data: [
|
||||||
|
{ name: 'a', value: [7.667821250000001, 46.791734269956265] },
|
||||||
|
{ name: 'b', value: [7.404848750000001, 46.516308805996054] },
|
||||||
|
{ name: 'c', value: [7.376673125000001, 46.24728858538375] },
|
||||||
|
{ name: 'd', value: [8.015320625000001, 46.39460918238572] },
|
||||||
|
{ name: 'e', value: [8.616400625, 46.7020608630855] },
|
||||||
|
{ name: 'f', value: [8.869981250000002, 46.37539345234199] },
|
||||||
|
{ name: 'g', value: [9.546196250000001, 46.58676648282309] },
|
||||||
|
{ name: 'h', value: [9.311399375, 47.182454114178896] },
|
||||||
|
{ name: 'i', value: [9.085994375000002, 47.55395822835779] },
|
||||||
|
{ name: 'j', value: [8.653968125000002, 47.47709530818285] },
|
||||||
|
{ name: 'k', value: [8.203158125000002, 47.44506909144329] }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
@ -0,0 +1,392 @@
|
|||||||
|
<template>
|
||||||
|
<div class="leftPage">
|
||||||
|
<div class="topPage">
|
||||||
|
<Title title="项目进度分析" style="font-size: 22px" />
|
||||||
|
<div class="progress">
|
||||||
|
<div class="progress_item">
|
||||||
|
<div class="progress_imgBox">
|
||||||
|
<div class="progress_img">
|
||||||
|
<img src="@/assets/large/capacity.png" style="width: 100%; height: 100%" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="progress_text">
|
||||||
|
<div class="progress_text_title">
|
||||||
|
<div>{{ capacityData.gridConnectedCapacity ?? '0' }}</div>
|
||||||
|
<div>MW</div>
|
||||||
|
</div>
|
||||||
|
<div class="content_text">井网总容量</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="progress_item">
|
||||||
|
<div class="progress_imgBox">
|
||||||
|
<div class="progress_img">
|
||||||
|
<img src="@/assets/large/plan.png" style="width: 100%; height: 100%" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="progress_text">
|
||||||
|
<div class="progress_text_title">
|
||||||
|
<div>{{ capacityData.plannedCapacity ?? '0' }}</div>
|
||||||
|
<div>MW</div>
|
||||||
|
</div>
|
||||||
|
<div class="content_text">计划总容量</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="progress_item">
|
||||||
|
<div class="progress_imgBox">
|
||||||
|
<div class="progress_img">
|
||||||
|
<img src="@/assets/large/delay.png" style="width: 100%; height: 100%" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="progress_text">
|
||||||
|
<div class="progress_text_title">
|
||||||
|
<div>{{ capacityData.delayedProjectCount ?? '0' }}</div>
|
||||||
|
<div>个</div>
|
||||||
|
</div>
|
||||||
|
<div class="content_text">延期项目</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="projectItem">
|
||||||
|
<div class="chart_container">
|
||||||
|
<div ref="pieChartRef" class="echart" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="output">
|
||||||
|
<Title title="实际产值与预期产值对比" style="font-size: 22px" />
|
||||||
|
<div class="chart_container">
|
||||||
|
<div ref="lineChartRef" class="echart" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, onMounted, onUnmounted, nextTick } from 'vue';
|
||||||
|
import Title from './title.vue';
|
||||||
|
import * as echarts from 'echarts';
|
||||||
|
import { pieOption, barOption } from './optionList';
|
||||||
|
import { projectProgress, outpuProgress } from '@/api/outputApi';
|
||||||
|
const capacityData: any = ref({});
|
||||||
|
const props = defineProps({
|
||||||
|
projectId: {
|
||||||
|
type: String,
|
||||||
|
default: 0
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const generalize = ref();
|
||||||
|
// 饼图相关
|
||||||
|
const pieChartRef = ref<HTMLDivElement | null>(null);
|
||||||
|
let pieChart: any = null;
|
||||||
|
const totalPercent = ref(0);
|
||||||
|
// 折线图相关
|
||||||
|
const lineChartRef = ref<HTMLDivElement | null>(null);
|
||||||
|
let lineChart: any = null;
|
||||||
|
// 土地数据 折线图
|
||||||
|
const designAreaData = ref([]);
|
||||||
|
const transferAreaData = ref([]);
|
||||||
|
const barNames = ref([]);
|
||||||
|
// // 饼图数据
|
||||||
|
// const pieData = [
|
||||||
|
// { label: 'areaPercentage', name: '厂区', value: 0 },
|
||||||
|
// { label: 'roadPercentage', name: '道路', value: 0 },
|
||||||
|
// { label: 'collectorLinePercentage', name: '集电线路', value: 0 },
|
||||||
|
// { label: 'exportLinePercentage', name: '送出线路', value: 0 },
|
||||||
|
// { label: 'substationPercentage', name: '升压站', value: 0 },
|
||||||
|
// { label: 'boxTransformerPercentage', name: '箱变', value: 0 }
|
||||||
|
// ];
|
||||||
|
|
||||||
|
// 响应窗口大小变化
|
||||||
|
const handleResize = () => {
|
||||||
|
if (pieChart) pieChart.resize();
|
||||||
|
if (lineChart) lineChart.resize();
|
||||||
|
};
|
||||||
|
|
||||||
|
const processedDataList = ref([]);
|
||||||
|
//获取数据
|
||||||
|
const getData = async () => {
|
||||||
|
const res = await projectProgress();
|
||||||
|
if (res.code == 200) {
|
||||||
|
capacityData.value = res.data;
|
||||||
|
// processedDataList.value = res.data.projectProgressDetailList;
|
||||||
|
let totalCapacity = 0;
|
||||||
|
const processedData = res.data.projectProgressDetailList.map((item) => {
|
||||||
|
const capacity = parseInt(item.projectCapacity) || 0;
|
||||||
|
totalCapacity += capacity;
|
||||||
|
return {
|
||||||
|
name: item.projectName,
|
||||||
|
value: capacity,
|
||||||
|
completionRate: item.completionRate
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
// 计算每个项目的百分比
|
||||||
|
processedData.forEach((item) => {
|
||||||
|
item.percentage = totalCapacity > 0 ? ((item.value / totalCapacity) * 100).toFixed(2) : '0%';
|
||||||
|
});
|
||||||
|
processedDataList.value = processedData;
|
||||||
|
initPieChart();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 初始化饼图
|
||||||
|
const initPieChart = () => {
|
||||||
|
if (!pieChartRef.value) {
|
||||||
|
console.error('未找到饼图容器元素');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const data = processedDataList.value.map((item: any) => {
|
||||||
|
return {
|
||||||
|
name: item.name,
|
||||||
|
value: item.percentage,
|
||||||
|
completionRate: item.value
|
||||||
|
};
|
||||||
|
});
|
||||||
|
pieOption.series.data = data;
|
||||||
|
|
||||||
|
// pieOption.graphic[0].style.text = totalPercent.value + '%';
|
||||||
|
pieChart = echarts.init(pieChartRef.value, null, {
|
||||||
|
renderer: 'canvas',
|
||||||
|
useDirtyRect: false
|
||||||
|
});
|
||||||
|
pieChart.setOption(pieOption);
|
||||||
|
};
|
||||||
|
//获取产值数据
|
||||||
|
const getOutputData = async () => {
|
||||||
|
const res = await outpuProgress();
|
||||||
|
if (res.code == 200) {
|
||||||
|
designAreaData.value = res.data.map((item: any) => Number(item.planValue));
|
||||||
|
transferAreaData.value = res.data.map((item: any) => Number(item.actualValue));
|
||||||
|
barNames.value = res.data.map((item: any) => item.projectName);
|
||||||
|
initLineChart();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 初始化柱状图图
|
||||||
|
const initLineChart = () => {
|
||||||
|
if (!lineChartRef.value) {
|
||||||
|
console.error('未找到柱状图容器元素');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
console.log(barOption);
|
||||||
|
barOption.xAxis.data = barNames.value;
|
||||||
|
barOption.series[0].data = designAreaData.value;
|
||||||
|
barOption.series[1].data = transferAreaData.value;
|
||||||
|
lineChart = echarts.init(lineChartRef.value, null, {
|
||||||
|
renderer: 'canvas',
|
||||||
|
useDirtyRect: false
|
||||||
|
});
|
||||||
|
lineChart.setOption(barOption);
|
||||||
|
};
|
||||||
|
// /**
|
||||||
|
// * 获取项目土地统计数据
|
||||||
|
// */
|
||||||
|
// const getScreenLandData = async () => {
|
||||||
|
// const res = await getScreenLand(props.projectId);
|
||||||
|
// const { data, code } = res;
|
||||||
|
// if (code === 200) {
|
||||||
|
// designAreaData.value = data.map((item: any) => Number(item.designArea));
|
||||||
|
// transferAreaData.value = data.map((item: any) => Number(item.transferArea));
|
||||||
|
// // initLineChart();
|
||||||
|
// }
|
||||||
|
// };
|
||||||
|
|
||||||
|
// /**
|
||||||
|
// * 获取项目形象进度数据
|
||||||
|
// */
|
||||||
|
// const getScreenImgProcessData = async () => {
|
||||||
|
// const res = await getScreenImgProcess(props.projectId);
|
||||||
|
// const { data, code } = res;
|
||||||
|
// if (code === 200) {
|
||||||
|
// totalPercent.value = data.totalPercentage;
|
||||||
|
// pieData.forEach((item: any) => {
|
||||||
|
// item.value = data[item.label];
|
||||||
|
// });
|
||||||
|
// initPieChart();
|
||||||
|
// }
|
||||||
|
// };
|
||||||
|
|
||||||
|
// /**
|
||||||
|
// * 获取项目概况数据
|
||||||
|
// */
|
||||||
|
// const getScreenGeneralizeData = async () => {
|
||||||
|
// const res = await getScreenGeneralize(props.projectId);
|
||||||
|
// const { data, code } = res;
|
||||||
|
// if (code === 200) {
|
||||||
|
// generalize.value = data;
|
||||||
|
// }
|
||||||
|
// };
|
||||||
|
|
||||||
|
// 组件挂载时初始化图表
|
||||||
|
onMounted(() => {
|
||||||
|
// getScreenLandData();
|
||||||
|
// getScreenImgProcessData();
|
||||||
|
// getScreenGeneralizeData();
|
||||||
|
getData();
|
||||||
|
getOutputData();
|
||||||
|
nextTick(() => {
|
||||||
|
initPieChart();
|
||||||
|
window.addEventListener('resize', handleResize);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// 组件卸载时清理
|
||||||
|
onUnmounted(() => {
|
||||||
|
window.removeEventListener('resize', handleResize);
|
||||||
|
if (pieChart) {
|
||||||
|
pieChart.dispose();
|
||||||
|
pieChart = null;
|
||||||
|
}
|
||||||
|
if (lineChart) {
|
||||||
|
lineChart.dispose();
|
||||||
|
lineChart = null;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.leftPage {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.topPage {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
padding: 15px 0 0 0;
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 20%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .content {
|
||||||
|
// height: 100px;
|
||||||
|
// margin: 0 15px;
|
||||||
|
// padding: 0 10px;
|
||||||
|
// margin-top: 15px;
|
||||||
|
// box-sizing: border-box;
|
||||||
|
// overflow-y: auto;
|
||||||
|
|
||||||
|
// &::-webkit-scrollbar-track {
|
||||||
|
// background: rgba(204, 204, 204, 0.1);
|
||||||
|
// border-radius: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// &::-webkit-scrollbar-thumb {
|
||||||
|
// background: rgba(29, 214, 255, 0.78);
|
||||||
|
// border-radius: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .content_item {
|
||||||
|
// font-size: 14px;
|
||||||
|
// font-weight: 400;
|
||||||
|
// color: rgba(230, 247, 255, 1);
|
||||||
|
// margin-bottom: 10px;
|
||||||
|
|
||||||
|
// &:last-child {
|
||||||
|
// margin-bottom: 0;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
.progress {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr 1fr;
|
||||||
|
grid-gap: 10px;
|
||||||
|
.progress_item {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
// background: rgba(29, 214, 255, 1);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
.progress_imgBox {
|
||||||
|
width: 100%;
|
||||||
|
height: 35%;
|
||||||
|
position: relative;
|
||||||
|
.progress_img {
|
||||||
|
width: 84px;
|
||||||
|
height: 48px;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 80%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress_text {
|
||||||
|
width: 100%;
|
||||||
|
height: 65%;
|
||||||
|
background: rgba(29, 214, 255, 0.1);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-end;
|
||||||
|
padding: 15px 5px 5px 5px;
|
||||||
|
.progress_text_title {
|
||||||
|
width: 100%;
|
||||||
|
// height: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
& > div:first-child {
|
||||||
|
// 第一个子元素的样式
|
||||||
|
width: 50%;
|
||||||
|
font-size: 24px;
|
||||||
|
// font-weight: bold;
|
||||||
|
font-family: 'AlimamaShuHeiTi', sans-serif;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > div:last-child {
|
||||||
|
// 最后一个子元素的样式
|
||||||
|
width: 50%;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content_text {
|
||||||
|
width: 100%;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #c6d1db;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.projectItem {
|
||||||
|
width: 100%;
|
||||||
|
height: 40%;
|
||||||
|
// background: rgba(29, 214, 255, 1);
|
||||||
|
padding: 10px 10px 10px 0;
|
||||||
|
// border: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
.chart_container {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
.echart {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.output {
|
||||||
|
width: 100%;
|
||||||
|
height: 40%;
|
||||||
|
// background: rgba(29, 214, 255, 0.5);
|
||||||
|
padding: 10px 10px 10px 0;
|
||||||
|
border: 1px solid rgba(29, 214, 255, 0.1);
|
||||||
|
|
||||||
|
.chart_container {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
.echart {
|
||||||
|
height: 90%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
@ -0,0 +1,46 @@
|
|||||||
|
<template>
|
||||||
|
<div class="title">
|
||||||
|
<div class="title_icon">
|
||||||
|
<img src="@/assets/projectLarge/section.svg" alt="" />
|
||||||
|
<img src="@/assets/projectLarge/border.svg" alt="" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<slot></slot>
|
||||||
|
</div>
|
||||||
|
<div>{{ title }}</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
defineProps({
|
||||||
|
title: {
|
||||||
|
type: String,
|
||||||
|
default: '标题'
|
||||||
|
|
||||||
|
},
|
||||||
|
prefix: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.title {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 3px;
|
||||||
|
font-family: 'AlimamaShuHeiTi', sans-serif;
|
||||||
|
|
||||||
|
.title_icon {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
& > img:last-child {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 4px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
@ -22,11 +22,10 @@ import leftPage from './components/leftPage.vue';
|
|||||||
import centerPage from './components/centerPage.vue';
|
import centerPage from './components/centerPage.vue';
|
||||||
import rightPage from './components/rightPage.vue';
|
import rightPage from './components/rightPage.vue';
|
||||||
import { useUserStoreHook } from '@/store/modules/user';
|
import { useUserStoreHook } from '@/store/modules/user';
|
||||||
|
|
||||||
const userStore = useUserStoreHook();
|
const userStore = useUserStoreHook();
|
||||||
const projectId = computed(() => userStore.selectedProject.id);
|
const projectId = computed(() => userStore.selectedProject.id);
|
||||||
const isFull = ref(false)
|
const isFull = ref(false);
|
||||||
const isHideOther = ref(false)
|
const isHideOther = ref(false);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 切换中心页面全屏
|
* 切换中心页面全屏
|
||||||
@ -41,7 +40,7 @@ const handleChangePage = () => {
|
|||||||
isFull.value = true;
|
isFull.value = true;
|
||||||
isHideOther.value = true;
|
isHideOther.value = true;
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
@ -140,9 +140,9 @@ const createEarth = () => {
|
|||||||
// 加载底图
|
// 加载底图
|
||||||
loadBaseMap(earthInstance.viewer);
|
loadBaseMap(earthInstance.viewer);
|
||||||
|
|
||||||
// 可以取消注释以下代码来设置初始视角
|
// // 可以取消注释以下代码来设置初始视角
|
||||||
// YJ.Global.flyTo(earthInstance, view);
|
// YJ.Global.flyTo(earthInstance, view);
|
||||||
// YJ.Global.setDefaultView(earthInstance.viewer, view)
|
// YJ.Global.setDefaultView(earthInstance.viewer, view);
|
||||||
|
|
||||||
// 地球创建完成后获取并渲染轨迹数据
|
// 地球创建完成后获取并渲染轨迹数据
|
||||||
getTrajectoryData();
|
getTrajectoryData();
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="p-2">
|
<div class="p-2">
|
||||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter"
|
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||||
:leave-active-class="proxy?.animate.searchAnimate.leave">
|
|
||||||
<div v-show="showSearch" class="mb-[10px]">
|
<div v-show="showSearch" class="mb-[10px]">
|
||||||
<el-card shadow="hover">
|
<el-card shadow="hover">
|
||||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
|
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
|
||||||
@ -12,15 +11,25 @@
|
|||||||
<el-input v-model="queryParams.formalitiesId" placeholder="请输入手续办理清单模板id" clearable @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.formalitiesId" placeholder="请输入手续办理清单模板id" clearable @keyup.enter="handleQuery" />
|
||||||
</el-form-item> -->
|
</el-form-item> -->
|
||||||
<el-form-item label="计划开始时间" prop="planTheStartTime">
|
<el-form-item label="计划开始时间" prop="planTheStartTime">
|
||||||
<el-date-picker clearable v-model="queryParams.planTheStartTime" type="date" value-format="YYYY-MM-DD"
|
<el-date-picker
|
||||||
placeholder="请选择计划开始时间" />
|
clearable
|
||||||
|
v-model="queryParams.planTheStartTime"
|
||||||
|
type="date"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
placeholder="请选择计划开始时间"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="负责人" prop="head">
|
<el-form-item label="负责人" prop="head">
|
||||||
<el-input v-model="queryParams.head" placeholder="请输入负责人" clearable @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.head" placeholder="请输入负责人" clearable @keyup.enter="handleQuery" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="实际完成时间" prop="actualCompletionTime">
|
<el-form-item label="实际完成时间" prop="actualCompletionTime">
|
||||||
<el-date-picker clearable v-model="queryParams.actualCompletionTime" type="date" value-format="YYYY-MM-DD"
|
<el-date-picker
|
||||||
placeholder="请选择实际完成时间" />
|
clearable
|
||||||
|
v-model="queryParams.actualCompletionTime"
|
||||||
|
type="date"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
placeholder="请选择实际完成时间"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- <el-form-item label="手续材料" prop="formalitiesUrl">
|
<!-- <el-form-item label="手续材料" prop="formalitiesUrl">
|
||||||
<el-input v-model="queryParams.formalitiesUrl" placeholder="请输入手续材料" clearable @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.formalitiesUrl" placeholder="请输入手续材料" clearable @keyup.enter="handleQuery" />
|
||||||
@ -38,13 +47,15 @@
|
|||||||
<template #header>
|
<template #header>
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-row :gutter="10" class="mb8">
|
||||||
<el-col :span="1.5">
|
<el-col :span="1.5">
|
||||||
<el-button type="primary" plain icon="Plus" @click="handleAdd()"
|
<el-button type="primary" plain icon="Plus" @click="handleAdd()" v-hasPermi="['formalities:formalitiesAreConsolidated:getTree']"
|
||||||
v-hasPermi="['formalities:formalitiesAreConsolidated:getTree']">新增</el-button>
|
>新增</el-button
|
||||||
<span style="margin-left: 10px"><el-tooltip class="box-item" effect="dark" content="从原有模板列表选择新增"
|
>
|
||||||
placement="top">
|
<span style="margin-left: 10px"
|
||||||
|
><el-tooltip class="box-item" effect="dark" content="从原有模板列表选择新增" placement="top">
|
||||||
<el-icon color="#409efc">
|
<el-icon color="#409efc">
|
||||||
<WarningFilled />
|
<WarningFilled />
|
||||||
</el-icon> </el-tooltip></span>
|
</el-icon> </el-tooltip
|
||||||
|
></span>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5" v-hasPermi="['formalities:listOfFormalities:list']">
|
<el-col :span="1.5" v-hasPermi="['formalities:listOfFormalities:list']">
|
||||||
<el-button type="primary" plain icon="Plus" @click="addTemplate()">新增数据</el-button>
|
<el-button type="primary" plain icon="Plus" @click="addTemplate()">新增数据</el-button>
|
||||||
@ -71,11 +82,13 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<el-table v-loading="loading" :data="formalitiesAreConsolidatedList" @selection-change="handleSelectionChange"
|
<el-table v-loading="loading" :data="formalitiesAreConsolidatedList" @selection-change="handleSelectionChange" row-key="id" default-expand-all>
|
||||||
row-key="id" default-expand-all>
|
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
<!-- <el-table-column label="手续办理清单模板父级" align="center" prop="formalitiesPname" /> -->
|
<el-table-column label="手续办理清单" align="left" prop="formalitiesName">
|
||||||
<el-table-column label="手续办理清单" align="left" prop="formalitiesName" />
|
<template #default="scope">
|
||||||
|
<div>{{ scope.row.formalitiesName }}</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
<el-table-column label="计划开始时间" align="center" prop="planTheStartTime" width="180">
|
<el-table-column label="计划开始时间" align="center" prop="planTheStartTime" width="180">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ parseTime(scope.row.planTheStartTime, '{y}-{m}-{d}') }}</span>
|
<span>{{ parseTime(scope.row.planTheStartTime, '{y}-{m}-{d}') }}</span>
|
||||||
@ -95,52 +108,58 @@
|
|||||||
<el-table-column label="办理状态" align="center" prop="processingStatus" />
|
<el-table-column label="办理状态" align="center" prop="processingStatus" />
|
||||||
<el-table-column label="手续材料" align="center" prop="formalitiesUrl" width="180">
|
<el-table-column label="手续材料" align="center" prop="formalitiesUrl" width="180">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<div style="display: flex; justify-content: center; align-items: center;">
|
<div style="display: flex; justify-content: center; align-items: center">
|
||||||
|
<div style="width: 30px">
|
||||||
|
<el-link type="primary" :underline="false" @click="handlePreview(scope.row)" target="_blank" v-if="scope.row.formalitiesPid"
|
||||||
<div>
|
>查看</el-link
|
||||||
<el-link type="primary" :underline="false" @click="handlePreview(scope.row)" target="_blank"
|
>
|
||||||
v-if="scope.row.formalitiesPid">查看</el-link>
|
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div style="width: 5px">
|
||||||
<el-badge v-if="scope.row.fileCount" :value="scope.row.fileCount" class="item" type="danger">
|
<el-badge v-if="scope.row.fileCount" :value="scope.row.fileCount" class="item" type="danger"> </el-badge>
|
||||||
</el-badge>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="备注" align="center" prop="remark" />
|
<el-table-column label="备注" align="center" prop="remark" />
|
||||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" fixed="right">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<div v-if="scope.row.formalitiesPid">
|
<div v-if="scope.row.formalitiesPid">
|
||||||
<el-button link type="primary" icon="Edit" v-if="scope.row.processingStatus != '已完成'"
|
<el-button
|
||||||
|
link
|
||||||
|
type="primary"
|
||||||
|
icon="Edit"
|
||||||
|
v-if="scope.row.processingStatus != '已完成'"
|
||||||
@click="handleUpdate(scope.row)"
|
@click="handleUpdate(scope.row)"
|
||||||
v-hasPermi="['formalities:formalitiesAreConsolidated:edit']">修改</el-button>
|
v-hasPermi="['formalities:formalitiesAreConsolidated:edit']"
|
||||||
<el-button link type="primary" icon="Upload" v-if="scope.row.processingStatus != '已完成'"
|
>修改</el-button
|
||||||
@click="handleUpload(scope.row)">上传</el-button>
|
>
|
||||||
<el-button link type="primary" icon="EditPen" @click="handleUpdateStatus(scope.row)"
|
<el-button link type="primary" icon="Upload" v-if="scope.row.processingStatus != '已完成'" @click="handleUpload(scope.row)"
|
||||||
v-hasPermi="['formalities:formalitiesAreConsolidated:edit']">修改状态</el-button>
|
>上传</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
link
|
||||||
|
type="primary"
|
||||||
|
icon="EditPen"
|
||||||
|
@click="handleUpdateStatus(scope.row)"
|
||||||
|
v-hasPermi="['formalities:formalitiesAreConsolidated:edit']"
|
||||||
|
>修改状态</el-button
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
||||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 添加或修改合规性手续合账对话框 -->
|
<!-- 添加或修改合规性手续合账对话框 -->
|
||||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||||
<el-form ref="formalitiesAreConsolidatedFormRef" :model="form" :rules="rules" label-width="160px">
|
<el-form ref="formalitiesAreConsolidatedFormRef" :model="form" :rules="rules" label-width="160px">
|
||||||
<el-form-item label="计划开始时间" prop="planTheStartTime">
|
<el-form-item label="计划开始时间" prop="planTheStartTime">
|
||||||
<el-date-picker clearable v-model="form.planTheStartTime" type="date" value-format="YYYY-MM-DD"
|
<el-date-picker clearable v-model="form.planTheStartTime" type="date" value-format="YYYY-MM-DD" placeholder="请选择计划开始时间">
|
||||||
placeholder="请选择计划开始时间">
|
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="计划完成时间" prop="planTheStartTime">
|
<el-form-item label="计划完成时间" prop="planTheStartTime">
|
||||||
<el-date-picker clearable v-model="form.planTheEndTime" type="date" value-format="YYYY-MM-DD"
|
<el-date-picker clearable v-model="form.planTheEndTime" type="date" value-format="YYYY-MM-DD" placeholder="请选择计划完成时间">
|
||||||
placeholder="请选择计划完成时间">
|
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="负责人" prop="head">
|
<el-form-item label="负责人" prop="head">
|
||||||
@ -162,8 +181,7 @@
|
|||||||
<el-table :data="fileList" style="width: 100%" border v-loading="fileLoading">
|
<el-table :data="fileList" style="width: 100%" border v-loading="fileLoading">
|
||||||
<el-table-column prop="fileName" label="文件" align="center">
|
<el-table-column prop="fileName" label="文件" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-link :key="scope.row.annexUrl" :href="scope.row.annexUrl" target="_blank" type="primary"
|
<el-link :key="scope.row.annexUrl" :href="scope.row.annexUrl" target="_blank" type="primary" :underline="false">
|
||||||
:underline="false">
|
|
||||||
{{ scope.row.fileName || '查看文件' }}
|
{{ scope.row.fileName || '查看文件' }}
|
||||||
</el-link>
|
</el-link>
|
||||||
</template>
|
</template>
|
||||||
@ -174,8 +192,13 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
<pagination v-show="fileTotal > 0" :total="fileTotal" v-model:page="fileParams.pageNum"
|
<pagination
|
||||||
v-model:limit="fileParams.pageSize" @pagination="getFileList" />
|
v-show="fileTotal > 0"
|
||||||
|
:total="fileTotal"
|
||||||
|
v-model:page="fileParams.pageNum"
|
||||||
|
v-model:limit="fileParams.pageSize"
|
||||||
|
@pagination="getFileList"
|
||||||
|
/>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span>
|
<span>
|
||||||
<el-button type="primary" @click="viewVisible = false">关闭</el-button>
|
<el-button type="primary" @click="viewVisible = false">关闭</el-button>
|
||||||
@ -185,9 +208,18 @@
|
|||||||
<!-- 上传文件对话框 -->
|
<!-- 上传文件对话框 -->
|
||||||
<el-dialog draggable title="上传文件" v-model="fileVisible" width="450">
|
<el-dialog draggable title="上传文件" v-model="fileVisible" width="450">
|
||||||
<el-form-item label="上传文件" prop="processingStatus">
|
<el-form-item label="上传文件" prop="processingStatus">
|
||||||
<file-upload v-model="file" ref="uploadRef" uploadUrl="/formalities/formalitiesAnnex"
|
<file-upload
|
||||||
v-hasPermi="['formalities:formalitiesAnnex:add']" :data="{ formalitiesId: form.id }" :fileType="['pdf']"
|
v-model="file"
|
||||||
:auto-upload="false" showFileList method="put" :onUploadSuccess="handleUploadSuccess" />
|
ref="uploadRef"
|
||||||
|
uploadUrl="/formalities/formalitiesAnnex"
|
||||||
|
v-hasPermi="['formalities:formalitiesAnnex:add']"
|
||||||
|
:data="{ formalitiesId: form.id }"
|
||||||
|
:fileType="['pdf']"
|
||||||
|
:auto-upload="false"
|
||||||
|
showFileList
|
||||||
|
method="put"
|
||||||
|
:onUploadSuccess="handleUploadSuccess"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span>
|
<span>
|
||||||
@ -215,14 +247,18 @@
|
|||||||
</el-dialog>
|
</el-dialog>
|
||||||
<el-dialog title="新增合规性手续合账" v-model="templateVisbile" width="450">
|
<el-dialog title="新增合规性手续合账" v-model="templateVisbile" width="450">
|
||||||
<el-form-item label="合规性手续模板">
|
<el-form-item label="合规性手续模板">
|
||||||
<el-cascader v-model="tempValue" :options="tempTreeList" :props="{
|
<el-cascader
|
||||||
multiple: true,
|
v-model="tempValue"
|
||||||
value: 'id',
|
:options="tempTreeList"
|
||||||
label: 'name',
|
:props="{
|
||||||
disabled: (node: any) => {
|
multiple: true,
|
||||||
return (node.pid == 0 && !node.children.length) || node.status == 1; // 有 parent 的是二级,没有 parent 的是一级,禁用一级
|
value: 'id',
|
||||||
}
|
label: 'name',
|
||||||
}" />
|
disabled: (node: any) => {
|
||||||
|
return (node.pid == 0 && !node.children.length) || node.status == 1; // 有 parent 的是二级,没有 parent 的是一级,禁用一级
|
||||||
|
}
|
||||||
|
}"
|
||||||
|
/>
|
||||||
<div style="margin-left: 10px; display: flex; justify-content: center; align-items: center">
|
<div style="margin-left: 10px; display: flex; justify-content: center; align-items: center">
|
||||||
<el-tooltip class="box-item" effect="dark" content="列表上已选择得模版不可再选" placement="top">
|
<el-tooltip class="box-item" effect="dark" content="列表上已选择得模版不可再选" placement="top">
|
||||||
<el-icon>
|
<el-icon>
|
||||||
@ -248,8 +284,7 @@
|
|||||||
<el-option v-for="item in listOfFormalitiesList" :label="item.name" :value="item.id" />
|
<el-option v-for="item in listOfFormalitiesList" :label="item.name" :value="item.id" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="名称" prop="formalitiesName"
|
<el-form-item label="名称" prop="formalitiesName" :rules="[{ required: true, message: '请输入名称', trigger: 'blur' }]">
|
||||||
:rules="[{ required: true, message: '请输入名称', trigger: 'blur' }]">
|
|
||||||
<el-input v-model="formTemplate.formalitiesName" placeholder="请输入名称" />
|
<el-input v-model="formTemplate.formalitiesName" placeholder="请输入名称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="ol-map" id="olMap"></div>
|
<div class="ol-map" id="olMap"></div>
|
||||||
<div class="left_title_button">
|
<div class="left_title_button">
|
||||||
<div class="title">{{ projectName }}</div>
|
<div class="title">{{ currentProject.name }}</div>
|
||||||
<div class="btn" @click="updateZhiJiaZhuanDian('zhuangdian')">
|
<div class="btn" @click="updateZhiJiaZhuanDian('zhuangdian')">
|
||||||
<SvgIcon :name="bottomSvg" :isStyle="true" :className="'width:250px;height:50px;'" />
|
<SvgIcon :name="bottomSvg" :isStyle="true" :className="'width:250px;height:50px;'" />
|
||||||
<span>桩点-更新高程</span>
|
<span>桩点-更新高程</span>
|
||||||
@ -29,6 +29,11 @@
|
|||||||
import { workScheduleDel } from '@/api/progress/plan';
|
import { workScheduleDel } from '@/api/progress/plan';
|
||||||
import { renderFacilitiesToCesium } from '@/views/gisHome/js/renderFacilities';
|
import { renderFacilitiesToCesium } from '@/views/gisHome/js/renderFacilities';
|
||||||
import { CenterHeight } from '@/views/gis2D/js/center';
|
import { CenterHeight } from '@/views/gis2D/js/center';
|
||||||
|
import { useUserStoreHook } from '@/store/modules/user';
|
||||||
|
const userStore = useUserStoreHook();
|
||||||
|
const currentProject = computed(() => userStore.selectedProject);
|
||||||
|
console.log('projectName', currentProject);
|
||||||
|
|
||||||
import md5 from 'js-md5';
|
import md5 from 'js-md5';
|
||||||
const arr = ref();
|
const arr = ref();
|
||||||
const initFacilities = async () => {
|
const initFacilities = async () => {
|
||||||
@ -129,8 +134,10 @@ onMounted(async () => {
|
|||||||
username: 'admin',
|
username: 'admin',
|
||||||
password: md5('admin_admin123'),
|
password: md5('admin_admin123'),
|
||||||
host: 'http://192.168.110.2:8895/'
|
host: 'http://192.168.110.2:8895/'
|
||||||
|
}).then((res) => {
|
||||||
|
createEarth();
|
||||||
|
console.log(res);
|
||||||
});
|
});
|
||||||
createEarth();
|
|
||||||
await handletilList();
|
await handletilList();
|
||||||
await initFacilities();
|
await initFacilities();
|
||||||
console.log(YJ);
|
console.log(YJ);
|
||||||
|
@ -9,7 +9,7 @@
|
|||||||
<!-- 合同利润:保持万元显示 -->
|
<!-- 合同利润:保持万元显示 -->
|
||||||
<RevenueContractCard title="合同利润" :value="formatToTenThousand(data.profitAmount, 'tenThousand')" />
|
<RevenueContractCard title="合同利润" :value="formatToTenThousand(data.profitAmount, 'tenThousand')" />
|
||||||
<!-- 工程变更:改为百分比显示 -->
|
<!-- 工程变更:改为百分比显示 -->
|
||||||
<RevenueContractCard title="工程变更" :value="formatToTenThousand(data.changeAmount, 'percentage')" unit="" />
|
<!-- <RevenueContractCard title="工程变更" :value="formatToTenThousand(data.changeAmount, 'percentage')" unit="" /> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="centerPage_map">
|
<div class="centerPage_map">
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div style="font-size: 12px; padding-left: 10px">安全生产天数:</div>
|
<div style="font-size: 12px; padding-left: 10px">安全生产天数:</div>
|
||||||
<div class="header_left_text">
|
<div class="header_left_text">
|
||||||
1,235
|
{{ safetyDay }}
|
||||||
<span style="font-size: 12px">天</span>
|
<span style="font-size: 12px">天</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -16,14 +16,20 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<div class="top-bar">
|
<div class="top-bar">
|
||||||
<!-- 左侧:天气图标 + 日期文字 -->
|
<!-- 左侧:天气轮播区域 -->
|
||||||
<div class="left-section">
|
<div class="left-section">
|
||||||
<img src="@/assets/large/weather.png" alt="天气图标" />
|
<div class="weather-list" @mouseenter="requestPause" @mouseleave="resumeScroll">
|
||||||
|
<div
|
||||||
<span>
|
v-for="(item, i) in weatherList"
|
||||||
<span>多云 9°/18°</span>
|
:key="i"
|
||||||
<span style="padding-left: 20px"> {{ week[date.week] }} ({{ date.ymd }})</span>
|
class="weather-item"
|
||||||
</span>
|
:style="{ transform: `translateY(-${offsetY}px)`, transition: transition }"
|
||||||
|
>
|
||||||
|
<img :src="`/assets/demo/${item.icon}.png`" alt="" />
|
||||||
|
<div>{{ item.weather }}{{ item.tempMin }}°/{{ item.tempMax }}°</div>
|
||||||
|
<div>{{ item.week }}({{ item.date }})</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 分割线 -->
|
<!-- 分割线 -->
|
||||||
<div class="divider">
|
<div class="divider">
|
||||||
@ -41,38 +47,164 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { ref, computed, onMounted, onUnmounted } from 'vue';
|
||||||
|
import { useUserStoreHook } from '@/store/modules/user';
|
||||||
|
import { getSafetyDay, getWeather } from '@/api/largeScreen/index';
|
||||||
|
|
||||||
|
interface WeatherData {
|
||||||
|
date: string;
|
||||||
|
week: string;
|
||||||
|
tempMax: string;
|
||||||
|
tempMin: string;
|
||||||
|
sunRise: string;
|
||||||
|
sunSet: string;
|
||||||
|
dayStatus: string;
|
||||||
|
dayIcon: string;
|
||||||
|
nightStatus: string;
|
||||||
|
nightIcon: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 星期映射
|
||||||
const week = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
|
const week = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
|
||||||
|
// 日期数据
|
||||||
const date = ref({
|
const date = ref({
|
||||||
ymd: '',
|
ymd: '',
|
||||||
hms: '',
|
hms: '',
|
||||||
week: 0
|
week: 0
|
||||||
});
|
});
|
||||||
|
// 安全生产天数
|
||||||
|
const safetyDay = ref('');
|
||||||
|
// 用户存储
|
||||||
|
const userStore = useUserStoreHook();
|
||||||
|
const currentProject = computed(() => userStore.selectedProject);
|
||||||
|
|
||||||
|
// 天气轮播相关变量
|
||||||
|
const weatherList = ref<WeatherData[]>([]);
|
||||||
|
const offsetY = ref<number>(0);
|
||||||
|
const curIndex = ref(0);
|
||||||
|
const transition = ref('transform 0.5s ease');
|
||||||
|
const timer = ref<number | null>(0);
|
||||||
|
const pendingPause = ref(false);
|
||||||
|
|
||||||
|
// 判断当前时间是白天/夜晚
|
||||||
|
function judgeDayOrNight(sunRise: string, sunSet: string) {
|
||||||
|
const timeToMinutes = (timeStr: string) => {
|
||||||
|
const [hours, minutes] = timeStr.split(':').map(Number);
|
||||||
|
return isNaN(hours) || isNaN(minutes) ? 0 : hours * 60 + minutes;
|
||||||
|
};
|
||||||
|
const sunRiseMinutes = timeToMinutes(sunRise);
|
||||||
|
const sunSetMinutes = timeToMinutes(sunSet);
|
||||||
|
const now = new Date();
|
||||||
|
const currentMinutes = now.getHours() * 60 + now.getMinutes();
|
||||||
|
return currentMinutes >= sunRiseMinutes && currentMinutes <= sunSetMinutes;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 天气轮播逻辑:每5秒切换一次
|
||||||
|
const setWeatherScroll = () => {
|
||||||
|
curIndex.value += 1;
|
||||||
|
transition.value = 'transform 0.3s ease';
|
||||||
|
offsetY.value = curIndex.value * 60; // 每个天气项高度60px,需和样式一致
|
||||||
|
|
||||||
|
// 轮播到最后一项时,无缝衔接回第一项
|
||||||
|
if (curIndex.value === weatherList.value.length - 1) {
|
||||||
|
setTimeout(() => {
|
||||||
|
transition.value = 'none';
|
||||||
|
curIndex.value = 0;
|
||||||
|
offsetY.value = 0;
|
||||||
|
}, 350);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 启动轮播定时器
|
||||||
|
function startScroll() {
|
||||||
|
if (timer.value) clearInterval(timer.value);
|
||||||
|
timer.value = window.setInterval(setWeatherScroll, 5000) as unknown as number;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 鼠标悬浮暂停轮播
|
||||||
|
function requestPause() {
|
||||||
|
if (timer.value) {
|
||||||
|
clearInterval(timer.value);
|
||||||
|
timer.value = null;
|
||||||
|
}
|
||||||
|
pendingPause.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 鼠标离开恢复轮播
|
||||||
|
function resumeScroll() {
|
||||||
|
pendingPause.value = false;
|
||||||
|
startScroll();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 设置实时时间
|
||||||
const setTime = () => {
|
const setTime = () => {
|
||||||
let date1 = new Date();
|
const date1 = new Date();
|
||||||
let year: any = date1.getFullYear();
|
const year = date1.getFullYear();
|
||||||
let month: any = date1.getMonth() + 1;
|
const month = date1.getMonth() + 1;
|
||||||
let day: any = date1.getDate();
|
const day = date1.getDate();
|
||||||
let hours: any = date1.getHours();
|
const hours = date1.getHours().toString().padStart(2, '0');
|
||||||
if (hours < 10) {
|
const minutes = date1.getMinutes().toString().padStart(2, '0');
|
||||||
hours = '0' + hours;
|
const seconds = date1.getSeconds().toString().padStart(2, '0');
|
||||||
}
|
|
||||||
let minutes: any = date1.getMinutes();
|
date.value.ymd = `${year}-${month}-${day}`;
|
||||||
if (minutes < 10) {
|
date.value.hms = `${hours}:${minutes}:${seconds}`;
|
||||||
minutes = '0' + minutes;
|
|
||||||
}
|
|
||||||
let seconds: any = date1.getSeconds();
|
|
||||||
if (seconds < 10) {
|
|
||||||
seconds = '0' + seconds;
|
|
||||||
}
|
|
||||||
date.value.ymd = year + '-' + month + '-' + day;
|
|
||||||
date.value.hms = hours + ':' + minutes + ':' + seconds;
|
|
||||||
date.value.week = date1.getDay();
|
date.value.week = date1.getDay();
|
||||||
};
|
};
|
||||||
// 添加定时器,每秒更新一次时间
|
|
||||||
const timer = setInterval(setTime, 1000);
|
// 获取天气数据
|
||||||
|
const getWeatherData = async () => {
|
||||||
|
try {
|
||||||
|
if (currentProject.value?.id) {
|
||||||
|
const res = await getWeather(currentProject.value.id);
|
||||||
|
if (res.code === 200 && res.data && res.data.length > 0) {
|
||||||
|
weatherList.value = res.data;
|
||||||
|
|
||||||
|
// 处理每一天的天气(白天/夜晚切换图标和状态)
|
||||||
|
weatherList.value.forEach((item) => {
|
||||||
|
const isDay = judgeDayOrNight(item.sunRise, item.sunSet);
|
||||||
|
item.status = isDay ? item.dayStatus : item.nightStatus;
|
||||||
|
item.icon = isDay ? item.dayIcon : item.nightIcon;
|
||||||
|
item.tempRange = `${item.tempMin}°/${item.tempMax}°`;
|
||||||
|
});
|
||||||
|
|
||||||
|
// 复制第一项实现无缝轮播
|
||||||
|
weatherList.value = [...weatherList.value, weatherList.value[0]];
|
||||||
|
startScroll(); // 数据加载后启动轮播
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取天气数据失败:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 获取安全生产天数
|
||||||
|
const getSafetyDays = async () => {
|
||||||
|
try {
|
||||||
|
if (currentProject.value?.id) {
|
||||||
|
const res = await getSafetyDay(currentProject.value.id);
|
||||||
|
if (res.code === 200 && res.data) {
|
||||||
|
safetyDay.value = res.data.safetyDay.toString();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取安全生产天数失败:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 组件挂载时初始化
|
||||||
|
onMounted(() => {
|
||||||
|
setTime(); // 初始化时间
|
||||||
|
getSafetyDays();
|
||||||
|
getWeatherData();
|
||||||
|
// 时间定时器(每秒更新)
|
||||||
|
window.setInterval(setTime, 1000);
|
||||||
|
});
|
||||||
|
|
||||||
// 组件卸载时清除定时器
|
// 组件卸载时清除定时器
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
clearInterval(timer);
|
if (timer.value) {
|
||||||
|
clearInterval(timer.value);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -86,41 +218,47 @@ onUnmounted(() => {
|
|||||||
grid-template-columns: 1fr 1fr 1fr;
|
grid-template-columns: 1fr 1fr 1fr;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header_left {
|
.header_left {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
.header_left_img {
|
.header_left_img {
|
||||||
width: 48px;
|
width: 48px;
|
||||||
height: 48px;
|
height: 48px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
// padding-right: 10px;
|
// padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header_left_text {
|
.header_left_text {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
text-shadow: 0px 1.24px 6.21px rgba(25, 179, 250, 1);
|
text-shadow: 0px 1.24px 6.21px rgba(25, 179, 250, 1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.header_right {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-family: 'AlimamaShuHeiTi', sans-serif;
|
font-family: 'AlimamaShuHeiTi', sans-serif;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title > div:first-child {
|
.title > div:first-child {
|
||||||
/* 第一个子元素的样式 */
|
/* 第一个子元素的样式 */
|
||||||
font-size: 38px;
|
font-size: 38px;
|
||||||
// font-weight: 300;
|
letter-spacing: 0.1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title > div:last-child {
|
.title > div:last-child {
|
||||||
/* 最后一个子元素的样式 */
|
/* 最后一个子元素的样式 */
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
letter-spacing: 0.3em; /* 调整这个值来控制间距大小 */
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 顶部栏容器:Flex 水平布局 + 垂直居中 */
|
/* 顶部栏容器:Flex 水平布局 + 垂直居中 */
|
||||||
.top-bar {
|
.top-bar {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -128,27 +266,44 @@ onUnmounted(() => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
// background-color: #1e2128;
|
|
||||||
color: #fff;
|
color: #fff;
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 左侧区域(天气 + 日期):自身也用 Flex 水平排列,确保元素在一行 */
|
/* 左侧区域(天气 + 日期):自身也用 Flex 水平排列,确保元素在一行 */
|
||||||
.left-section {
|
.left-section {
|
||||||
|
height: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
// margin-right: auto; /* 让右侧元素(管理系统)居右 */
|
|
||||||
}
|
.weather-list {
|
||||||
.left-section img {
|
height: 60px;
|
||||||
width: 32px;
|
overflow: hidden;
|
||||||
height: 32px;
|
|
||||||
margin-right: 8px; /* 图标与文字间距 */
|
.weather-item {
|
||||||
|
height: 60px;
|
||||||
|
line-height: 60px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
& > div:last-child {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 分割线(视觉分隔,可根据需求调整样式) */
|
/* 分割线(视觉分隔,可根据需求调整样式) */
|
||||||
.divider {
|
.divider {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-rows: 1fr 1fr;
|
grid-template-rows: 1fr 1fr;
|
||||||
height: 100%; /* 根据需要调整高度 */
|
gap: 2px;
|
||||||
padding: 14px 10px;
|
padding: 14px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -165,16 +320,27 @@ onUnmounted(() => {
|
|||||||
background: #19b5fb;
|
background: #19b5fb;
|
||||||
align-self: end;
|
align-self: end;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 右侧区域(管理系统):图标 + 文字水平排列 */
|
/* 右侧区域(管理系统):图标 + 文字水平排列 */
|
||||||
.right-section {
|
.right-section {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
font-family: 'AlimamaShuHeiTi', sans-serif;
|
font-family: 'AlimamaShuHeiTi', sans-serif;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.right-section img {
|
.right-section img {
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
margin-right: 6px; /* 图标与文字间距 */
|
margin-right: 6px;
|
||||||
|
/* 图标与文字间距 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.change {
|
||||||
|
display: grid;
|
||||||
|
place-items: center;
|
||||||
|
margin-right: 10px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -3,13 +3,19 @@
|
|||||||
<div class="max-w-4xl mx-auto">
|
<div class="max-w-4xl mx-auto">
|
||||||
<!-- 顶部按钮区域 -->
|
<!-- 顶部按钮区域 -->
|
||||||
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
|
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
|
||||||
<approvalButton @submitForm="submitForm" @approvalVerifyOpen="approvalVerifyOpen"
|
<approvalButton
|
||||||
@handleApprovalRecord="handleApprovalRecord" :buttonLoading="buttonLoading" :id="form.mrpBaseBo.id"
|
@submitForm="submitForm"
|
||||||
:status="form.mrpBaseBo.status" :pageType="routeParams.type" />
|
@approvalVerifyOpen="approvalVerifyOpen"
|
||||||
|
@handleApprovalRecord="handleApprovalRecord"
|
||||||
|
:buttonLoading="buttonLoading"
|
||||||
|
:id="form.mrpBaseBo.id"
|
||||||
|
:status="form.mrpBaseBo.status"
|
||||||
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
<el-card
|
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
|
||||||
class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
|
|
||||||
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
|
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
|
||||||
<h3 class="text-lg font-semibold text-gray-800">物资设备批次需求计划</h3>
|
<h3 class="text-lg font-semibold text-gray-800">物资设备批次需求计划</h3>
|
||||||
<el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
@ -20,8 +26,7 @@
|
|||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="8" :offset="0">
|
<el-col :span="8" :offset="0">
|
||||||
<el-form-item label="编制日期" prop="mrpBaseBo.preparedDate">
|
<el-form-item label="编制日期" prop="mrpBaseBo.preparedDate">
|
||||||
<el-date-picker v-model="form.mrpBaseBo.preparedDate" type="date" value-format="YYYY-MM-DD" disabled
|
<el-date-picker v-model="form.mrpBaseBo.preparedDate" type="date" value-format="YYYY-MM-DD" disabled placeholder="请选择编制日期" />
|
||||||
placeholder="请选择编制日期" />
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="8" :offset="0">
|
<el-col :span="8" :offset="0">
|
||||||
@ -50,8 +55,14 @@
|
|||||||
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
|
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
|
||||||
<approvalRecord ref="approvalRecordRef"></approvalRecord>
|
<approvalRecord ref="approvalRecordRef"></approvalRecord>
|
||||||
<!-- 流程选择对话框 -->
|
<!-- 流程选择对话框 -->
|
||||||
<el-dialog draggable v-model="dialogVisible.visible" :title="dialogVisible.title" :before-close="handleClose"
|
<el-dialog
|
||||||
width="500" class="rounded-lg shadow-lg">
|
draggable
|
||||||
|
v-model="dialogVisible.visible"
|
||||||
|
:title="dialogVisible.title"
|
||||||
|
:before-close="handleClose"
|
||||||
|
width="500"
|
||||||
|
class="rounded-lg shadow-lg"
|
||||||
|
>
|
||||||
<div class="p-4">
|
<div class="p-4">
|
||||||
<p class="text-gray-600 mb-4">请选择要启动的流程:</p>
|
<p class="text-gray-600 mb-4">请选择要启动的流程:</p>
|
||||||
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
|
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
|
||||||
@ -60,10 +71,12 @@
|
|||||||
</div>
|
</div>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
|
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
|
||||||
<el-button @click="handleClose"
|
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
|
||||||
class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors">取消</el-button>
|
>取消</el-button
|
||||||
<el-button type="primary" @click="submitFlow()"
|
>
|
||||||
class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors">确认</el-button>
|
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
|
||||||
|
>确认</el-button
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.approvalDesign"
|
:status="form.approvalDesign"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|
@ -8,27 +8,35 @@
|
|||||||
<span>{{ scope.row.residue }}</span>
|
<span>{{ scope.row.residue }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="出库数量" align="center" prop="number">
|
<el-table-column label="出库数量" align="center" prop="number" width="150px">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-input-number v-if="scope.row.type" v-model="scope.row.number" :controls="false" :min="0" :max="scope.row.residue" :precision="0" />
|
<el-input-number
|
||||||
|
v-if="scope.row.type"
|
||||||
|
v-model="scope.row.number"
|
||||||
|
:controls="false"
|
||||||
|
:min="0"
|
||||||
|
:max="scope.row.residue"
|
||||||
|
:precision="0"
|
||||||
|
style="width: 100px"
|
||||||
|
/>
|
||||||
<span v-else>{{ scope.row.number }}</span>
|
<span v-else>{{ scope.row.number }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="交接单位" align="center" prop="recipient">
|
<el-table-column label="交接单位" align="center" prop="recipient" width="150px">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-input v-if="scope.row.type" style="width: 150px" v-model="scope.row.recipient" />
|
<el-input v-if="scope.row.type" v-model="scope.row.recipient" width="100px" />
|
||||||
<span v-else>{{ scope.row.recipient }}</span>
|
<span v-else>{{ scope.row.recipient }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="领用人" align="center" prop=" shipper">
|
<el-table-column label="领用人" align="center" prop=" shipper" width="150px">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-input v-if="scope.row.type" style="width: 150px" v-model="scope.row.shipper" />
|
<el-input v-if="scope.row.type" v-model="scope.row.shipper" width="100px" />
|
||||||
<span v-else>{{ scope.row.shipper }}</span>
|
<span v-else>{{ scope.row.shipper }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作人" align="center" prop="operator">
|
<el-table-column label="操作人" align="center" prop="operator" width="150px">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-input v-if="scope.row.type" style="width: 150px" v-model="scope.row.operator" />
|
<el-input v-if="scope.row.type" v-model="scope.row.operator" width="100px" />
|
||||||
<span v-else>{{ scope.row.operator }}</span>
|
<span v-else>{{ scope.row.operator }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
@ -70,6 +70,13 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="备注" align="center" prop="remark" />
|
<el-table-column label="备注" align="center" prop="remark" />
|
||||||
|
<el-table-column label="附件" align="center" prop="attachmentName">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button :href="scope.row.attachmentName" link type="primary" @click="downloadAttachment(scope.row)">{{
|
||||||
|
scope.row.attachmentName
|
||||||
|
}}</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" min-width="120" fixed="right">
|
<el-table-column label="操作" align="center" min-width="120" fixed="right">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<!-- <el-button link type="primary" icon="edit" @click="handleUpdate(scope.row)" v-hasPermi="['materials:materialReceive:edit']"
|
<!-- <el-button link type="primary" icon="edit" @click="handleUpdate(scope.row)" v-hasPermi="['materials:materialReceive:edit']"
|
||||||
@ -254,6 +261,11 @@
|
|||||||
<file-upload :isShowTip="false" :fileType="['pdf', 'png', 'jpg', 'jpeg']" v-model="form.licenseCountFileId" />
|
<file-upload :isShowTip="false" :fileType="['pdf', 'png', 'jpg', 'jpeg']" v-model="form.licenseCountFileId" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="附件" prop="attachmentId">
|
||||||
|
<file-upload :isShowTip="false" :fileType="['pdf', 'png', 'jpg', 'jpeg', 'zip']" v-model="form.attachmentId" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<span style="color: #ff0000ab; margin-bottom: 10px; display: block">注意:pdf/png/jpg/jpeg格式文件</span>
|
<span style="color: #ff0000ab; margin-bottom: 10px; display: block">注意:pdf/png/jpg/jpeg格式文件</span>
|
||||||
</el-col>
|
</el-col>
|
||||||
@ -351,6 +363,7 @@ const getInitFormData = (): MaterialReceiveForm => {
|
|||||||
techDocCountFileId: undefined,
|
techDocCountFileId: undefined,
|
||||||
licenseCount: undefined,
|
licenseCount: undefined,
|
||||||
licenseCountFileId: undefined,
|
licenseCountFileId: undefined,
|
||||||
|
attachmentId: undefined,
|
||||||
storageType: '1',
|
storageType: '1',
|
||||||
remark: undefined,
|
remark: undefined,
|
||||||
docId: undefined,
|
docId: undefined,
|
||||||
@ -538,6 +551,17 @@ const handleUpdate = async (row?: MaterialReceiveVO) => {
|
|||||||
proxy?.$modal.msgError('获取详情失败');
|
proxy?.$modal.msgError('获取详情失败');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
//下载附件
|
||||||
|
const downloadAttachment = (row: any) => {
|
||||||
|
if (row.attachmentUrl) {
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.href = row.attachmentUrl;
|
||||||
|
link.download = row.fileName || 'download';
|
||||||
|
document.body.appendChild(link);
|
||||||
|
link.click();
|
||||||
|
document.body.removeChild(link);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
/** 提交按钮 */
|
/** 提交按钮 */
|
||||||
const submitForm = () => {
|
const submitForm = () => {
|
||||||
|
@ -3,7 +3,25 @@
|
|||||||
<el-row :gutter="10" class="mb8">
|
<el-row :gutter="10" class="mb8">
|
||||||
<el-col :span="5">
|
<el-col :span="5">
|
||||||
<el-card shadow="never">
|
<el-card shadow="never">
|
||||||
<el-tree style="max-width: 600px" :data="TreeData" :props="defaultProps" @node-click="handleNodeClick" />
|
<!-- <el-tree style="max-width: 600px" :data="TreeData" :props="defaultProps" @node-click="handleNodeClick" /> -->
|
||||||
|
<el-tree
|
||||||
|
:data="TreeData"
|
||||||
|
:props="defaultProps"
|
||||||
|
@node-click="handleNodeClick"
|
||||||
|
node-key="id"
|
||||||
|
default-expand-all
|
||||||
|
:expand-on-click-node="false"
|
||||||
|
>
|
||||||
|
<template #default="{ node, data }">
|
||||||
|
<span class="custom-tree-node">
|
||||||
|
<span class="tree-title">
|
||||||
|
<div>
|
||||||
|
<div>{{ node.label }}</div>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-tree>
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
@ -228,8 +246,13 @@ const getMaterialsListData = async () => {
|
|||||||
label: item.materialsName + '_' + item.createTime,
|
label: item.materialsName + '_' + item.createTime,
|
||||||
children: []
|
children: []
|
||||||
}));
|
}));
|
||||||
queryParams.value.materialsId = TreeData.value[0].id;
|
if (TreeData.value.length > 0) {
|
||||||
getList();
|
queryParams.value.materialsId = TreeData.value[0].id;
|
||||||
|
getList();
|
||||||
|
} else {
|
||||||
|
queryParams.value.materialsId = '';
|
||||||
|
getList();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -453,7 +476,7 @@ const listeningProject: WatchStopHandle = watch(
|
|||||||
Object.values(childRowStates.value).forEach((state) => {
|
Object.values(childRowStates.value).forEach((state) => {
|
||||||
state.queryParams.projectId = newId;
|
state.queryParams.projectId = newId;
|
||||||
});
|
});
|
||||||
getList();
|
getMaterialsListData();
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
@ -468,3 +491,53 @@ onMounted(() => {
|
|||||||
getMaterialsListData();
|
getMaterialsListData();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.custom-tree-node {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 14px;
|
||||||
|
padding-right: 8px;
|
||||||
|
height: 40px; /* 固定高度 */
|
||||||
|
}
|
||||||
|
.tree-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
:deep(.el-tree) {
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-tree-node) {
|
||||||
|
margin: 2px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-tree-node__content) {
|
||||||
|
height: auto !important;
|
||||||
|
margin: 2px 0;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-tree-node__content:hover) {
|
||||||
|
background-color: #ecf5ff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 为不同层级添加不同的边框颜色 */
|
||||||
|
:deep(.el-tree-node:focus > .el-tree-node__content) {
|
||||||
|
background-color: #d9ecff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-tree-node > .el-tree-node__content) {
|
||||||
|
border-left: 3px solid #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-tree-node .el-tree-node__children .el-tree-node__content) {
|
||||||
|
border-left: 3px solid #67c23a;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-tree-node .el-tree-node__children .el-tree-node__children .el-tree-node__content) {
|
||||||
|
border-left: 3px solid #e6a23c;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
:id="form.id"
|
:id="form.id"
|
||||||
:status="form.approvalOrder"
|
:status="form.approvalOrder"
|
||||||
:pageType="routeParams.type"
|
:pageType="routeParams.type"
|
||||||
|
:projectName="routeParams.projectName"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
|