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> | ||||||
|       <!-- 表单区域 --> |       <!-- 表单区域 --> | ||||||
| @ -205,7 +206,7 @@ const approvalVerifyOpen = async () => { | |||||||
|   // 图纸评审验证 判断是否需要设计验证 |   // 图纸评审验证 判断是否需要设计验证 | ||||||
|   if (form.value.isWindow) { |   if (form.value.isWindow) { | ||||||
|     console.log(routeParams.value.businessId); |     console.log(routeParams.value.businessId); | ||||||
|      |  | ||||||
|     submitVerifyRef.value.openDialog(routeParams.value.taskId, true, routeParams.value.businessId); |     submitVerifyRef.value.openDialog(routeParams.value.taskId, true, routeParams.value.businessId); | ||||||
|   } else { |   } else { | ||||||
|     submitVerifyRef.value.openDialog(routeParams.value.taskId); |     submitVerifyRef.value.openDialog(routeParams.value.taskId); | ||||||
|  | |||||||
| @ -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> | ||||||
|       <!-- 表单区域 --> |       <!-- 表单区域 --> | ||||||
|  | |||||||