Compare commits
	
		
			1 Commits
		
	
	
		
			45538e80c4
			...
			projects/m
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 8e1d420ffb | 
							
								
								
									
										18
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						| @@ -1,25 +1,19 @@ | |||||||
| ### | ### | ||||||
|  # @Author: zhp |  # @Author: zhp | ||||||
|  # @Date: 2024-04-28 13:42:51 |  # @Date: 2024-04-28 13:42:51 | ||||||
|  # @LastEditTime: 2024-06-17 09:01:32 |  # @LastEditTime: 2024-05-29 17:06:55 | ||||||
|  # @LastEditors: DY |  # @LastEditors: zhp | ||||||
|  # @Description: |  # @Description: | ||||||
| ### | ### | ||||||
| # 开发环境配置 | # 开发环境配置 | ||||||
| ENV = 'development' | ENV = 'development' | ||||||
|  |  | ||||||
| # 页面标题 | # 页面标题 | ||||||
| VUE_APP_TITLE = 发电玻璃智能管控平台 | VUE_APP_TITLE = 芋道管理系统 | ||||||
|  |  | ||||||
| # 芋道管理系统/开发环境 | # 芋道管理系统/开发环境 | ||||||
| # VUE_APP_BASE_API = 'http://192.168.1.70:30307' | VUE_APP_BASE_API = 'http://192.168.1.61:48080' | ||||||
| VUE_APP_BASE_API = 'http://glass.kszny.picaiba.com' | # VUE_APP_BASE_API = 'http://glass.kszny.picaiba.com' | ||||||
| # 郭 |  | ||||||
| # VUE_APP_BASE_API = 'http://192.168.1.61:48080' |  | ||||||
| # sara |  | ||||||
| # VUE_APP_BASE_API = 'http://192.168.1.63:48080' |  | ||||||
| # 张一丁 |  | ||||||
| # VUE_APP_BASE_API = 'http://192.168.4.139:48080' |  | ||||||
|  |  | ||||||
| # 路由懒加载 | # 路由懒加载 | ||||||
| VUE_CLI_BABEL_TRANSPILE_MODULES = true | VUE_CLI_BABEL_TRANSPILE_MODULES = true | ||||||
| @@ -28,7 +22,7 @@ VUE_CLI_BABEL_TRANSPILE_MODULES = true | |||||||
| VUE_APP_TENANT_ENABLE = true | VUE_APP_TENANT_ENABLE = true | ||||||
|  |  | ||||||
| # 验证码的开关 | # 验证码的开关 | ||||||
| VUE_APP_CAPTCHA_ENABLE = false | VUE_APP_CAPTCHA_ENABLE = true | ||||||
|  |  | ||||||
| # 文档的开关 | # 文档的开关 | ||||||
| VUE_APP_DOC_ENABLE = true | VUE_APP_DOC_ENABLE = true | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
| ENV = 'development' | ENV = 'development' | ||||||
|  |  | ||||||
| # 页面标题 | # 页面标题 | ||||||
| VUE_APP_TITLE = 发电玻璃智能管控平台 | VUE_APP_TITLE = 芋道管理系统 | ||||||
|  |  | ||||||
| # 芋道管理系统/本地环境 | # 芋道管理系统/本地环境 | ||||||
| VUE_APP_BASE_API = 'http://api-dashboard.yudao.iocoder.cn' | VUE_APP_BASE_API = 'http://api-dashboard.yudao.iocoder.cn' | ||||||
| @@ -14,7 +14,7 @@ VUE_CLI_BABEL_TRANSPILE_MODULES = true | |||||||
| VUE_APP_TENANT_ENABLE = true | VUE_APP_TENANT_ENABLE = true | ||||||
|  |  | ||||||
| # 验证码的开关 | # 验证码的开关 | ||||||
| VUE_APP_CAPTCHA_ENABLE = false | VUE_APP_CAPTCHA_ENABLE = true | ||||||
|  |  | ||||||
| # 文档的开关 | # 文档的开关 | ||||||
| VUE_APP_DOC_ENABLE = true | VUE_APP_DOC_ENABLE = true | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
| NODE_ENV = 'production' | NODE_ENV = 'production' | ||||||
|  |  | ||||||
| # 页面标题 | # 页面标题 | ||||||
| VUE_APP_TITLE = 发电玻璃智能管控平台 | VUE_APP_TITLE = 玻璃控股信息平台 | ||||||
|  |  | ||||||
| # 芋道管理系统/生产环境 | # 芋道管理系统/生产环境 | ||||||
| VUE_APP_BASE_API = '' | VUE_APP_BASE_API = '' | ||||||
| @@ -16,7 +16,7 @@ PUBLIC_PATH = '' | |||||||
| VUE_APP_TENANT_ENABLE = true | VUE_APP_TENANT_ENABLE = true | ||||||
|  |  | ||||||
| # 验证码的开关 | # 验证码的开关 | ||||||
| VUE_APP_CAPTCHA_ENABLE = false | VUE_APP_CAPTCHA_ENABLE = true | ||||||
|  |  | ||||||
| # 文档的开关 | # 文档的开关 | ||||||
| VUE_APP_DOC_ENABLE = false | VUE_APP_DOC_ENABLE = false | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| NODE_ENV = production | NODE_ENV = production | ||||||
|  |  | ||||||
| # 页面标题 | # 页面标题 | ||||||
| VUE_APP_TITLE = 发电玻璃智能管控平台 | VUE_APP_TITLE = 芋道管理系统 | ||||||
|  |  | ||||||
| # 测试环境配置 | # 测试环境配置 | ||||||
| ENV = 'staging' | ENV = 'staging' | ||||||
| @@ -16,7 +16,7 @@ PUBLIC_PATH = 'http://static.yudao.iocoder.cn/' | |||||||
| VUE_APP_TENANT_ENABLE = true | VUE_APP_TENANT_ENABLE = true | ||||||
|  |  | ||||||
| # 验证码的开关 | # 验证码的开关 | ||||||
| VUE_APP_CAPTCHA_ENABLE = false | VUE_APP_CAPTCHA_ENABLE = true | ||||||
|  |  | ||||||
| # 文档的开关 | # 文档的开关 | ||||||
| VUE_APP_DOC_ENABLE = false | VUE_APP_DOC_ENABLE = false | ||||||
|   | |||||||
| @@ -4,7 +4,7 @@ NODE_ENV = development | |||||||
| ENV = 'staging' | ENV = 'staging' | ||||||
|  |  | ||||||
| # 页面标题 | # 页面标题 | ||||||
| VUE_APP_TITLE = 发电玻璃智能管控平台 | VUE_APP_TITLE = 芋道管理系统 | ||||||
|  |  | ||||||
| # 芋道管理系统/测试环境 | # 芋道管理系统/测试环境 | ||||||
| VUE_APP_BASE_API = 'http://127.0.0.1:48080' | VUE_APP_BASE_API = 'http://127.0.0.1:48080' | ||||||
| @@ -18,7 +18,7 @@ VUE_APP_APP_NAME ='/admin-ui-vue2/' | |||||||
| VUE_APP_TENANT_ENABLE = true | VUE_APP_TENANT_ENABLE = true | ||||||
|  |  | ||||||
| # 验证码的开关 | # 验证码的开关 | ||||||
| VUE_APP_CAPTCHA_ENABLE = false | VUE_APP_CAPTCHA_ENABLE = true | ||||||
|  |  | ||||||
| # 文档的开关 | # 文档的开关 | ||||||
| VUE_APP_DOC_ENABLE = true | VUE_APP_DOC_ENABLE = true | ||||||
|   | |||||||
| @@ -51,14 +51,10 @@ | |||||||
|     "crypto-js": "^4.0.0", |     "crypto-js": "^4.0.0", | ||||||
|     "echarts": "5.4.0", |     "echarts": "5.4.0", | ||||||
|     "element-ui": "2.15.12", |     "element-ui": "2.15.12", | ||||||
|     "exceljs": "^4.4.0", |  | ||||||
|     "file-saver": "^2.0.5", |  | ||||||
|     "fuse.js": "6.6.2", |     "fuse.js": "6.6.2", | ||||||
|     "highlight.js": "^11.9.0", |     "highlight.js": "^11.9.0", | ||||||
|     "html2canvas": "^1.4.1", |  | ||||||
|     "js-beautify": "^1.15.1", |     "js-beautify": "^1.15.1", | ||||||
|     "jsencrypt": "3.3.1", |     "jsencrypt": "3.3.1", | ||||||
|     "jspdf": "^2.5.1", |  | ||||||
|     "lodash": "^4.17.21", |     "lodash": "^4.17.21", | ||||||
|     "mockjs": "^1.1.0", |     "mockjs": "^1.1.0", | ||||||
|     "moment": "^2.30.1", |     "moment": "^2.30.1", | ||||||
| @@ -73,8 +69,7 @@ | |||||||
|     "vue-quill-editor": "^3.0.6", |     "vue-quill-editor": "^3.0.6", | ||||||
|     "vue-router": "3.4.9", |     "vue-router": "3.4.9", | ||||||
|     "vuedraggable": "2.24.3", |     "vuedraggable": "2.24.3", | ||||||
|     "vuex": "3.6.2", |     "vuex": "3.6.2" | ||||||
|     "xlsx": "^0.18.5" |  | ||||||
|   }, |   }, | ||||||
|   "devDependencies": { |   "devDependencies": { | ||||||
|     "@vue/cli-plugin-babel": "4.5.18", |     "@vue/cli-plugin-babel": "4.5.18", | ||||||
|   | |||||||
| @@ -1,13 +1,13 @@ | |||||||
| /* | /* | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-07 08:54:59 |  * @Date: 2024-05-07 08:54:59 | ||||||
|  * @LastEditTime: 2024-06-03 08:52:02 |  * @LastEditTime: 2024-05-22 16:31:08 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description: |  * @Description: | ||||||
|  */ |  */ | ||||||
| import request from '@/utils/request' | import request from '@/utils/request' | ||||||
|  |  | ||||||
| // 查询生产数据管理分页 | // 查询部门列表 | ||||||
| export function getProduceDataPage(data) { | export function getProduceDataPage(data) { | ||||||
|   return request({ |   return request({ | ||||||
|     url: 'ip/prod-output/prodOutputDataPage', |     url: 'ip/prod-output/prodOutputDataPage', | ||||||
| @@ -33,15 +33,6 @@ export function exportOutPutExcel(data) { | |||||||
|   }) |   }) | ||||||
| } | } | ||||||
|  |  | ||||||
| // 获取生产数据管理列表 |  | ||||||
| export function prodOutputDataList(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/prod-output/prodOutputDataList', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 获取生产管理生产目标管理碲化镉工厂分页 | // 获取生产管理生产目标管理碲化镉工厂分页 | ||||||
| export function prodTargetDiPage(data) { | export function prodTargetDiPage(data) { | ||||||
|   return request({ |   return request({ | ||||||
| @@ -119,7 +110,7 @@ export function importToTarget(data) { | |||||||
|   return request({ |   return request({ | ||||||
|     url: '/ip/prod-target/to-target-import-excel', |     url: '/ip/prod-target/to-target-import-excel', | ||||||
|     method: 'post', |     method: 'post', | ||||||
|     data: data |     data | ||||||
|   }) |   }) | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -128,7 +119,7 @@ export function importDiTarget(data) { | |||||||
|   return request({ |   return request({ | ||||||
|     url: '/ip/prod-target/di-target-import-excel', |     url: '/ip/prod-target/di-target-import-excel', | ||||||
|     method: 'post', |     method: 'post', | ||||||
|     data: data |     data | ||||||
|   }) |   }) | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -147,12 +138,3 @@ export function cockpitDataMonitor(data) { | |||||||
|     data: data |     data: data | ||||||
|   }) |   }) | ||||||
| } | } | ||||||
|  |  | ||||||
| export function exportFactoryDataExcel(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/prod-output-month/export/excel', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data, |  | ||||||
|     responseType: 'blob' |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|   | |||||||
| @@ -1,60 +0,0 @@ | |||||||
| /* |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-05-07 08:54:59 |  | ||||||
|  * @LastEditTime: 2024-06-03 14:25:02 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
| import request from '@/utils/request' |  | ||||||
|  |  | ||||||
| // 查询工单分页 |  | ||||||
| export function getWorkOrderPage(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/prod-work-order/page', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 查询工单趋势数据 |  | ||||||
| export function getDailyTrend(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/prod-work-order/getDailyTrend', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 获得工单 |  | ||||||
| export function getWorkOrderDetail(id){ |  | ||||||
|   return request({ |  | ||||||
|      url: '/ip/prod-work-order/get?id=' + id, |  | ||||||
|     method: 'get' |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 获得工单设备加工数量 |  | ||||||
| export function getEqNum(id){ |  | ||||||
|   return request({ |  | ||||||
|      url: '/ip/prod-work-order/getEqNum?workOrderId=' + id, |  | ||||||
|     method: 'get' |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 导出工单数据 |  | ||||||
| export function exportExcel(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/prod-work-order/export-excel', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data, |  | ||||||
|     responseType: 'blob' |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 获得工单数据概览 |  | ||||||
| export function getOverView(){ |  | ||||||
|   return request({ |  | ||||||
|      url: '/ip/prod-work-order/getOverView', |  | ||||||
|     method: 'get' |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
| @@ -1,38 +0,0 @@ | |||||||
| // 对标报表的接口 |  | ||||||
| import request from '@/utils/request' |  | ||||||
|  |  | ||||||
| // 稼动率对标 |  | ||||||
| export function utilzationComparePage(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/utilzation-compare/page', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
| // 稼动率对标导出 |  | ||||||
| export function utilzationCompareExport(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/utilzation-compare/export-excel', |  | ||||||
|     method: 'post', |  | ||||||
|     responseType: 'blob', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 芯片OEE对标 |  | ||||||
| export function chipoeeComparePage(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/chipoee-compare/page', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
| // 芯片OEE对标导出 |  | ||||||
| export function chipoeeCompareExport(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/ip/chipoee-compare/export-excel', |  | ||||||
|     method: 'post', |  | ||||||
|     responseType: 'blob', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
| @@ -1,23 +0,0 @@ | |||||||
| /* |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-17 09:41:03 |  | ||||||
|  * @LastEditTime: 2024-06-18 13:47:36 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
| import request from '@/utils/request' |  | ||||||
| export function getComprehensiveDataPage(data) { |  | ||||||
|   return request({ |  | ||||||
|     url: 'ip/comprehensive/data/get/comprehensive/data', |  | ||||||
|     method: 'get', |  | ||||||
|     params: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| export function getProduceTransData(data) { |  | ||||||
|    return request({ |  | ||||||
|     url: 'ip/prod-output/queryYCEReportByDateRange', |  | ||||||
|     method: 'post', |  | ||||||
|     data: data |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
| Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 7.6 MiB | 
| @@ -1,17 +0,0 @@ | |||||||
| <?xml version="1.0" encoding="UTF-8"?> |  | ||||||
| <svg width="26px" height="26px" viewBox="0 0 26 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> |  | ||||||
|     <title>编组 15</title> |  | ||||||
|     <g id="03设备管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> |  | ||||||
|         <g id="工单管理" transform="translate(-714.000000, -131.000000)"> |  | ||||||
|             <g id="编组-15" transform="translate(714.000000, 131.000000)"> |  | ||||||
|                 <g id="编组-13备份" fill="#0B58FF" opacity="0.227236793"> |  | ||||||
|                     <rect id="矩形备份-2" x="0" y="0" width="26" height="26" rx="6"></rect> |  | ||||||
|                 </g> |  | ||||||
|                 <g id="公司" transform="translate(4.749735, 4.749735)" fill-rule="nonzero"> |  | ||||||
|                     <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16.50053" height="16.50053"></rect> |  | ||||||
|                     <path d="M11.933204,3.46511501 L11.933204,1 C11.933204,0.44771525 11.4854888,-1.01453063e-16 10.933204,0 L7.7088886,0 L7.7088886,0 C3.83109495,0 0.687522083,3.16186639 0.687522083,7.06222625 L0.687522083,15.50053 C0.687522083,16.0528147 1.13523733,16.50053 1.68752208,16.50053 L14.8130079,16.50053 C15.3652927,16.50053 15.8130079,16.0528147 15.8130079,15.50053 L15.8130079,6.45996015 L15.8130079,6.45996015 L11.933204,3.46511501 Z M10.8812851,15.4709239 L1.80917527,15.4709239 L1.80917527,6.9505448 C1.81175925,3.6815283 4.55432163,1.03209261 7.93823277,1.02960612 L10.8812851,1.02960612 L10.8812851,15.4709239 Z M14.8298514,15.4709239 L11.9257773,15.4709239 L11.9257773,5.179727 L14.850314,7.12879718 L14.8298514,15.4709239 Z M3.75976827,9.04329837 L8.75976827,9.04329837 L8.75976827,10.3766317 L3.75976827,10.3766317 L3.75976827,9.04329837 Z M3.75976827,6.3766317 L8.75976827,6.3766317 L8.75976827,7.70996504 L3.75976827,7.70996504 L3.75976827,6.3766317 Z" id="形状" fill="#0B58FF"></path> |  | ||||||
|                 </g> |  | ||||||
|             </g> |  | ||||||
|         </g> |  | ||||||
|     </g> |  | ||||||
| </svg> |  | ||||||
| Before Width: | Height: | Size: 1.9 KiB | 
| @@ -1,15 +0,0 @@ | |||||||
| <?xml version="1.0" encoding="UTF-8"?> |  | ||||||
| <svg width="26px" height="26px" viewBox="0 0 26 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> |  | ||||||
|     <title>编组 13</title> |  | ||||||
|     <g id="03设备管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> |  | ||||||
|         <g id="工单管理" transform="translate(-474.000000, -131.000000)"> |  | ||||||
|             <g id="编组-13" transform="translate(474.000000, 131.000000)"> |  | ||||||
|                 <rect id="矩形备份-2" fill="#66DD89" opacity="0.227236793" x="0" y="0" width="26" height="26" rx="6"></rect> |  | ||||||
|                 <g id="机床、加工中心" transform="translate(3.000000, 3.000000)" fill-rule="nonzero"> |  | ||||||
|                     <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="20" height="20"></rect> |  | ||||||
|                     <path d="M18.1818304,15.1909171 L18.1818304,2.5 C18.1818304,2.22385763 17.9579728,2 17.6818304,2 L2.7272736,2 C2.45113122,2 2.2272736,2.22385763 2.2272736,2.5 L2.2272736,10.195451 C2.2272736,10.3084167 2.31885035,10.3999934 2.431816,10.3999934 C2.54478165,10.3999934 2.63635841,10.4915702 2.63635841,10.6045358 L2.63635841,10.999993 C2.63635841,11.3313636 2.90498735,11.5999925 3.23635794,11.5999925 L3.24999521,11.5999925 C3.58889745,11.5999925 3.86363201,11.8747271 3.86363201,12.2136293 L3.86363201,12.7909094 C3.86363201,13.016846 4.04678981,13.2000037 4.2727264,13.2000037 C4.498663,13.2000037 4.6818208,13.016846 4.6818208,12.7909094 L4.6818208,12.2136293 C4.6818208,11.8747271 4.95655535,11.5999925 5.2954576,11.5999925 L5.30909486,11.5999925 C5.64046546,11.5999925 5.9090944,11.3313636 5.9090944,10.999993 L5.9090944,10.6045358 C5.9090944,10.4915702 6.00067115,10.3999934 6.1136368,10.3999934 C6.22660245,10.3999934 6.3181792,10.3084167 6.3181792,10.195451 L6.3181792,6.5 C6.3181792,6.22385763 6.54203683,6 6.8181792,6 L12.772736,6 C13.0488784,6 13.272736,6.22385763 13.272736,6.5 L13.272736,15.1000019 C13.272736,15.3761442 13.0488784,15.6000019 12.772736,15.6000019 L11.7272736,15.6000019 C11.4511312,15.6000019 11.2272736,15.3761442 11.2272736,15.1000019 L11.2272736,14.8000009 C11.2272736,14.3581726 10.869101,14 10.4272727,14 L8.75453855,14 C8.31271023,14 7.95453761,14.3581726 7.95453761,14.8000009 L7.95453761,15.1000019 C7.95453761,15.3761442 7.73067998,15.6000019 7.45453761,15.6000019 L6.4090944,15.6000019 C6.13295202,15.6000019 5.9090944,15.3761442 5.9090944,15.1000019 L5.9090944,14.8000009 C5.9090944,14.3581726 5.55092178,14 5.10909346,14 L3.43635934,14 C2.99453103,14 2.63635841,14.3581726 2.63635841,14.8000009 L2.63635841,15.1000019 C2.63635841,15.3761442 2.41250078,15.6000019 2.13635841,15.6000019 L1.8181792,15.6000019 C1.36631131,15.6000019 1,15.9663132 1,16.4181811 L1,17.5 C1,17.7761424 1.22385763,18 1.5,18 L18.5,18 C18.7761424,18 19,17.7761424 19,17.5 L19,16.0090867 C19,15.7831554 18.8168465,15.6000019 18.5909152,15.6000019 C18.3649839,15.6000019 18.1818304,15.4168484 18.1818304,15.1909171 Z M5.0909056,10.8000056 L3.4545472,10.8000056 L3.4545472,10.3999934 L5.0909056,10.3999934 L5.0909056,10.8000056 Z M5.49999041,6.20000375 L5.49999041,9.60000656 L5.49999041,9.60000656 L3.04544321,9.60000656 L3.04544321,2.80000562 L17.3636416,2.80000562 L17.3636416,15.6000019 L14.0909056,15.6000019 L14.0909056,6.20000375 C14.0909056,5.647719 13.6431904,5.20000375 13.0909056,5.20000375 L6.49999041,5.20000375 C5.94770566,5.20000375 5.49999041,5.647719 5.49999041,6.20000375 Z M8.7727264,14.7999963 L10.4090848,14.7999963 L10.4090848,15.6000019 L8.7727264,15.6000019 L8.7727264,14.7999963 Z M3.4545472,14.7999963 L5.0909056,14.7999963 L5.0909056,15.6000019 L3.4545472,15.6000019 L3.4545472,14.7999963 Z M18.1818304,17.1999944 L1.81816962,17.1999944 L1.81816962,16.3999888 L18.1818304,16.3999888 L18.1818304,17.1999944 Z M12.0454528,4.00000469 C12.0440427,4.28673847 12.1996755,4.55228735 12.4534043,4.69605646 C12.707133,4.83982557 13.0201502,4.83982557 13.2738789,4.69605646 C13.5276077,4.55228735 13.6832405,4.28673847 13.6818304,4.00000469 C13.6832405,3.71327091 13.5276077,3.44772202 13.2738789,3.30395291 C13.0201502,3.1601838 12.707133,3.1601838 12.4534043,3.30395291 C12.1996755,3.44772202 12.0440427,3.71327091 12.0454528,4.00000469 L12.0454528,4.00000469 Z M5.49999041,3.60001125 L11.2272736,3.60001125 L11.2272736,4.39999813 L5.49999041,4.39999813 L5.49999041,3.60001125 Z M15.3181792,11.5999925 L16.136368,11.5999925 L16.136368,14.7999963 L15.3181792,14.7999963 L15.3181792,11.5999925 Z M15.3181792,9.19999438 L16.136368,9.19999438 L16.136368,10.8000056 L15.3181792,10.8000056 L15.3181792,9.19999438 Z M15.3181792,6.79999625 L16.136368,6.79999625 L16.136368,8.4000075 L15.3181792,8.4000075 L15.3181792,6.79999625 Z" id="形状" fill="#43B866"></path> |  | ||||||
|                 </g> |  | ||||||
|             </g> |  | ||||||
|         </g> |  | ||||||
|     </g> |  | ||||||
| </svg> |  | ||||||
| Before Width: | Height: | Size: 4.7 KiB | 
| Before Width: | Height: | Size: 1.2 MiB After Width: | Height: | Size: 6.5 MiB | 
| Before Width: | Height: | Size: 8.5 MiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/logo/logo.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 2.7 KiB | 
| @@ -232,8 +232,6 @@ aside { | |||||||
|   background-color: #d9d9d9; |   background-color: #d9d9d9; | ||||||
| } | } | ||||||
|  |  | ||||||
| // 大屏滚动表格 |  | ||||||
|  |  | ||||||
| .no-data-bg { | .no-data-bg { | ||||||
|   position: absolute; |   position: absolute; | ||||||
|   display: inline-block; |   display: inline-block; | ||||||
| @@ -254,13 +252,3 @@ aside { | |||||||
|     letter-spacing: 1px; |     letter-spacing: 1px; | ||||||
|   } |   } | ||||||
| } | } | ||||||
|  |  | ||||||
| .dv-scroll-board .rows .ceil, |  | ||||||
| .dv-scroll-board .header .header-item { |  | ||||||
|   border-right: 1px solid rgba(13, 23, 40, 1); |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .dv-scroll-board .rows .ceil:last-child, |  | ||||||
| .dv-scroll-board .header .header-item:last-child { |  | ||||||
|   border-right: none; |  | ||||||
| } |  | ||||||
|   | |||||||
| @@ -49,7 +49,7 @@ | |||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import logoImg from "@/assets/logo/cnbm.png"; | import logoImg from "@/assets/logo/logo.png"; | ||||||
| import variables from "@/assets/styles/variables.scss"; | import variables from "@/assets/styles/variables.scss"; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
| @@ -70,7 +70,7 @@ export default { | |||||||
|   }, |   }, | ||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       title: "发电玻璃智能管控平台", |       title: "玻璃控股信息平台", | ||||||
|       logo: logoImg, |       logo: logoImg, | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
| @@ -104,7 +104,7 @@ export default { | |||||||
|       width: 32px; |       width: 32px; | ||||||
|       height: 32px; |       height: 32px; | ||||||
|       vertical-align: middle; |       vertical-align: middle; | ||||||
|       margin-right: 10px; |       margin-right: 12px; | ||||||
|     } |     } | ||||||
|  |  | ||||||
|     & .sidebar-title { |     & .sidebar-title { | ||||||
| @@ -113,7 +113,7 @@ export default { | |||||||
|       color: #fff; |       color: #fff; | ||||||
|       font-weight: 600; |       font-weight: 600; | ||||||
|       line-height: 50px; |       line-height: 50px; | ||||||
|       font-size: 19px; |       font-size: 14px; | ||||||
|       font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif; |       font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif; | ||||||
|       vertical-align: middle; |       vertical-align: middle; | ||||||
|     } |     } | ||||||
|   | |||||||
| @@ -8,14 +8,10 @@ function __resizeHandler(entries) { | |||||||
|           ? entry.contentBoxSize[0] |           ? entry.contentBoxSize[0] | ||||||
|           : entry.contentBoxSize; |           : entry.contentBoxSize; | ||||||
|         this.chart_mixin_chartInstance.resize({ |         this.chart_mixin_chartInstance.resize({ | ||||||
|           // width: |           width: | ||||||
|           //   contentBoxSize.inlineSize < this.MIN_WIDTH |             contentBoxSize.inlineSize < this.MIN_WIDTH | ||||||
|           //     ? this.MIN_WIDTH |               ? this.MIN_WIDTH | ||||||
|           //     : contentBoxSize.inlineSize, |               : contentBoxSize.inlineSize, | ||||||
|         // width: |  | ||||||
|         //   entry.contentRect.width < this.MIN_WIDTH |  | ||||||
|         //     ? this.MIN_WIDTH |  | ||||||
|         //     : entry.contentRect.width, |  | ||||||
|           height: contentBoxSize.blockSize, |           height: contentBoxSize.blockSize, | ||||||
|         }); |         }); | ||||||
|     } else { |     } else { | ||||||
|   | |||||||
| @@ -127,8 +127,7 @@ Router.prototype.push = function push(location) { | |||||||
|  |  | ||||||
| export default new Router({ | export default new Router({ | ||||||
|   base: process.env.VUE_APP_APP_NAME ? process.env.VUE_APP_APP_NAME : "/", |   base: process.env.VUE_APP_APP_NAME ? process.env.VUE_APP_APP_NAME : "/", | ||||||
|   // mode: "history", // 去掉url中的# |   mode: "history", // 去掉url中的# | ||||||
|   mode: "hash", |  | ||||||
|   scrollBehavior: () => ({ y: 0 }), |   scrollBehavior: () => ({ y: 0 }), | ||||||
|   routes: constantRoutes, |   routes: constantRoutes, | ||||||
| }); | }); | ||||||
|   | |||||||
| @@ -92,12 +92,10 @@ const actions = { | |||||||
|   /** 初始化首页数据 */ |   /** 初始化首页数据 */ | ||||||
|   async initHome({ commit }) { |   async initHome({ commit }) { | ||||||
|     const dataArr = await getHomeInfo(); |     const dataArr = await getHomeInfo(); | ||||||
|     console.log('dataArr', dataArr); |     console.log('dataArr',dataArr); | ||||||
|       let preData = dataArr.previousProdOutputOutDO |  | ||||||
|       let preFtoData = dataArr.previousProdOutputFtoDO |  | ||||||
|     // const targetArr = await getHomeInfo(); |     // const targetArr = await getHomeInfo(); | ||||||
|     // factoryListResponse, targetListResponse, prodOutputFtoListRes,preData,preFtoData |     const payload = splitCurrentAndPrevious(dataArr.prodOutputOutDO, dataArr.prodTargetDO,dataArr.prodOutputFtoDO | ||||||
|     const payload = splitCurrentAndPrevious(dataArr.prodOutputOutDO, dataArr.prodTargetOutputDO,dataArr.prodOutputFtoDO,preData,preFtoData); | ); | ||||||
|     commit("SET_HOME_INFO", payload); |     commit("SET_HOME_INFO", payload); | ||||||
|   }, |   }, | ||||||
|   /** 初始化驾驶舱数据 */ |   /** 初始化驾驶舱数据 */ | ||||||
| @@ -127,7 +125,6 @@ const actions = { | |||||||
|     //   const payload = handler(factoryData) |     //   const payload = handler(factoryData) | ||||||
|     //   commit("SET_COPILOT_INFO", { type, payload }); |     //   commit("SET_COPILOT_INFO", { type, payload }); | ||||||
|     // } else { |     // } else { | ||||||
|       console.log('factoryList',factoryList) |  | ||||||
|       let factoryData = factoryList.prodOutputOutDO ? factoryList.prodOutputOutDO : factoryList.prodOutputRateDO |       let factoryData = factoryList.prodOutputOutDO ? factoryList.prodOutputOutDO : factoryList.prodOutputRateDO | ||||||
|       let preData = factoryList.previousProdOutputOutDO ? factoryList.previousProdOutputOutDO : factoryList.previousProdOutputRateDO |       let preData = factoryList.previousProdOutputOutDO ? factoryList.previousProdOutputOutDO : factoryList.previousProdOutputRateDO | ||||||
|       let preFtoData = factoryList.previousProdOutputFtoDO ? factoryList.previousProdOutputFtoDO : [] |       let preFtoData = factoryList.previousProdOutputFtoDO ? factoryList.previousProdOutputFtoDO : [] | ||||||
| @@ -346,7 +343,7 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO | |||||||
|   if (preData && preData[0] != null) { |   if (preData && preData[0] != null) { | ||||||
|     for (const factory of preData) { |     for (const factory of preData) { | ||||||
|       const fId = getPreFactoryId(factory); |       const fId = getPreFactoryId(factory); | ||||||
|         //  chipInvest.previous[fId] = factory.previousYearInputNumber; |          chipInvest.previous[fId] = factory.previousYearInputNumber; | ||||||
|       // chipOeeRate.current[fId] = factory.oee; |       // chipOeeRate.current[fId] = factory.oee; | ||||||
|       chipOeeRate.previous[fId] = factory.previousYearOee; |       chipOeeRate.previous[fId] = factory.previousYearOee; | ||||||
|       // 转化效率 |       // 转化效率 | ||||||
| @@ -378,14 +375,10 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO | |||||||
|         transformRate.target[fId] = componentConversionEfficiency |         transformRate.target[fId] = componentConversionEfficiency | ||||||
|       } |       } | ||||||
|       // 芯片OEE |       // 芯片OEE | ||||||
|       if (factory.glassType === 0) { |       chipOeeRate.current[fId] = factory.oee; | ||||||
|          chipOeeRate.current[fId] = factory.oee; |  | ||||||
|       } |  | ||||||
|       // chipOeeRate.previous[fId] = factory.previousYearOee; |       // chipOeeRate.previous[fId] = factory.previousYearOee; | ||||||
|       // 转化效率 |       // 转化效率 | ||||||
|       if (factory.glassType === 1) { |       transformRate.current[fId] = factory.componentConversionEfficiency; | ||||||
|         transformRate.current[fId] = factory.componentConversionEfficiency; |  | ||||||
|       } |  | ||||||
|       // transformRate.previous[fId] = factory.previousYearComponentConversionEfficiency ; |       // transformRate.previous[fId] = factory.previousYearComponentConversionEfficiency ; | ||||||
|       // 芯片良率 与 标准组件良率 |       // 芯片良率 与 标准组件良率 | ||||||
|       if (![0, 1].includes(factory.glassType)) continue; |       if (![0, 1].includes(factory.glassType)) continue; | ||||||
| @@ -404,10 +397,10 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO | |||||||
| } | } | ||||||
|  |  | ||||||
| function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOutputFtoListRes,preData,preFtoData) { | function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOutputFtoListRes,preData,preFtoData) { | ||||||
|   console.log('prodOutputFtoListRes',preFtoData); |   console.log('prodOutputFtoListRes',preData); | ||||||
|   // 初始数据 |   // 初始数据 | ||||||
|   const { chipInvest, ftoInvest, chipOutput, stdOutput, bipvOutput } = init() |   const { chipInvest, ftoInvest, chipOutput, stdOutput, bipvOutput } = init() | ||||||
|    if (prodOutputFtoListRes.length !== 0 ) { |    if (prodOutputFtoListRes) { | ||||||
|     for (const factory of prodOutputFtoListRes) { |     for (const factory of prodOutputFtoListRes) { | ||||||
|       console.log(factory); |       console.log(factory); | ||||||
|       const fId = getFactoryId(factory); |       const fId = getFactoryId(factory); | ||||||
| @@ -433,13 +426,10 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu | |||||||
|       // } |       // } | ||||||
|     } |     } | ||||||
|    } |    } | ||||||
|     if (preData) { |     if (preData && preData[0] != null) { | ||||||
|     for (const factory of preData) { |     for (const factory of preData) { | ||||||
|       const fId = getPreFactoryId(factory); |       const fId = getPreFactoryId(factory); | ||||||
|       if (factory.previousGlassType === 0) { |          chipInvest.previous[fId] = factory.previousYearInputNumber; | ||||||
|       chipInvest.previous[fId] = factory.previousYearInputNumber |  | ||||||
|       } |  | ||||||
|         //  chipInvest.previous[fId] = factory.previousYearInputNumber; |  | ||||||
|       if (![0, 1, 2].includes(factory.previousGlassType)) continue; |       if (![0, 1, 2].includes(factory.previousGlassType)) continue; | ||||||
|       const _t = [chipOutput, stdOutput, bipvOutput][factory.previousGlassType]; |       const _t = [chipOutput, stdOutput, bipvOutput][factory.previousGlassType]; | ||||||
|       // if (fId) { |       // if (fId) { | ||||||
| @@ -452,14 +442,11 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu | |||||||
|     } |     } | ||||||
|   } |   } | ||||||
|     // console.log('ftoInvest',ftoInvest) |     // console.log('ftoInvest',ftoInvest) | ||||||
|   if (factoryListResponse) { |   if (factoryListResponse && factoryListResponse[0] != null) { | ||||||
|     for (const factory of factoryListResponse) { |     for (const factory of factoryListResponse) { | ||||||
|       const fId = getFactoryId(factory); |       const fId = getFactoryId(factory); | ||||||
|       console.log('factory.inputNumber', factory, fId); |  | ||||||
|       if (factory.glassType === 0) { |  | ||||||
|       chipInvest.current[fId] = factory.inputNumber |  | ||||||
|       } |  | ||||||
|       // const preFId = getPreFactoryId(factory); |       // const preFId = getPreFactoryId(factory); | ||||||
|  |  | ||||||
|       // 获取目标值 |       // 获取目标值 | ||||||
|       if (targetListResponse) { |       if (targetListResponse) { | ||||||
|         const { chipYield, componentYield, bipvProductOutput } = |         const { chipYield, componentYield, bipvProductOutput } = | ||||||
| @@ -469,6 +456,7 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu | |||||||
|         bipvOutput.target[fId] = bipvProductOutput; |         bipvOutput.target[fId] = bipvProductOutput; | ||||||
|       } |       } | ||||||
|       // 芯片投入 |       // 芯片投入 | ||||||
|  |           chipInvest.current[fId] = factory.inputNumber; | ||||||
|  |  | ||||||
|       // 产出数据, 0 - (玻璃)芯片产出, 1 - 标准组件产出, 2 - BIPV产出 |       // 产出数据, 0 - (玻璃)芯片产出, 1 - 标准组件产出, 2 - BIPV产出 | ||||||
|       // 因为后端写的垃圾数据,所以这里要做一下判断 |       // 因为后端写的垃圾数据,所以这里要做一下判断 | ||||||
| @@ -476,7 +464,6 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu | |||||||
|       const _t = [chipOutput, stdOutput, bipvOutput][factory.glassType]; |       const _t = [chipOutput, stdOutput, bipvOutput][factory.glassType]; | ||||||
|         _t.current[fId] = factory.outputNumber; |         _t.current[fId] = factory.outputNumber; | ||||||
|     } |     } | ||||||
|     console.log('chipInvest',ftoInvest); |  | ||||||
|     return { |     return { | ||||||
|       chipInvest, |       chipInvest, | ||||||
|       // ftoInvest, |       // ftoInvest, | ||||||
| @@ -485,6 +472,15 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu | |||||||
|       stdOutput, |       stdOutput, | ||||||
|       bipvOutput, |       bipvOutput, | ||||||
|     }; |     }; | ||||||
|  |   }else{ | ||||||
|  |       return { | ||||||
|  |       chipInvest, | ||||||
|  |       // ftoInvest, | ||||||
|  |       ftoInvest, | ||||||
|  |       chipOutput, | ||||||
|  |       stdOutput, | ||||||
|  |       bipvOutput, | ||||||
|  |     } | ||||||
|   } |   } | ||||||
| } | } | ||||||
|  |  | ||||||
|   | |||||||
| @@ -163,4 +163,4 @@ textarea { | |||||||
|  |  | ||||||
| .el-upload__tip { | .el-upload__tip { | ||||||
|   line-height: 1.2; |   line-height: 1.2; | ||||||
| } | } | ||||||
| @@ -74,9 +74,9 @@ export const SystemDataScopeEnum = { | |||||||
| /** | /** | ||||||
|  * 工厂名称 |  * 工厂名称 | ||||||
|  */ |  */ | ||||||
| // export const factoryList =['瑞昌中建材光电材料有限公司', '邯郸中建材光电材料有限公司', '中建材株洲光电材料有限公司', '佳木斯中建材光电材料有限公司', '成都中建材光电材料有限公司', '凯盛光伏材料有限公司', '蚌埠兴科玻璃有限公司'] | export const factoryList =['瑞昌中建材光电材料有限公司', '邯郸中建材光电材料有限公司', '中建材株洲光电材料有限公司', '佳木斯中建材光电材料有限公司', '成都中建材光电材料有限公司', '凯盛光伏材料有限公司', '蚌埠兴科玻璃有限公司'] | ||||||
|  |  | ||||||
| export const factoryArray1 =[ | export const dhgfactoryList =[ | ||||||
|   { |   { | ||||||
|     name: '瑞昌中建材光电材料有限公司', |     name: '瑞昌中建材光电材料有限公司', | ||||||
|     id: 0 |     id: 0 | ||||||
| @@ -97,43 +97,12 @@ export const factoryArray1 =[ | |||||||
|     name: '成都中建材光电材料有限公司', |     name: '成都中建材光电材料有限公司', | ||||||
|     id: 4 |     id: 4 | ||||||
|   }, |   }, | ||||||
|   { |  | ||||||
|     name: '凯盛光伏材料有限公司', |  | ||||||
|     id: 5 |  | ||||||
|   }, |  | ||||||
|   { |   { | ||||||
|     name: '蚌埠兴科玻璃有限公司', |     name: '蚌埠兴科玻璃有限公司', | ||||||
|     id: 6 |     id: 6 | ||||||
|   } |   } | ||||||
| ] | ] | ||||||
|  |  | ||||||
| // export const dhgfactoryList =[ |  | ||||||
| //   { |  | ||||||
| //     name: '瑞昌中建材光电材料有限公司', |  | ||||||
| //     id: 0 |  | ||||||
| //   }, |  | ||||||
| //   { |  | ||||||
| //     name: '邯郸中建材光电材料有限公司', |  | ||||||
| //     id: 1 |  | ||||||
| //   }, |  | ||||||
| //   { |  | ||||||
| //     name: '中建材株洲光电材料有限公司', |  | ||||||
| //     id: 2 |  | ||||||
| //   }, |  | ||||||
| //   { |  | ||||||
| //     name: '佳木斯中建材光电材料有限公司', |  | ||||||
| //     id: 3 |  | ||||||
| //   }, |  | ||||||
| //   { |  | ||||||
| //     name: '成都中建材光电材料有限公司', |  | ||||||
| //     id: 4 |  | ||||||
| //   }, |  | ||||||
| //   { |  | ||||||
| //     name: '蚌埠兴科玻璃有限公司', |  | ||||||
| //     id: 6 |  | ||||||
| //   } |  | ||||||
| // ] |  | ||||||
|  |  | ||||||
| export const tyjxfactoryList =[ | export const tyjxfactoryList =[ | ||||||
|   { |   { | ||||||
|     name: '凯盛光伏材料有限公司', |     name: '凯盛光伏材料有限公司', | ||||||
| @@ -141,30 +110,6 @@ export const tyjxfactoryList =[ | |||||||
|   } |   } | ||||||
| ] | ] | ||||||
|  |  | ||||||
| // 暂时只有瑞昌邯郸数据 |  | ||||||
| export const factoryList =['瑞昌中建材光电材料有限公司', '邯郸中建材光电材料有限公司'] |  | ||||||
| export const factoryArray =[ |  | ||||||
|   { |  | ||||||
|     name: '瑞昌中建材光电材料有限公司', |  | ||||||
|     id: 0 |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     name: '邯郸中建材光电材料有限公司', |  | ||||||
|     id: 1 |  | ||||||
|   } |  | ||||||
| ] |  | ||||||
|  |  | ||||||
| export const dhgfactoryList =[ |  | ||||||
|   { |  | ||||||
|     name: '瑞昌中建材光电材料有限公司', |  | ||||||
|     id: 0 |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     name: '邯郸中建材光电材料有限公司', |  | ||||||
|     id: 1 |  | ||||||
|   } |  | ||||||
| ] |  | ||||||
|  |  | ||||||
| /** | /** | ||||||
|  * 代码生成模板类型 |  * 代码生成模板类型 | ||||||
|  */ |  */ | ||||||
|   | |||||||
| @@ -83,7 +83,6 @@ export default { | |||||||
|           nameTextStyle: { |           nameTextStyle: { | ||||||
|             color: "#fff", |             color: "#fff", | ||||||
|             fontSize: 12, |             fontSize: 12, | ||||||
|             align: "right", |  | ||||||
|           }, |           }, | ||||||
|           axisTick: { |           axisTick: { | ||||||
|             show: false, |             show: false, | ||||||
|   | |||||||
| @@ -19,7 +19,7 @@ | |||||||
|       <CopilotButton v-for="i in ['日', '周', '月', '年']" :key="i" :label="i" :active="i === period" |       <CopilotButton v-for="i in ['日', '周', '月', '年']" :key="i" :label="i" :active="i === period" | ||||||
|         @click="() => $emit('update:period', i)" /> |         @click="() => $emit('update:period', i)" /> | ||||||
|       <div class="btn-group"> |       <div class="btn-group"> | ||||||
|         <!-- <button type="button" class="export-btn" @click="handleExport" /> --> |         <button type="button" class="export-btn" /> | ||||||
|         <button type="button" class="fullscreen-btn" :class="[isFullscreen ? 'exit-fullscreen' : '']" |         <button type="button" class="fullscreen-btn" :class="[isFullscreen ? 'exit-fullscreen' : '']" | ||||||
|           @click="toggleFullScreen" /> |           @click="toggleFullScreen" /> | ||||||
|         <!-- <button class="times-btn"> {{ times }} </button> --> |         <!-- <button class="times-btn"> {{ times }} </button> --> | ||||||
| @@ -31,7 +31,6 @@ | |||||||
| <script> | <script> | ||||||
| import CopilotButton from "./button.vue"; | import CopilotButton from "./button.vue"; | ||||||
| import screenfull from "screenfull"; | import screenfull from "screenfull"; | ||||||
| import { exportFactoryDataExcel } from "@/api/produceData"; |  | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "CopilotHeader", |   name: "CopilotHeader", | ||||||
| @@ -59,15 +58,6 @@ export default { | |||||||
|   }, |   }, | ||||||
|   computed: {}, |   computed: {}, | ||||||
|   methods: { |   methods: { | ||||||
|     handleExport() { |  | ||||||
|       exportFactoryDataExcel({ |  | ||||||
|         // factoryId: this.companyId, |  | ||||||
|         timeSelection: this.period === 1 ? 0 : this.period === 2 ? 1 : this.period === 3 ? 2 : 3, |  | ||||||
|       }).then(response => { |  | ||||||
|         this.$download.excel(response, `生产数据.xls`); |  | ||||||
|         // this.exportLoading = false; |  | ||||||
|       }).catch(() => { }); |  | ||||||
|     }, |  | ||||||
|     getTimes() { |     getTimes() { | ||||||
|       setInterval(this.getTimesInterval, 60000); |       setInterval(this.getTimesInterval, 60000); | ||||||
|     }, |     }, | ||||||
|   | |||||||
| @@ -4,22 +4,18 @@ | |||||||
|       <!-- <CopilotButton v-for="i in ['产量', '效率']" :key="i" :label="i" :active="i === active" |       <!-- <CopilotButton v-for="i in ['产量', '效率']" :key="i" :label="i" :active="i === active" | ||||||
|         @click="() => $emit('update:active', i)" /> |         @click="() => $emit('update:active', i)" /> | ||||||
|       <div class="type-name"></div> --> |       <div class="type-name"></div> --> | ||||||
|       <CopilotButton v-for="i in dataList" :key="i.id" :label="i.name" :active="i.id === period" |       <CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than" | ||||||
|         @click="() => $emit('update:period', i.id)" /> |         @click="() => $emit('update:than', i)" /> | ||||||
|       <!-- <CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than" |       <div class="btn-group"> | ||||||
|         @click="() => $emit('update:than', i)" /> --> |         <button type="button" class="export-btn" /> | ||||||
|  |         <button type="button" class="fullscreen-btn" :class="[isFullscreen ? 'exit-fullscreen' : '']" | ||||||
|  |           @click="toggleFullScreen" /> | ||||||
|  |       </div> | ||||||
|     </section> |     </section> | ||||||
|     <div class="page-title">{{ companyName }}</div> |     <div class="page-title">{{ companyName }}</div> | ||||||
|     <section class="menu2"> |     <section class="menu2"> | ||||||
|       <div class="btn-group"> |       <CopilotButton v-for="i in dataList" :key="i.id" :label="i.name" :active="i.id === period" | ||||||
|         <el-tooltip class="item" effect="dark" content="导出" placement="top"> |         @click="() => $emit('update:period', i.id)" /> | ||||||
|           <button type="button" class="export-btn" @click="handleExport" /> |  | ||||||
|         </el-tooltip> |  | ||||||
|         <el-tooltip class="item" effect="dark" :content="isFullscreen  === false ? '退出全屏' : '全屏'" placement="top"> |  | ||||||
|           <button type="button" class="fullscreen-btn" :class="[isFullscreen ? 'exit-fullscreen' : '']" |  | ||||||
|             @click="toggleFullScreen" /> |  | ||||||
|         </el-tooltip> |  | ||||||
|       </div> |  | ||||||
|     </section> |     </section> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
| @@ -29,8 +25,6 @@ | |||||||
| import FactorySelect from "./FactorySelect.vue"; | import FactorySelect from "./FactorySelect.vue"; | ||||||
| import screenfull from "screenfull"; | import screenfull from "screenfull"; | ||||||
| import CopilotButton from "./button.vue"; | import CopilotButton from "./button.vue"; | ||||||
| import { exportFactoryDataExcel } from "@/api/produceData"; |  | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "FactoryDataHeader", |   name: "FactoryDataHeader", | ||||||
|   components: { CopilotButton, FactorySelect }, |   components: { CopilotButton, FactorySelect }, | ||||||
| @@ -51,7 +45,6 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       isFullscreen: false, |       isFullscreen: false, | ||||||
|       content:'全屏', |  | ||||||
|       dataList: [ |       dataList: [ | ||||||
|         { id: 1, name: "日" }, |         { id: 1, name: "日" }, | ||||||
|         { id: 2, name: "周" }, |         { id: 2, name: "周" }, | ||||||
| @@ -62,16 +55,6 @@ export default { | |||||||
|   }, |   }, | ||||||
|   computed: {}, |   computed: {}, | ||||||
|   methods: { |   methods: { | ||||||
|     handleExport() { |  | ||||||
|       exportFactoryDataExcel({ |  | ||||||
|         factoryId: this.companyId, |  | ||||||
|         timeSelection: this.period === 1 ? 0 : this.period === 2 ? 1 : this.period === 3 ? 2 : 3, |  | ||||||
|         compare: this.than === '同比' ? 1 : 2 |  | ||||||
|       }).then(response => { |  | ||||||
|         this.$download.excel(response, `${this.companyName}生产数据.xls`); |  | ||||||
|       // this.exportLoading = false; |  | ||||||
|     }).catch(() => { }); |  | ||||||
|     }, |  | ||||||
|     toggleFullScreen() { |     toggleFullScreen() { | ||||||
|       this.isFullscreen = !this.isFullscreen; |       this.isFullscreen = !this.isFullscreen; | ||||||
|  |  | ||||||
| @@ -107,16 +90,14 @@ export default { | |||||||
|   gap: 8px; |   gap: 8px; | ||||||
| } | } | ||||||
| .factory-header > .menu2 { | .factory-header > .menu2 { | ||||||
|   width: 20vw; |   width: 26vw; | ||||||
|   display: flex; |   display: flex; | ||||||
|   justify-content: flex-end; |  | ||||||
|   align-items: center; |   align-items: center; | ||||||
|   gap: 8px; |   gap: 8px; | ||||||
| } | } | ||||||
|  |  | ||||||
| .export-btn, | .export-btn, | ||||||
| .fullscreen-btn { | .fullscreen-btn { | ||||||
|   /* float: right; */ |  | ||||||
|   width: 32px; |   width: 32px; | ||||||
|   height: 32px; |   height: 32px; | ||||||
|   margin-left: 24px; |   margin-left: 24px; | ||||||
|   | |||||||
| @@ -1,15 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-04-28 13:42:51 |  | ||||||
|  * @LastEditTime: 2024-05-31 13:26:32 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <!-- |  | ||||||
|     filename: button.vue |     filename: button.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-16 15:02:34 |     date: 2024-04-16 15:02:34 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -57,7 +50,7 @@ button { | |||||||
|   padding: 12px; |   padding: 12px; | ||||||
|   padding-left: 20px; |   padding-left: 20px; | ||||||
|   color: #fff; |   color: #fff; | ||||||
|   font-size: 18px; |   font-size: 22px; | ||||||
|   letter-spacing: 10px; |   letter-spacing: 10px; | ||||||
|   cursor: pointer; |   cursor: pointer; | ||||||
| } | } | ||||||
|   | |||||||
| @@ -1,10 +1,16 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-23 15:49:14 |  * @Date: 2024-05-23 15:49:14 | ||||||
|  * @LastEditTime: 2024-06-04 08:54:10 |  * @LastEditTime: 2024-05-29 10:56:21 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
|  | <!-- | ||||||
|  |     filename: BarChartBase.vue | ||||||
|  |     author: liubin | ||||||
|  |     date: 2024-04-10 08:59:28 | ||||||
|  |     description: | ||||||
|  | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
|   <chart-container class="bar-chart-base"> |   <chart-container class="bar-chart-base"> | ||||||
| @@ -84,7 +90,6 @@ export default { | |||||||
|           nameTextStyle: { |           nameTextStyle: { | ||||||
|             color: "#fff", |             color: "#fff", | ||||||
|             fontSize: 12, |             fontSize: 12, | ||||||
|             align: "right", |  | ||||||
|           }, |           }, | ||||||
|           axisTick: { |           axisTick: { | ||||||
|             show: false, |             show: false, | ||||||
|   | |||||||
| @@ -1,234 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-05 09:43:51 |  | ||||||
|  * @LastEditTime: 2024-06-05 09:43:52 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <div class="copilot-container"> |  | ||||||
|     <!-- refresh btn  --> |  | ||||||
|     <button |  | ||||||
|       v-if="false" |  | ||||||
|       style=" |  | ||||||
|         appearance: none; |  | ||||||
|         outline: none; |  | ||||||
|         border: none; |  | ||||||
|         background: none; |  | ||||||
|         color: #fff; |  | ||||||
|         cursor: pointer; |  | ||||||
|         position: absolute; |  | ||||||
|         top: 8px; |  | ||||||
|         right: 8px; |  | ||||||
|       " |  | ||||||
|       @click="$emit('refresh')" |  | ||||||
|     > |  | ||||||
|       <svg |  | ||||||
|         xmlns="http://www.w3.org/2000/svg" |  | ||||||
|         fill="none" |  | ||||||
|         viewBox="0 0 24 24" |  | ||||||
|         stroke-width="1.5" |  | ||||||
|         stroke="currentColor" |  | ||||||
|         style="width: 24px; height: 24px" |  | ||||||
|       > |  | ||||||
|         <path |  | ||||||
|           stroke-linecap="round" |  | ||||||
|           stroke-linejoin="round" |  | ||||||
|           d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" |  | ||||||
|         /> |  | ||||||
|       </svg> |  | ||||||
|     </button> |  | ||||||
|     <!-- decoration  --> |  | ||||||
|     <div class="corner tl"></div> |  | ||||||
|     <div class="corner tr"></div> |  | ||||||
|     <div  class="corner bl"></div> |  | ||||||
|     <div  class="corner br"></div> |  | ||||||
|     <!-- content  --> |  | ||||||
|     <div |  | ||||||
|       class="container-head" |  | ||||||
|       :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']" |  | ||||||
|     > |  | ||||||
|       <Icon :icon="icon"></Icon> |  | ||||||
|       <h2 class="container-title">{{ title }}</h2> |  | ||||||
|     </div> |  | ||||||
|     <div |  | ||||||
|       class="container-body" |  | ||||||
|       :class="[ |  | ||||||
|         side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left', |  | ||||||
|       ]" |  | ||||||
|     > |  | ||||||
|       <slot /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import ContainerIconVue from "./ContainerIcon.vue"; |  | ||||||
| export default { |  | ||||||
|   name: "DashboardContainer", |  | ||||||
|   components: { |  | ||||||
|     Icon: ContainerIconVue, |  | ||||||
|   }, |  | ||||||
|   props: { |  | ||||||
|     side: { |  | ||||||
|       type: String, |  | ||||||
|       default: "left", |  | ||||||
|     }, |  | ||||||
|     icon: { |  | ||||||
|       type: String, |  | ||||||
|       default: "cube", |  | ||||||
|     }, |  | ||||||
|     title: { |  | ||||||
|       type: String, |  | ||||||
|       default: "Default Title", |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return {}; |  | ||||||
|   }, |  | ||||||
|   computed: {}, |  | ||||||
|   methods: {}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped lang="scss"> |  | ||||||
| .copilot-container { |  | ||||||
|   height: 0; |  | ||||||
|   flex: 1; |  | ||||||
|   display: flex; |  | ||||||
|   flex-direction: column; |  | ||||||
|   position: relative; |  | ||||||
|   box-shadow: inset 0 0 20px 1px #fff1; |  | ||||||
|   backdrop-filter: blur(4px); |  | ||||||
|  |  | ||||||
|   &::before { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     height: 100%; |  | ||||||
|     width: 0.11415vw; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     top: 0%; |  | ||||||
|     left: 0; |  | ||||||
|     background: radial-gradient( |  | ||||||
|       circle at center, |  | ||||||
|       #024798 2%, |  | ||||||
|       #024798 30%, |  | ||||||
|       transparent |  | ||||||
|     ); |  | ||||||
|     z-index: 1; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   &::after { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 60%; |  | ||||||
|     height: 0.31415vh; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     left: 8%; |  | ||||||
|     bottom: 0; |  | ||||||
|     background: linear-gradient(to right, #024798, transparent); |  | ||||||
|     z-index: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-head { |  | ||||||
|     // height: 40px; |  | ||||||
|     height: 3.8vh; |  | ||||||
|     padding: 8px; |  | ||||||
|     display: flex; |  | ||||||
|     align-items: center; |  | ||||||
|     gap: 8px; |  | ||||||
|  |  | ||||||
|     .container-title { |  | ||||||
|       font-size: 1.18vw; |  | ||||||
|       line-height: 1.39vw; |  | ||||||
|       font-weight: normal; |  | ||||||
|       letter-spacing: 2px; |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-body { |  | ||||||
|     padding: 12px; |  | ||||||
|     display: flex; |  | ||||||
|     flex-direction: column; |  | ||||||
|     flex: 1; |  | ||||||
|     height: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner { |  | ||||||
|     z-index: 1; |  | ||||||
|     position: absolute; |  | ||||||
|     // width: 16px; |  | ||||||
|     // height: 16px; |  | ||||||
|     width: 0.95vw; |  | ||||||
|     height: 0.95vw; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tl { |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-left: 2px solid #0175dc; |  | ||||||
|     top: 0; |  | ||||||
|     left: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tr { |  | ||||||
|     top: 0; |  | ||||||
|     right: 0; |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-right: 2px solid #0175dc; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.bl { |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     bottom: 0; |  | ||||||
|     left: 0; |  | ||||||
|     // border-left: 10px solid #0175dc; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid transparent; |  | ||||||
|     border-left: 0.532vw solid transparent; |  | ||||||
|     border-bottom: .6vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid transparent; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.br { |  | ||||||
|     bottom: 0; |  | ||||||
|     right: 0; |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     border-left: 0.532vw solid transparent; |  | ||||||
|     border-bottom: 0.532vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid #0175dc; |  | ||||||
|     // border-left: 10px solid transparent; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid #0175dc; |  | ||||||
|     // transform: rotate(-90deg); |  | ||||||
|  |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0003, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0003, transparent); |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,239 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-05 09:48:37 |  | ||||||
|  * @LastEditTime: 2024-06-05 09:53:49 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <!-- |  | ||||||
|     filename: Container.vue |  | ||||||
|     author: liubin |  | ||||||
|     date: 2024-04-09 10:44:09 |  | ||||||
|     description: |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
|   <div class="copilot-container"> |  | ||||||
|     <!-- refresh btn  --> |  | ||||||
|     <button |  | ||||||
|       v-if="0" |  | ||||||
|       style=" |  | ||||||
|         appearance: none; |  | ||||||
|         outline: none; |  | ||||||
|         border: none; |  | ||||||
|         background: none; |  | ||||||
|         color: #fff; |  | ||||||
|         cursor: pointer; |  | ||||||
|         position: absolute; |  | ||||||
|         top: 8px; |  | ||||||
|         right: 8px; |  | ||||||
|       " |  | ||||||
|       @click="$emit('refresh')" |  | ||||||
|     >rotate |  | ||||||
|       <svg |  | ||||||
|         xmlns="http://www.w3.org/2000/svg" |  | ||||||
|         fill="none" |  | ||||||
|         viewBox="0 0 24 24" |  | ||||||
|         stroke-width="1.5" |  | ||||||
|         stroke="currentColor" |  | ||||||
|         style="width: 24px; height: 24px" |  | ||||||
|       > |  | ||||||
|         <path |  | ||||||
|           stroke-linecap="round" |  | ||||||
|           stroke-linejoin="round" |  | ||||||
|           d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" |  | ||||||
|         /> |  | ||||||
|       </svg> |  | ||||||
|     </button> |  | ||||||
|     <!-- decoration  --> |  | ||||||
|     <div class="corner tl"></div> |  | ||||||
|     <div class="corner tr"></div> |  | ||||||
|     <div class="corner bl"></div> |  | ||||||
|     <div class="corner br"></div> |  | ||||||
|     <!-- content  --> |  | ||||||
|     <div |  | ||||||
|       class="container-head" |  | ||||||
|       :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']" |  | ||||||
|     > |  | ||||||
|       <Icon :icon="icon"></Icon> |  | ||||||
|       <h2 class="container-title">{{ title }}</h2> |  | ||||||
|     </div> |  | ||||||
|     <div |  | ||||||
|       class="container-body" |  | ||||||
|       :class="[ |  | ||||||
|         side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left', |  | ||||||
|       ]" |  | ||||||
|     > |  | ||||||
|       <slot /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import ContainerIconVue from "./ContainerIcon.vue"; |  | ||||||
| export default { |  | ||||||
|   name: "DashboardContainer", |  | ||||||
|   components: { |  | ||||||
|     Icon: ContainerIconVue, |  | ||||||
|   }, |  | ||||||
|   props: { |  | ||||||
|     side: { |  | ||||||
|       type: String, |  | ||||||
|       default: "left", |  | ||||||
|     }, |  | ||||||
|     icon: { |  | ||||||
|       type: String, |  | ||||||
|       default: "cube", |  | ||||||
|     }, |  | ||||||
|     title: { |  | ||||||
|       type: String, |  | ||||||
|       default: "Default Title", |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return {}; |  | ||||||
|   }, |  | ||||||
|   computed: {}, |  | ||||||
|   methods: {}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped lang="scss"> |  | ||||||
| .copilot-container { |  | ||||||
|   height: 0; |  | ||||||
|   flex: 1; |  | ||||||
|   display: flex; |  | ||||||
|   flex-direction: column; |  | ||||||
|   position: relative; |  | ||||||
|   box-shadow: inset 0 0 20px 1px #fff1; |  | ||||||
|   backdrop-filter: blur(4px); |  | ||||||
|  |  | ||||||
|   &::before { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     height: 100%; |  | ||||||
|     width: 0.11415vw; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     top: 0%; |  | ||||||
|     left: 0; |  | ||||||
|     background: radial-gradient( |  | ||||||
|       circle at center, |  | ||||||
|       #024798 2%, |  | ||||||
|       #024798 30%, |  | ||||||
|       transparent |  | ||||||
|     ); |  | ||||||
|     z-index: 1; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   &::after { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 60%; |  | ||||||
|     height: 0.31415vh; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     left: 8%; |  | ||||||
|     bottom: 0; |  | ||||||
|     background: linear-gradient(to right, #024798, transparent); |  | ||||||
|     z-index: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-head { |  | ||||||
|     // height: 40px; |  | ||||||
|     height: 3.8vh; |  | ||||||
|     padding: 8px; |  | ||||||
|     display: flex; |  | ||||||
|     align-items: center; |  | ||||||
|     gap: 8px; |  | ||||||
|  |  | ||||||
|     .container-title { |  | ||||||
|       font-size: 1.18vw; |  | ||||||
|       line-height: 1.39vw; |  | ||||||
|       font-weight: normal; |  | ||||||
|       letter-spacing: 2px; |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-body { |  | ||||||
|     padding: 12px; |  | ||||||
|     display: flex; |  | ||||||
|     flex-direction: column; |  | ||||||
|     flex: 1; |  | ||||||
|     height: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner { |  | ||||||
|     z-index: 1; |  | ||||||
|     position: absolute; |  | ||||||
|     // width: 16px; |  | ||||||
|     // height: 16px; |  | ||||||
|     width: 0.95vw; |  | ||||||
|     height: 0.95vw; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tl { |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-left: 2px solid #0175dc; |  | ||||||
|     top: 0; |  | ||||||
|     left: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tr { |  | ||||||
|     top: 0; |  | ||||||
|     right: 0; |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-right: 2px solid #0175dc; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.bl { |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     bottom: 0; |  | ||||||
|     left: 0; |  | ||||||
|     // border-left: 10px solid #0175dc; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid transparent; |  | ||||||
|     border-left: 0.532vw solid #0175dc; |  | ||||||
|     border-bottom: 0.532vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid transparent; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.br { |  | ||||||
|     bottom: 0; |  | ||||||
|     right: 0; |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     // border-left: 10px solid transparent; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid #0175dc; |  | ||||||
|     border-left: 0.532vw solid transparent; |  | ||||||
|     border-bottom: 0.532vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid #0175dc; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0003, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0003, transparent); |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -25,7 +25,7 @@ import YieldCopilot from "./yield/index.vue"; | |||||||
| // import EfficiencyCopilot from "./efficiency/index.vue"; | // import EfficiencyCopilot from "./efficiency/index.vue"; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "copilotContainer", |   name: "CopilotContainer", | ||||||
|   components: { |   components: { | ||||||
|     CopilotHeaderVue, |     CopilotHeaderVue, | ||||||
|     YieldCopilot, |     YieldCopilot, | ||||||
| @@ -35,7 +35,7 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       page: "产量", |       page: "产量", | ||||||
|       period: "月", |       period: "日", | ||||||
|       than:'同比', |       than:'同比', | ||||||
|       currentsStyles: '', |       currentsStyles: '', | ||||||
|     }; |     }; | ||||||
|   | |||||||
| @@ -36,9 +36,7 @@ export default { | |||||||
|   }, |   }, | ||||||
|   data() { |   data() { | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["瑞昌", "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       xAxis: cities, |       xAxis: cities, | ||||||
|     }; |     }; | ||||||
| @@ -47,11 +45,8 @@ export default { | |||||||
|     legend() { |     legend() { | ||||||
|       let items = []; |       let items = []; | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |       //今天的时间 | ||||||
|       // var day2 = new Date(); |       // var day2 = new Date(); | ||||||
|       // day2.setTime(day2.getTime()); |       // day2.setTime(day2.getTime()); | ||||||
| @@ -63,17 +58,17 @@ export default { | |||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" }, |           { label: `去年${month}月${today}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${dayBeYes}日`, color: "#12f7f1" }, |           { label: `${yesterday}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年本周`, color: "#12f7f1" }, |           { label: `去年本周`, color: "#12f7f1" }, | ||||||
|           { label: `本周`, color: "#58adfa" }, |           { label: `本周`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
| @@ -83,7 +78,7 @@ export default { | |||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |       } else if (this.period === '月' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年${month}月`, color: "#12f7f1" }, |           { label: `去年${month}月`, color: "#12f7f1" }, | ||||||
|           { label: `${month}月`, color: "#58adfa" }, |           { label: `${month}月`, color: "#58adfa" }, | ||||||
|           { label: `${month}月目标`, color: "#58adfa" }, |           { label: `${month}月目标`, color: "#58adfa" }, | ||||||
|           // { label: `${month}月目标`, value: valueTuple[2] }, |           // { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
| @@ -99,7 +94,7 @@ export default { | |||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年`, color: "#12f7f1" }, |           { label: `${year - 1}年`, color: "#12f7f1" }, | ||||||
|           { label: `${year}年`, color: "#58adfa" }, |           { label: `${year}年`, color: "#58adfa" }, | ||||||
|           { label:  `${year}年目标`, color: "#58adfa" }, |           { label:  `${year}年`, color: "#58adfa" }, | ||||||
|  |  | ||||||
|           // { label: `${year}年目标`, value: valueTuple[2] }, |           // { label: `${year}年目标`, value: valueTuple[2] }, | ||||||
|         ]; |         ]; | ||||||
| @@ -166,11 +161,8 @@ function getTemplate(period, dataList, than) { | |||||||
|   // console.log('dataList',dataList); |   // console.log('dataList',dataList); | ||||||
|   let items = []; |   let items = []; | ||||||
|   var day1 = new Date(); |   var day1 = new Date(); | ||||||
|   var day2 = new Date(); |   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|   day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|   var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|   //今天的时间 |   //今天的时间 | ||||||
|   // var day2 = new Date(); |   // var day2 = new Date(); | ||||||
|   // day2.setTime(day2.getTime()); |   // day2.setTime(day2.getTime()); | ||||||
| @@ -183,11 +175,11 @@ function getTemplate(period, dataList, than) { | |||||||
|   if (period === '日' && than === '同比') { |   if (period === '日' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year - 1}年${yesterday}日`, |         name: `去年${month}月${today}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -195,11 +187,11 @@ function getTemplate(period, dataList, than) { | |||||||
|   } else if (period === '日' && than === '环比') { |   } else if (period === '日' && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${dayBeYes}日`, |         name: `${yesterday}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -207,7 +199,7 @@ function getTemplate(period, dataList, than) { | |||||||
|   } else if (period === '周' && than === '同比') { |   } else if (period === '周' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年本周`, |         name: `去年本周`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
| @@ -231,7 +223,7 @@ function getTemplate(period, dataList, than) { | |||||||
|   } else if (period === '月' && than === '同比') { |   } else if (period === '月' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年${month}月`, |         name: `去年${month}月`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|   | |||||||
| @@ -1,15 +1,15 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-10 11:10:54 |  * @Date: 2024-05-10 11:10:54 | ||||||
|  * @LastEditTime: 2024-06-06 10:04:49 |  * @LastEditTime: 2024-05-30 13:23:03 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
|   <div class="chip-rate"> |   <div class="chip-rate"> | ||||||
|     <ChipRateItem :period="period" :than="than" :cities="['邯郸',]" :color="1" /> |     <ChipRateItem :period="period" :than="than" :cities="['成都', '邯郸', '株洲', '瑞昌']" :color="1" /> | ||||||
|     <ChipRateItem :period="period" :than="than" :cities="['瑞昌']" :color="2" /> |     <ChipRateItem :period="period" :than="than" :cities="['佳木斯', '凯盛光伏', '蚌埠兴科']" :color="2" /> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -1,21 +1,21 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-07 10:25:10 |  * @Date: 2024-05-07 10:25:10 | ||||||
|  * @LastEditTime: 2024-06-06 13:55:10 |  * @LastEditTime: 2024-05-30 11:19:51 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
|   <!-- <div class="order"> --> |   <!-- <div class="order"> --> | ||||||
|   <div class="std-rate" style="width: 100%"> |     <div class="std-rate" style="width: 100%; overflow: hidden scroll; height: 400px"> | ||||||
|     <!-- <div class="span-2"> |       <div class="span-2"> | ||||||
|         <StdRateItem :period="period" :city="cities[5]" /> |         <StdRateItem :period="period" :city="cities[5]" /> | ||||||
|       </div> --> |       </div> | ||||||
|     <div class="span-2" v-for="item in cities.filter((val, index) => index != 5)" :key="item.name"> |       <div class="flex-item" v-for="item in cities.filter((val, index) => index != 5)" :key="item.name"> | ||||||
|       <StdRateItem :period="period" :than="than" :city="item" /> |         <StdRateItem :period="period" :than="than" :city="item" /> | ||||||
|  |       </div> | ||||||
|     </div> |     </div> | ||||||
|   </div> |  | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| @@ -33,15 +33,7 @@ export default { | |||||||
|       default: "同比", |       default: "同比", | ||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       // data: null |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   computed: { |   computed: { | ||||||
|     stdData() { |  | ||||||
|       return this.$store.getters.copilot.efficiency.stdRate |  | ||||||
|     }, |  | ||||||
|     cities() { |     cities() { | ||||||
|       console.log('ztl', this.$store.getters.copilot.efficiency.stdRate) |       console.log('ztl', this.$store.getters.copilot.efficiency.stdRate) | ||||||
|       // let getterName = ""; |       // let getterName = ""; | ||||||
| @@ -57,30 +49,30 @@ export default { | |||||||
|       //     break; |       //     break; | ||||||
|       // } |       // } | ||||||
|       const _cities = [ |       const _cities = [ | ||||||
|         { name: "瑞昌", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, |         { name: "瑞昌", target: 0, total: 0, current: 0, componentYield: 0, goodNumber:0,}, | ||||||
|         { name: "邯郸",target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, |         { name: "邯郸", target: 0, total: 0, current: 0, componentYield: 0, goodNumber: 0, }, | ||||||
|         { name: "株洲", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, |         { name: "株洲", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, | ||||||
|         { name: "佳木斯", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, |         { name: "佳木斯", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, | ||||||
|         { name: "成都", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, |         { name: "成都", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, | ||||||
|         { name: "凯盛光伏", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, |         { name: "凯盛光伏", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, | ||||||
|         { name: "蚌埠", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, |         { name: "蚌埠", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, | ||||||
|       ] |       ] | ||||||
|       if (this.stdData?.previous) { |       if (this.$store.getters.copilot?.efficiency.stdRate?.previous) { | ||||||
|         this.stdData?.previous.forEach( |         this.$store.getters.copilot?.efficiency.stdRate?.previous.forEach( | ||||||
|           (v, idx) => { |           (v, idx) => { | ||||||
|             _cities[idx].previous = v ?? 0; |             _cities[idx].previous = v ?? 0; | ||||||
|           } |           } | ||||||
|         ); |         ); | ||||||
|       } |       } | ||||||
|       if (this.stdData?.target) { |       if (this.$store.getters.copilot?.efficiency.stdRate?.target) { | ||||||
|         this.stdData?.target.forEach( |         this.$store.getters.copilot?.efficiency.stdRate?.target.forEach( | ||||||
|           (v, idx) => { |           (v, idx) => { | ||||||
|             _cities[idx].target = v ?? 0; |             _cities[idx].target = v ?? 0; | ||||||
|           } |           } | ||||||
|         ) |         ) | ||||||
|       } |       } | ||||||
|       if (this.stdData?.current) { |       if (this.$store.getters.copilot?.efficiency.stdRate?.current) { | ||||||
|         this.stdData?.current.forEach( |         this.$store.getters.copilot?.efficiency.stdRate?.current.forEach( | ||||||
|           (v, idx) => { |           (v, idx) => { | ||||||
|             _cities[idx].current = v ?? 0; |             _cities[idx].current = v ?? 0; | ||||||
|           } |           } | ||||||
| @@ -88,30 +80,22 @@ export default { | |||||||
|       } |       } | ||||||
|       // 删掉凯盛光伏 |       // 删掉凯盛光伏 | ||||||
|       // _cities.splice(4, 1); |       // _cities.splice(4, 1); | ||||||
|       let arr = [] |       return _cities; | ||||||
|       arr.push(_cities[0]) |  | ||||||
|       arr.push(_cities[1]) |  | ||||||
|       return arr; |  | ||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   watch: { |   data() { | ||||||
|     period() { |     return { | ||||||
|       this.data = this.$store.getters.copilot.efficiency.stdRate |       // cities: [ | ||||||
|     } |       //   { name: "瑞昌", target: 100, total: 200, current: 20 }, | ||||||
|  |       //   { name: "邯郸", target: 200, total: 300, current: 20 }, | ||||||
|  |       //   { name: "株洲", target: 300, total: 400, current: 20 }, | ||||||
|  |       //   { name: "佳木斯", target: 400, total: 500, current: 20 }, | ||||||
|  |       //   { name: "成都", target: 500, total: 600, current: 20 }, | ||||||
|  |       //   { name: "凯盛光伏", target: 400, total: 500, current: 20 }, | ||||||
|  |       //   { name: "蚌埠", target: 500, total: 600, current: 20 }, | ||||||
|  |       // ], | ||||||
|  |     }; | ||||||
|   }, |   }, | ||||||
|   // data() { |  | ||||||
|   //   return { |  | ||||||
|   //     // cities: [ |  | ||||||
|   //     //   { name: "瑞昌", target: 100, total: 200, current: 20 }, |  | ||||||
|   //     //   { name: "邯郸", target: 200, total: 300, current: 20 }, |  | ||||||
|   //     //   { name: "株洲", target: 300, total: 400, current: 20 }, |  | ||||||
|   //     //   { name: "佳木斯", target: 400, total: 500, current: 20 }, |  | ||||||
|   //     //   { name: "成都", target: 500, total: 600, current: 20 }, |  | ||||||
|   //     //   { name: "凯盛光伏", target: 400, total: 500, current: 20 }, |  | ||||||
|   //     //   { name: "蚌埠", target: 500, total: 600, current: 20 }, |  | ||||||
|   //     // ], |  | ||||||
|   //   }; |  | ||||||
|   // }, |  | ||||||
|   methods: {}, |   methods: {}, | ||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
| @@ -119,12 +103,12 @@ export default { | |||||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||||
| .std-rate { | .std-rate { | ||||||
|   display: flex; |   display: flex; | ||||||
|   gap: 16px; |   // gap: 1px; | ||||||
|   // flex: 1 1 auto; |   // flex: 1 1 auto; | ||||||
|   flex-direction: column; |  | ||||||
|   // display: -webkit-box; |   // display: -webkit-box; | ||||||
|   flex-wrap: wrap; |   flex-wrap: wrap; | ||||||
|   // align-items: center; |   align-items: center; | ||||||
|   // grid-template-columns: repeat(2, 1fr); |   // grid-template-columns: repeat(2, 1fr); | ||||||
|   // grid-template-rows: repeat(4, 1fr); |   // grid-template-rows: repeat(4, 1fr); | ||||||
| } | } | ||||||
| @@ -133,7 +117,7 @@ export default { | |||||||
| } | } | ||||||
| .flex-item{ | .flex-item{ | ||||||
|   // flex: 1 1 auto; |   // flex: 1 1 auto; | ||||||
|   // width: 50%; |   width: 50%; | ||||||
| } | } | ||||||
| .span-2 { | .span-2 { | ||||||
|   // flex: 1 1 auto; |   // flex: 1 1 auto; | ||||||
|   | |||||||
| @@ -36,9 +36,7 @@ export default { | |||||||
|   }, |   }, | ||||||
|   data() { |   data() { | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["瑞昌", "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       xAxis: cities, |       xAxis: cities, | ||||||
|     }; |     }; | ||||||
| @@ -47,11 +45,8 @@ export default { | |||||||
|     legend() { |     legend() { | ||||||
|       let items = []; |       let items = []; | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |       //今天的时间 | ||||||
|       // var day2 = new Date(); |       // var day2 = new Date(); | ||||||
|       // day2.setTime(day2.getTime()); |       // day2.setTime(day2.getTime()); | ||||||
| @@ -63,17 +58,17 @@ export default { | |||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" }, |           { label: `去年${month}月${today}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${dayBeYes}日`, color: "#12f7f1" }, |           { label: `${yesterday}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年本周`, color: "#12f7f1" }, |           { label: `去年本周`, color: "#12f7f1" }, | ||||||
|           { label: `本周`, color: "#58adfa" }, |           { label: `本周`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
| @@ -83,7 +78,7 @@ export default { | |||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |       } else if (this.period === '月' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年${month}月`, color: "#12f7f1" }, |           { label: `去年${month}月`, color: "#12f7f1" }, | ||||||
|           { label: `${month}月`, color: "#58adfa" }, |           { label: `${month}月`, color: "#58adfa" }, | ||||||
|           { label: `${month}月目标`, color: "#58adfa" }, |           { label: `${month}月目标`, color: "#58adfa" }, | ||||||
|           // { label: `${month}月目标`, value: valueTuple[2] }, |           // { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
| @@ -99,7 +94,7 @@ export default { | |||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年`, color: "#12f7f1" }, |           { label: `${year - 1}年`, color: "#12f7f1" }, | ||||||
|           { label: `${year}年`, color: "#58adfa" }, |           { label: `${year}年`, color: "#58adfa" }, | ||||||
|           { label: `${year}年目标`, color: "#58adfa" }, |           { label: `${year}年`, color: "#58adfa" }, | ||||||
|  |  | ||||||
|           // { label: `${year}年目标`, value: valueTuple[2] }, |           // { label: `${year}年目标`, value: valueTuple[2] }, | ||||||
|         ]; |         ]; | ||||||
| @@ -157,11 +152,8 @@ function getTemplate(period, dataList,than) { | |||||||
|   // console.log('dataList',dataList); |   // console.log('dataList',dataList); | ||||||
|   let items = []; |   let items = []; | ||||||
|   var day1 = new Date(); |   var day1 = new Date(); | ||||||
|   var day2 = new Date(); |   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|   day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|   var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|   //今天的时间 |   //今天的时间 | ||||||
|   // var day2 = new Date(); |   // var day2 = new Date(); | ||||||
|   // day2.setTime(day2.getTime()); |   // day2.setTime(day2.getTime()); | ||||||
| @@ -174,11 +166,11 @@ function getTemplate(period, dataList,than) { | |||||||
|   if (period === '日' && than === '同比') { |   if (period === '日' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year - 1}年${yesterday}日`, |         name: `去年${month}月${today}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -186,11 +178,11 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '日' && than === '环比') { |   } else if (period === '日' && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${dayBeYes}日`, |         name: `${yesterday}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -198,7 +190,7 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '周' && than === '同比') { |   } else if (period === '周' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年本周`, |         name: `去年本周`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
| @@ -222,7 +214,7 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '月' && than === '同比') { |   } else if (period === '月' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年${month}月`, |         name: `去年${month}月`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-07 13:22:43 |  * @Date: 2024-05-07 13:22:43 | ||||||
|  * @LastEditTime: 2024-06-17 09:22:17 |  * @LastEditTime: 2024-05-29 14:09:08 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -11,7 +11,7 @@ | |||||||
|       <span v-for="(item,index) in legend" :key="index" class="legend-item" |       <span v-for="(item,index) in legend" :key="index" class="legend-item" | ||||||
|         :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span> |         :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span> | ||||||
|     </div> |     </div> | ||||||
|     <div ref="oeeChart" style="height:94%;width:100%"></div> |     <div ref="oeeChart" style="height:96%;width:100%"></div> | ||||||
|   </chart-container> |   </chart-container> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| @@ -22,7 +22,7 @@ import ChartContainer from "../../../../components/ChartContainer.vue"; | |||||||
| import { debounce } from "@/utils/debounce"; | import { debounce } from "@/utils/debounce"; | ||||||
| import * as echarts from "echarts"; | import * as echarts from "echarts"; | ||||||
| export default { | export default { | ||||||
|   name: "barChartBaseoee", |   name: "BarChartBase", | ||||||
|   components: { |   components: { | ||||||
|     ChartContainer, |     ChartContainer, | ||||||
|   }, |   }, | ||||||
| @@ -180,30 +180,30 @@ export default { | |||||||
|             itemStyle: { |             itemStyle: { | ||||||
|               color: "#f3c000", |               color: "#f3c000", | ||||||
|             }, |             }, | ||||||
|             // areaStyle: { |             areaStyle: { | ||||||
|             //   color: { |               color: { | ||||||
|             //     type: "linear", |                 type: "linear", | ||||||
|             //     x: 0, |                 x: 0, | ||||||
|             //     y: 0, |                 y: 0, | ||||||
|             //     x2: 0, |                 x2: 0, | ||||||
|             //     y2: 1, |                 y2: 1, | ||||||
|             //     colorStops: [ |                 colorStops: [ | ||||||
|             //       { |                   { | ||||||
|             //         offset: 0, |                     offset: 0, | ||||||
|             //         color: "#f3c000", // 0% 处的颜色 |                     color: "#f3c000", // 0% 处的颜色 | ||||||
|             //       }, |                   }, | ||||||
|             //       { |                   { | ||||||
|             //         offset: 0.55, |                     offset: 0.55, | ||||||
|             //         color: "#f3c00033", |                     color: "#f3c00033", | ||||||
|             //       }, |                   }, | ||||||
|             //       { |                   { | ||||||
|             //         offset: 1, |                     offset: 1, | ||||||
|             //         color: "transparent", // 100% 处的颜色 |                     color: "transparent", // 100% 处的颜色 | ||||||
|             //       }, |                   }, | ||||||
|             //     ], |                 ], | ||||||
|             //     global: false, // 缺省为 false |                 global: false, // 缺省为 false | ||||||
|             //   }, |               }, | ||||||
|             // }, |             }, | ||||||
|             data: [], // this.series[0].data, |             data: [], // this.series[0].data, | ||||||
|           }, |           }, | ||||||
|         ], |         ], | ||||||
| @@ -221,12 +221,12 @@ export default { | |||||||
|     }, |     }, | ||||||
|     /** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */ |     /** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */ | ||||||
|     isFullscreen(val) { |     isFullscreen(val) { | ||||||
|       // this.actualOptions.series.map((item) => { |       this.actualOptions.series.map((item) => { | ||||||
|       //   item.barWidth = val ? 18 : 12; |         item.barWidth = val ? 18 : 12; | ||||||
|       // }); |       }); | ||||||
|       // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; |       this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | ||||||
|       // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; |       this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | ||||||
|       // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; |       this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | ||||||
|       // if (val === false && this.isOpen === true) { |       // if (val === false && this.isOpen === true) { | ||||||
|       //   console.log(val) |       //   console.log(val) | ||||||
|       //   this.width = 97 + '%' |       //   this.width = 97 + '%' | ||||||
| @@ -268,11 +268,11 @@ export default { | |||||||
|     //     this.isFullscreen = screenfull.isFullscreen; |     //     this.isFullscreen = screenfull.isFullscreen; | ||||||
|     //   }); |     //   }); | ||||||
|     // } |     // } | ||||||
|     if (screenfull.isEnabled) { |     // if (screenfull.isEnabled) { | ||||||
|       screenfull.on("change", () => { |     //   screenfull.on("change", () => { | ||||||
|         this.isFullscreen = screenfull.isFullscreen; |     //     this.isFullscreen = screenfull.isFullscreen; | ||||||
|       }); |     //   }); | ||||||
|     } |     // } | ||||||
|     this.actualOptions = this.options |     this.actualOptions = this.options | ||||||
|     this.canvasReset(); |     this.canvasReset(); | ||||||
|     window.addEventListener("resize", this.canvasReset); |     window.addEventListener("resize", this.canvasReset); | ||||||
| @@ -303,7 +303,6 @@ export default { | |||||||
| </script> | </script> | ||||||
|  |  | ||||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||||
|  |  | ||||||
| .bar-chart-base { | .bar-chart-base { | ||||||
|   // position: relative; |   // position: relative; | ||||||
|  |  | ||||||
| @@ -328,9 +327,6 @@ export default { | |||||||
|       margin-right: 0.22vw; |       margin-right: 0.22vw; | ||||||
|     } |     } | ||||||
|   } |   } | ||||||
|      .legend-item:nth-child(3) { |  | ||||||
|        margin-left: 1vw; |  | ||||||
|      } |  | ||||||
|  .legend-item:nth-child(3):before { |  .legend-item:nth-child(3):before { | ||||||
|    // width: 12px; |    // width: 12px; | ||||||
|    // height: 2px; |    // height: 2px; | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-23 15:50:44 |  * @Date: 2024-05-23 15:50:44 | ||||||
|  * @LastEditTime: 2024-06-17 09:23:39 |  * @LastEditTime: 2024-05-29 14:25:10 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -11,7 +11,7 @@ | |||||||
|       <span v-for="(item,index) in legend" :key="index" class="legend-item" |       <span v-for="(item,index) in legend" :key="index" class="legend-item" | ||||||
|         :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span> |         :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span> | ||||||
|     </div> |     </div> | ||||||
|     <div ref="oeeChart" style="height:94%;width:100%"></div> |     <div ref="oeeChart" style="height:96%;width:100%"></div> | ||||||
|   </chart-container> |   </chart-container> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| @@ -22,7 +22,7 @@ import ChartContainer from "../../../../components/ChartContainer.vue"; | |||||||
| import { debounce } from "@/utils/debounce"; | import { debounce } from "@/utils/debounce"; | ||||||
| import * as echarts from "echarts"; | import * as echarts from "echarts"; | ||||||
| export default { | export default { | ||||||
|   name: "barChartBaseoee", |   name: "BarChartBase", | ||||||
|   components: { |   components: { | ||||||
|     ChartContainer, |     ChartContainer, | ||||||
|   }, |   }, | ||||||
| @@ -180,30 +180,30 @@ export default { | |||||||
|             itemStyle: { |             itemStyle: { | ||||||
|               color: "#f3c000", |               color: "#f3c000", | ||||||
|             }, |             }, | ||||||
|             // areaStyle: { |             areaStyle: { | ||||||
|             //   color: { |               color: { | ||||||
|             //     type: "linear", |                 type: "linear", | ||||||
|             //     x: 0, |                 x: 0, | ||||||
|             //     y: 0, |                 y: 0, | ||||||
|             //     x2: 0, |                 x2: 0, | ||||||
|             //     y2: 1, |                 y2: 1, | ||||||
|             //     colorStops: [ |                 colorStops: [ | ||||||
|             //       { |                   { | ||||||
|             //         offset: 0, |                     offset: 0, | ||||||
|             //         color: "#f3c000", // 0% 处的颜色 |                     color: "#f3c000", // 0% 处的颜色 | ||||||
|             //       }, |                   }, | ||||||
|             //       { |                   { | ||||||
|             //         offset: 0.55, |                     offset: 0.55, | ||||||
|             //         color: "#f3c00033", |                     color: "#f3c00033", | ||||||
|             //       }, |                   }, | ||||||
|             //       { |                   { | ||||||
|             //         offset: 1, |                     offset: 1, | ||||||
|             //         color: "transparent", // 100% 处的颜色 |                     color: "transparent", // 100% 处的颜色 | ||||||
|             //       }, |                   }, | ||||||
|             //     ], |                 ], | ||||||
|             //     global: false, // 缺省为 false |                 global: false, // 缺省为 false | ||||||
|             //   }, |               }, | ||||||
|             // }, |             }, | ||||||
|             data: [], // this.series[0].data, |             data: [], // this.series[0].data, | ||||||
|           }, |           }, | ||||||
|         ], |         ], | ||||||
| @@ -221,12 +221,12 @@ export default { | |||||||
|     }, |     }, | ||||||
|     /** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */ |     /** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */ | ||||||
|     isFullscreen(val) { |     isFullscreen(val) { | ||||||
|       // this.actualOptions.series.map((item) => { |       this.actualOptions.series.map((item) => { | ||||||
|       //   item.barWidth = val ? 18 : 12; |         item.barWidth = val ? 18 : 12; | ||||||
|       // }); |       }); | ||||||
|       // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; |       this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | ||||||
|       // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; |       this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | ||||||
|       // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; |       this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | ||||||
|       // if (val === false && this.isOpen === true) { |       // if (val === false && this.isOpen === true) { | ||||||
|       //   console.log(val) |       //   console.log(val) | ||||||
|       //   this.width = 97 + '%' |       //   this.width = 97 + '%' | ||||||
| @@ -242,7 +242,7 @@ export default { | |||||||
|       // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; |       // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | ||||||
|       // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; |       // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | ||||||
|       this.initChart(this.actualOptions) |       this.initChart(this.actualOptions) | ||||||
|       this.canvasReset() |       // this.canvasReset() | ||||||
|     }, |     }, | ||||||
|     series(val) { |     series(val) { | ||||||
|       if (!val) { |       if (!val) { | ||||||
| @@ -267,11 +267,11 @@ export default { | |||||||
|     //     this.isFullscreen = screenfull.isFullscreen; |     //     this.isFullscreen = screenfull.isFullscreen; | ||||||
|     //   }); |     //   }); | ||||||
|     // } |     // } | ||||||
|     if (screenfull.isEnabled) { |     // if (screenfull.isEnabled) { | ||||||
|       screenfull.on("change", () => { |     //   screenfull.on("change", () => { | ||||||
|         this.isFullscreen = screenfull.isFullscreen; |     //     this.isFullscreen = screenfull.isFullscreen; | ||||||
|       }); |     //   }); | ||||||
|     } |     // } | ||||||
|     this.actualOptions = this.options |     this.actualOptions = this.options | ||||||
|     this.canvasReset(); |     this.canvasReset(); | ||||||
|     window.addEventListener("resize", this.canvasReset); |     window.addEventListener("resize", this.canvasReset); | ||||||
| @@ -302,7 +302,6 @@ export default { | |||||||
| </script> | </script> | ||||||
|  |  | ||||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||||
|  |  | ||||||
| .bar-chart-base { | .bar-chart-base { | ||||||
|   // position: relative; |   // position: relative; | ||||||
|  |  | ||||||
| @@ -327,9 +326,7 @@ export default { | |||||||
|       margin-right: 0.22vw; |       margin-right: 0.22vw; | ||||||
|     } |     } | ||||||
|   } |   } | ||||||
|  .legend-item:nth-child(3) { |  | ||||||
|    margin-left: 1vw; |  | ||||||
|  } |  | ||||||
|   .legend-item:nth-child(1):before { |   .legend-item:nth-child(1):before { | ||||||
|     background-color: #12f7f1; |     background-color: #12f7f1; | ||||||
|   } |   } | ||||||
|   | |||||||
| @@ -13,11 +13,10 @@ | |||||||
|     <!-- <div style="flex:1;padding: 0 20%;"> --> |     <!-- <div style="flex:1;padding: 0 20%;"> --> | ||||||
|     <div class="chart" ref="chart"></div> |     <div class="chart" ref="chart"></div> | ||||||
|     <!-- </div> --> |     <!-- </div> --> | ||||||
|     <div class="legend"> |     <div class="legend" > | ||||||
|       <div class="legend-item" v-for="lgd in legend" :key="lgd.label"> |       <div class="legend-item" v-for="lgd in legend" :key="lgd.label"> | ||||||
|         <span class="legend-item__label">{{ lgd.label }}</span> |  | ||||||
|         <span class="legend-item__value">{{ lgd.value }}</span> |         <span class="legend-item__value">{{ lgd.value }}</span> | ||||||
|  |         <span class="legend-item__label">{{ lgd.label }}</span> | ||||||
|       </div> |       </div> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
| @@ -80,81 +79,27 @@ export default { | |||||||
|       ]; |       ]; | ||||||
|     }, |     }, | ||||||
|     options() { |     options() { | ||||||
|       // const single = this.period === "日" || this.period === "周"; |       const single = this.period === "日" || this.period === "周"; | ||||||
|       const today = new Date().getDate(); |  | ||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       const month = new Date().getMonth() + 1; |       const month = new Date().getMonth() + 1; | ||||||
|       const vt = this.valueTuple; |       const vt = this.valueTuple; | ||||||
|       let items = []; |       let titleValue = single | ||||||
|       var day1 = new Date(); |           ? (vt[1] != null && `${vt[1] * 100}%`) || "0%" | ||||||
|       var day2 = new Date(); |           : vt[0] != null && vt[2] != null && vt[2] !== 0 | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |           ? `${((vt[1] / vt[2]) * 100).toFixed(0)}%` | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |           : "0%", | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |  | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |  | ||||||
|       // var day2 = new Date(); |  | ||||||
|       // day2.setTime(day2.getTime()); |  | ||||||
|       // var s2 = (day2.getMonth() + 1) + "月" + day2.getDate() + '日'; |  | ||||||
|       // const today = new Date().getDate(); |  | ||||||
|       // let yesterday = new Date().getDate() -1; |  | ||||||
|       // const month = new Date().getMonth() + 1; |  | ||||||
|       const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1; |  | ||||||
|       // const year = new Date().getFullYear(); |  | ||||||
|       if (this.period === '日' && this.than === '同比') { |  | ||||||
|         items = [ |  | ||||||
|           { label: `${yesterday}日良率`, }, |  | ||||||
|           { label: `${year - 1}年${yesterday}日良率` }, |  | ||||||
|         ]; |  | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |  | ||||||
|         items = [ |  | ||||||
|           { label: `${yesterday}日良率` }, |  | ||||||
|           { label: `${dayBeYes}日良率` }, |  | ||||||
|         ]; |  | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |  | ||||||
|         items = [ |  | ||||||
|           { label: `本周良率`, }, |  | ||||||
|           { label: `${year-1}年本周良率` }, |  | ||||||
|         ]; |  | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |  | ||||||
|         items = [ |  | ||||||
|           { label: `本周良率`, }, |  | ||||||
|           { label: `上周良率`, }, |  | ||||||
|         ]; |  | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |  | ||||||
|         items = [ |  | ||||||
|           { label: `${month}月良率`, }, |  | ||||||
|           { label: `${year-1}年${month}月良率`, }, |  | ||||||
|           { label: `${month}月目标良率`, }, |  | ||||||
|         ]; |  | ||||||
|       } else if (this.period === '月' && this.than === '环比') { |  | ||||||
|         items = [ |  | ||||||
|           { label: `${month}月良率`, }, |  | ||||||
|           { label: `${lastMonth}月良率`, }, |  | ||||||
|           { label: `${month}月目标良率`, }, |  | ||||||
|         ]; |  | ||||||
|       } else { |  | ||||||
|         items = [ |  | ||||||
|           { label: `${year}年良率`, }, |  | ||||||
|           { label: `${year - 1}年良率` }, |  | ||||||
|           { label: `${year}年目标良率` }, |  | ||||||
|         ]; |  | ||||||
|       } |  | ||||||
|       let titleValue = vt[1] === null ? 0 + '%' : this.formatNumber(vt[1]) + '%', |  | ||||||
|         subtitle = { |         subtitle = { | ||||||
|           日: "昨日良率", |           日: "本日良率", | ||||||
|           周: "本周良率", |           周: "本周良率", | ||||||
|           月: `${month}月良率`, |           月: `${month}月良率`, | ||||||
|           年: `${year}良率`, |           年: `${year}良率`, | ||||||
|         }[this.period]; |         }[this.period]; | ||||||
|       console.log(vt[1]); |  | ||||||
|       const t = getOptions({ |       const t = getOptions({ | ||||||
|         // single, |         single, | ||||||
|         color: this.color == 1 ? "#4CF0E8" : "#1065ff", |         color: this.color == 1 ? "#4CF0E8" : "#1065ff", | ||||||
|         titleValue, |         titleValue, | ||||||
|         subtitle, |         subtitle, | ||||||
|         currentName: items[0].label, |  | ||||||
|         preName: items[1].label, |  | ||||||
|         previousSum: vt[0], |         previousSum: vt[0], | ||||||
|         currentSum: vt[1], |         currentSum: vt[1], | ||||||
|         targetSum: vt[2], |         targetSum: vt[2], | ||||||
| @@ -164,11 +109,8 @@ export default { | |||||||
|     legend() { |     legend() { | ||||||
|       let items = []; |       let items = []; | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |       //今天的时间 | ||||||
|       // var day2 = new Date(); |       // var day2 = new Date(); | ||||||
|       // day2.setTime(day2.getTime()); |       // day2.setTime(day2.getTime()); | ||||||
| @@ -180,45 +122,41 @@ export default { | |||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年${yesterday}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0]) ) + "%" }, |           { label: `${month}月${today}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.valueTuple[1]) + "%" }, | ||||||
|           { label: `${yesterday}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, |           { label: `去年${month}月${today}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.valueTuple[0]) + "%" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${dayBeYes}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, |           { label: `${month}月${today}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.valueTuple[1]) + "%" }, | ||||||
|           { label: `${yesterday}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, |           { label: `${yesterday}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.valueTuple[0]) + "%" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年本周良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, |           { label: `本周良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.valueTuple[1]) + "%" }, | ||||||
|           { label: `本周良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, |           { label: `去年本周良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.valueTuple[0]) + "%" }, | ||||||
|  |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `上周良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, |           { label: `本周良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.valueTuple[1]) + "%" }, | ||||||
|           { label: `本周良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, |           { label: `上周良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.valueTuple[0]) + "%" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |       } else if (this.period === '月' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年${month}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, |           { label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.valueTuple[1]) + "%" }, | ||||||
|           { label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, |           { label: `去年${month}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.valueTuple[0]) + "%" }, | ||||||
|  |           { label: `${month}月目标良率`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.valueTuple[2]) + "%" }, | ||||||
|           { label: `${month}月目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '环比') { |       } else if (this.period === '月' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${lastMonth}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, |           { label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.valueTuple[1]) + "%" }, | ||||||
|           { label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, |           { label: `${lastMonth}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.valueTuple[0]) + "%" }, | ||||||
|  |           { label: `${month}月目标良率`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.valueTuple[2]) + "%" }, | ||||||
|           { label: `${month}月目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else { |       } else { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, |           { label: `${year}年良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.valueTuple[1]) + "%" }, | ||||||
|           { label: `${year}年良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, |           { label: `${year - 1}年良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null  ? 0 + "%" : (this.valueTuple[0]) + "%" }, | ||||||
|  |           { label: `${year}年目标良率`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.valueTuple[2]) + "%" }, | ||||||
|           { label: `${year}年目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" }, |  | ||||||
|         ]; |         ]; | ||||||
|       } |       } | ||||||
|       return items |       return items | ||||||
| @@ -253,16 +191,6 @@ export default { | |||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   methods: { |   methods: { | ||||||
|     formatNumber(num) { |  | ||||||
|       console.log(num); |  | ||||||
|       // 判断是否为整数 |  | ||||||
|       if (Number.isInteger(num)) { |  | ||||||
|         return num; // 如果是整数,直接转换为字符串 |  | ||||||
|       } else { |  | ||||||
|         // 如果不是整数,保留两位小数并转换为字符串 |  | ||||||
|         return num.toFixed(2); |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     handleCityUpdate(id) { |     handleCityUpdate(id) { | ||||||
|       this.factoryId = id; |       this.factoryId = id; | ||||||
|     }, |     }, | ||||||
| @@ -278,8 +206,7 @@ export default { | |||||||
|     display: flex; |     display: flex; | ||||||
|     flex-direction: column; |     flex-direction: column; | ||||||
|     align-items: center; |     align-items: center; | ||||||
|     // padding: 0 3px; |     justify-content: center; | ||||||
|     // justify-content: center; |  | ||||||
|     gap: 3px; |     gap: 3px; | ||||||
|     backdrop-filter: blur(24px); |     backdrop-filter: blur(24px); | ||||||
|   .cities { |   .cities { | ||||||
| @@ -289,34 +216,29 @@ export default { | |||||||
|     .chart { |     .chart { | ||||||
|       // margin-left: 5%; |       // margin-left: 5%; | ||||||
|       // width: 290px; |       // width: 290px; | ||||||
|       flex: 1 1 auto; |  | ||||||
|       padding: 0 20%; |  | ||||||
|       /* margin: 10%; */ |  | ||||||
|       height: 16vh; |  | ||||||
|       /* min-width: 300px; */ |  | ||||||
|       align-self: stretch; |       align-self: stretch; | ||||||
|  |       // flex: 1 1 auto; | ||||||
|  |     // align-items: center; | ||||||
|  |       // margin:0 auto; | ||||||
|  |       // padding: 0 10%;; | ||||||
|  |       /* margin: 10%; */ | ||||||
|  |       /* min-width: 300px; */ | ||||||
|  |       height: 200px; | ||||||
|     } |     } | ||||||
|   .legend { |   .legend { | ||||||
|     height: 80px; |     height: 80px; | ||||||
|     display: flex; |     display: flex; | ||||||
|     color: #fff; |     gap: 40px; | ||||||
|     justify-content: flex-end; |     justify-content: space-around; | ||||||
|     gap:20px; |  | ||||||
|     // justify-content: space-between; |  | ||||||
|   } |   } | ||||||
|   // .legend:nth-child(3){ |  | ||||||
|   //   margin-left: 30px; |  | ||||||
|   // } |  | ||||||
|   .legend-item { |   .legend-item { | ||||||
|     margin-left: 15px; |  | ||||||
|     display: flex; |     display: flex; | ||||||
|     flex-direction: column; |     flex-direction: column; | ||||||
|     // align-items: center; |     align-items: center; | ||||||
|     align-items: flex-start; |  | ||||||
|     gap: 3px; |     gap: 3px; | ||||||
|  |  | ||||||
|     &:first-child { |     &:first-child { | ||||||
|       // margin-left: 5px; |  | ||||||
|       .legend-item__value { |       .legend-item__value { | ||||||
|         color: #0e61f5; |         color: #0e61f5; | ||||||
|       } |       } | ||||||
| @@ -328,40 +250,7 @@ export default { | |||||||
|       } |       } | ||||||
|     } |     } | ||||||
|   } |   } | ||||||
| .legend-item__label { |  | ||||||
|   position: relative; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .legend-item__label::before { |  | ||||||
|   content: ""; |  | ||||||
|   position: absolute; |  | ||||||
|   width: 12px; |  | ||||||
|   height: 12px; |  | ||||||
|   background: #ccc; |  | ||||||
|   border-radius: 2px; |  | ||||||
|   top: 6px; |  | ||||||
|   left: -18px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .legend-item:nth-child(2) .legend-item__label::before { |  | ||||||
|   background: #12fff5; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .legend-item:nth-child(2) .legend-item__value { |  | ||||||
|   color: #12fff5; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .legend-item:nth-child(1) .legend-item__label::before { |  | ||||||
|   background: #0f65ff; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .legend-item:nth-child(1) .legend-item__value { |  | ||||||
|   color: #0f65ff; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .legend-item:nth-child(3) .legend-item__label::before { |  | ||||||
|   background: #003982; |  | ||||||
| } |  | ||||||
|   .legend-item__value { |   .legend-item__value { | ||||||
|     font-size: 24px; |     font-size: 24px; | ||||||
|     font-weight: 600; |     font-weight: 600; | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|     filename: DoubleRingChart.vue |     filename: DoubleRingChart.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-17 11:01:55 |     date: 2024-04-17 11:01:55 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -132,19 +132,19 @@ function calculateItems(period, valueTuple) { | |||||||
|     case "日": |     case "日": | ||||||
|       items = [ |       items = [ | ||||||
|         { label: `${month}月${today}日累计`, value: valueTuple[1] }, |         { label: `${month}月${today}日累计`, value: valueTuple[1] }, | ||||||
|         { label: `${year-1}年${month}月${today}日累计`, value: valueTuple[0] }, |         { label: `去年${month}月${today}日累计`, value: valueTuple[0] }, | ||||||
|       ]; |       ]; | ||||||
|       break; |       break; | ||||||
|     case "周": |     case "周": | ||||||
|       items = [ |       items = [ | ||||||
|         { label: `本周累计`, value: valueTuple[1] }, |         { label: `本周累计`, value: valueTuple[1] }, | ||||||
|         { label: `${year-1}年本周累计`, value: valueTuple[0] }, |         { label: `去年本周累计`, value: valueTuple[0] }, | ||||||
|       ]; |       ]; | ||||||
|       break; |       break; | ||||||
|     case "月": |     case "月": | ||||||
|       items = [ |       items = [ | ||||||
|         { label: `${month}月累计`, value: valueTuple[1] }, |         { label: `${month}月累计`, value: valueTuple[1] }, | ||||||
|         { label: `${year-1}年${month}月累计`, value: valueTuple[0] }, |         { label: `去年${month}月累计`, value: valueTuple[0] }, | ||||||
|         { label: `${month}月目标`, value: valueTuple[2] }, |         { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
|       ]; |       ]; | ||||||
|       break; |       break; | ||||||
|   | |||||||
| @@ -6,7 +6,7 @@ | |||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
|   <div class="progress-bar" :data-title="title" :data-rate="current + '%'"> |   <div class="progress-bar" :data-title="title" :data-rate="value + '%'"> | ||||||
|     <div class="progress-bar__rate" :style="{ width: dataRate == '-' ? 0 : dataRate }"></div> |     <div class="progress-bar__rate" :style="{ width: dataRate == '-' ? 0 : dataRate }"></div> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
| @@ -20,18 +20,6 @@ export default { | |||||||
|       type: Number, |       type: Number, | ||||||
|       default: 0, |       default: 0, | ||||||
|     }, |     }, | ||||||
|     target: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 0, |  | ||||||
|     }, |  | ||||||
|     previous: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 0, |  | ||||||
|     }, |  | ||||||
|     current: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 0, |  | ||||||
|     }, |  | ||||||
|     // total: { |     // total: { | ||||||
|     //   type: Number, |     //   type: Number, | ||||||
|     //   default: 0, |     //   default: 0, | ||||||
| @@ -46,16 +34,11 @@ export default { | |||||||
|   }, |   }, | ||||||
|   computed: { |   computed: { | ||||||
|     dataRate() { |     dataRate() { | ||||||
|       // if (this.current != 0 && this.target != 0) { |       return this.value == 0 | ||||||
|         console.log( '1111111111', this.current, this.target); |         ? "-" | ||||||
|       return this.current == 0 && this.target == 0 |         : this.value > 1 | ||||||
|           ? 0 |           ?  100 + '%' | ||||||
|         : this.current != 0 && this.target != 0 |           : `${(parseFloat(this.value)).toFixed(0)}%`; | ||||||
|           ? `${((this.current / this.target) * 100).toFixed(2)}%` |  | ||||||
|           : this.current != 0 && this.target == 0 && this.current >= 100 ? 100 + '%' : this.current != 0 && this.target == 0 && this.current < 100 ? this.current + '%' : this.previous >=100 ? 100 + '%' : this.previous + '%'; |  | ||||||
|       // } else if(this.previous != 0) { |  | ||||||
|       //   return this.previous + '%' |  | ||||||
|       // } |  | ||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   methods: {}, |   methods: {}, | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-07 10:25:10 |  * @Date: 2024-05-07 10:25:10 | ||||||
|  * @LastEditTime: 2024-06-14 09:58:01 |  * @LastEditTime: 2024-05-29 17:03:00 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -10,31 +10,31 @@ | |||||||
|   <div v-if="period == '日'" class="std-rate-item"> |   <div v-if="period == '日'" class="std-rate-item"> | ||||||
|     <CityName :value="city.name" /> |     <CityName :value="city.name" /> | ||||||
|     <div class="std-rate-item__value"> |     <div class="std-rate-item__value"> | ||||||
|       <ProgressBar :period="period" :title="title" :target="city.target" :current="city.current" /> |       <ProgressBar :period="period" :title="title" :value="city.current" /> | ||||||
|       <ProgressBar :period="period" :title="titlePre" :previous="city.previous" /> |       <ProgressBar :period="period" :title="titlePre" :value="city.previous" /> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|   <div v-else-if="period == '周'" class="std-rate-item"> |   <div v-else-if="period == '周'" class="std-rate-item"> | ||||||
|     <CityName :value="city.name" /> |     <CityName :value="city.name" /> | ||||||
|     <div class="std-rate-item__value"> |     <div class="std-rate-item__value"> | ||||||
|       <ProgressBar :period="period" :title="title" :target="city.target" :current="city.current" /> |       <ProgressBar :period="period" :title="title" :value="city.current" /> | ||||||
|       <ProgressBar :period="period" :title="titlePre" :previous="city.previous" /> |       <ProgressBar :period="period" :title="titlePre" :value="city.previous" /> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|   <div v-else-if="period == '月'" class="std-rate-item"> |   <div v-else-if="period == '月'" class="std-rate-item"> | ||||||
|     <CityName :value="city.name" /> |     <CityName :value="city.name" /> | ||||||
|     <div class="std-rate-item__value"> |     <div class="std-rate-item__value"> | ||||||
|       <ProgressBar :period="period" :title="titleTarget" :target="city.target" :current="city.current" /> |       <ProgressBar :period="period" :title="titleTarget" :value="city.target" /> | ||||||
|       <ProgressBar :period="period" :title="titlePre" :previous="city.previous" /> |       <ProgressBar :period="period" :title="titlePre" :value="city.previous" /> | ||||||
|       <!-- <ProgressBar :period="period" :title="title" :value="city.current" /> --> |       <ProgressBar :period="period" :title="title" :value="city.current" /> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|   <div v-else="period == '年'" class="std-rate-item"> |   <div v-else="period == '年'" class="std-rate-item"> | ||||||
|     <CityName :value="city.name" /> |     <CityName :value="city.name" /> | ||||||
|     <div class="std-rate-item__value"> |     <div class="std-rate-item__value"> | ||||||
|       <ProgressBar :period="period" :title="titleTarget" :target="city.target" :current="city.current" /> |       <ProgressBar :period="period" :title="titleTarget" :value="city.target" /> | ||||||
|       <ProgressBar :period="period" :title="titlePre" :previous="city.previous" /> |       <ProgressBar :period="period" :title="titlePre" :value="city.previous" /> | ||||||
|       <!-- <ProgressBar :period="period" :title="title" :value="city.current" /> --> |       <ProgressBar :period="period" :title="title" :value="city.current" /> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
| @@ -69,25 +69,22 @@ export default { | |||||||
|     titlePre() { |     titlePre() { | ||||||
|       console.log(this.city); |       console.log(this.city); | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       const today = new Date().getDate(); |       const today = new Date().getDate(); | ||||||
|       const month = new Date().getMonth() + 1; |       const month = new Date().getMonth() + 1; | ||||||
|       const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1; |       const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1; | ||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         return `${year - 1}年${yesterday}日` |         return `去年${month}月${today}日` | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         return `${dayBeYes}日` |         return `${yesterday}日` | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         return `${year-1}年本周` |         return `去年本周` | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
|         return `上周` |         return `上周` | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |       } else if (this.period === '月' && this.than === '同比') { | ||||||
|         return `${year-1}年${month}月` |         return `去年${month}月` | ||||||
|       } else if (this.period === '月' && this.than === '环比') { |       } else if (this.period === '月' && this.than === '环比') { | ||||||
|         return `${lastMonth}月` |         return `${lastMonth}月` | ||||||
|       } else { |       } else { | ||||||
| @@ -96,18 +93,14 @@ export default { | |||||||
|     }, |     }, | ||||||
|     title() { |     title() { | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |  | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       const today = new Date().getDate(); |       const today = new Date().getDate(); | ||||||
|       const month = new Date().getMonth() + 1; |       const month = new Date().getMonth() + 1; | ||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         return `${yesterday}日` |         return `${month}月${today}日` | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         return `${yesterday}日` |         return `${month}月${today}日` | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         return `本周` |         return `本周` | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
| @@ -127,13 +120,9 @@ export default { | |||||||
|       const month = new Date().getMonth() + 1; |       const month = new Date().getMonth() + 1; | ||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '月') { |       if (this.period === '月') { | ||||||
|         return `${month}月目标${this.city.target}%` |         return `${month}月目标` | ||||||
|       } else if (this.period === '年') { |       } else if (this.period === '年') { | ||||||
|         return `${year}年目标${this.city.target}%` |         return `${year}年目标` | ||||||
|       } else if (this.period === '周') { |  | ||||||
|         return `本周目标${this.city.target}%` |  | ||||||
|       } else if (this.period === '日') { |  | ||||||
|         return `${month}月${today}日目标${this.city.target}%` |  | ||||||
|       } |       } | ||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   | |||||||
| @@ -1,47 +1,39 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-07 10:04:53 |  * @Date: 2024-05-07 10:04:53 | ||||||
|  * @LastEditTime: 2024-06-05 09:45:47 |  * @LastEditTime: 2024-05-30 11:13:01 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
|   <div class="efficiency-copilot"> |   <div class="efficiency-copilot"> | ||||||
|     <section class="top flex"> |     <Container title="芯片良率" icon="chip2"> | ||||||
|       <Container title="芯片良率" icon="chip2"> |       <ChipRate :period="period" :than="than" /> | ||||||
|         <ChipRate :period="period" :than="than" /> |     </Container> | ||||||
|       </Container> |     <Container title="标准组件良率" icon="std"> | ||||||
|       <left-container title="标准组件良率" icon="std"> |       <StdRate :period="period" :than="than" /> | ||||||
|         <StdRate :period="period" :than="than" /> |     </Container> | ||||||
|       </left-container> |     <Container title="芯片OEE" icon="chip"> | ||||||
|     </section> |       <ChipOee :chipOeeRate="chipOeeRate" :period="period" :than="than" /> | ||||||
|     <section class="bottom flex"> |     </Container> | ||||||
|       <Container title="芯片OEE" icon="chip"> |     <Container title="转化效率" icon="cube"> | ||||||
|         <ChipOee :chipOeeRate="chipOeeRate" :period="period" :than="than" /> |       <TransformRate :transformRate="transformRate" :period="period" :than="than" /> | ||||||
|       </Container> |     </Container> | ||||||
|       <left-container title="转化效率" icon="cube"> |  | ||||||
|         <TransformRate :transformRate="transformRate" :period="period" :than="than" /> |  | ||||||
|       </left-container> |  | ||||||
|     </section> |  | ||||||
|  |  | ||||||
|  |  | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import Container from "@/views/copilot/components/rightContainer.vue"; | import Container from "@/views/copilot/components/Container.vue"; | ||||||
| import leftContainer from "@/views/copilot/components/leftContainer.vue"; |  | ||||||
| import ChipOeeVue from "./components/ChipOee.vue"; | import ChipOeeVue from "./components/ChipOee.vue"; | ||||||
| import ChipRateVue from "./components/ChipRate.vue"; | import ChipRateVue from "./components/ChipRate.vue"; | ||||||
| import StdRateVue from "./components/StdRate.vue"; | import StdRateVue from "./components/StdRate.vue"; | ||||||
| import TransformRateVue from "./components/TransformRate.vue"; | import TransformRateVue from "./components/TransformRate.vue"; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "efficiencyCopilot", |   name: "EfficiencyCopilot", | ||||||
|   components: { |   components: { | ||||||
|     Container, |     Container, | ||||||
|     leftContainer, |  | ||||||
|     ChipOee: ChipOeeVue, |     ChipOee: ChipOeeVue, | ||||||
|     ChipRate: ChipRateVue, |     ChipRate: ChipRateVue, | ||||||
|     StdRate: StdRateVue, |     StdRate: StdRateVue, | ||||||
| @@ -96,30 +88,7 @@ export default { | |||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
|  |  | ||||||
|  |  | ||||||
| <style scoped> | <style scoped> | ||||||
| .efficiency-copilot { |  | ||||||
|   flex: 1; |  | ||||||
|   display: flex; |  | ||||||
|   flex-direction: column; |  | ||||||
|   gap: 16px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .flex { |  | ||||||
|   display: flex; |  | ||||||
|   gap: 16px; |  | ||||||
|   flex: 1; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .top > div, |  | ||||||
| .bottom > div { |  | ||||||
|   height: 100%; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| </style> |  | ||||||
|  |  | ||||||
| <!-- <style scoped> |  | ||||||
|  |  | ||||||
| .efficiency-copilot { | .efficiency-copilot { | ||||||
|   flex: 1; |   flex: 1; | ||||||
|   display: grid; |   display: grid; | ||||||
| @@ -131,4 +100,4 @@ export default { | |||||||
| .efficiency-copilot > div { | .efficiency-copilot > div { | ||||||
|   height: 100%; |   height: 100%; | ||||||
| } | } | ||||||
| </style> --> | </style> | ||||||
|   | |||||||
| @@ -1,142 +1,163 @@ | |||||||
| export default ({ | export default function ({ | ||||||
|  |   single = false, | ||||||
|  |   color, | ||||||
|   titleValue, |   titleValue, | ||||||
|   subtitle, |   subtitle, | ||||||
|   previousSum, |   previousSum, | ||||||
|   currentSum, |   currentSum, | ||||||
|   targetSum, |   targetSum, | ||||||
|   currentName, | }) { | ||||||
|   preName, |   return { | ||||||
| }) => ({ |     grid: { | ||||||
|   grid: { |       left: 0, | ||||||
|     left: 300, |       right: 0, | ||||||
|     right: 0, |       bottom: 0, | ||||||
|     bottom: 0, |       top: 0, | ||||||
|     top: 0, |       containLabel: true, | ||||||
|     containLabel: true, |  | ||||||
|   }, |  | ||||||
|   tooltip: {}, |  | ||||||
|   title: { |  | ||||||
|     text: titleValue, |  | ||||||
|     left: "48%", |  | ||||||
|     top: "37%", |  | ||||||
|     textAlign: "center", |  | ||||||
|     textStyle: { |  | ||||||
|       fontWeight: 600, |  | ||||||
|       fontSize: 26, |  | ||||||
|       color: "#fffd", |  | ||||||
|     }, |     }, | ||||||
|     subtext: `\u2002${subtitle}\u2002`, |     tooltip: { | ||||||
|     subtextStyle: { |       // formatter(params) { | ||||||
|       fontSize: 14, |       //   return `${params.name}: ${(params.value * 100).toFixed(0)}%`; | ||||||
|       fontWeight: 100, |       // } | ||||||
|       color: "#fffd", |  | ||||||
|       align: "right", |  | ||||||
|     }, |     }, | ||||||
|   }, |     title: { | ||||||
|   series: [ |       text: titleValue, | ||||||
|     // 背景 series |       left: "49%", | ||||||
|     { |       top: "39%", | ||||||
|       type: "pie", |       textAlign: "center", | ||||||
|       name: "当前良率", |       textStyle: { | ||||||
|       radius: ["70%", "85%"], |         fontWeight: 600, | ||||||
|       center: ["50%", "52%"], |         fontSize: 32, | ||||||
|       emptyCircleStyle: { |         color: "#fffd", | ||||||
|         color: "#003982", |       }, | ||||||
|  |       subtext: `\u2002${subtitle}\u2002`, | ||||||
|  |       subtextStyle: { | ||||||
|  |         fontSize: 14, | ||||||
|  |         fontWeight: 100, | ||||||
|  |         color: "#fffd", | ||||||
|  |         align: "right", | ||||||
|       }, |       }, | ||||||
|     }, |     }, | ||||||
|     // 数据 series |     series: [ | ||||||
|     { |       // 背景 series | ||||||
|       type: "pie", |       { | ||||||
|       radius: ["70%", "85%"], |         type: "pie", | ||||||
|       center: ["50%", "52%"], |         name: "当前目标", | ||||||
|       avoidLabelOvervlap: false, |         radius: ["70%", "85%"], | ||||||
|       label: { |         center: ["50%", "52%"], | ||||||
|         show: false, |         emptyCircleStyle: { | ||||||
|  |           color: "#040c5f45", | ||||||
|  |         }, | ||||||
|       }, |       }, | ||||||
|       labelLine: { |       // 数据 series | ||||||
|         show: false, |       { | ||||||
|       }, |         type: "pie", | ||||||
|       data: [ |         radius: ["70%", "85%"], | ||||||
|         { |         center: ["50%", "52%"], | ||||||
|           value: currentSum, |         avoidLabelOvervlap: false, | ||||||
|           name: currentName, |         label: { | ||||||
|           tooltip: { |           show: false, | ||||||
|             formatter: `${currentName} : ${currentSum}` |         }, | ||||||
|           }, |         labelLine: { | ||||||
|           selected: false, |           show: false, | ||||||
|           itemStyle: { |         }, | ||||||
|             borderJoin: "round", |         data: [ | ||||||
|             borderCap: "round", |           { | ||||||
|             borderWidth: 12, |             value: currentSum, | ||||||
|             borderRadius: "50%", |             name: "当前良率", | ||||||
|             color: { |             selected: false, | ||||||
|               type: "linear", |             itemStyle: { | ||||||
|               x: 1, |               borderJoin: "round", | ||||||
|               y: 0, |               borderCap: "round", | ||||||
|               x2: 0, |               borderWidth: 12, | ||||||
|               y2: 1, |               borderRadius: "50%", | ||||||
|               colorStops: [ |               color: { | ||||||
|                 { offset: 0, color: "#4CF0E811" }, |                 type: "linear", | ||||||
|                 { offset: 1, color: "#4CF0E8" }, |                 x: 1, | ||||||
|               ], |                 y: 0, | ||||||
|  |                 x2: 0, | ||||||
|  |                 y2: 1, | ||||||
|  |                 colorStops: single | ||||||
|  |                   ? [ | ||||||
|  |                       { offset: 0, color: `${color}11` }, | ||||||
|  |                       { offset: 1, color: `${color}` }, | ||||||
|  |                     ] | ||||||
|  |                   : [ | ||||||
|  |                       { offset: 0, color: "#4CF0E811" }, | ||||||
|  |                       { offset: 1, color: "#4CF0E8" }, | ||||||
|  |                     ], | ||||||
|  |               }, | ||||||
|             }, |             }, | ||||||
|           }, |           }, | ||||||
|         }, |           { | ||||||
|         { |             value: | ||||||
|           value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum), |               targetSum > currentSum | ||||||
|           name: currentName, |                 ? targetSum - currentSum | ||||||
|           tooltip: { |                 : targetSum == 0 | ||||||
|             formatter: `${currentName} : ${currentSum}` |                 ? currentSum == 0 | ||||||
|  |                   ? 1 | ||||||
|  |                   : 0 | ||||||
|  |                 : targetSum, | ||||||
|  |  | ||||||
|  |             name: "未达成", | ||||||
|  |             itemStyle: { color: "transparent" }, | ||||||
|  |             label: { show: false }, | ||||||
|           }, |           }, | ||||||
|           itemStyle: { color: "transparent" }, |         ], | ||||||
|           label: { show: false }, |  | ||||||
|         }, |  | ||||||
|       ], |  | ||||||
|     }, |  | ||||||
|     // 数据 series2 - 2023累计 |  | ||||||
|     { |  | ||||||
|       type: "pie", |  | ||||||
|       radius: ["55%", "70%"], |  | ||||||
|       center: ["50%", "52%"], |  | ||||||
|       avoidLabelOvervlap: false, |  | ||||||
|       label: { |  | ||||||
|         show: false, |  | ||||||
|       }, |       }, | ||||||
|       labelLine: { |       // 数据 series2 - 2023累计 | ||||||
|         show: false, |       single | ||||||
|       }, |         ? null | ||||||
|       data: [ |         : { | ||||||
|         { |             type: "pie", | ||||||
|           value: previousSum, |             radius: ["55%", "70%"], | ||||||
|           name: preName, |             center: ["50%", "52%"], | ||||||
|           selected: false, |             avoidLabelOvervlap: false, | ||||||
|           itemStyle: { |             label: { | ||||||
|             borderJoin: "round", |               show: false, | ||||||
|             borderCap: "round", |  | ||||||
|             borderWidth: 12, |  | ||||||
|             borderRadius: "50%", |  | ||||||
|             color: { |  | ||||||
|               type: "linear", |  | ||||||
|               x: 1, |  | ||||||
|               y: 0, |  | ||||||
|               x2: 0, |  | ||||||
|               y2: 1, |  | ||||||
|               colorStops: [ |  | ||||||
|                 { offset: 0, color: "#1065ff66" }, |  | ||||||
|                 { offset: 1, color: "#1065ff" }, |  | ||||||
|               ], |  | ||||||
|             }, |             }, | ||||||
|  |             labelLine: { | ||||||
|  |               show: false, | ||||||
|  |             }, | ||||||
|  |             data: [ | ||||||
|  |               { | ||||||
|  |                 value: previousSum, | ||||||
|  |                 name: "上期良率", | ||||||
|  |                 selected: false, | ||||||
|  |                 itemStyle: { | ||||||
|  |                   borderJoin: "round", | ||||||
|  |                   borderCap: "round", | ||||||
|  |                   borderWidth: 12, | ||||||
|  |                   borderRadius: "50%", | ||||||
|  |                   color: { | ||||||
|  |                     type: "linear", | ||||||
|  |                     x: 1, | ||||||
|  |                     y: 0, | ||||||
|  |                     x2: 0, | ||||||
|  |                     y2: 1, | ||||||
|  |                     colorStops: [ | ||||||
|  |                       { offset: 0, color: "#1065ff66" }, | ||||||
|  |                       { offset: 1, color: "#1065ff" }, | ||||||
|  |                     ], | ||||||
|  |                   }, | ||||||
|  |                 }, | ||||||
|  |               }, | ||||||
|  |               { | ||||||
|  |                 value: | ||||||
|  |                   targetSum > previousSum | ||||||
|  |                     ? targetSum - previousSum | ||||||
|  |                     : previousSum == 0 | ||||||
|  |                     ? 1 | ||||||
|  |                     : 0, | ||||||
|  |                 name: "-", | ||||||
|  |                 formatter: { | ||||||
|  |                   show: false | ||||||
|  |                 }, | ||||||
|  |                 itemStyle: { color: "transparent" }, | ||||||
|  |                 label: { show: false }, | ||||||
|  |               }, | ||||||
|  |             ], | ||||||
|           }, |           }, | ||||||
|         }, |     ], | ||||||
|         { |   }; | ||||||
|           value:previousSum == 0 | } | ||||||
|               ? 1 |  | ||||||
|               : 0, |  | ||||||
|           name: "-", |  | ||||||
|           itemStyle: { color: "transparent" }, |  | ||||||
|           label: { show: false }, |  | ||||||
|         }, |  | ||||||
|       ], |  | ||||||
|     }, |  | ||||||
|   ], |  | ||||||
| }); |  | ||||||
|   | |||||||
| @@ -1,13 +1,13 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-20 16:04:18 |  * @Date: 2024-05-20 16:04:18 | ||||||
|  * @LastEditTime: 2024-06-03 16:46:11 |  * @LastEditTime: 2024-05-30 11:14:17 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
|   <!-- <div class="copilot-layout" ref="copilot-layout"> --> |   <!-- <div class="copilot-layout" ref="copilot-layout"> --> | ||||||
|   <div class="copilot-layout" ref="copilot-layout"> |   <div class="copilot-layout other" ref="copilot-layout"> | ||||||
|     <CopilotHeaderVue :than="than" :active="page" :period="period" @update:active="updateActive" |     <CopilotHeaderVue :than="than" :active="page" :period="period" @update:active="updateActive" | ||||||
|       @update:period="period = $event" @update:than="updateThan" /> |       @update:period="period = $event" @update:than="updateThan" /> | ||||||
|  |  | ||||||
| @@ -25,7 +25,7 @@ import CopilotHeaderVue from "./components/CopilotHeader.vue"; | |||||||
| import EfficiencyCopilot from "./efficiency/index.vue"; | import EfficiencyCopilot from "./efficiency/index.vue"; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "copilotEfficiencyContainer", |   name: "CopilotContainer", | ||||||
|   components: { |   components: { | ||||||
|     CopilotHeaderVue, |     CopilotHeaderVue, | ||||||
|     EfficiencyCopilot, |     EfficiencyCopilot, | ||||||
| @@ -34,7 +34,7 @@ export default { | |||||||
|     return { |     return { | ||||||
|       than:'同比', |       than:'同比', | ||||||
|       page: "效率", |       page: "效率", | ||||||
|       period: "月", |       period: "日", | ||||||
|       currentsStyles: '', |       currentsStyles: '', | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
| @@ -95,14 +95,13 @@ export default { | |||||||
| </script> | </script> | ||||||
| <style> | <style> | ||||||
|  |  | ||||||
|  |  | ||||||
| .copilot-layout { | .copilot-layout { | ||||||
|   padding: 16px; |   padding: 16px; | ||||||
|   background: url(../../assets/images/copilot-bg.png) 0 0 / 100% 100% no-repeat; |   background: url(../../assets/images/copilot-bg.png) 0 0 / 100% 100% no-repeat; | ||||||
|   position: absolute; |   position: absolute; | ||||||
|   left: -16px; |   left: -16px; | ||||||
|   /* top: -8px; */ |   /* top: -8px; */ | ||||||
|   height: calc(100% + 30px); |   /* height: calc(100% + 38px); */ | ||||||
|   width: calc(100% + 30px); |   width: calc(100% + 30px); | ||||||
|   z-index: 1001; |   z-index: 1001; | ||||||
|   color: #fff; |   color: #fff; | ||||||
| @@ -111,12 +110,12 @@ export default { | |||||||
|   gap: 8px; |   gap: 8px; | ||||||
| } | } | ||||||
|  |  | ||||||
| /* .produce{ | .produce{ | ||||||
|   height: calc(100% + 38px); |   height: calc(100% + 38px); | ||||||
| } */ | } | ||||||
| /* .other { */ | .other { | ||||||
|   /* height: calc(100% + 240px); */ |   height: calc(100% + 240px); | ||||||
| /* } */ | } | ||||||
| .copilot-footer { | .copilot-footer { | ||||||
|   /** position: absolute; |   /** position: absolute; | ||||||
|   bottom: 10px; **/ |   bottom: 10px; **/ | ||||||
|   | |||||||
| @@ -1,16 +1,16 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="factory-layout"> |   <div class="factory-layout"> | ||||||
|     <FactoryDataHeader :companyName="companyName" :companyId="companyId" :period="period" |     <FactoryDataHeader :than="than" :companyName="companyName" :companyId="companyId" :period="period" | ||||||
|       @update:period="updatePeriod" /> |       @update:than="updateThan" @update:period="updatePeriod" /> | ||||||
|     <div class="factory-section"> |     <div class="factory-section"> | ||||||
|       <section class="top flex"> |       <section class="top flex"> | ||||||
|         <db-container title="生产监控" icon="prod" @update:than="updateThan" :than="than"> |         <db-container title="生产监控" icon="prod"> | ||||||
|           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" |           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" | ||||||
|             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> |             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> | ||||||
|         </db-container> |         </db-container> | ||||||
|         <left-container title="工单监控" icon="order"> |         <db-container title="工单监控" icon="order"> | ||||||
|           <order :prodOrder="prodOrder" /> |           <order :prodOrder="prodOrder" /> | ||||||
|         </left-container> |         </db-container> | ||||||
|         <!-- <db-container title="" icon="store"> --> |         <!-- <db-container title="" icon="store"> --> | ||||||
|         <!-- <store :stock="stock" /> --> |         <!-- <store :stock="stock" /> --> | ||||||
|         <!-- </db-container> --> |         <!-- </db-container> --> | ||||||
| @@ -26,8 +26,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| import Container from "./components/rightContainer.vue"; | import Container from "./components/Container.vue"; | ||||||
| import leftContainer from "./components/leftContainer.vue"; |  | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import { deepClone } from "@/utils"; | import { deepClone } from "@/utils"; | ||||||
| // import Store from "./components/Store.vue"; | // import Store from "./components/Store.vue"; | ||||||
| @@ -39,7 +38,6 @@ export default { | |||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     DbContainer: Container, |     DbContainer: Container, | ||||||
|     LeftContainer: leftContainer, |  | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     // Store, |     // Store, | ||||||
|     // Energy, |     // Energy, | ||||||
|   | |||||||
| @@ -8,9 +8,9 @@ | |||||||
|           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" |           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" | ||||||
|             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> |             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> | ||||||
|         </db-container> |         </db-container> | ||||||
|         <left-container title="工单监控" icon="order"> |         <db-container title="工单监控" icon="order"> | ||||||
|           <order :prodOrder="prodOrder" /> |           <order :prodOrder="prodOrder" /> | ||||||
|         </left-container> |         </db-container> | ||||||
|         <!-- <db-container title="" icon="store"> --> |         <!-- <db-container title="" icon="store"> --> | ||||||
|         <!-- <store :stock="stock" /> --> |         <!-- <store :stock="stock" /> --> | ||||||
|         <!-- </db-container> --> |         <!-- </db-container> --> | ||||||
| @@ -26,8 +26,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| import Container from "./components/rightContainer.vue"; | import Container from "./components/Container.vue"; | ||||||
| import leftContainer from "./components/leftContainer.vue"; |  | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import { deepClone } from "@/utils"; | import { deepClone } from "@/utils"; | ||||||
| // import Store from "./components/Store.vue"; | // import Store from "./components/Store.vue"; | ||||||
| @@ -39,7 +38,6 @@ export default { | |||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     DbContainer: Container, |     DbContainer: Container, | ||||||
|     LeftContainer: leftContainer, |  | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     // Store, |     // Store, | ||||||
|     // Energy, |     // Energy, | ||||||
|   | |||||||
| @@ -1,36 +1,22 @@ | |||||||
| <template> | <template> | ||||||
|   <chart-container class="bar-chart-base"> |   <div class="left-chart-base"> | ||||||
|     <div class="left-chart-base"> |     <!-- <div class="legend"> | ||||||
|       <!-- <div class="legend"> |  | ||||||
|       <span v-for="item in legend" :key="item.label" class="legend-item" |       <span v-for="item in legend" :key="item.label" class="legend-item" | ||||||
|         :style="{ fontSize: isFullscreen ? '0.85vw' : '0.73vw' }">{{ item.label }}</span> |         :style="{ fontSize: isFullscreen ? '0.85vw' : '0.73vw' }">{{ item.label }}</span> | ||||||
|     </div> --> |     </div> --> | ||||||
|  |     <div id="factoryEnergyChart" style="width: 100%; height: 100%"></div> | ||||||
|       <div id="factoryEnergyChart" style="width: 100%; height: 100%"></div> |   </div> | ||||||
|     </div> |  | ||||||
|   </chart-container> |  | ||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import { debounce } from "@/utils/debounce"; | import { debounce } from "@/utils/debounce"; | ||||||
| import * as echarts from "echarts"; | import * as echarts from "echarts"; | ||||||
| import ChartContainer from "../../components/ChartContainer.vue"; |  | ||||||
|  |  | ||||||
| // import CopilotButton from "./chartButton" |  | ||||||
| export default { | export default { | ||||||
|   components: { |  | ||||||
|     ChartContainer |  | ||||||
|     // CopilotButton, |  | ||||||
|   }, |  | ||||||
|   name: "Energy", |   name: "Energy", | ||||||
|   props: { |   props: { | ||||||
|     // legend: { |     // legend: { | ||||||
|     //   type: Array, |     //   type: Array, | ||||||
|     //   required: true, |     //   required: true, | ||||||
|     // }, |     // }, | ||||||
|     type: { |  | ||||||
|       type: String, |  | ||||||
|       default:'目标产量' |  | ||||||
|     }, |  | ||||||
|     energyCockpits: { |     energyCockpits: { | ||||||
|       type: Array, |       type: Array, | ||||||
|       required: true, |       required: true, | ||||||
| @@ -41,23 +27,12 @@ export default { | |||||||
|       isFullscreen: false, |       isFullscreen: false, | ||||||
|       actualOptions: null, |       actualOptions: null, | ||||||
|       chart: "", |       chart: "", | ||||||
|       data: [], |  | ||||||
|       orderXAxis:[], |  | ||||||
|       // obj:{ |  | ||||||
|       //   seriesArr: [], |  | ||||||
|       //   targetProduceArr: [], |  | ||||||
|       //   planIn: [], |  | ||||||
|       //   acIn: [], |  | ||||||
|       //   acProduceArr: [], |  | ||||||
|       //   scrapNum: [], |  | ||||||
|       //   processNum: [], |  | ||||||
|       // }, |  | ||||||
|       options: { |       options: { | ||||||
|         color: ["#FFD160", "#2760FF", "#12FFF5"], |         color: ["#FFD160", "#2760FF", "#12FFF5"], | ||||||
|         grid: { |         grid: { | ||||||
|           left: "7%", |           left: "7%", | ||||||
|           right: "7%", |           right: "7%", | ||||||
|           bottom: "15%", |           bottom: "8%", | ||||||
|           top: "15%", |           top: "15%", | ||||||
|         }, |         }, | ||||||
|         tooltip: { |         tooltip: { | ||||||
| @@ -73,25 +48,11 @@ export default { | |||||||
|             }, |             }, | ||||||
|           }, |           }, | ||||||
|           axisLabel: { |           axisLabel: { | ||||||
|             interval: 0,//设置横坐标为斜 |  | ||||||
|             rotate:45, |  | ||||||
|             color: "rgba(255, 255, 255, 0.7)", |             color: "rgba(255, 255, 255, 0.7)", | ||||||
|             fontSize: 12, |             fontSize: 12, | ||||||
|             // formatter: function (value) { |  | ||||||
|             //   console.log(value); |  | ||||||
|  |  | ||||||
|             //   return value; |  | ||||||
|             // }, |  | ||||||
|           }, |           }, | ||||||
|           data: [], |           data: [], | ||||||
|         }, |         }, | ||||||
|         // dataZoom: [ |  | ||||||
|         //   { |  | ||||||
|         //     // show: true, |  | ||||||
|         //     start: 0, |  | ||||||
|         //     end: 50 |  | ||||||
|         //   } |  | ||||||
|         //   ], |  | ||||||
|         yAxis: { |         yAxis: { | ||||||
|             type: "value", |             type: "value", | ||||||
|             name: "单位/片", |             name: "单位/片", | ||||||
| @@ -105,7 +66,7 @@ export default { | |||||||
|             }, |             }, | ||||||
|             axisLabel: { |             axisLabel: { | ||||||
|               color: "rgba(255, 255, 255, 0.7)", |               color: "rgba(255, 255, 255, 0.7)", | ||||||
|               fontSize: 10, |               fontSize: 12, | ||||||
|             }, |             }, | ||||||
|             axisLine: { |             axisLine: { | ||||||
|               show: true, |               show: true, | ||||||
| @@ -211,9 +172,6 @@ export default { | |||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   watch: { |   watch: { | ||||||
|     type(val) { |  | ||||||
|       this.initChart() |  | ||||||
|     }, |  | ||||||
|     /** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */ |     /** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */ | ||||||
|     // isFullscreen(val) { |     // isFullscreen(val) { | ||||||
|     //   this.actualOptions.series.map((item) => { |     //   this.actualOptions.series.map((item) => { | ||||||
| @@ -239,9 +197,9 @@ export default { | |||||||
|     //   this.actualOptions = actualOptions; |     //   this.actualOptions = actualOptions; | ||||||
|     //   this.initOptions(actualOptions); |     //   this.initOptions(actualOptions); | ||||||
|     // }, |     // }, | ||||||
|     // energyCockpits() { |     energyCockpits() { | ||||||
|     //   this.initChart(); |       this.initChart(); | ||||||
|     // }, |     }, | ||||||
|     isOpen(val) { |     isOpen(val) { | ||||||
|       this.canvasReset(); |       this.canvasReset(); | ||||||
|     }, |     }, | ||||||
| @@ -270,81 +228,17 @@ export default { | |||||||
|       }, 500)(); |       }, 500)(); | ||||||
|     }, |     }, | ||||||
|     initChart() { |     initChart() { | ||||||
|       if (this.type === '目标产量') { |       console.log("this.energyCockpits", this.energyCockpits); | ||||||
|         this.orderXAxis = [] |       let orderXAxis = ['目标产量', '计划投入量', '实际投入量', '实际产出量', '废品数量', '待再加工数量']; | ||||||
|         this.data = [] |       // let n = 0; | ||||||
|         if (this.energyCockpits) { |       let seriesArr =[] | ||||||
|           this.energyCockpits.forEach(ele => { |       seriesArr[0] = this.energyCockpits.length != 0 && this.energyCockpits[0].targetProduction ? this.energyCockpits[0].targetProduction :0 | ||||||
|             this.data.push(ele.targetProduction) |       seriesArr[1] = this.energyCockpits.length != 0 && this.energyCockpits[0].plannedInvestment ? this.energyCockpits[0].plannedInvestment : 0 | ||||||
|             if (ele.workOrderNumber.length > 4) { |       seriesArr[2] = this.energyCockpits.length != 0 && this.energyCockpits[0].actualInvestment ? this.energyCockpits[0].actualInvestment : 0 | ||||||
|               ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + ".."; |       seriesArr[3] = this.energyCockpits.length != 0 && this.energyCockpits[0].actualProduction ? this.energyCockpits[0].actualProduction : 0 | ||||||
|             } |       seriesArr[4] = this.energyCockpits.length != 0 && this.energyCockpits[0].wasteNum ? this.energyCockpits[0].wasteNum : 0 | ||||||
|             this.orderXAxis.push(ele.workOrderNumber) |       seriesArr[5] = this.energyCockpits.length != 0 && this.energyCockpits[0].reworkNum ? this.energyCockpits[0].reworkNum : 0 | ||||||
|           }); |       console.log(seriesArr); | ||||||
|         } |  | ||||||
|         // this.initChart(targetProduceArr, orderXAxis) |  | ||||||
|       } else if (this.type === '计划投入') { |  | ||||||
|         this.orderXAxis = [] |  | ||||||
|         this.data = [] |  | ||||||
|         if (this.energyCockpits) { |  | ||||||
|           this.energyCockpits.forEach(ele => { |  | ||||||
|             this.data.push(ele.plannedInvestment) |  | ||||||
|             if (ele.workOrderNumber.length > 4) { |  | ||||||
|               ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + ".."; |  | ||||||
|             } |  | ||||||
|             this.orderXAxis.push(ele.workOrderNumber) |  | ||||||
|           }); |  | ||||||
|         } |  | ||||||
|       } else if (this.type === '实际投入') { |  | ||||||
|         this.orderXAxis = [] |  | ||||||
|         this.data = [] |  | ||||||
|         if (this.energyCockpits) { |  | ||||||
|           this.energyCockpits.forEach(ele => { |  | ||||||
|             this.data.push(ele.actualInvestment) |  | ||||||
|             if (ele.workOrderNumber.length > 4) { |  | ||||||
|               ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + ".."; |  | ||||||
|             } |  | ||||||
|             this.orderXAxis.push(ele.workOrderNumber) |  | ||||||
|           }); |  | ||||||
|         } |  | ||||||
|       } else if (this.type === '实际产出') { |  | ||||||
|         this.orderXAxis = [] |  | ||||||
|         this.data = [] |  | ||||||
|         if (this.energyCockpits) { |  | ||||||
|           this.energyCockpits.forEach(ele => { |  | ||||||
|             this.data.push(ele.actualProduction) |  | ||||||
|             if (ele.workOrderNumber.length > 4) { |  | ||||||
|               ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + ".."; |  | ||||||
|             } |  | ||||||
|             this.orderXAxis.push(ele.workOrderNumber) |  | ||||||
|           }); |  | ||||||
|         } |  | ||||||
|       } else if (this.type === '废品数量') { |  | ||||||
|         this.orderXAxis = [] |  | ||||||
|         this.data  = [] |  | ||||||
|         if (this.energyCockpits) { |  | ||||||
|           this.energyCockpits.forEach(ele => { |  | ||||||
|             this.data.push(ele.wasteNum) |  | ||||||
|             if (ele.workOrderNumber.length > 4) { |  | ||||||
|               ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + ".."; |  | ||||||
|             } |  | ||||||
|             this.orderXAxis.push(ele.workOrderNumber) |  | ||||||
|           }); |  | ||||||
|         } |  | ||||||
|       } else if (this.type === '待再加工') { |  | ||||||
|         this.orderXAxis = [] |  | ||||||
|         this.data = [] |  | ||||||
|         if (this.energyCockpits) { |  | ||||||
|           this.energyCockpits.forEach(ele => { |  | ||||||
|             console.log(ele.reworkNum); |  | ||||||
|             this.data.push(ele.reworkNum) |  | ||||||
|             if (ele.workOrderNumber.length > 4) { |  | ||||||
|               ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + ".."; |  | ||||||
|             } |  | ||||||
|             this.orderXAxis.push(ele.workOrderNumber) |  | ||||||
|           }); |  | ||||||
|         } |  | ||||||
|       } |  | ||||||
|  |  | ||||||
|       // let seriesArr = [ |       // let seriesArr = [ | ||||||
|       //   { |       //   { | ||||||
| @@ -386,19 +280,18 @@ export default { | |||||||
|       //     } |       //     } | ||||||
|       //   } |       //   } | ||||||
|       // } |       // } | ||||||
|  |  | ||||||
|       // actualOptions.series[0].name = seriesArr[0].name; |  | ||||||
|       // actualOptions.series[1].data = seriesArr[1].data; |  | ||||||
|       // actualOptions.series[1].name = seriesArr[1].name; |  | ||||||
|       // actualOptions.series[2].data = seriesArr[2].data; |  | ||||||
|       // actualOptions.series[2].name = seriesArr[2].name; |  | ||||||
|       if (this.chart) { |       if (this.chart) { | ||||||
|         this.chart.dispose(); |         this.chart.dispose(); | ||||||
|       } |       } | ||||||
|       this.chart = echarts.init(document.getElementById("factoryEnergyChart")); |       this.chart = echarts.init(document.getElementById("factoryEnergyChart")); | ||||||
|       const actualOptions = JSON.parse(JSON.stringify(this.options)); |       const actualOptions = JSON.parse(JSON.stringify(this.options)); | ||||||
|       actualOptions.xAxis.data = this.orderXAxis; |       actualOptions.xAxis.data = orderXAxis; | ||||||
|       actualOptions.series[0].data = this.data; |       actualOptions.series[0].data = seriesArr; | ||||||
|  |       // actualOptions.series[0].name = seriesArr[0].name; | ||||||
|  |       // actualOptions.series[1].data = seriesArr[1].data; | ||||||
|  |       // actualOptions.series[1].name = seriesArr[1].name; | ||||||
|  |       // actualOptions.series[2].data = seriesArr[2].data; | ||||||
|  |       // actualOptions.series[2].name = seriesArr[2].name; | ||||||
|       this.actualOptions = actualOptions; |       this.actualOptions = actualOptions; | ||||||
|       this.chart.setOption(actualOptions); |       this.chart.setOption(actualOptions); | ||||||
|     }, |     }, | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-30 08:58:39 |  * @Date: 2024-05-30 08:58:39 | ||||||
|  * @LastEditTime: 2024-06-07 09:29:45 |  * @LastEditTime: 2024-05-30 10:38:32 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -11,7 +11,7 @@ | |||||||
|       <span v-for="(item,index) in legend" :key="index" class="legend-item" |       <span v-for="(item,index) in legend" :key="index" class="legend-item" | ||||||
|         :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span> |         :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span> | ||||||
|     </div> |     </div> | ||||||
|     <div ref="oeeChart" style="height:100%"></div> |     <div ref="oeeChart" style="height:96%;width:100%"></div> | ||||||
|   </chart-container> |   </chart-container> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| @@ -79,11 +79,10 @@ export default { | |||||||
|           data: this.xAxis, |           data: this.xAxis, | ||||||
|         }, |         }, | ||||||
|         yAxis: { |         yAxis: { | ||||||
|           name: "单位/片", |           name: "单位/%", | ||||||
|           nameTextStyle: { |           nameTextStyle: { | ||||||
|             color: "#fff", |             color: "#fff", | ||||||
|             fontSize: 12, |             fontSize: 12, | ||||||
|             align: "right", |  | ||||||
|           }, |           }, | ||||||
|           axisTick: { |           axisTick: { | ||||||
|             show: false, |             show: false, | ||||||
| @@ -106,7 +105,7 @@ export default { | |||||||
|         }, |         }, | ||||||
|         series: [ |         series: [ | ||||||
|           { |           { | ||||||
|             name: "FTO", // this.series[0].name, |             name: "fto", // this.series[0].name, | ||||||
|             type: "bar", |             type: "bar", | ||||||
|             barWidth: 12, |             barWidth: 12, | ||||||
|             itemStyle: { |             itemStyle: { | ||||||
| @@ -174,11 +173,32 @@ export default { | |||||||
|           }, |           }, | ||||||
|           { |           { | ||||||
|             name: "", // "2024年目标值", |             name: "", // "2024年目标值", | ||||||
|             type: "line", |             type: "bar", | ||||||
|             barWidth: 12, |             barWidth: 12, | ||||||
|             itemStyle: { |             itemStyle: { | ||||||
|               borderRadius: [10, 10, 0, 0], |               borderRadius: [10, 10, 0, 0], | ||||||
|               color:'#f3c000' |               color: { | ||||||
|  |                 type: "linear", | ||||||
|  |                 x: 0, | ||||||
|  |                 y: 0, | ||||||
|  |                 x2: 0, | ||||||
|  |                 y2: 1, | ||||||
|  |                 colorStops: [ | ||||||
|  |                   { | ||||||
|  |                     offset: 0, | ||||||
|  |                     color: "#f3c000", // 0% 处的颜色 | ||||||
|  |                   }, | ||||||
|  |                   { | ||||||
|  |                     offset: 1, | ||||||
|  |                     color: "#f3c00033", | ||||||
|  |                   }, | ||||||
|  |                   { | ||||||
|  |                     offset: 1, | ||||||
|  |                     color: "transparent", // 100% 处的颜色 | ||||||
|  |                   }, | ||||||
|  |                 ], | ||||||
|  |                 global: false, // 缺省为 false | ||||||
|  |               }, | ||||||
|             }, |             }, | ||||||
|             data: [], // this.series[0].data, |             data: [], // this.series[0].data, | ||||||
|           }, |           }, | ||||||
| @@ -296,7 +316,7 @@ export default { | |||||||
|   .legend-item { |   .legend-item { | ||||||
|     position: relative; |     position: relative; | ||||||
|     // font-size: 12px; |     // font-size: 12px; | ||||||
|     margin-right:1.2vw; |     margin-right: 1.3vw; | ||||||
|  |  | ||||||
|     &::before { |     &::before { | ||||||
|       content: ""; |       content: ""; | ||||||
| @@ -308,9 +328,7 @@ export default { | |||||||
|       margin-right: 0.22vw; |       margin-right: 0.22vw; | ||||||
|     } |     } | ||||||
|   } |   } | ||||||
|   .legend-item:nth-child(3) { |  | ||||||
|       margin-left: 1vw; |  | ||||||
|   } |  | ||||||
|   .legend-item:nth-child(1):before { |   .legend-item:nth-child(1):before { | ||||||
|     background-color: #12f7f1; |     background-color: #12f7f1; | ||||||
|   } |   } | ||||||
| @@ -318,33 +336,8 @@ export default { | |||||||
|   .legend-item:nth-child(2):before { |   .legend-item:nth-child(2):before { | ||||||
|     background-color: #58adfa; |     background-color: #58adfa; | ||||||
|   } |   } | ||||||
|  .legend-item:nth-child(3):before { |   .legend-item:nth-child(3):before { | ||||||
|    // width: 12px; |     background-color: #f3c000; | ||||||
|    // height: 2px; |   } | ||||||
|    width: 1vw; |  | ||||||
|    height: 0.1064vw; |  | ||||||
|    background-color: #f3c000; |  | ||||||
|    position: absolute; |  | ||||||
|    top: 50%; |  | ||||||
|    // left: -16px; |  | ||||||
|    left: -0.951vw; |  | ||||||
|    transform: translateY(-50%); |  | ||||||
|  } |  | ||||||
|  |  | ||||||
|  .legend-item:nth-child(3):after { |  | ||||||
|    background-color: #f3c000; |  | ||||||
|    content: ""; |  | ||||||
|    display: inline-block; |  | ||||||
|    position: absolute; |  | ||||||
|    // width: 6px; |  | ||||||
|    // height: 6px; |  | ||||||
|    width: 0.3191vw; |  | ||||||
|    height: 0.3191vw; |  | ||||||
|    border-radius: 100%; |  | ||||||
|    top: 50%; |  | ||||||
|    left: -0.851vw; |  | ||||||
|    // left: -16px; |  | ||||||
|    transform: translateY(-50%) translateX(50%); |  | ||||||
|  } |  | ||||||
| } | } | ||||||
| </style> | </style> | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-29 14:48:06 |  * @Date: 2024-05-29 14:48:06 | ||||||
|  * @LastEditTime: 2024-06-18 14:49:25 |  * @LastEditTime: 2024-05-30 10:54:00 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -41,7 +41,7 @@ export default { | |||||||
|   }, |   }, | ||||||
|   data() { |   data() { | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["FTO投入", "芯片产量", "标准组件产量"]; |     const cities = ["fto投入", "芯片产量", "标准组件产量"]; | ||||||
|     return { |     return { | ||||||
|       // xAxis: cities, |       // xAxis: cities, | ||||||
|     }; |     }; | ||||||
| @@ -49,25 +49,13 @@ export default { | |||||||
|   computed: { |   computed: { | ||||||
|     xAxis() { |     xAxis() { | ||||||
|       console.log(' this.companyId', this.companyId); |       console.log(' this.companyId', this.companyId); | ||||||
|       return this.companyId === 0 ? ["FTO投入", "芯片产量", "标准组件产量"] : ["FTO投入", "芯片产量", "标准组件产量", 'BIPV产量']; |       return this.companyId === 0 ? ["fto投入", "芯片产量", "标准组件产量"] : ["fto投入", "芯片产量", "标准组件产量", 'BIPV产量']; | ||||||
|     }, |     }, | ||||||
|     legend() { |     legend() { | ||||||
|       let items = []; |       let items = []; | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |  | ||||||
|       // var day2 = new Date(); |  | ||||||
|       // day2.setTime(day2.getTime()); |  | ||||||
|       // var s2 = (day2.getMonth() + 1) + "月" + day2.getDate() + '日'; |  | ||||||
|       // const today = new Date().getDate(); |  | ||||||
|       // let yesterday = new Date().getDate() -1; |  | ||||||
|       // const month = new Date().getMonth() + 1; |  | ||||||
|       // const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1; |  | ||||||
|       // const year = new Date().getFullYear(); |  | ||||||
|       //今天的时间 |       //今天的时间 | ||||||
|       // var day2 = new Date(); |       // var day2 = new Date(); | ||||||
|       // day2.setTime(day2.getTime()); |       // day2.setTime(day2.getTime()); | ||||||
| @@ -77,22 +65,19 @@ export default { | |||||||
|       const month = new Date().getMonth() + 1; |       const month = new Date().getMonth() + 1; | ||||||
|       const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1; |       const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1; | ||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === 1 && this.than === '同比') { |       if (this.period === 1  && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年${yesterday}累计` }, |           { label: `去年${month}月${today}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日累计`, }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|  |  | ||||||
|           // { label: `${month}月${today}日目标`, }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === 1 && this.than === '环比') { |       } else if (this.period ===1 && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${dayBeYes}日累计` }, |           { label: `${yesterday}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日累计` }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|           // { label: `${month}月${today}日目标`, }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === 2 && this.than === '同比') { |       } else if (this.period === 2 && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年本周`, color: "#12f7f1" }, |           { label: `去年本周`, color: "#12f7f1" }, | ||||||
|           { label: `本周`, color: "#58adfa" }, |           { label: `本周`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === 2 && this.than === '环比') { |       } else if (this.period === 2 && this.than === '环比') { | ||||||
| @@ -102,7 +87,7 @@ export default { | |||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === 3 && this.than === '同比') { |       } else if (this.period === 3 && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年${month}月`, color: "#12f7f1" }, |           { label: `去年${month}月`, color: "#12f7f1" }, | ||||||
|           { label: `${month}月`, color: "#58adfa" }, |           { label: `${month}月`, color: "#58adfa" }, | ||||||
|           { label: `${month}月目标`, color: "#58adfa" }, |           { label: `${month}月目标`, color: "#58adfa" }, | ||||||
|           // { label: `${month}月目标`, value: valueTuple[2] }, |           // { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
| @@ -173,11 +158,8 @@ function getTemplate(period, dataList, than) { | |||||||
|   // console.log('dataList',dataList); |   // console.log('dataList',dataList); | ||||||
|   let items = []; |   let items = []; | ||||||
|   var day1 = new Date(); |   var day1 = new Date(); | ||||||
|   var day2 = new Date(); |   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|   day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|   var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|   //今天的时间 |   //今天的时间 | ||||||
|   // var day2 = new Date(); |   // var day2 = new Date(); | ||||||
|   // day2.setTime(day2.getTime()); |   // day2.setTime(day2.getTime()); | ||||||
| @@ -190,11 +172,11 @@ function getTemplate(period, dataList, than) { | |||||||
|   if (period === 1 && than === '同比') { |   if (period === 1 && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year - 1}年${yesterday}日`, |         name: `去年${month}月${today}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -202,11 +184,11 @@ function getTemplate(period, dataList, than) { | |||||||
|   } else if (period ===1 && than === '环比') { |   } else if (period ===1 && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${dayBeYes}日`, |         name: `${yesterday}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -214,7 +196,7 @@ function getTemplate(period, dataList, than) { | |||||||
|   } else if (period === 2 && than === '同比') { |   } else if (period === 2 && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年本周`, |         name: `去年本周`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
| @@ -238,7 +220,7 @@ function getTemplate(period, dataList, than) { | |||||||
|   } else if (period === 3 && than === '同比') { |   } else if (period === 3 && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年${month}月`, |         name: `去年${month}月`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|     filename: Container.vue |     filename: Container.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-09 10:44:09 |     date: 2024-04-09 10:44:09 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
| 
 | 
 | ||||||
| <template> | <template> | ||||||
| @@ -41,8 +41,8 @@ | |||||||
|     <!-- decoration  --> |     <!-- decoration  --> | ||||||
|     <div class="corner tl"></div> |     <div class="corner tl"></div> | ||||||
|     <div class="corner tr"></div> |     <div class="corner tr"></div> | ||||||
|     <div  class="corner bl"></div> |     <div v-if="side == 'left'" class="corner bl"></div> | ||||||
|     <div  class="corner br"></div> |     <div v-if="side == 'right'" class="corner br"></div> | ||||||
|     <!-- content  --> |     <!-- content  --> | ||||||
|     <div |     <div | ||||||
|       class="container-head" |       class="container-head" | ||||||
| @@ -207,11 +207,10 @@ export default { | |||||||
|     // border-bottom: 10px solid #0175dc; |     // border-bottom: 10px solid #0175dc; | ||||||
|     // border-top: 10px solid transparent; |     // border-top: 10px solid transparent; | ||||||
|     // border-right: 10px solid #0175dc; |     // border-right: 10px solid #0175dc; | ||||||
|     // transform: rotate(-90deg); |  | ||||||
|     border-left: 0.532vw solid transparent; |     border-left: 0.532vw solid transparent; | ||||||
|     border-bottom: .6vw solid #0175dc; |     border-bottom: 0.532vw solid #0175dc; | ||||||
|     border-top: 0.532vw solid transparent; |     border-top: 0.532vw solid transparent; | ||||||
|     border-right: 0.532vw solid transparent; |     border-right: 0.532vw solid #0175dc; | ||||||
|   } |   } | ||||||
| 
 | 
 | ||||||
|   .gradient-to-right { |   .gradient-to-right { | ||||||
| @@ -1,19 +1,14 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="order-container"> |   <div class="order-container"> | ||||||
|     <div class="table"> |     <div class="table"> | ||||||
|       <dv-scroll-board v-if="showTable" :config="config" style="width: 100%; height: 100%; color: rgba(255, 255, 255, .6);" ref="orderScrollBoard" /> |       <dv-scroll-board v-if="showTable" :config="config" style="width: 100%; height: 100%" ref="orderScrollBoard" /> | ||||||
|     </div> |     </div> | ||||||
|     <div class="chart"> |     <div class="chart"> | ||||||
|       <div class="chart-title"> |       <div class="chart-title"> | ||||||
|         <span class="title">工单情况</span> |         <span class="title">生产情况</span> | ||||||
|         <span class="line"></span> |         <span class="line"></span> | ||||||
|       </div> |       </div> | ||||||
|       <div class="button-type" style="margin-left: auto;position: absolute;right: 1%;top: 57%;z-index: 999;"> |       <barChartBase :energyCockpits="prodOrder" ref="barChart" style="height: 0;flex:1"></barChartBase> | ||||||
|         <CopilotButton v-for="i in ['目标产量', '计划投入', '实际投入', '实际产出', '废品数量', '待再加工']" :key="i" :label="i" |  | ||||||
|           :active="i === type" @click="() => $emit('update:type', i)" /> |  | ||||||
|       </div> |  | ||||||
|       <barChartBase :type="type" :energyCockpits="prodOrder" ref="barChart" |  | ||||||
|         style="height: 0;flex:1"></barChartBase> |  | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|  |  | ||||||
| @@ -21,18 +16,14 @@ | |||||||
| <script> | <script> | ||||||
| import { debounce } from "@/utils/debounce"; | import { debounce } from "@/utils/debounce"; | ||||||
| import barChartBase from './BarChartBase' | import barChartBase from './BarChartBase' | ||||||
| // import barChartBase from './BarChartBase' |  | ||||||
| import CopilotButton from "./chartButton" |  | ||||||
| export default { | export default { | ||||||
|   name: "Order", |   name: "Order", | ||||||
|   components: { |   components: { | ||||||
|     barChartBase, |     barChartBase, | ||||||
|     CopilotButton, |  | ||||||
|   }, |   }, | ||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       showTable: true, |       showTable: true, | ||||||
|       // type: '目标产量', |  | ||||||
|       config: { |       config: { | ||||||
|         header: ["工单号", "工单状态", "计划投入", "实际投入", "目标产量", "实际产量", "生产进度"], |         header: ["工单号", "工单状态", "计划投入", "实际投入", "目标产量", "实际产量", "生产进度"], | ||||||
|         headerBGC: "rgba(0, 106, 205, 0.22)", |         headerBGC: "rgba(0, 106, 205, 0.22)", | ||||||
| @@ -41,17 +32,13 @@ export default { | |||||||
|         data: [], |         data: [], | ||||||
|         rowNum: 12, |         rowNum: 12, | ||||||
|         waitTime: 3000, |         waitTime: 3000, | ||||||
|         columnWidth: [150], |         columnWidth: [100], | ||||||
|         align: ["left"], |         align: ["center"], | ||||||
|         carousel: "page", |         carousel: "page", | ||||||
|       }, |       }, | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
|   props: { |   props: { | ||||||
|     type: { |  | ||||||
|       type: String, |  | ||||||
|       default: "目标产量", |  | ||||||
|     }, |  | ||||||
|     prodOrder: { |     prodOrder: { | ||||||
|       type: Array, |       type: Array, | ||||||
|       default: [], |       default: [], | ||||||
| @@ -71,18 +58,9 @@ export default { | |||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   mounted() { |   mounted() { | ||||||
|     window.addEventListener("resize", this.tableReset) |     window.addEventListener("resize", this.tableReset); | ||||||
|     this.$nextTick(() => { |  | ||||||
|       let button = document.getElementsByClassName('button-type') |  | ||||||
|       console.log(button); |  | ||||||
|       button[0].children[0].style.borderRadius = '4px 0 0 4px' |  | ||||||
|       button[0].children[5].style.borderRadius = '0px 4px 4px 0px' |  | ||||||
|       // children[5].classList.add('skate') |  | ||||||
|       // console.log(button[0].children[5].classList); |  | ||||||
|     }); |  | ||||||
|   }, |   }, | ||||||
|   methods: { |   methods: { | ||||||
|  |  | ||||||
|     tableReset() { |     tableReset() { | ||||||
|       this.showTable = false; |       this.showTable = false; | ||||||
|       debounce(() => { |       debounce(() => { | ||||||
| @@ -101,37 +79,51 @@ export default { | |||||||
|           arr.push( |           arr.push( | ||||||
|             `<span title=${this.prodOrder[i].workOrderNumber || ""}>${ |             `<span title=${this.prodOrder[i].workOrderNumber || ""}>${ | ||||||
|             this.prodOrder[i].workOrderNumber || "" |             this.prodOrder[i].workOrderNumber || "" | ||||||
|             }</span>`, |             }</span>` | ||||||
|               `<span title=${this.prodOrder[i].orderStatus || ""}>${this.prodOrder[i].orderStatus === 1 ? '未开始' : this.prodOrder[i].orderStatus === 2 ? '进行中' : '已完成' || "" |           ); | ||||||
|               }</span>`, |           arr.push( | ||||||
|               `<span title=${this.prodOrder[i].plannedInvestment || ""}>${this.prodOrder[i].plannedInvestment || "" |             `<span title=${this.prodOrder[i].inStatus || ""}>${ | ||||||
|               }</span>`, |             this.prodOrder[i].inStatus || "" | ||||||
|               `<span title=${this.prodOrder[i].actualInvestment || ""}>${this.prodOrder[i].actualInvestment || "" |             }</span>` | ||||||
|               }</span>`, |           ); | ||||||
|               `<span title=${this.prodOrder[i].targetProduction || ""}>${this.prodOrder[i].targetProduction || "" |           arr.push( | ||||||
|               }</span>`, |             `<span title=${this.prodOrder[i].plannedInvestment || ""}>${ | ||||||
|               `<span title=${this.prodOrder[i].actualProduction || ""}>${this.prodOrder[i].actualProduction || "" |             this.prodOrder[i].plannedInvestment || "" | ||||||
|               }</span>`, |             }</span>` | ||||||
|               `<span style="display:inline-block;width:45px;">${this.prodOrder[i].productionProgress |           ); | ||||||
|                 ? this.prodOrder[i].productionProgress.toFixed(0) + "%" |           arr.push( | ||||||
|                 : "0%" |             `<span title=${this.prodOrder[i].actualInvestment || ""}>${this.prodOrder[i].actualInvestment || "" | ||||||
|               }</span> |             }</span>` | ||||||
|  |           ); | ||||||
|  |           arr.push( | ||||||
|  |             `<span title=${this.prodOrder[i].targetProduction || ""}>${this.prodOrder[i].targetProduction || "" | ||||||
|  |             }</span>` | ||||||
|  |           ); | ||||||
|  |           arr.push( | ||||||
|  |             `<span title=${this.prodOrder[i].actualProduction || ""}>${this.prodOrder[i].actualProduction || "" | ||||||
|  |             }</span>` | ||||||
|  |           ); | ||||||
|  |           arr.push(`<span style="display:inline-block;width:45px;">${ | ||||||
|  |             this.prodOrder[i].productionProgress | ||||||
|  |             ? this.prodOrder[i].productionProgress.toFixed(0) + "%" | ||||||
|  |               : "0%" | ||||||
|  |           }</span> | ||||||
|             <div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;"> |             <div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;"> | ||||||
|             <svg xmlns="http://www.w3.org/200/svg" height="20" width="20"> |             <svg xmlns="http://www.w3.org/200/svg" height="20" width="20"> | ||||||
|               <circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/> |               <circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/> | ||||||
|               <circle style="transform-origin: center;transform: rotate(-90deg);" id="J_progress_bar" cx="10" cy="10" r="6" fill="none" stroke="#47FF27" stroke-width="4" stroke-dasharray="${this.prodOrder[i].productionProgress |               <circle style="transform-origin: center;transform: rotate(-90deg);" id="J_progress_bar" cx="10" cy="10" r="6" fill="none" stroke="#47FF27" stroke-width="4" stroke-dasharray="${ | ||||||
|                 ? this.prodOrder[i].productionProgress.toFixed(0) * |             this.prodOrder[i].productionProgress | ||||||
|                 37.68 * |             ? this.prodOrder[i].productionProgress.toFixed(0) * | ||||||
|                 0.01 + |                       37.68 * | ||||||
|                 "," + |                       0.01 + | ||||||
|                 (1 - |                     "," + | ||||||
|                   this.prodOrder[i].productionProgress.toFixed(0) * 0.01) * |                     (1 - | ||||||
|                 37.68 |               this.prodOrder[i].productionProgress.toFixed(0) * 0.01) * | ||||||
|                 : 0 + "," + 37.68 |                       37.68 | ||||||
|  |                   : 0 + "," + 37.68 | ||||||
|               }"/> |               }"/> | ||||||
|             </svg> |             </svg> | ||||||
|           </div>` |           </div>`); | ||||||
|           ) |  | ||||||
|           outArr.push(arr); |           outArr.push(arr); | ||||||
|         } |         } | ||||||
|         this.config.data = outArr; |         this.config.data = outArr; | ||||||
|   | |||||||
| @@ -8,11 +8,11 @@ | |||||||
|         </div> |         </div> | ||||||
|         <div class="middle-box"> |         <div class="middle-box"> | ||||||
|           <span class="type">玻璃类型</span> |           <span class="type">玻璃类型</span> | ||||||
|           <span class="type-name">FTO</span> |           <span class="type-name">FTO投入</span> | ||||||
|         </div> |         </div> | ||||||
|         <div class="right-box"> |         <div class="right-box"> | ||||||
|           <span class="type">投入数量</span> |           <span class="type">投入数量</span> | ||||||
|           <span class="num">{{ prodFto[0] ? prodFto[0].chipInput.toLocaleString() : 0 }}</span> |           <span class="num">{{ prodFto[0] ? prodFto[0].chipInput : 0 }}</span> | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|       <div class="std-box"> |       <div class="std-box"> | ||||||
| @@ -23,12 +23,12 @@ | |||||||
|           <div class="separate"> |           <div class="separate"> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type">玻璃类型</span> |               <span class="type">玻璃类型</span> | ||||||
|               <span class="type-name">标准组件</span> |               <span class="type-name">标准组检产量</span> | ||||||
|             </div> |             </div> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type">良品数量</span> |               <span class="type">良品数量</span> | ||||||
|               <span class="type-name">{{ |               <span class="type-name">{{ | ||||||
|               msgObj.stand.goodNumber ? msgObj.stand.goodNumber.toLocaleString() : 0 |               msgObj.stand.goodNumber ? msgObj.stand.goodNumber : 0 | ||||||
|               }}</span> |               }}</span> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
| @@ -38,12 +38,12 @@ | |||||||
|             <div> |             <div> | ||||||
|               <span class="type">生产数量</span> |               <span class="type">生产数量</span> | ||||||
|               <span class="num">{{ |               <span class="num">{{ | ||||||
|               msgObj.stand.outputNumber ? msgObj.stand.outputNumber.toLocaleString() : 0 |               msgObj.stand.outputNumber ? msgObj.stand.outputNumber : 0 | ||||||
|               }}</span> |               }}</span> | ||||||
|             </div> |             </div> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type1">良品率</span> |               <span class="type1">良品率</span> | ||||||
|               <span class="num">{{ msgObj.stand.yieldRate ? msgObj.stand.yieldRate.toFixed(2) : 0 }}%</span> |               <span class="num">{{ msgObj.stand.yieldRate ? msgObj.stand.yieldRate : 0 }}%</span> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
| @@ -56,12 +56,12 @@ | |||||||
|           <div class="separate"> |           <div class="separate"> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type">玻璃类型</span> |               <span class="type">玻璃类型</span> | ||||||
|               <span class="type-name">芯片</span> |               <span class="type-name">芯片产量</span> | ||||||
|             </div> |             </div> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type">良品数量</span> |               <span class="type">良品数量</span> | ||||||
|               <span class="type-name">{{ |               <span class="type-name">{{ | ||||||
|               msgObj.chip.goodNumber ? msgObj.chip.goodNumber.toLocaleString() : 0 |               msgObj.chip.goodNumber ? msgObj.chip.goodNumber : 0 | ||||||
|               }}</span> |               }}</span> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
| @@ -71,12 +71,12 @@ | |||||||
|             <div> |             <div> | ||||||
|               <span class="type">生产数量</span> |               <span class="type">生产数量</span> | ||||||
|               <span class="num">{{ |               <span class="num">{{ | ||||||
|               msgObj.chip.outputNumber ? msgObj.chip.outputNumber.toLocaleString() : 0 |               msgObj.chip.outputNumber ? msgObj.chip.outputNumber : 0 | ||||||
|               }}</span> |               }}</span> | ||||||
|             </div> |             </div> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type1">良品率</span> |               <span class="type1">良品率</span> | ||||||
|               <span class="num">{{ msgObj.chip.yieldRate ? msgObj.chip.yieldRate.toFixed(2) : 0 }}%</span> |               <span class="num">{{ msgObj.chip.yieldRate ? msgObj.chip.yieldRate : 0 }}%</span> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
| @@ -89,12 +89,12 @@ | |||||||
|           <div class="separate"> |           <div class="separate"> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type">玻璃类型</span> |               <span class="type">玻璃类型</span> | ||||||
|               <span class="type-name">BIPV</span> |               <span class="type-name">BIPV产量</span> | ||||||
|             </div> |             </div> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type">良品数量</span> |               <span class="type">良品数量</span> | ||||||
|               <span class="type-name">{{ |               <span class="type-name">{{ | ||||||
|               msgObj.bipv.goodNumber ? msgObj.bipv.goodNumber.toLocaleString() : 0 |               msgObj.bipv.goodNumber ? msgObj.bipv.goodNumber : 0 | ||||||
|               }}</span> |               }}</span> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
| @@ -104,12 +104,12 @@ | |||||||
|             <div> |             <div> | ||||||
|               <span class="type">生产数量</span> |               <span class="type">生产数量</span> | ||||||
|               <span class="num">{{ |               <span class="num">{{ | ||||||
|               msgObj.bipv.outputNumber ? msgObj.bipv.outputNumber.toLocaleString() : 0 |               msgObj.bipv.outputNumber ? msgObj.bipv.outputNumber : 0 | ||||||
|               }}</span> |               }}</span> | ||||||
|             </div> |             </div> | ||||||
|             <div> |             <div> | ||||||
|               <span class="type1">良品率</span> |               <span class="type1">良品率</span> | ||||||
|               <span class="num">{{ msgObj.bipv.yieldRate ? msgObj.bipv.yieldRate.toFixed(2) : 0 }}%</span> |               <span class="num">{{ msgObj.bipv.yieldRate ? msgObj.bipv.yieldRate : 0 }}%</span> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
| @@ -129,6 +129,7 @@ | |||||||
| <script> | <script> | ||||||
| import { number } from 'echarts'; | import { number } from 'echarts'; | ||||||
| import barChartBase from './ChipOee' | import barChartBase from './ChipOee' | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "ProdMonitor", |   name: "ProdMonitor", | ||||||
|   components: { |   components: { | ||||||
|   | |||||||
| @@ -1,99 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-06 14:22:56 |  | ||||||
|  * @LastEditTime: 2024-06-07 10:53:39 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
|   <button |  | ||||||
|     class="copilot-btn" |  | ||||||
|     :class="[active ? 'active' : '']" |  | ||||||
|     @click="$emit('click', label)" |  | ||||||
|   > |  | ||||||
|     {{ label }} |  | ||||||
|   </button> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
|   name: "CopilotButton", |  | ||||||
|   props: { |  | ||||||
|     label: { |  | ||||||
|       type: String, |  | ||||||
|       required: true, |  | ||||||
|     }, |  | ||||||
|     active: { |  | ||||||
|       type: Boolean, |  | ||||||
|       default: false, |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|  |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style> |  | ||||||
|  |  | ||||||
| button { |  | ||||||
|   appearance: none; |  | ||||||
|   outline: none; |  | ||||||
|   border: none; |  | ||||||
|   background: none; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
|  |  | ||||||
| <style scoped> |  | ||||||
| .copilot-btn { |  | ||||||
|   /* flex: 1; */ |  | ||||||
|   /* position: relative; */ |  | ||||||
|   width: 88px; |  | ||||||
|   height: 32px; |  | ||||||
|   background: #01306C; |  | ||||||
|   /* border-radius: 4px 0px 0px 4px; */ |  | ||||||
|   backdrop-filter: blur(3px); |  | ||||||
|   /* text-align: center; |  | ||||||
|   padding: 12px; |  | ||||||
|   padding-left: 20px; |  | ||||||
|   color: #fff; |  | ||||||
|   font-size: 18px; */ |  | ||||||
|   font-family: PingFangSC, PingFang SC; |  | ||||||
|   font-weight: 400; |  | ||||||
|   font-size: 16px; |  | ||||||
|   color: #FFFFFF; |  | ||||||
|   line-height: 22px; |  | ||||||
|   letter-spacing: 5px; |  | ||||||
|   text-align: center; |  | ||||||
|   font-style: normal; |  | ||||||
|   letter-spacing: 10px; |  | ||||||
|   cursor: pointer; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .copilot-btn.active { |  | ||||||
|   background: #1D74D8; |  | ||||||
|   /* border-radius: 4px;; */ |  | ||||||
| } |  | ||||||
| /* .copilot-btn::before, |  | ||||||
| .copilot-btn::after { |  | ||||||
|   content: ""; |  | ||||||
|   position: absolute; |  | ||||||
|   width: 16px; |  | ||||||
|   height: 16px; |  | ||||||
|   top: 0; |  | ||||||
|   background: transparent; |  | ||||||
|   border-style: solid; |  | ||||||
|   border-width: 2px; |  | ||||||
|   border-color: transparent; |  | ||||||
|   border-top-color: #007be4; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .copilot-btn::before { |  | ||||||
|   left: 0; |  | ||||||
|   border-left-color: #007be4; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .copilot-btn::after { |  | ||||||
|   right: 0; |  | ||||||
|   border-right-color: #007be4; |  | ||||||
| } */ |  | ||||||
| </style> |  | ||||||
| @@ -1,148 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-07 08:37:17 |  | ||||||
|  * @LastEditTime: 2024-06-07 11:04:41 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
|   <button |  | ||||||
|     class="chart-btn" |  | ||||||
|     :class="[active ? 'active' : '']" |  | ||||||
|     @click="$emit('click', label)" |  | ||||||
|   > |  | ||||||
|     {{ label }} |  | ||||||
|   </button> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
|   name: "CopilotButton", |  | ||||||
|   props: { |  | ||||||
|     label: { |  | ||||||
|       type: String, |  | ||||||
|       required: true, |  | ||||||
|     }, |  | ||||||
|     active: { |  | ||||||
|       type: Boolean, |  | ||||||
|       default: false, |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style> |  | ||||||
| button { |  | ||||||
|   appearance: none; |  | ||||||
|   outline: none; |  | ||||||
|   border: none; |  | ||||||
|   background: none; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
|  |  | ||||||
| <style scoped> |  | ||||||
| .skate { |  | ||||||
|   /* flex: 1; */ |  | ||||||
|   position: relative; |  | ||||||
|   width: 88px; |  | ||||||
|   height: 32px; |  | ||||||
|   background: #01306C; |  | ||||||
|   /* border-radius: 4px 0px 0px 4px; */ |  | ||||||
|   backdrop-filter: blur(3px); |  | ||||||
|   /* text-align: center; |  | ||||||
|   padding: 12px; |  | ||||||
|   padding-left: 20px; |  | ||||||
|   color: #fff; |  | ||||||
|   font-size: 18px; */ |  | ||||||
|   font-family: PingFangSC, PingFang SC; |  | ||||||
|   font-weight: 400; |  | ||||||
|   font-size: 12px; |  | ||||||
|   color: #FFFFFF; |  | ||||||
|   line-height: 22px; |  | ||||||
|   letter-spacing: 5px; |  | ||||||
|   text-align: center; |  | ||||||
|   font-style: normal; |  | ||||||
|   /* margin-right: 1px; */ |  | ||||||
|   /* letter-spacing: 10px; */ |  | ||||||
|   cursor: pointer; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .chart-btn:nth-child(6)::after { |  | ||||||
|   content: ''; |  | ||||||
|   width: 0; |  | ||||||
|   height: 0; |  | ||||||
|   display: none; |  | ||||||
| } |  | ||||||
| .chart-btn { |  | ||||||
|   /* flex: 1; */ |  | ||||||
|   position: relative; |  | ||||||
|   width: 88px; |  | ||||||
|   height: 32px; |  | ||||||
|   background: #01306C; |  | ||||||
|   /* border-radius: 4px 0px 0px 4px; */ |  | ||||||
|   backdrop-filter: blur(3px); |  | ||||||
|   /* text-align: center; |  | ||||||
|   padding: 12px; |  | ||||||
|   padding-left: 20px; |  | ||||||
|   color: #fff; |  | ||||||
|   font-size: 18px; */ |  | ||||||
|   font-family: PingFangSC, PingFang SC; |  | ||||||
|   font-weight: 400; |  | ||||||
|   font-size: 12px; |  | ||||||
|   color: #FFFFFF; |  | ||||||
|   line-height: 22px; |  | ||||||
|   letter-spacing: 5px; |  | ||||||
|   text-align: center; |  | ||||||
|   font-style: normal; |  | ||||||
|   /* margin-right: 1px; */ |  | ||||||
|   /* letter-spacing: 10px; */ |  | ||||||
|   cursor: pointer; |  | ||||||
| } |  | ||||||
| .chart-btn::after { |  | ||||||
|   /* flex: 1; */ |  | ||||||
|   /* position: relative; */ |  | ||||||
|   content: ""; |  | ||||||
|   position: absolute; |  | ||||||
|     /* width: 16px; */ |  | ||||||
|     /* height: 16px; */ |  | ||||||
|   top: px; |  | ||||||
|   right: -1px; |  | ||||||
|   width: 1px; |  | ||||||
|   height: 23px; |  | ||||||
|   border: 1px solid #010D18; |  | ||||||
| } |  | ||||||
| .chart-btn.active { |  | ||||||
|   background: #1D74D8; |  | ||||||
|   /* border-radius: 4px;; */ |  | ||||||
| } |  | ||||||
| .chart-btn.active::after { |  | ||||||
|   display: none; |  | ||||||
|   /* border-radius: 4px;; */ |  | ||||||
| } |  | ||||||
| /* .copilot-btn::before, |  | ||||||
| .copilot-btn::after { |  | ||||||
|   content: ""; |  | ||||||
|   position: absolute; |  | ||||||
|   width: 16px; |  | ||||||
|   height: 16px; |  | ||||||
|   top: 0; |  | ||||||
|   background: transparent; |  | ||||||
|   border-style: solid; |  | ||||||
|   border-width: 2px; |  | ||||||
|   border-color: transparent; |  | ||||||
|   border-top-color: #007be4; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .copilot-btn::before { |  | ||||||
|   left: 0; |  | ||||||
|   border-left-color: #007be4; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .copilot-btn::after { |  | ||||||
|   right: 0; |  | ||||||
|   border-right-color: #007be4; |  | ||||||
| } */ |  | ||||||
| </style> |  | ||||||
| @@ -1,241 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-05 09:36:07 |  | ||||||
|  * @LastEditTime: 2024-06-05 09:38:23 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <!-- |  | ||||||
|     filename: Container.vue |  | ||||||
|     author: liubin |  | ||||||
|     date: 2024-04-09 10:44:09 |  | ||||||
|     description: |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
|   <div class="copilot-container"> |  | ||||||
|     <!-- refresh btn  --> |  | ||||||
|     <button |  | ||||||
|       v-if="false" |  | ||||||
|       style=" |  | ||||||
|         appearance: none; |  | ||||||
|         outline: none; |  | ||||||
|         border: none; |  | ||||||
|         background: none; |  | ||||||
|         color: #fff; |  | ||||||
|         cursor: pointer; |  | ||||||
|         position: absolute; |  | ||||||
|         top: 8px; |  | ||||||
|         right: 8px; |  | ||||||
|       " |  | ||||||
|       @click="$emit('refresh')" |  | ||||||
|     > |  | ||||||
|       <svg |  | ||||||
|         xmlns="http://www.w3.org/2000/svg" |  | ||||||
|         fill="none" |  | ||||||
|         viewBox="0 0 24 24" |  | ||||||
|         stroke-width="1.5" |  | ||||||
|         stroke="currentColor" |  | ||||||
|         style="width: 24px; height: 24px" |  | ||||||
|       > |  | ||||||
|         <path |  | ||||||
|           stroke-linecap="round" |  | ||||||
|           stroke-linejoin="round" |  | ||||||
|           d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" |  | ||||||
|         /> |  | ||||||
|       </svg> |  | ||||||
|     </button> |  | ||||||
|     <!-- decoration  --> |  | ||||||
|     <div class="corner tl"></div> |  | ||||||
|     <div class="corner tr"></div> |  | ||||||
|     <div  class="corner bl"></div> |  | ||||||
|     <div  class="corner br"></div> |  | ||||||
|     <!-- content  --> |  | ||||||
|     <div |  | ||||||
|       class="container-head" |  | ||||||
|       :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']" |  | ||||||
|     > |  | ||||||
|       <Icon :icon="icon"></Icon> |  | ||||||
|       <h2 class="container-title">{{ title }}</h2> |  | ||||||
|     </div> |  | ||||||
|     <div |  | ||||||
|       class="container-body" |  | ||||||
|       :class="[ |  | ||||||
|         side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left', |  | ||||||
|       ]" |  | ||||||
|     > |  | ||||||
|       <slot /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import ContainerIconVue from "./ContainerIcon.vue"; |  | ||||||
| export default { |  | ||||||
|   name: "DashboardContainer", |  | ||||||
|   components: { |  | ||||||
|     Icon: ContainerIconVue, |  | ||||||
|   }, |  | ||||||
|   props: { |  | ||||||
|     side: { |  | ||||||
|       type: String, |  | ||||||
|       default: "left", |  | ||||||
|     }, |  | ||||||
|     icon: { |  | ||||||
|       type: String, |  | ||||||
|       default: "cube", |  | ||||||
|     }, |  | ||||||
|     title: { |  | ||||||
|       type: String, |  | ||||||
|       default: "Default Title", |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return {}; |  | ||||||
|   }, |  | ||||||
|   computed: {}, |  | ||||||
|   methods: {}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped lang="scss"> |  | ||||||
| .copilot-container { |  | ||||||
|   height: 0; |  | ||||||
|   flex: 1; |  | ||||||
|   display: flex; |  | ||||||
|   flex-direction: column; |  | ||||||
|   position: relative; |  | ||||||
|   box-shadow: inset 0 0 20px 1px #fff1; |  | ||||||
|   backdrop-filter: blur(4px); |  | ||||||
|  |  | ||||||
|   &::before { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     height: 100%; |  | ||||||
|     width: 0.11415vw; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     top: 0%; |  | ||||||
|     left: 0; |  | ||||||
|     background: radial-gradient( |  | ||||||
|       circle at center, |  | ||||||
|       #024798 2%, |  | ||||||
|       #024798 30%, |  | ||||||
|       transparent |  | ||||||
|     ); |  | ||||||
|     z-index: 1; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   &::after { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 60%; |  | ||||||
|     height: 0.31415vh; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     left: 8%; |  | ||||||
|     bottom: 0; |  | ||||||
|     background: linear-gradient(to right, #024798, transparent); |  | ||||||
|     z-index: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-head { |  | ||||||
|     // height: 40px; |  | ||||||
|     height: 3.8vh; |  | ||||||
|     padding: 8px; |  | ||||||
|     display: flex; |  | ||||||
|     align-items: center; |  | ||||||
|     gap: 8px; |  | ||||||
|  |  | ||||||
|     .container-title { |  | ||||||
|       font-size: 1.18vw; |  | ||||||
|       line-height: 1.39vw; |  | ||||||
|       font-weight: normal; |  | ||||||
|       letter-spacing: 2px; |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-body { |  | ||||||
|     padding: 12px; |  | ||||||
|     display: flex; |  | ||||||
|     flex-direction: column; |  | ||||||
|     flex: 1; |  | ||||||
|     height: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner { |  | ||||||
|     z-index: 1; |  | ||||||
|     position: absolute; |  | ||||||
|     // width: 16px; |  | ||||||
|     // height: 16px; |  | ||||||
|     width: 0.95vw; |  | ||||||
|     height: 0.95vw; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tl { |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-left: 2px solid #0175dc; |  | ||||||
|     top: 0; |  | ||||||
|     left: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tr { |  | ||||||
|     top: 0; |  | ||||||
|     right: 0; |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-right: 2px solid #0175dc; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.bl { |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     bottom: 0; |  | ||||||
|     left: 0; |  | ||||||
|     // border-left: 10px solid #0175dc; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid transparent; |  | ||||||
|     border-left: 0.532vw solid transparent; |  | ||||||
|     border-bottom: .6vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid transparent; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.br { |  | ||||||
|     bottom: 0; |  | ||||||
|     right: 0; |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     border-left: 0.532vw solid transparent; |  | ||||||
|     border-bottom: 0.532vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid #0175dc; |  | ||||||
|     // border-left: 10px solid transparent; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid #0175dc; |  | ||||||
|     // transform: rotate(-90deg); |  | ||||||
|  |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0003, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0003, transparent); |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,234 +0,0 @@ | |||||||
| <!-- |  | ||||||
|     filename: Container.vue |  | ||||||
|     author: liubin |  | ||||||
|     date: 2024-04-09 10:44:09 |  | ||||||
|     description: |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
|   <div class="copilot-container"> |  | ||||||
|     <!-- refresh btn  --> |  | ||||||
|     <button v-if="false" style=" |  | ||||||
|         appearance: none; |  | ||||||
|         outline: none; |  | ||||||
|         border: none; |  | ||||||
|         background: none; |  | ||||||
|         color: #fff; |  | ||||||
|         cursor: pointer; |  | ||||||
|         position: absolute; |  | ||||||
|         top: 8px; |  | ||||||
|         right: 8px; |  | ||||||
|       " @click="$emit('refresh')"> |  | ||||||
|       <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" |  | ||||||
|         style="width: 24px; height: 24px"> |  | ||||||
|         <path stroke-linecap="round" stroke-linejoin="round" |  | ||||||
|           d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" /> |  | ||||||
|       </svg> |  | ||||||
|     </button> |  | ||||||
|     <!-- decoration  --> |  | ||||||
|     <div class="corner tl"></div> |  | ||||||
|     <div class="corner tr"></div> |  | ||||||
|     <div class="corner bl"></div> |  | ||||||
|     <div class="corner br"></div> |  | ||||||
|     <!-- content  --> |  | ||||||
|     <div class="container-head" ref="container-head" |  | ||||||
|       :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']"> |  | ||||||
|       <Icon :icon="icon"></Icon> |  | ||||||
|       <h2 class="container-title">{{ title }}</h2> |  | ||||||
|       <div class="button-than" style="margin-left: auto;"> |  | ||||||
|         <CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than" |  | ||||||
|           @click="() => $emit('update:than', i)" /> |  | ||||||
|       </div> |  | ||||||
|     </div> |  | ||||||
|     <div class="container-body" :class="[ |  | ||||||
|       side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left', |  | ||||||
|     ]"> |  | ||||||
|       <slot /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import ContainerIconVue from "./ContainerIcon.vue" |  | ||||||
| import CopilotButton from "./button.vue" |  | ||||||
| export default { |  | ||||||
|   name: "DashboardContainer", |  | ||||||
|   components: { |  | ||||||
|     Icon: ContainerIconVue, |  | ||||||
|     CopilotButton |  | ||||||
|   }, |  | ||||||
|   props: { |  | ||||||
|     side: { |  | ||||||
|       type: String, |  | ||||||
|       default: "left", |  | ||||||
|     }, |  | ||||||
|     icon: { |  | ||||||
|       type: String, |  | ||||||
|       default: "cube", |  | ||||||
|     }, |  | ||||||
|     than: { |  | ||||||
|       type: String, |  | ||||||
|     }, |  | ||||||
|     title: { |  | ||||||
|       type: String, |  | ||||||
|       default: "Default Title", |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   computed: {}, |  | ||||||
|   mounted() { |  | ||||||
|     this.$nextTick(() => { |  | ||||||
|       let button = document.getElementsByClassName('button-than') |  | ||||||
|       console.log(button); |  | ||||||
|       button[0].children[0].style.borderRadius = '4px 0 0 4px' |  | ||||||
|       button[0].children[1].style.borderRadius = '0px 4px 4px 0' |  | ||||||
|       console.log(button[0].children[0].style); |  | ||||||
|     }) |  | ||||||
|   }, |  | ||||||
|   methods: {}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped lang="scss"> |  | ||||||
| .copilot-container { |  | ||||||
|   height: 0; |  | ||||||
|   flex: 1; |  | ||||||
|   display: flex; |  | ||||||
|   flex-direction: column; |  | ||||||
|   position: relative; |  | ||||||
|   box-shadow: inset 0 0 20px 1px #fff1; |  | ||||||
|   backdrop-filter: blur(4px); |  | ||||||
|  |  | ||||||
|   &::before { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     height: 100%; |  | ||||||
|     width: 0.11415vw; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     top: 0%; |  | ||||||
|     left: 0; |  | ||||||
|     background: radial-gradient( |  | ||||||
|       circle at center, |  | ||||||
|       #024798 2%, |  | ||||||
|       #024798 30%, |  | ||||||
|       transparent |  | ||||||
|     ); |  | ||||||
|     z-index: 1; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   &::after { |  | ||||||
|     content: ""; |  | ||||||
|     position: absolute; |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 60%; |  | ||||||
|     height: 0.31415vh; |  | ||||||
|     border-radius: 2px; |  | ||||||
|     left: 8%; |  | ||||||
|     bottom: 0; |  | ||||||
|     background: linear-gradient(to right, #024798, transparent); |  | ||||||
|     z-index: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-head { |  | ||||||
|     // height: 40px; |  | ||||||
|     height: 3.8vh; |  | ||||||
|     padding: 8px; |  | ||||||
|     display: flex; |  | ||||||
|     align-items: center; |  | ||||||
|     gap: 8px; |  | ||||||
|  |  | ||||||
|     .container-title { |  | ||||||
|       font-size: 1.18vw; |  | ||||||
|       line-height: 1.39vw; |  | ||||||
|       font-weight: normal; |  | ||||||
|       letter-spacing: 2px; |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .container-body { |  | ||||||
|     padding: 12px; |  | ||||||
|     display: flex; |  | ||||||
|     flex-direction: column; |  | ||||||
|     flex: 1; |  | ||||||
|     height: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner { |  | ||||||
|     z-index: 1; |  | ||||||
|     position: absolute; |  | ||||||
|     // width: 16px; |  | ||||||
|     // height: 16px; |  | ||||||
|     width: 0.95vw; |  | ||||||
|     height: 0.95vw; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tl { |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-left: 2px solid #0175dc; |  | ||||||
|     top: 0; |  | ||||||
|     left: 0; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.tr { |  | ||||||
|     top: 0; |  | ||||||
|     right: 0; |  | ||||||
|     border-top: 2px solid #0175dc; |  | ||||||
|     border-right: 2px solid #0175dc; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.bl { |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     bottom: 0; |  | ||||||
|     left: 0; |  | ||||||
|     // border-left: 10px solid #0175dc; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid transparent; |  | ||||||
|     border-left: 0.532vw solid #0175dc; |  | ||||||
|     border-bottom: 0.532vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid transparent; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .corner.br { |  | ||||||
|     bottom: 0; |  | ||||||
|     right: 0; |  | ||||||
|     // width: 20px; |  | ||||||
|     // height: 20px; |  | ||||||
|     width: 1.064vw; |  | ||||||
|     height: 1.064vw; |  | ||||||
|     // border-left: 10px solid transparent; |  | ||||||
|     // border-bottom: 10px solid #0175dc; |  | ||||||
|     // border-top: 10px solid transparent; |  | ||||||
|     // border-right: 10px solid #0175dc; |  | ||||||
|     // transform: rotate(-90deg); |  | ||||||
|     border-left: 0.532vw solid transparent; |  | ||||||
|     border-bottom: .6vw solid #0175dc; |  | ||||||
|     border-top: 0.532vw solid transparent; |  | ||||||
|     border-right: 0.532vw solid transparent; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0c3f68cc, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-right { |  | ||||||
|     background: linear-gradient(to right, #0003, transparent); |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .body-gradient-to-left { |  | ||||||
|     background: linear-gradient(to left, #0003, transparent); |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -4,13 +4,13 @@ | |||||||
|       @update:than="updateThan" @update:period="updatePeriod" /> |       @update:than="updateThan" @update:period="updatePeriod" /> | ||||||
|     <div class="factory-section"> |     <div class="factory-section"> | ||||||
|       <section class="top flex"> |       <section class="top flex"> | ||||||
|         <db-container title="生产监控" icon="prod" @update:than="updateThan" :than="than"> |         <db-container title="生产监控" icon="prod"> | ||||||
|           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" |           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" | ||||||
|             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> |             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> | ||||||
|         </db-container> |         </db-container> | ||||||
|         <left-container title="工单监控" icon="order"> |         <db-container title="工单监控" icon="order"> | ||||||
|           <order @update:type="updateType" :type="type" :prodOrder="prodOrder" /> |           <order :prodOrder="prodOrder" /> | ||||||
|         </left-container> |         </db-container> | ||||||
|         <!-- <db-container title="" icon="store"> --> |         <!-- <db-container title="" icon="store"> --> | ||||||
|         <!-- <store :stock="stock" /> --> |         <!-- <store :stock="stock" /> --> | ||||||
|         <!-- </db-container> --> |         <!-- </db-container> --> | ||||||
| @@ -26,8 +26,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| import Container from "./components/rightContainer.vue"; | import Container from "./components/Container.vue"; | ||||||
| import leftContainer from "./components/leftContainer.vue"; |  | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import { deepClone } from "@/utils"; | import { deepClone } from "@/utils"; | ||||||
| // import Store from "./components/Store.vue"; | // import Store from "./components/Store.vue"; | ||||||
| @@ -39,7 +38,6 @@ export default { | |||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     DbContainer: Container, |     DbContainer: Container, | ||||||
|     LeftContainer: leftContainer, |  | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     // Store, |     // Store, | ||||||
|     // Energy, |     // Energy, | ||||||
| @@ -47,7 +45,6 @@ export default { | |||||||
|   }, |   }, | ||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       type: '目标产量', |  | ||||||
|       companyId: 1, |       companyId: 1, | ||||||
|       companyName: "邯郸中建材光电材料有限公司", |       companyName: "邯郸中建材光电材料有限公司", | ||||||
|       period: 1, |       period: 1, | ||||||
| @@ -76,10 +73,6 @@ export default { | |||||||
|     this.getMes(); |     this.getMes(); | ||||||
|   }, |   }, | ||||||
|   methods: { |   methods: { | ||||||
|     updateType(val) { |  | ||||||
|       console.log(val) |  | ||||||
|       this.type = val |  | ||||||
|     }, |  | ||||||
|     updateCompany(obj) { |     updateCompany(obj) { | ||||||
|       this.companyId = obj.companyId; |       this.companyId = obj.companyId; | ||||||
|       this.companyName = obj.companyName; |       this.companyName = obj.companyName; | ||||||
|   | |||||||
| @@ -1,16 +1,16 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="factory-layout"> |   <div class="factory-layout"> | ||||||
|     <FactoryDataHeader :companyName="companyName" :companyId="companyId" :period="period" |     <FactoryDataHeader :than="than" :companyName="companyName" :companyId="companyId" :period="period" | ||||||
|       @update:period="updatePeriod" /> |       @update:than="updateThan" @update:period="updatePeriod" /> | ||||||
|     <div class="factory-section"> |     <div class="factory-section"> | ||||||
|       <section class="top flex"> |       <section class="top flex"> | ||||||
|         <db-container title="生产监控" icon="prod" @update:than="updateThan" :than="than"> |         <db-container title="生产监控" icon="prod"> | ||||||
|           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" |           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" | ||||||
|             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> |             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> | ||||||
|         </db-container> |         </db-container> | ||||||
|         <left-container title="工单监控" icon="order"> |         <db-container title="工单监控" icon="order"> | ||||||
|           <order @update:type="updateType" :type="type" :prodOrder="prodOrder" /> |           <order :prodOrder="prodOrder" /> | ||||||
|         </left-container> |         </db-container> | ||||||
|         <!-- <db-container title="" icon="store"> --> |         <!-- <db-container title="" icon="store"> --> | ||||||
|         <!-- <store :stock="stock" /> --> |         <!-- <store :stock="stock" /> --> | ||||||
|         <!-- </db-container> --> |         <!-- </db-container> --> | ||||||
| @@ -26,9 +26,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| import Container from "./components/rightContainer.vue"; | import Container from "./components/Container.vue"; | ||||||
| import leftContainer from "./components/leftContainer.vue"; |  | ||||||
|  |  | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import { deepClone } from "@/utils"; | import { deepClone } from "@/utils"; | ||||||
| // import Store from "./components/Store.vue"; | // import Store from "./components/Store.vue"; | ||||||
| @@ -40,7 +38,6 @@ export default { | |||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     DbContainer: Container, |     DbContainer: Container, | ||||||
|     LeftContainer:leftContainer, |  | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     // Store, |     // Store, | ||||||
|     // Energy, |     // Energy, | ||||||
| @@ -49,7 +46,6 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       companyId: 0, |       companyId: 0, | ||||||
|       type:'目标产量', |  | ||||||
|       companyName: "瑞昌中建材光电材料有限公司", |       companyName: "瑞昌中建材光电材料有限公司", | ||||||
|       period: 1, |       period: 1, | ||||||
|       show:false, |       show:false, | ||||||
| @@ -77,10 +73,6 @@ export default { | |||||||
|     this.getMes(); |     this.getMes(); | ||||||
|   }, |   }, | ||||||
|   methods: { |   methods: { | ||||||
|     updateType(val) { |  | ||||||
|       console.log(val) |  | ||||||
|       this.type = val |  | ||||||
|     }, |  | ||||||
|     updateCompany(obj) { |     updateCompany(obj) { | ||||||
|       this.companyId = obj.companyId; |       this.companyId = obj.companyId; | ||||||
|       this.companyName = obj.companyName; |       this.companyName = obj.companyName; | ||||||
| @@ -89,7 +81,7 @@ export default { | |||||||
|     updateThan(val) { |     updateThan(val) { | ||||||
|       console.log(val); |       console.log(val); | ||||||
|       this.than = val; |       this.than = val; | ||||||
|       this.getMes() |       // this.getMes(); | ||||||
|     }, |     }, | ||||||
|     updatePeriod(val) { |     updatePeriod(val) { | ||||||
|       this.period = val; |       this.period = val; | ||||||
|   | |||||||
| @@ -8,9 +8,9 @@ | |||||||
|           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" |           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" | ||||||
|             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> |             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> | ||||||
|         </db-container> |         </db-container> | ||||||
|         <left-container title="工单监控" icon="order"> |         <db-container title="工单监控" icon="order"> | ||||||
|           <order :prodOrder="prodOrder" /> |           <order :prodOrder="prodOrder" /> | ||||||
|         </left-container> |         </db-container> | ||||||
|         <!-- <db-container title="" icon="store"> --> |         <!-- <db-container title="" icon="store"> --> | ||||||
|         <!-- <store :stock="stock" /> --> |         <!-- <store :stock="stock" /> --> | ||||||
|         <!-- </db-container> --> |         <!-- </db-container> --> | ||||||
| @@ -26,8 +26,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| import Container from "./components/rightContainer.vue"; | import Container from "./components/Container.vue"; | ||||||
| import leftContainer from "./components/leftContainer.vue"; |  | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import { deepClone } from "@/utils"; | import { deepClone } from "@/utils"; | ||||||
| // import Store from "./components/Store.vue"; | // import Store from "./components/Store.vue"; | ||||||
| @@ -39,7 +38,6 @@ export default { | |||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     DbContainer: Container, |     DbContainer: Container, | ||||||
|     LeftContainer: leftContainer, |  | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     // Store, |     // Store, | ||||||
|     // Energy, |     // Energy, | ||||||
|   | |||||||
| @@ -8,9 +8,9 @@ | |||||||
|           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" |           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" | ||||||
|             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> |             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> | ||||||
|         </db-container> |         </db-container> | ||||||
|         <left-container title="工单监控" icon="order"> |         <db-container title="工单监控" icon="order"> | ||||||
|           <order :prodOrder="prodOrder" /> |           <order :prodOrder="prodOrder" /> | ||||||
|         </left-container> |         </db-container> | ||||||
|         <!-- <db-container title="" icon="store"> --> |         <!-- <db-container title="" icon="store"> --> | ||||||
|         <!-- <store :stock="stock" /> --> |         <!-- <store :stock="stock" /> --> | ||||||
|         <!-- </db-container> --> |         <!-- </db-container> --> | ||||||
| @@ -26,8 +26,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| import Container from "./components/rightContainer.vue"; | import Container from "./components/Container.vue"; | ||||||
| import leftContainer from "./components/leftContainer.vue"; |  | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import { deepClone } from "@/utils"; | import { deepClone } from "@/utils"; | ||||||
| // import Store from "./components/Store.vue"; | // import Store from "./components/Store.vue"; | ||||||
| @@ -39,7 +38,6 @@ export default { | |||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     DbContainer: Container, |     DbContainer: Container, | ||||||
|     LeftContainer: leftContainer, |  | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     // Store, |     // Store, | ||||||
|     // Energy, |     // Energy, | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-21 13:24:03 |  * @Date: 2024-05-21 13:24:03 | ||||||
|  * @LastEditTime: 2024-06-05 09:43:30 |  * @LastEditTime: 2024-05-21 13:24:03 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -37,7 +37,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| // import Container from "./components/Container.vue"; | import Container from "./components/Container.vue"; | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import Store from "./components/Store.vue"; | import Store from "./components/Store.vue"; | ||||||
| import Energy from "./components/Energy.vue"; | import Energy from "./components/Energy.vue"; | ||||||
| @@ -47,7 +47,7 @@ export default { | |||||||
|   name: "factoryData", |   name: "factoryData", | ||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     // DbContainer: Container, |     DbContainer: Container, | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     Store, |     Store, | ||||||
|     Energy, |     Energy, | ||||||
|   | |||||||
| @@ -8,9 +8,9 @@ | |||||||
|           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" |           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" | ||||||
|             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> |             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> | ||||||
|         </db-container> |         </db-container> | ||||||
|         <left-container title="工单监控" icon="order"> |         <db-container title="工单监控" icon="order"> | ||||||
|           <order :prodOrder="prodOrder" /> |           <order :prodOrder="prodOrder" /> | ||||||
|         </left-container> |         </db-container> | ||||||
|         <!-- <db-container title="" icon="store"> --> |         <!-- <db-container title="" icon="store"> --> | ||||||
|         <!-- <store :stock="stock" /> --> |         <!-- <store :stock="stock" /> --> | ||||||
|         <!-- </db-container> --> |         <!-- </db-container> --> | ||||||
| @@ -26,9 +26,7 @@ | |||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | import FactoryDataHeader from "./../components/FactoryDataHeader.vue"; | ||||||
| import Container from "./components/rightContainer.vue"; | import Container from "./components/Container.vue"; | ||||||
| import leftContainer from "./components/leftContainer.vue"; |  | ||||||
|  |  | ||||||
| import ProdMonitor from "./components/ProdMonitor.vue"; | import ProdMonitor from "./components/ProdMonitor.vue"; | ||||||
| import { deepClone } from "@/utils"; | import { deepClone } from "@/utils"; | ||||||
| // import Store from "./components/Store.vue"; | // import Store from "./components/Store.vue"; | ||||||
| @@ -40,7 +38,6 @@ export default { | |||||||
|   components: { |   components: { | ||||||
|     FactoryDataHeader, |     FactoryDataHeader, | ||||||
|     DbContainer: Container, |     DbContainer: Container, | ||||||
|     LeftContainer: leftContainer, |  | ||||||
|     ProdMonitor, |     ProdMonitor, | ||||||
|     // Store, |     // Store, | ||||||
|     // Energy, |     // Energy, | ||||||
|   | |||||||
| @@ -23,10 +23,7 @@ export default { | |||||||
|   components: { BarChartBase }, |   components: { BarChartBase }, | ||||||
|   data() { |   data() { | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["瑞昌", "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|  |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       xAxis: cities, |       xAxis: cities, | ||||||
|     }; |     }; | ||||||
| @@ -45,11 +42,8 @@ export default { | |||||||
|     legend() { |     legend() { | ||||||
|       let items = []; |       let items = []; | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |       //今天的时间 | ||||||
|       // var day2 = new Date(); |       // var day2 = new Date(); | ||||||
|       // day2.setTime(day2.getTime()); |       // day2.setTime(day2.getTime()); | ||||||
| @@ -61,17 +55,17 @@ export default { | |||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" }, |           { label: `去年${month}月${today}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${dayBeYes}日`, color: "#12f7f1" }, |           { label: `${yesterday}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年本周`, color: "#12f7f1" }, |           { label: `去年本周`, color: "#12f7f1" }, | ||||||
|           { label: `本周`, color: "#58adfa" }, |           { label: `本周`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
| @@ -81,7 +75,7 @@ export default { | |||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |       } else if (this.period === '月' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年${month}月`, color: "#12f7f1" }, |           { label: `去年${month}月`, color: "#12f7f1" }, | ||||||
|           { label: `${month}月`, color: "#58adfa" }, |           { label: `${month}月`, color: "#58adfa" }, | ||||||
|           // { label: `${month}月目标`, value: valueTuple[2] }, |           // { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
|         ]; |         ]; | ||||||
| @@ -152,11 +146,8 @@ export default { | |||||||
| function getTemplate(period, dataList,than) { | function getTemplate(period, dataList,than) { | ||||||
|   let items = []; |   let items = []; | ||||||
|   var day1 = new Date(); |   var day1 = new Date(); | ||||||
|   var day2 = new Date(); |   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|   day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|   var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|   //今天的时间 |   //今天的时间 | ||||||
|   // var day2 = new Date(); |   // var day2 = new Date(); | ||||||
|   // day2.setTime(day2.getTime()); |   // day2.setTime(day2.getTime()); | ||||||
| @@ -169,11 +160,11 @@ function getTemplate(period, dataList,than) { | |||||||
|   if (period === '日' && than === '同比') { |   if (period === '日' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year - 1}年${yesterday}日`, |         name: `去年${month}月${today}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -181,11 +172,11 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '日' && than === '环比') { |   } else if (period === '日' && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${dayBeYes}日`, |         name: `${yesterday}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -193,7 +184,7 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '周' && than === '同比') { |   } else if (period === '周' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年本周`, |         name: `去年本周`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
| @@ -217,7 +208,7 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '月' && than === '同比') { |   } else if (period === '月' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年${month}月`, |         name: `去年${month}月`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|   | |||||||
| @@ -23,10 +23,7 @@ export default { | |||||||
|   components: { BarChartBase }, |   components: { BarChartBase }, | ||||||
|   data() { |   data() { | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["瑞昌", "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|  |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       xAxis: cities, |       xAxis: cities, | ||||||
|     }; |     }; | ||||||
| @@ -45,11 +42,8 @@ export default { | |||||||
|     legend() { |     legend() { | ||||||
|       let items = []; |       let items = []; | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |       //今天的时间 | ||||||
|       // var day2 = new Date(); |       // var day2 = new Date(); | ||||||
|       // day2.setTime(day2.getTime()); |       // day2.setTime(day2.getTime()); | ||||||
| @@ -61,17 +55,17 @@ export default { | |||||||
|       const year = new Date().getFullYear(); |       const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" }, |           { label: `去年${month}月${today}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${dayBeYes}日`, color: "#12f7f1" }, |           { label: `${yesterday}日`, color: "#12f7f1" }, | ||||||
|           { label: `${yesterday}日`, color: "#58adfa" }, |           { label: `${month}月${today}日`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年本周`, color: "#12f7f1" }, |           { label: `去年本周`, color: "#12f7f1" }, | ||||||
|           { label: `本周`, color: "#58adfa" }, |           { label: `本周`, color: "#58adfa" }, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
| @@ -81,7 +75,7 @@ export default { | |||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |       } else if (this.period === '月' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${year-1}年${month}月`, color: "#12f7f1" }, |           { label: `去年${month}月`, color: "#12f7f1" }, | ||||||
|           { label: `${month}月`, color: "#58adfa" }, |           { label: `${month}月`, color: "#58adfa" }, | ||||||
|           // { label: `${month}月目标`, value: valueTuple[2] }, |           // { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
|         ]; |         ]; | ||||||
| @@ -153,15 +147,9 @@ export default { | |||||||
|  |  | ||||||
| function getTemplate(period, dataList,than) { | function getTemplate(period, dataList,than) { | ||||||
|   let items = []; |   let items = []; | ||||||
|   // var day1 = new Date(); |  | ||||||
|   // day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); |  | ||||||
|   // var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |  | ||||||
|   var day1 = new Date(); |   var day1 = new Date(); | ||||||
|   var day2 = new Date(); |   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|   day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|   var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|   //今天的时间 |   //今天的时间 | ||||||
|   // var day2 = new Date(); |   // var day2 = new Date(); | ||||||
|   // day2.setTime(day2.getTime()); |   // day2.setTime(day2.getTime()); | ||||||
| @@ -174,11 +162,11 @@ function getTemplate(period, dataList,than) { | |||||||
|   if (period === '日' && than === '同比') { |   if (period === '日' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year - 1}年${yesterday}日`, |         name: `去年${month}月${today}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -186,11 +174,11 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '日' && than === '环比') { |   } else if (period === '日' && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${dayBeYes}日`, |         name: `${yesterday}日`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|         name: `${yesterday}日`, |         name: `${month}月${today}日`, | ||||||
|         data: dataList ? dataList[1] : [], |         data: dataList ? dataList[1] : [], | ||||||
|         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), |         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), | ||||||
|       }, |       }, | ||||||
| @@ -198,7 +186,7 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '周' && than === '同比') { |   } else if (period === '周' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年本周`, |         name: `去年本周`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
| @@ -222,7 +210,7 @@ function getTemplate(period, dataList,than) { | |||||||
|   } else if (period === '月' && than === '同比') { |   } else if (period === '月' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { |       { | ||||||
|         name: `${year-1}年${month}月`, |         name: `去年${month}月`, | ||||||
|         data: dataList ? dataList[0] : [], |         data: dataList ? dataList[0] : [], | ||||||
|       }, |       }, | ||||||
|       { |       { | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-20 13:32:59 |  * @Date: 2024-05-20 13:32:59 | ||||||
|  * @LastEditTime: 2024-06-17 16:42:12 |  * @LastEditTime: 2024-05-30 13:35:00 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -78,13 +78,13 @@ export default { | |||||||
|     valueTuple() { |     valueTuple() { | ||||||
|       // [previousValue, currentValue, sumValue?] |       // [previousValue, currentValue, sumValue?] | ||||||
|       const getter = this.$store.getters.copilot.yield[this.dataSourceField]; |       const getter = this.$store.getters.copilot.yield[this.dataSourceField]; | ||||||
|       // if (this.period === "日" || this.period === "周") { |       if (this.period === "日" || this.period === "周") { | ||||||
|       //   console.log(this.period) |         console.log(this.period) | ||||||
|       //   return [ |         return [ | ||||||
|       //     getter.previous[this.factoryId], |           getter.previous[this.factoryId], | ||||||
|       //     getter.current[this.factoryId], |           getter.current[this.factoryId], | ||||||
|       //   ]; |         ]; | ||||||
|       // } |       } | ||||||
|       // [100, 200, 200] |       // [100, 200, 200] | ||||||
|       return [ |       return [ | ||||||
|         getter.previous[this.factoryId], |         getter.previous[this.factoryId], | ||||||
| @@ -100,11 +100,8 @@ export default { | |||||||
|       const vt = this.valueTuple; |       const vt = this.valueTuple; | ||||||
|       let items = []; |       let items = []; | ||||||
|       var day1 = new Date(); |       var day1 = new Date(); | ||||||
|       var day2 = new Date(); |       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|       day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|       day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |       var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|       var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|       //今天的时间 |       //今天的时间 | ||||||
|       // var day2 = new Date(); |       // var day2 = new Date(); | ||||||
|       // day2.setTime(day2.getTime()); |       // day2.setTime(day2.getTime()); | ||||||
| @@ -116,32 +113,28 @@ export default { | |||||||
|       // const year = new Date().getFullYear(); |       // const year = new Date().getFullYear(); | ||||||
|       if (this.period === '日' && this.than === '同比') { |       if (this.period === '日' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${yesterday}日累计`,}, |           { label: `${month}月${today}日累计`,}, | ||||||
|           { label: `${year - 1}年${yesterday}累计` }, |           { label: `去年${month}月${today}日累计` }, | ||||||
|           { label: `${yesterday}日目标`, }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '日' && this.than === '环比') { |       } else if (this.period === '日' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|  |           { label: `${month}月${today}日累计`}, | ||||||
|           { label: `${yesterday}日累计`}, |           { label: `${yesterday}日累计`}, | ||||||
|           { label: `${dayBeYes}日累计` }, |  | ||||||
|           { label: `${yesterday}日目标`, }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '同比') { |       } else if (this.period === '周' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `本周累计`,}, |           { label: `本周累计`,}, | ||||||
|           { label: `${year-1}年本周累计` }, |           { label: `去年本周累计`}, | ||||||
|           { label: `本周目标`, }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '周' && this.than === '环比') { |       } else if (this.period === '周' && this.than === '环比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `本周累计`,}, |           { label: `本周累计`,}, | ||||||
|           { label: `上周累计`, }, |           { label: `上周累计`,}, | ||||||
|           { label: `本周目标`, }, |  | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '同比') { |       } else if (this.period === '月' && this.than === '同比') { | ||||||
|         items = [ |         items = [ | ||||||
|           { label: `${month}月累计`,}, |           { label: `${month}月累计`,}, | ||||||
|           { label: `${year-1}年${month}月累计`, }, |           { label: `去年${month}月累计`, }, | ||||||
|           { label: `${month}月目标`,}, |           { label: `${month}月目标`,}, | ||||||
|         ]; |         ]; | ||||||
|       } else if (this.period === '月' && this.than === '环比') { |       } else if (this.period === '月' && this.than === '环比') { | ||||||
| @@ -158,14 +151,13 @@ export default { | |||||||
|         ]; |         ]; | ||||||
|       } |       } | ||||||
|       let titleValue = |       let titleValue = | ||||||
|         vt[1] != null && (vt[2] !== 0 && vt[2] !== undefined) |           vt[0] != null && vt[2] != null && vt[2] !== 0 | ||||||
|           ? this.formatNumber((vt[1] / vt[2] * 100)) + '%' |             ? `${vt[1] / vt[2]}%` | ||||||
|           : (vt[1] != 0 && vt[1] != null) && vt[2] == 0 |             : "0%", | ||||||
|             ? "100%" : '0%', |  | ||||||
|         subtitle = |         subtitle = | ||||||
|           this.period == "日" ? `${yesterday}日累计完成值` : this.period == "周" ? `本周累计完成值` : this.period == "月" ? `${month}月累计完成值` : `${year}年累计完成值`; |       this.period == "日" ? `${month}月${today}日累计` : this.period == "周" ? `本周` : this.period == "月" ? `${month}月累计产出` : `${year}年累计产出`; | ||||||
|       console.log('titleValue', items) |       console.log(this.valueTuple[0], this.valueTuple[1], this.valueTuple[2],) | ||||||
|       // console.log(this.valueTuple[2]- this.valueTuple[1]) |       console.log(items) | ||||||
|       return getOptions({ |       return getOptions({ | ||||||
|         titleValue, |         titleValue, | ||||||
|         subtitle, |         subtitle, | ||||||
| @@ -173,7 +165,7 @@ export default { | |||||||
|         preName: items[1].label, |         preName: items[1].label, | ||||||
|         previousSum: this.valueTuple[0], |         previousSum: this.valueTuple[0], | ||||||
|         currentSum: this.valueTuple[1], |         currentSum: this.valueTuple[1], | ||||||
|         targetSum: this.valueTuple[2] ? this.valueTuple[2] :0, |         targetSum: this.valueTuple[2] ? this.valueTuple[2] :0 , | ||||||
|       }); |       }); | ||||||
|     }, |     }, | ||||||
|  |  | ||||||
| @@ -204,15 +196,6 @@ export default { | |||||||
|     } |     } | ||||||
|   }, |   }, | ||||||
|   methods: { |   methods: { | ||||||
|     formatNumber(num) { |  | ||||||
|       // 判断是否为整数 |  | ||||||
|       if (Number.isInteger(num)) { |  | ||||||
|         return num; // 如果是整数,直接转换为字符串 |  | ||||||
|       } else { |  | ||||||
|         // 如果不是整数,保留两位小数并转换为字符串 |  | ||||||
|         return num.toFixed(2); |  | ||||||
|       } |  | ||||||
|     } |  | ||||||
|     // fullscreen mixin 需要的回调 |     // fullscreen mixin 需要的回调 | ||||||
|     // fullscreenCallback(isFullscreen) { |     // fullscreenCallback(isFullscreen) { | ||||||
|     //   console.log("isFullscreen--->", isFullscreen); |     //   console.log("isFullscreen--->", isFullscreen); | ||||||
| @@ -220,16 +203,11 @@ export default { | |||||||
|   }, |   }, | ||||||
| }; | }; | ||||||
|  |  | ||||||
| function calculateItems(period, valueTuple, than) { | function calculateItems(period, valueTuple,than) { | ||||||
|   console.log('valueTuple', valueTuple); |  | ||||||
|   let items = []; |   let items = []; | ||||||
|   var day1 = new Date(); |   var day1 = new Date(); | ||||||
|   var day2 = new Date(); |   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); | ||||||
|   day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000) |  | ||||||
|   day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000) |  | ||||||
|   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() |   var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() | ||||||
|   var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate() |  | ||||||
|  |  | ||||||
|   //今天的时间 |   //今天的时间 | ||||||
|   // var day2 = new Date(); |   // var day2 = new Date(); | ||||||
|   // day2.setTime(day2.getTime()); |   // day2.setTime(day2.getTime()); | ||||||
| @@ -241,44 +219,40 @@ function calculateItems(period, valueTuple, than) { | |||||||
|   const year = new Date().getFullYear(); |   const year = new Date().getFullYear(); | ||||||
|   if (period === '日' && than === '同比') { |   if (period === '日' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { label: `${year - 1}年${yesterday}累计`, value: valueTuple[0] }, |       { label: `${month}月${today}日累计`, value: valueTuple[1] }, | ||||||
|       { label: `${yesterday}累计`, value: valueTuple[1] }, |       { label: `去年${month}月${today}日累计`, value: valueTuple[0] }, | ||||||
|       { label: `${yesterday}日目标`, value: valueTuple[2] }, |  | ||||||
|     ]; |     ]; | ||||||
|   } else if (period === '日' && than === '环比') { |   } else if (period === '日' && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { label: `${dayBeYes}日累计`, value: valueTuple[0] }, |       { label: `${month}月${today}日累计`, value: valueTuple[1] }, | ||||||
|       { label: `${yesterday}日累计`, value: valueTuple[1] }, |       { label: `${yesterday}日累计`, value: valueTuple[0] }, | ||||||
|       { label: `${yesterday}日目标`, value: valueTuple[2] }, |  | ||||||
|     ]; |     ]; | ||||||
|   } else if (period === '周' && than === '同比') { |   } else if (period === '周' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { label: `${year-1}年本周累计`, value: valueTuple[0] }, |  | ||||||
|       { label: `本周累计`, value: valueTuple[1] }, |       { label: `本周累计`, value: valueTuple[1] }, | ||||||
|       { label: `本周目标`, value: valueTuple[2] }, |       { label: `去年本周累计`, value: valueTuple[0] }, | ||||||
|     ]; |     ]; | ||||||
|   } else if (period === '周' && than === '环比') { |   } else if (period === '周' && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { label: `上周累计`, value: valueTuple[0] }, |  | ||||||
|       { label: `本周累计`, value: valueTuple[1] }, |       { label: `本周累计`, value: valueTuple[1] }, | ||||||
|       { label: `本周目标`, value: valueTuple[2] }, |       { label: `上周累计`, value: valueTuple[0] }, | ||||||
|     ]; |     ]; | ||||||
|   } else if (period === '月' && than === '同比') { |   } else if (period === '月' && than === '同比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { label: `${year-1}年${month}月累计`, value: valueTuple[0] }, |  | ||||||
|       { label: `${month}月累计`, value: valueTuple[1] }, |       { label: `${month}月累计`, value: valueTuple[1] }, | ||||||
|  |       { label: `去年${month}月累计`, value: valueTuple[0] }, | ||||||
|       { label: `${month}月目标`, value: valueTuple[2] }, |       { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
|     ]; |     ]; | ||||||
|   } else if (period === '月' && than === '环比') { |   } else if (period === '月' && than === '环比') { | ||||||
|     items = [ |     items = [ | ||||||
|       { label: `${lastMonth}月累计`, value: valueTuple[0] }, |  | ||||||
|       { label: `${month}月累计`, value: valueTuple[1] }, |       { label: `${month}月累计`, value: valueTuple[1] }, | ||||||
|  |       { label: `${lastMonth}月累计`, value: valueTuple[0] }, | ||||||
|       { label: `${month}月目标`, value: valueTuple[2] }, |       { label: `${month}月目标`, value: valueTuple[2] }, | ||||||
|     ]; |     ]; | ||||||
|   } else { |   } else { | ||||||
|     items = [ |     items = [ | ||||||
|       { label: `${year - 1}年累计`, value: valueTuple[0] }, |  | ||||||
|       { label: `${year}年累计`, value: valueTuple[1] }, |       { label: `${year}年累计`, value: valueTuple[1] }, | ||||||
|  |       { label: `${year - 1}年累计`, value: valueTuple[0] }, | ||||||
|       { label: `${year}年目标`, value: valueTuple[2] }, |       { label: `${year}年目标`, value: valueTuple[2] }, | ||||||
|     ]; |     ]; | ||||||
|   } |   } | ||||||
| @@ -340,17 +314,17 @@ function calculateItems(period, valueTuple, than) { | |||||||
|   left: -18px; |   left: -18px; | ||||||
| } | } | ||||||
|  |  | ||||||
| .legend-item:nth-child(2) .legend-item__label::before { | .legend-item:nth-child(1) .legend-item__label::before { | ||||||
|   background: #12fff5; |   background: #12fff5; | ||||||
| } | } | ||||||
| .legend-item:nth-child(2) .legend-item__value { | .legend-item:nth-child(1) .legend-item__value { | ||||||
|   color: #12fff5; |   color: #12fff5; | ||||||
| } | } | ||||||
|  |  | ||||||
| .legend-item:nth-child(1) .legend-item__label::before { | .legend-item:nth-child(2) .legend-item__label::before { | ||||||
|   background: #0f65ff; |   background: #0f65ff; | ||||||
| } | } | ||||||
| .legend-item:nth-child(1) .legend-item__value { | .legend-item:nth-child(2) .legend-item__value { | ||||||
|   color: #0f65ff; |   color: #0f65ff; | ||||||
| } | } | ||||||
|  |  | ||||||
|   | |||||||
| @@ -1,10 +1,10 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |     filename: DoubleRingWrapper.vue | ||||||
|  * @Date: 2024-05-30 16:00:50 |     author: liubin | ||||||
|  * @LastEditTime: 2024-06-03 16:26:03 |     date: 2024-04-17 09:55:12 | ||||||
|  * @LastEditors: zhp |     description: | ||||||
|  * @Description: |  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
|   <div class="double-ring-wrapper"> |   <div class="double-ring-wrapper"> | ||||||
|     <template> |     <template> | ||||||
| @@ -42,13 +42,13 @@ export default { | |||||||
|     return { |     return { | ||||||
|       factoryId: 4, // 默认成都 |       factoryId: 4, // 默认成都 | ||||||
|       cityOptions: [ |       cityOptions: [ | ||||||
|         // "成都", |         "成都", | ||||||
|         "邯郸", |         "邯郸", | ||||||
|         // "株洲", |         "株洲", | ||||||
|         "瑞昌", |         "瑞昌", | ||||||
|         // "佳木斯", |         "佳木斯", | ||||||
|         // "凯盛光伏", |         "凯盛光伏", | ||||||
|         // "蚌埠兴科", |         "蚌埠兴科", | ||||||
|       ], |       ], | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-24 15:15:00 |  * @Date: 2024-05-24 15:15:00 | ||||||
|  * @LastEditTime: 2024-05-31 16:16:16 |  * @LastEditTime: 2024-05-28 08:42:36 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -54,12 +54,12 @@ export default { | |||||||
|     return { |     return { | ||||||
|       factoryId: 4, // 默认成都 |       factoryId: 4, // 默认成都 | ||||||
|       cityOptions: [ |       cityOptions: [ | ||||||
|         // "成都", |         "成都", | ||||||
|         "邯郸", |         "邯郸", | ||||||
|         // "株洲", |         "株洲", | ||||||
|         // "佳木斯", |         "佳木斯", | ||||||
|         // "凯盛光伏", |         "凯盛光伏", | ||||||
|         // "蚌埠兴科", |         "蚌埠兴科", | ||||||
|       ], |       ], | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-05-10 11:10:54 |  * @Date: 2024-05-10 11:10:54 | ||||||
|  * @LastEditTime: 2024-06-05 09:49:46 |  * @LastEditTime: 2024-05-28 13:36:07 | ||||||
|  * @LastEditors: zhp |  * @LastEditors: zhp | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -9,32 +9,29 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="yield-copilot"> |   <div class="yield-copilot"> | ||||||
|     <section class="top flex"> |     <section class="top flex"> | ||||||
|       <right-container class="std-yield" title="标准组件产出" icon="std"> |       <db-container class="std-yield" title="标准组件产出" icon="std"> | ||||||
|         <std-output v-if="show" :period="period" :than="than" /> |         <std-output v-if="show" :period="period" :than="than" /> | ||||||
|       </right-container> |       </db-container> | ||||||
|       <db-container class="chip-yield" title="芯片产出" icon="chip2"> |       <db-container class="chip-yield" title="芯片产出" icon="chip2"> | ||||||
|         <chip-output v-if="show" :period="period" :than="than" /> |         <chip-output v-if="show" :period="period" :than="than" /> | ||||||
|       </db-container> |       </db-container> | ||||||
|       <left-container class="bipv-yield" title="BIPV产出" icon="bipv"> |       <db-container class="bipv-yield" title="BIPV产出" icon="bipv"> | ||||||
|         <bipv-output v-if="show" :period="period" :than="than" /> |         <bipv-output v-if="show" :period="period" :than="than" /> | ||||||
|       </left-container> |       </db-container> | ||||||
|     </section> |     </section> | ||||||
|     <section class="bottom flex"> |     <section class="bottom flex"> | ||||||
|       <right-container class="fto-involve" title="FTO投入"> |       <db-container class="fto-involve" title="FTO投入"> | ||||||
|         <fto-invest :period="period" :than="than" /> |         <fto-invest :period="period" :than="than" /> | ||||||
|       </right-container> |       </db-container> | ||||||
|       <left-container class="chip-involve" title="芯片投入" icon="chip"> |       <db-container class="chip-involve" title="芯片投入" icon="chip"> | ||||||
|         <chip-invest :period="period" :than="than" /> |         <chip-invest :period="period" :than="than" /> | ||||||
|       </left-container> |       </db-container> | ||||||
|     </section> |     </section> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import twoContainer from "@/views/copilot/components/twoContainer.vue"; | import Container from "@/views/copilot/components/Container.vue"; | ||||||
| import leftContainer from "@/views/copilot/components/leftContainer.vue"; |  | ||||||
| import rightContainer from "@/views/copilot/components/rightContainer.vue"; |  | ||||||
|  |  | ||||||
| import StdOutput from "./components/StdOutput.vue"; | import StdOutput from "./components/StdOutput.vue"; | ||||||
| import ChipOutput from "./components/ChipOutput.vue"; | import ChipOutput from "./components/ChipOutput.vue"; | ||||||
| import FtoInvest from "./components/FtoInvest.vue"; | import FtoInvest from "./components/FtoInvest.vue"; | ||||||
| @@ -44,9 +41,7 @@ import ChipInvest from "./components/ChipInvest.vue"; | |||||||
| export default { | export default { | ||||||
|   name: "YieldCopilot", |   name: "YieldCopilot", | ||||||
|   components: { |   components: { | ||||||
|     DbContainer: twoContainer, |     DbContainer: Container, | ||||||
|     leftContainer, |  | ||||||
|     rightContainer, |  | ||||||
|     StdOutput, |     StdOutput, | ||||||
|     ChipOutput, |     ChipOutput, | ||||||
|     BipvOutput, |     BipvOutput, | ||||||
|   | |||||||
| @@ -22,7 +22,7 @@ export default ({ | |||||||
|     textAlign: "center", |     textAlign: "center", | ||||||
|     textStyle: { |     textStyle: { | ||||||
|       fontWeight: 600, |       fontWeight: 600, | ||||||
|       fontSize: 20, |       fontSize: 32, | ||||||
|       color: "#fffd", |       color: "#fffd", | ||||||
|     }, |     }, | ||||||
|     subtext: `\u2002${subtitle}\u2002`, |     subtext: `\u2002${subtitle}\u2002`, | ||||||
| @@ -38,7 +38,7 @@ export default ({ | |||||||
|     { |     { | ||||||
|       type: "pie", |       type: "pie", | ||||||
|       name: "当前目标", |       name: "当前目标", | ||||||
|      radius: ["80%", "90%"], |       radius: ["70%", "85%"], | ||||||
|       center: ["45%", "52%"], |       center: ["45%", "52%"], | ||||||
|       emptyCircleStyle: { |       emptyCircleStyle: { | ||||||
|         color: "#042c5f33", |         color: "#042c5f33", | ||||||
| @@ -47,7 +47,7 @@ export default ({ | |||||||
|     // 数据 series |     // 数据 series | ||||||
|     { |     { | ||||||
|       type: "pie", |       type: "pie", | ||||||
|       radius: ["80%", "90%"], |       radius: ["70%", "85%"], | ||||||
|       center: ["45%", "52%"], |       center: ["45%", "52%"], | ||||||
|       avoidLabelOvervlap: false, |       avoidLabelOvervlap: false, | ||||||
|       label: { |       label: { | ||||||
| @@ -61,9 +61,6 @@ export default ({ | |||||||
|           value: currentSum, |           value: currentSum, | ||||||
|           name: currentName, |           name: currentName, | ||||||
|           selected: false, |           selected: false, | ||||||
|            tooltip: { |  | ||||||
|             formatter: `${currentName} : ${currentSum}` |  | ||||||
|           }, |  | ||||||
|           itemStyle: { |           itemStyle: { | ||||||
|             borderJoin: "round", |             borderJoin: "round", | ||||||
|             borderCap: "round", |             borderCap: "round", | ||||||
| @@ -83,11 +80,16 @@ export default ({ | |||||||
|           }, |           }, | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum), |           value: | ||||||
|           name: currentName, |             targetSum > currentSum | ||||||
|           tooltip: { |               ? targetSum - currentSum | ||||||
|             formatter: `${currentName} : ${currentSum}` |               : targetSum == 0 | ||||||
|           }, |               ? currentSum == 0 | ||||||
|  |                 ? 1 | ||||||
|  |                 : 0 | ||||||
|  |               : 0, | ||||||
|  |  | ||||||
|  |           name: "未达成累计", | ||||||
|           itemStyle: { color: "transparent" }, |           itemStyle: { color: "transparent" }, | ||||||
|           label: { show: false }, |           label: { show: false }, | ||||||
|         }, |         }, | ||||||
| @@ -96,7 +98,7 @@ export default ({ | |||||||
|     // 数据 series2 - 2023累计 |     // 数据 series2 - 2023累计 | ||||||
|     { |     { | ||||||
|       type: "pie", |       type: "pie", | ||||||
|       radius: ["70%", "80%"], |       radius: ["55%", "70%"], | ||||||
|       center: ["45%", "52%"], |       center: ["45%", "52%"], | ||||||
|       avoidLabelOvervlap: false, |       avoidLabelOvervlap: false, | ||||||
|       label: { |       label: { | ||||||
| @@ -110,9 +112,6 @@ export default ({ | |||||||
|           value: previousSum, |           value: previousSum, | ||||||
|           name: preName, |           name: preName, | ||||||
|           selected: false, |           selected: false, | ||||||
|           tooltip: { |  | ||||||
|             formatter: `${preName} : ${previousSum}` |  | ||||||
|           }, |  | ||||||
|           itemStyle: { |           itemStyle: { | ||||||
|             borderJoin: "round", |             borderJoin: "round", | ||||||
|             borderCap: "round", |             borderCap: "round", | ||||||
| @@ -132,12 +131,13 @@ export default ({ | |||||||
|           }, |           }, | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|  |           value: | ||||||
|           value:previousSum === 0 ? 1 : 0, |             targetSum > previousSum | ||||||
|           name: preName, |               ? targetSum - previousSum | ||||||
|            tooltip: { |               : previousSum == 0 | ||||||
|             formatter: `${preName} : ${previousSum}` |               ? 1 | ||||||
|           }, |               : 0, | ||||||
|  |           name: "-", | ||||||
|           itemStyle: { color: "transparent" }, |           itemStyle: { color: "transparent" }, | ||||||
|           label: { show: false }, |           label: { show: false }, | ||||||
|         }, |         }, | ||||||
|   | |||||||
| @@ -1,9 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|  * @Author: zhp |     filename: Bipv.vue | ||||||
|  * @Date: 2024-04-28 13:42:51 |     author: liubin | ||||||
|  * @LastEditTime: 2024-06-03 08:55:42 |     date: 2024-04-10 15:39:54 | ||||||
|  * @LastEditors: zhp |     description:  | ||||||
|  * @Description: |  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -25,10 +24,7 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     const year = new Date().getFullYear(); |     const year = new Date().getFullYear(); | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = [ "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|  |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       legend: [ |       legend: [ | ||||||
|         { label: `${year}年目标值`, color: "#f3c000" }, |         { label: `${year}年目标值`, color: "#f3c000" }, | ||||||
| @@ -74,15 +70,15 @@ export default { | |||||||
|       return [ |       return [ | ||||||
|         { |         { | ||||||
|           name: `${new Date().getFullYear()}年目标值`, |           name: `${new Date().getFullYear()}年目标值`, | ||||||
|           data: bipvOutput.target.splice(0, 1), |           data: bipvOutput.target, | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           name: `${new Date().getFullYear() - 1}年`, |           name: `${new Date().getFullYear() - 1}年`, | ||||||
|           data: bipvOutput.previous.splice(0, 1) |           data: bipvOutput.previous, | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           name: `${new Date().getFullYear()}年`, |           name: `${new Date().getFullYear()}年`, | ||||||
|           data: bipvOutput.current.splice(0, 1), |           data: bipvOutput.current, | ||||||
|         }, |         }, | ||||||
|       ]; |       ]; | ||||||
|     }, |     }, | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|     filename: chip-invest.vue |     filename: chip-invest.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-10 08:59:28 |     date: 2024-04-10 08:59:28 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -23,9 +23,7 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     const year = new Date().getFullYear(); |     const year = new Date().getFullYear(); | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["瑞昌", "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       legend: [ |       legend: [ | ||||||
|         { label: `${year - 1}年`, color: "#12f7f1" }, |         { label: `${year - 1}年`, color: "#12f7f1" }, | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|     filename: ChipYield.vue |     filename: ChipYield.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-11 10:46:47 |     date: 2024-04-11 10:46:47 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -11,24 +11,24 @@ | |||||||
|     <section class="right-part"> |     <section class="right-part"> | ||||||
|       <div class="yield-location"> |       <div class="yield-location"> | ||||||
|         <section class="btn-group"> |         <section class="btn-group"> | ||||||
|           <!-- <button |           <button | ||||||
|             @click="activeLoc = '1'" |             @click="activeLoc = '1'" | ||||||
|             :class="activeLoc === '1' ? 'active' : ''" |             :class="activeLoc === '1' ? 'active' : ''" | ||||||
|           > |           > | ||||||
|             成都 |             成都 | ||||||
|           </button> --> |           </button> | ||||||
|           <button |           <button | ||||||
|             @click="activeLoc = '2'" |             @click="activeLoc = '2'" | ||||||
|             :class="activeLoc === '2' ? 'active' : ''" |             :class="activeLoc === '2' ? 'active' : ''" | ||||||
|           > |           > | ||||||
|             邯郸 |             邯郸 | ||||||
|           </button> |           </button> | ||||||
|           <!-- <button |           <button | ||||||
|             @click="activeLoc = '3'" |             @click="activeLoc = '3'" | ||||||
|             :class="activeLoc === '3' ? 'active' : ''" |             :class="activeLoc === '3' ? 'active' : ''" | ||||||
|           > |           > | ||||||
|             株洲 |             株洲 | ||||||
|           </button> --> |           </button> | ||||||
|           <button |           <button | ||||||
|             @click="activeLoc = '4'" |             @click="activeLoc = '4'" | ||||||
|             :class="activeLoc === '4' ? 'active' : ''" |             :class="activeLoc === '4' ? 'active' : ''" | ||||||
| @@ -37,7 +37,7 @@ | |||||||
|           </button> |           </button> | ||||||
|         </section> |         </section> | ||||||
|         <section class="btn-group"> |         <section class="btn-group"> | ||||||
|           <!-- <button |           <button | ||||||
|             @click="activeLoc = '5'" |             @click="activeLoc = '5'" | ||||||
|             :class="activeLoc === '5' ? 'active' : ''" |             :class="activeLoc === '5' ? 'active' : ''" | ||||||
|             class="fixwidth" |             class="fixwidth" | ||||||
| @@ -55,7 +55,7 @@ | |||||||
|             :class="activeLoc === '7' ? 'active' : ''" |             :class="activeLoc === '7' ? 'active' : ''" | ||||||
|           > |           > | ||||||
|             蚌埠兴科 |             蚌埠兴科 | ||||||
|           </button> --> |           </button> | ||||||
|         </section> |         </section> | ||||||
|       </div> |       </div> | ||||||
|       <div class="yield-summary"> |       <div class="yield-summary"> | ||||||
| @@ -85,14 +85,13 @@ export default { | |||||||
|   props: {}, |   props: {}, | ||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       activeLoc: "2", |       activeLoc: "1", | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
|   computed: { |   computed: { | ||||||
|     output() { |     output() { | ||||||
|       // ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"] |       // ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"] | ||||||
|       const chipOutput = this.$store.getters.home.chipOutput; |       const chipOutput = this.$store.getters.home.chipOutput; | ||||||
|       console.log('chipOutput', chipOutput); |  | ||||||
|       if ( |       if ( | ||||||
|         !chipOutput || |         !chipOutput || | ||||||
|         !chipOutput.target || |         !chipOutput.target || | ||||||
|   | |||||||
| @@ -1,15 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-04-28 13:42:51 |  | ||||||
|  * @LastEditTime: 2024-06-14 09:03:26 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <!-- |  | ||||||
|     filename: ChipYield.vue |     filename: ChipYield.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-11 10:46:47 |     date: 2024-04-11 10:46:47 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -98,12 +91,9 @@ export default { | |||||||
|             }, |             }, | ||||||
|             data: [ |             data: [ | ||||||
|               { |               { | ||||||
|                 value: 0, |                 value: 90, | ||||||
|                 name: `${year}累计产出`, |                 name: `${year}累计产出`, | ||||||
|                 selected: false, |                 selected: false, | ||||||
|                 tooltip: { |  | ||||||
|                   formatter: null, |  | ||||||
|                 }, |  | ||||||
|                 itemStyle: { |                 itemStyle: { | ||||||
|                   borderJoin: "round", |                   borderJoin: "round", | ||||||
|                   borderCap: "round", |                   borderCap: "round", | ||||||
| @@ -123,11 +113,8 @@ export default { | |||||||
|                 }, |                 }, | ||||||
|               }, |               }, | ||||||
|               { |               { | ||||||
|                 value: 0, |                 value: 20, | ||||||
|                 name: `${year}目标`, |                 name: "-", | ||||||
|                 tooltip: { |  | ||||||
|                   formatter: null, |  | ||||||
|                 }, |  | ||||||
|                 itemStyle: { color: "transparent" }, |                 itemStyle: { color: "transparent" }, | ||||||
|                 label: { show: false }, |                 label: { show: false }, | ||||||
|               }, |               }, | ||||||
| @@ -147,12 +134,9 @@ export default { | |||||||
|             }, |             }, | ||||||
|             data: [ |             data: [ | ||||||
|               { |               { | ||||||
|                 value: 0, |                 value: 90, | ||||||
|                 name: `${year - 1}累计产出`, |                 name: `${year - 1}累计产出`, | ||||||
|                 selected: false, |                 selected: false, | ||||||
|                 tooltip: { |  | ||||||
|                   formatter: null, |  | ||||||
|                 }, |  | ||||||
|                 itemStyle: { |                 itemStyle: { | ||||||
|                   borderJoin: "round", |                   borderJoin: "round", | ||||||
|                   borderCap: "round", |                   borderCap: "round", | ||||||
| @@ -173,10 +157,7 @@ export default { | |||||||
|               }, |               }, | ||||||
|               { |               { | ||||||
|                 value: 0, |                 value: 0, | ||||||
|                 name: `${year - 1}累计产出`, |                 name: "-", | ||||||
|                 tooltip: { |  | ||||||
|                   formatter:null, |  | ||||||
|                 }, |  | ||||||
|                 itemStyle: { color: "transparent" }, |                 itemStyle: { color: "transparent" }, | ||||||
|                 label: { show: false }, |                 label: { show: false }, | ||||||
|               }, |               }, | ||||||
| @@ -221,44 +202,32 @@ export default { | |||||||
|       }; |       }; | ||||||
|     }, |     }, | ||||||
|     actualOptions() { |     actualOptions() { | ||||||
|       console.log('this.output.current / this.output.target', this.output.current/this.output.target); |  | ||||||
|       const year = new Date().getFullYear() |  | ||||||
|       const options = JSON.parse(JSON.stringify(this.options)); |       const options = JSON.parse(JSON.stringify(this.options)); | ||||||
|       // console.log('options', options); |  | ||||||
|       // 标题 |       // 标题 | ||||||
|       if (!this.output.target) options.title.text = "0%"; |       if (!this.output.target) options.title.text = "0%"; | ||||||
|       else |       else | ||||||
|         options.title.text = |         options.title.text = | ||||||
|           ((this.output.current / this.output.target).toFixed(2)) * 100 + "%"; |           (this.output.current / this.output.target) * 100 + "%"; | ||||||
|       // 外环 |       // 外环 | ||||||
|       if ( |       if ( | ||||||
|         this.output.current == this.output.target && |         this.output.current == this.output.target && | ||||||
|         this.output.current == 0 |         this.output.current == 0 | ||||||
|       ) { |       ) { | ||||||
|         options.series[1].data[0].value = 0; |         options.series[1].data[0].value = 0; | ||||||
|         options.series[1].data[1].value = 1; |         options.series[1].data[1].value = 100; | ||||||
|         options.series[1].data[0].tooltip.formatter = year + '累计完成:0'; |  | ||||||
|         options.series[1].data[1].tooltip.formatter = year + '累计完成:0'; |  | ||||||
|       } else { |       } else { | ||||||
|         options.series[1].data[0].value = this.output.current; |         options.series[1].data[0].value = this.output.current; | ||||||
|         options.series[1].data[1].value = |         options.series[1].data[1].value = | ||||||
|           this.output.target - this.output.current; |           this.output.target - this.output.current; | ||||||
|         options.series[1].data[0].tooltip.formatter = year + '累计完成:' + this.output.current; |  | ||||||
|         options.series[1].data[1].tooltip.formatter = year + '累计完成:' + this.output.current; |  | ||||||
|       } |       } | ||||||
|       // 内环 |       // 内环 | ||||||
|       if (this.output.previous == 0) { |       if (this.output.previous == 0) { | ||||||
|         options.series[2].data[0].value = 0; |         options.series[2].data[0].value = 0; | ||||||
|         options.series[2].data[1].value = 1; |         options.series[2].data[1].value = 100; | ||||||
|         options.series[2].data[0].tooltip.formatter = year-1 + '累计完成:' + 0; |  | ||||||
|         options.series[2].data[1].tooltip.formatter = year-1 + '累计完成:' + 0; |  | ||||||
|       } else { |       } else { | ||||||
|         options.series[2].data[0].value = this.output.previous; |         options.series[2].data[0].value = this.output.previous; | ||||||
|         options.series[2].data[1].value = 0; |         options.series[2].data[1].value = 0; | ||||||
|         options.series[2].data[0].tooltip.formatter = year - 1 + '累计完成:' + this.output.previous; |  | ||||||
|         options.series[2].data[1].tooltip.formatter = year - 1 + '累计完成:' + this.output.previous; |  | ||||||
|       } |       } | ||||||
|       console.log('options', options); |  | ||||||
|       return options; |       return options; | ||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   | |||||||
| @@ -1,15 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-04-28 13:42:51 |  | ||||||
|  * @LastEditTime: 2024-05-31 16:11:06 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <!-- |  | ||||||
|     filename: fto.vue |     filename: fto.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-10 08:59:28 |     date: 2024-04-10 08:59:28 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -30,9 +23,7 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     const year = new Date().getFullYear(); |     const year = new Date().getFullYear(); | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["瑞昌", "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       legend: [ |       legend: [ | ||||||
|         { label: `${year - 1}年`, color: "#12f7f1" }, |         { label: `${year - 1}年`, color: "#12f7f1" }, | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|     filename: left-chart-base |     filename: left-chart-base | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-10 08:59:28 |     date: 2024-04-10 08:59:28 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -59,7 +59,7 @@ export default { | |||||||
|       actualOptions: null, |       actualOptions: null, | ||||||
|       options: { |       options: { | ||||||
|         grid: { |         grid: { | ||||||
|           left: "5%", |           left: "3%", | ||||||
|           right: "4%", |           right: "4%", | ||||||
|           bottom: "0", |           bottom: "0", | ||||||
|           top: "15%", |           top: "15%", | ||||||
| @@ -86,7 +86,6 @@ export default { | |||||||
|           nameTextStyle: { |           nameTextStyle: { | ||||||
|             color: "#fff", |             color: "#fff", | ||||||
|             fontSize: 12, |             fontSize: 12, | ||||||
|             align:'right' |  | ||||||
|           }, |           }, | ||||||
|           axisTick: { |           axisTick: { | ||||||
|             show: false, |             show: false, | ||||||
| @@ -112,15 +111,6 @@ export default { | |||||||
|             name: '', // this.series[0].name, |             name: '', // this.series[0].name, | ||||||
|             type: "bar", |             type: "bar", | ||||||
|             barWidth: 12, |             barWidth: 12, | ||||||
|             label: { |  | ||||||
|               show: true, //开启显示 |  | ||||||
|               align: 'right', //在上方显示 |  | ||||||
|               position: 'top', //在上方显示 |  | ||||||
|               textStyle: { //数值样式 |  | ||||||
|                 color: '#DFF1FE', |  | ||||||
|                 fontSize: 12 |  | ||||||
|               } |  | ||||||
|             }, |  | ||||||
|             itemStyle: { |             itemStyle: { | ||||||
|               borderRadius: [10, 10, 0, 0], |               borderRadius: [10, 10, 0, 0], | ||||||
|               color: { |               color: { | ||||||
| @@ -156,20 +146,13 @@ export default { | |||||||
|             name: '', // this.series[1].name, |             name: '', // this.series[1].name, | ||||||
|             type: "bar", |             type: "bar", | ||||||
|             barWidth: 12, |             barWidth: 12, | ||||||
|             label: { |             // tooltip: { | ||||||
|               show: true, //开启显示 |             //   valueFormatter: function (value) { | ||||||
|               align: 'left', //在上方显示 |             //     return value + " ml"; | ||||||
|               position: 'top', //在上方显示 |             //   }, | ||||||
|               textStyle: { //数值样式 |             // }, | ||||||
|                 color: '#DFF1FE', |  | ||||||
|                 fontSize: 12 |  | ||||||
|               } |  | ||||||
|             }, |  | ||||||
|             itemStyle: { |             itemStyle: { | ||||||
|               borderRadius: [10, 10, 0, 0], |               borderRadius: [10, 10, 0, 0], | ||||||
|               // normal: { |  | ||||||
|  |  | ||||||
|               // }, |  | ||||||
|               color: { |               color: { | ||||||
|                 type: "linear", |                 type: "linear", | ||||||
|                 x: 0, |                 x: 0, | ||||||
|   | |||||||
| @@ -1,15 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-04-28 13:42:51 |  | ||||||
|  * @LastEditTime: 2024-06-14 09:16:09 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <!-- |  | ||||||
|     filename: right-chart-base |     filename: right-chart-base | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-10 08:59:28 |     date: 2024-04-10 08:59:28 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -65,7 +58,7 @@ export default { | |||||||
|       isFullscreen: false, |       isFullscreen: false, | ||||||
|       options: { |       options: { | ||||||
|         grid: { |         grid: { | ||||||
|           left: "5%", |           left: "3%", | ||||||
|           right: "4%", |           right: "4%", | ||||||
|           bottom: "0", |           bottom: "0", | ||||||
|           top: "18%", |           top: "18%", | ||||||
| @@ -92,7 +85,6 @@ export default { | |||||||
|           nameTextStyle: { |           nameTextStyle: { | ||||||
|             color: "#fff", |             color: "#fff", | ||||||
|             fontSize: 12, |             fontSize: 12, | ||||||
|             align: 'right' |  | ||||||
|           }, |           }, | ||||||
|           axisTick: { |           axisTick: { | ||||||
|             show: false, |             show: false, | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!--  | ||||||
|     filename: Bipv.vue |     filename: Bipv.vue | ||||||
|     author: liubin |     author: liubin | ||||||
|     date: 2024-04-10 15:39:54 |     date: 2024-04-10 15:39:54 | ||||||
|     description: |     description:  | ||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| @@ -25,9 +25,7 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     const year = new Date().getFullYear(); |     const year = new Date().getFullYear(); | ||||||
|     // 城市数组的顺序必须是固定的 |     // 城市数组的顺序必须是固定的 | ||||||
|     const cities = ["瑞昌", "邯郸", |     const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]; | ||||||
|       // "株洲", "佳木斯", "成都", "凯盛", "蚌埠" |  | ||||||
|     ]; |  | ||||||
|     return { |     return { | ||||||
|       legend: [ |       legend: [ | ||||||
|         { label: `${year}年目标值`, color: "#f3c000" }, |         { label: `${year}年目标值`, color: "#f3c000" }, | ||||||
|   | |||||||
| @@ -1,18 +1,18 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="dashboard-factory-all"> |   <div class="dashboard-factory-all"> | ||||||
|     <div id="map-container"> |     <div id="map-container"> | ||||||
|       <!-- <div v-if="visible" class="cdLine"></div> --> |       <div v-if="visible" class="cdLine"></div> | ||||||
|       <!-- <div v-if="visible" class="zzLine"></div> --> |       <div v-if="visible" class="zzLine"></div> | ||||||
|       <!-- <div v-if="visible" class="rcLine"></div> --> |       <div v-if="visible" class="rcLine"></div> | ||||||
|       <!-- <div v-if="visible" class="rcLineTwo"></div> --> |       <div v-if="visible" class="rcLineTwo"></div> | ||||||
|       <!-- <div v-if="visible" class="hdLine"></div> --> |       <div v-if="visible" class="hdLine"></div> | ||||||
|       <!-- <div v-if="visible" class="hdLineTwo"></div> --> |       <div v-if="visible" class="hdLineTwo"></div> | ||||||
|       <!-- <div v-if="visible" class="ksLine"></div> --> |       <div v-if="visible" class="ksLine"></div> | ||||||
|       <!-- <div v-if="visible" class="bbLine"></div> --> |       <div v-if="visible" class="bbLine"></div> | ||||||
|       <!-- <div v-if="visible" class="bbLineTwo"></div> --> |       <div v-if="visible" class="bbLineTwo"></div> | ||||||
|       <!-- <div v-if="visible" class="bbLineThree"></div> --> |       <div v-if="visible" class="bbLineThree"></div> | ||||||
|       <!-- <div v-if="visible" class="jmsLine"></div> --> |       <div v-if="visible" class="jmsLine"></div> | ||||||
|       <!-- <div v-if="visible" class="jmsLineTwo"></div> --> |       <div v-if="visible" class="jmsLineTwo"></div> | ||||||
|       <div class="databoard"> |       <div class="databoard"> | ||||||
|         <db-header class="db-header"></db-header> |         <db-header class="db-header"></db-header> | ||||||
|         <div class="db-body"> |         <div class="db-body"> | ||||||
| @@ -39,12 +39,12 @@ | |||||||
|       </div> |       </div> | ||||||
|     </div> |     </div> | ||||||
|     <company-info v-if="visible" :info="info" :position="rcHintPosition" /> |     <company-info v-if="visible" :info="info" :position="rcHintPosition" /> | ||||||
|     <!-- <ks-company-info v-if="visible" :info="ksInfo" :position="ksHintPosition" /> --> |     <ks-company-info v-if="visible" :info="ksInfo" :position="ksHintPosition" /> | ||||||
|     <!-- <jms-company-info v-if="visible" :info="jmsInfo" :position="jmsHintPosition" /> --> |     <jms-company-info v-if="visible" :info="jmsInfo" :position="jmsHintPosition" /> | ||||||
|     <hd-company-info v-if="visible" :info="hdInfo" :position="hdHintPosition" /> |     <hd-company-info v-if="visible" :info="hdInfo" :position="hdHintPosition" /> | ||||||
|     <!-- <bb-company-info v-if="visible" :info="bbInfo" :position="bbHintPosition" /> --> |     <bb-company-info v-if="visible" :info="bbInfo" :position="bbHintPosition" /> | ||||||
|     <!-- <cd-company-info v-if="visible" :info="cdInfo" :position="cdHintPosition" /> --> |     <cd-company-info v-if="visible" :info="cdInfo" :position="cdHintPosition" /> | ||||||
|     <!-- <zz-company-info v-if="visible" :info="zzInfo" :position="zzHintPosition" /> --> |     <zz-company-info v-if="visible" :info="zzInfo" :position="zzHintPosition" /> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| @@ -61,25 +61,21 @@ import StdChart from "./dashboard/charts/StdChart.vue"; | |||||||
|  |  | ||||||
| const LOCATIONS = [ | const LOCATIONS = [ | ||||||
|   // 佳木斯 |   // 佳木斯 | ||||||
|   // { x: 67, y: 20, tx: 60, ty: 29, path: 'factoryData/jmsIndex' }, |   { x: 67, y: 20, tx: 60, ty: 29,  path: 'copilot/jmsIndex' }, | ||||||
|   // 成都 |   // 成都 | ||||||
|   // { x: 46, y: 56, tx: 46, ty: 93, path: 'factoryData/cdIndex' }, |   { x: 46, y: 56,tx:46,ty:93, path: 'copilot/cdIndex' }, | ||||||
|   // 蚌埠1 |   // 蚌埠1 | ||||||
|   // { x: 60, y: 52, tx: 35.5, ty: 48.3, path: 'factoryData/bbIndex' }, |   { x: 60, y: 52, tx: 35.5, ty: 48.3, path: 'copilot/bbIndex' }, | ||||||
|   // 蚌埠2 |   // 蚌埠2 | ||||||
|   // { x: 61, y: 53, tx: 39, ty: 68, path: 'factoryData/ksIndex' }, |   { x: 61, y: 53,tx:39,ty:68, path: 'copilot/ksIndex' }, | ||||||
|   // 江西 瑞昌 |   // 江西 瑞昌 | ||||||
|   { x: 60, y: 58, tx: 68, ty: 52,lx:61,ly:61.5,ltx:69.5,lty:52, path: 'factoryData/factory-data' }, |   { x: 60, y: 58, tx: 68, ty: 52, path: 'copilot/factory-data' }, | ||||||
|   // 湖南 株洲 |   // 湖南 株洲 | ||||||
|   // { x: 56, y: 60, tx: 60, ty: 95, path: 'factoryData/zzIndex' }, |   { x: 56, y: 60, tx: 60, ty: 95, path: 'copilot/zzIndex' }, | ||||||
|   // 邯郸 |   // 邯郸 | ||||||
|   { x: 58, y: 45, tx: 47.4, ty: 34.3, lx: 58.7, ly: 34, ltx: 53.2, lty: 34, path: 'factoryData/hdIndex' }, |   { x: 58, y: 45, tx: 47, ty: 34, path: 'copilot/hdIndex' }, | ||||||
| ]; | ]; | ||||||
| // rcLine.style.left = `66.8%`; |  | ||||||
| // rcLine.style.top = `52%`; |  | ||||||
| // rcLineTwo.className = "rcLineTwo"; |  | ||||||
| // rcLineTwo.style.left = `58.7%`; |  | ||||||
| // rcLineTwo.style.top = `34%`; |  | ||||||
| export default { | export default { | ||||||
|   name: "Index", |   name: "Index", | ||||||
|   components: { |   components: { | ||||||
| @@ -217,51 +213,39 @@ export default { | |||||||
|           { label: "标准组件产出", value: 0 }, // Math.floor(Math.random() * 1000000) }, |           { label: "标准组件产出", value: 0 }, // Math.floor(Math.random() * 1000000) }, | ||||||
|         ], |         ], | ||||||
|       }; |       }; | ||||||
|       if |       if (position === LOCATIONS[0]) { | ||||||
|         // (position === LOCATIONS[0]) { |         templateInfo.companyName = "佳木斯中建材"; | ||||||
|         // templateInfo.companyName = "佳木斯中建材"; |         this.jmsHintPosition = position; | ||||||
|         // this.jmsHintPosition = position; |         templateInfo.items[0].value = this.homeStore.ftoInvest.current[3]; | ||||||
|         // templateInfo.items[0].value = this.homeStore.ftoInvest.current[3]; |         templateInfo.items[2].value = this.homeStore.chipInvest.current[3]; | ||||||
|         // templateInfo.items[2].value = this.homeStore.chipInvest.current[3]; |         templateInfo.items[1].value = this.homeStore.chipOutput.current[3]; | ||||||
|         // templateInfo.items[1].value = this.homeStore.chipOutput.current[3]; |         templateInfo.items[3].value = this.homeStore.stdOutput.current[3]; | ||||||
|         // templateInfo.items[3].value = this.homeStore.stdOutput.current[3]; |         this.jmsInfo = templateInfo; | ||||||
|         // this.jmsInfo = templateInfo; |       } else if (position === LOCATIONS[1]) { | ||||||
|       // } else if (position === LOCATIONS[1]) { |         this.cdHintPosition = position; | ||||||
|         // this.cdHintPosition = position; |         templateInfo.companyName = "成都中建材"; | ||||||
|         // templateInfo.companyName = "成都中建材"; |         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[4]; | ||||||
|         // templateInfo.items[0].value = this.homeStore.ftoInvest?.current[4]; |         templateInfo.items[2].value = this.homeStore.chipInvest.current[4]; | ||||||
|         // templateInfo.items[2].value = this.homeStore.chipInvest.current[4]; |         templateInfo.items[1].value = this.homeStore.chipOutput.current[4]; | ||||||
|         // templateInfo.items[1].value = this.homeStore.chipOutput.current[4]; |         templateInfo.items[3].value = this.homeStore.stdOutput.current[4]; | ||||||
|         // templateInfo.items[3].value = this.homeStore.stdOutput.current[4]; |         this.cdInfo = templateInfo; | ||||||
|         // this.cdInfo = templateInfo; |       } else if (position === LOCATIONS[2]) { | ||||||
|       // } else if (position === LOCATIONS[2]) { |         this.bbHintPosition = position; | ||||||
|         // this.bbHintPosition = position; |         templateInfo.companyName = "蚌埠兴科"; | ||||||
|         // templateInfo.companyName = "蚌埠兴科"; |         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[6]; | ||||||
|         // templateInfo.items[0].value = this.homeStore.ftoInvest?.current[6]; |         templateInfo.items[2].value = this.homeStore.chipInvest.current[6]; | ||||||
|         // templateInfo.items[2].value = this.homeStore.chipInvest.current[6]; |         templateInfo.items[1].value = this.homeStore.chipOutput?.current[6]; | ||||||
|         // templateInfo.items[1].value = this.homeStore.chipOutput?.current[6]; |         templateInfo.items[3].value = this.homeStore.stdOutput.current[6]; | ||||||
|         // templateInfo.items[3].value = this.homeStore.stdOutput.current[6]; |         this.bbInfo = templateInfo; | ||||||
|         // this.bbInfo = templateInfo; |       } else if (position === LOCATIONS[3]) { | ||||||
|       // } else if (position === LOCATIONS[3]) { |         this.ksHintPosition = position; | ||||||
|         // this.ksHintPosition = position; |         templateInfo.companyName = "凯盛光伏"; | ||||||
|         // templateInfo.companyName = "凯盛光伏"; |         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[5]; | ||||||
|         // templateInfo.items[0].value = this.homeStore.ftoInvest?.current[5]; |         templateInfo.items[2].value = this.homeStore.chipInvest.current[5]; | ||||||
|         // templateInfo.items[2].value = this.homeStore.chipInvest.current[5]; |         templateInfo.items[1].value = this.homeStore.chipOutput.current[5]; | ||||||
|         // templateInfo.items[1].value = this.homeStore.chipOutput.current[5]; |         templateInfo.items[3].value = this.homeStore.stdOutput.current[5]; | ||||||
|         // templateInfo.items[3].value = this.homeStore.stdOutput.current[5]; |         this.ksInfo = templateInfo; | ||||||
|         // this.ksInfo = templateInfo; |       } else if (position === LOCATIONS[4]) { | ||||||
|       // } |  | ||||||
|         (position === LOCATIONS[0]) { |  | ||||||
|         const rcLine = document.createElement("div"); |  | ||||||
|         const rcLineTwo = document.createElement("div"); |  | ||||||
|         rcLine.className = "rcLine"; |  | ||||||
|         rcLine.style.left = `${position.lx}%`; |  | ||||||
|         rcLine.style.top = `${position.ly}%`; |  | ||||||
|         rcLineTwo.className = "rcLineTwo"; |  | ||||||
|         rcLineTwo.style.left = `${position.ltx}%`; |  | ||||||
|         rcLineTwo.style.top = `${position.lty}%`; |  | ||||||
|         document.getElementById("map-container").appendChild(rcLine); |  | ||||||
|         document.getElementById("map-container").appendChild(rcLineTwo); |  | ||||||
|         this.rcHintPosition = position; |         this.rcHintPosition = position; | ||||||
|         templateInfo.companyName = "瑞昌中建材"; |         templateInfo.companyName = "瑞昌中建材"; | ||||||
|         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[0]; |         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[0]; | ||||||
| @@ -269,25 +253,15 @@ export default { | |||||||
|         templateInfo.items[1].value = this.homeStore.chipOutput.current[0]; |         templateInfo.items[1].value = this.homeStore.chipOutput.current[0]; | ||||||
|         templateInfo.items[3].value = this.homeStore.stdOutput.current[0]; |         templateInfo.items[3].value = this.homeStore.stdOutput.current[0]; | ||||||
|         this.info = templateInfo; |         this.info = templateInfo; | ||||||
|       // } else if (position === LOCATIONS[5]) { |       } else if (position === LOCATIONS[5]) { | ||||||
|         // this.zzHintPosition = position; |         this.zzHintPosition = position; | ||||||
|         // templateInfo.companyName = "株洲中建材"; |         templateInfo.companyName = "株洲中建材"; | ||||||
|         // templateInfo.items[0].value = this.homeStore.ftoInvest?.current[2]; |         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[2]; | ||||||
|         // templateInfo.items[2].value = this.homeStore.chipInvest.current[2]; |         templateInfo.items[2].value = this.homeStore.chipInvest.current[2]; | ||||||
|         // templateInfo.items[1].value = this.homeStore.chipOutput.current[2]; |         templateInfo.items[1].value = this.homeStore.chipOutput.current[2]; | ||||||
|         // templateInfo.items[3].value = this.homeStore.stdOutput.current[2]; |         templateInfo.items[3].value = this.homeStore.stdOutput.current[2]; | ||||||
|         // this.zzInfo = templateInfo; |         this.zzInfo = templateInfo; | ||||||
|       } else if (position === LOCATIONS[1]) { |       } else if (position === LOCATIONS[6]) { | ||||||
|         const hdLine = document.createElement("div"); |  | ||||||
|         const hdLineTwo = document.createElement("div"); |  | ||||||
|         hdLine.className = "hdLine"; |  | ||||||
|         hdLine.style.left = `${position.lx}%`; |  | ||||||
|         hdLine.style.top = `${position.ly}%`; |  | ||||||
|         hdLineTwo.className = "hdLineTwo"; |  | ||||||
|         hdLineTwo.style.left = `${position.ltx}%`; |  | ||||||
|         hdLineTwo.style.top = `${position.lty}%`; |  | ||||||
|         document.getElementById("map-container").appendChild(hdLine); |  | ||||||
|         document.getElementById("map-container").appendChild(hdLineTwo); |  | ||||||
|         this.hdHintPosition = position; |         this.hdHintPosition = position; | ||||||
|         templateInfo.companyName = "邯郸中建材"; |         templateInfo.companyName = "邯郸中建材"; | ||||||
|         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[1]; |         templateInfo.items[0].value = this.homeStore.ftoInvest?.current[1]; | ||||||
| @@ -374,40 +348,40 @@ export default { | |||||||
| .rcLine { | .rcLine { | ||||||
|   display: inline-block; |   display: inline-block; | ||||||
|   position: absolute; |   position: absolute; | ||||||
|   /* left: 61%; */ |   left: 61%; | ||||||
|   width: 7.9vw; |   width: 100px; | ||||||
|   /* top: 61.5%; */ |   top: 61.5%; | ||||||
|   /* x: 60, y: 58, */ |   /* x: 60, y: 58, */ | ||||||
|   height: 1px; |     height: 1px; | ||||||
|   border: 2px dashed #FFCF00; |   border: 2px dashed #FFCF00; | ||||||
| } | } | ||||||
|  |  | ||||||
| .rcLineTwo { | .rcLineTwo { | ||||||
|   position: absolute; |   position: absolute; | ||||||
|   /* left: 66.8%; */ |   left: 66.8%; | ||||||
|   width: 1px; |   width: 1px; | ||||||
|   /* top: 52%; */ |   top: 52%; | ||||||
|   display: inline-block; |   display: inline-block; | ||||||
|   /* // x: 60, y: 58, */ |   /* // x: 60, y: 58, */ | ||||||
|   height: 5vw; |   height: 90px; | ||||||
|   border: 2px dashed #FFCF00; |   border: 2px dashed #FFCF00; | ||||||
| } | } | ||||||
|  |  | ||||||
| .hdLine { | .hdLine { | ||||||
|   position: absolute; |   position: absolute; | ||||||
|   /* left: 58.7%; */ |   left: 58.7%; | ||||||
|   width: 1px; |   width: 1px; | ||||||
|   /* top: 34%; */ |   top: 34%; | ||||||
|   display: inline-block; |   display: inline-block; | ||||||
|   /* // x: 60, y: 58, */ |   /* // x: 60, y: 58, */ | ||||||
|   height: 6vw; |   height: 100px; | ||||||
|   border: 2px dashed #FFCF00; |   border: 2px dashed #FFCF00; | ||||||
| } | } | ||||||
| .hdLineTwo { | .hdLineTwo { | ||||||
|   position: absolute; |   position: absolute; | ||||||
|   /* left: 53%; */ |   left: 53%; | ||||||
|   width: 5vw; |   width: 90px; | ||||||
|   /* top: 34%; */ |   top: 34%; | ||||||
|   display: inline-block; |   display: inline-block; | ||||||
|   /* // x: 60, y: 58, */ |   /* // x: 60, y: 58, */ | ||||||
|   height: 1px; |   height: 1px; | ||||||
|   | |||||||
| @@ -10,7 +10,7 @@ | |||||||
|           style=" |           style=" | ||||||
|             position: absolute; |             position: absolute; | ||||||
|             top: 12%; |             top: 12%; | ||||||
|             left: 15%; |             left: 20%; | ||||||
|             user-select: none; |             user-select: none; | ||||||
|             display: flex; |             display: flex; | ||||||
|             flex-direction: column; |             flex-direction: column; | ||||||
| @@ -31,7 +31,7 @@ | |||||||
|           <p |           <p | ||||||
|             style=" |             style=" | ||||||
|               margin: 0; |               margin: 0; | ||||||
|               font-size: 24px; |               font-size: 26px; | ||||||
|               letter-spacing: 1px; |               letter-spacing: 1px; | ||||||
|               color: #26b9de; |               color: #26b9de; | ||||||
|               opacity: 75%; |               opacity: 75%; | ||||||
| @@ -52,8 +52,8 @@ | |||||||
|           </p> |           </p> | ||||||
|         </div> |         </div> | ||||||
|         <img |         <img | ||||||
|           src="../assets/images/map.png" |           src="../assets/images/login.png" | ||||||
|           style="position: absolute; top: 00%; left: 11%; width: 50vw" |           style="position: absolute; top: 30%; left: 15%; width: 40vw" | ||||||
|           alt="" |           alt="" | ||||||
|         /> |         /> | ||||||
|       </div> |       </div> | ||||||
| @@ -218,7 +218,7 @@ export default { | |||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       codeUrl: "", |       codeUrl: "", | ||||||
|       captchaEnable: false, |       captchaEnable: true, | ||||||
|       tenantEnable: true, |       tenantEnable: true, | ||||||
|       mobileCodeTimer: 0, |       mobileCodeTimer: 0, | ||||||
|       loginForm: { |       loginForm: { | ||||||
|   | |||||||
| @@ -1,12 +1,12 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2023-11-06 15:15:30 |  * @Date: 2023-11-06 15:15:30 | ||||||
|  * @LastEditTime: 2024-06-07 10:28:51 |  * @LastEditTime: 2024-05-20 18:02:10 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
|   <el-drawer class="drawer" :visible.sync="visible" size="60%" @closed="$emit('destroy')"> |   <el-drawer class="drawer" :visible.sync="visible" size="55%" @closed="$emit('destroy')"> | ||||||
|     <small-title slot="title" :no-padding="true"> |     <small-title slot="title" :no-padding="true"> | ||||||
|       {{ '碲化镉工厂生产数据详情' }} |       {{ '碲化镉工厂生产数据详情' }} | ||||||
|     </small-title> |     </small-title> | ||||||
| @@ -22,7 +22,7 @@ | |||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="8"> |         <el-col :span="8"> | ||||||
|           <p class="title">时间</p> |           <p class="title">时间</p> | ||||||
|           <p class="text">{{ dataForm.reportDate?.length > 0 ? dataForm.reportDate[0] + '年' + dataForm.reportDate[1] + '月' + dataForm.reportDate[2] + '日' : '' }}</p> |           <p class="text">{{ dataForm.reportDate.length > 0 ? dataForm.reportDate[0] + '年' + dataForm.reportDate[1] + '月' + dataForm.reportDate[2] + '日' : '' }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-divider></el-divider> |       <el-divider></el-divider> | ||||||
| @@ -31,11 +31,11 @@ | |||||||
|       </small-title> |       </small-title> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片产量(片)</p> |           <p class="title">芯片产量</p> | ||||||
|           <p class="text">{{ }}</p> |           <p class="text">{{ }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片良率(%)</p> |           <p class="title">芯片良率</p> | ||||||
|           <p class="text">{{ dataForm.yieldRate }}</p> |           <p class="text">{{ dataForm.yieldRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
| @@ -43,17 +43,17 @@ | |||||||
|           <p class="text">{{ dataForm.bom }}</p> |           <p class="text">{{ dataForm.bom }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片总功率(MW)</p> |           <p class="title">芯片总功率</p> | ||||||
|           <p class="text">{{ dataForm.totalPower }}</p> |           <p class="text">{{ dataForm.totalPower }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">FTO投入量(片)</p> |           <p class="title">FTO投入量</p> | ||||||
|           <p class="text">{{ dataForm.chipInput }}</p> |           <p class="text">{{ dataForm.chipInput }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">CSS稼动率(%)</p> |           <p class="title">CSS稼动率</p> | ||||||
|           <p class="text">{{ dataForm.marriageRate }}</p> |           <p class="text">{{ dataForm.marriageRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
| @@ -61,17 +61,17 @@ | |||||||
|           <p class="text">{{ dataForm.oee }}</p> |           <p class="text">{{ dataForm.oee }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片平均功率(W)</p> |           <p class="title">芯片平均功率</p> | ||||||
|           <p class="text">{{ dataForm.averagePower }}</p> |           <p class="text">{{ dataForm.averagePower }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片人均产量(片/人)</p> |           <p class="title">芯片人均产量</p> | ||||||
|           <p class="text">{{ dataForm.annualAverageProduction }}</p> |           <p class="text">{{ dataForm.annualAverageProduction }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片产能利用率(%)</p> |           <p class="title">芯片产能利用率</p> | ||||||
|           <p class="text">{{ dataForm.capacityUtilizationRate }}</p> |           <p class="text">{{ dataForm.capacityUtilizationRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
| @@ -85,25 +85,25 @@ | |||||||
|           <!-- <p class="text">{{ dataForm.bom }}</p> --> |           <!-- <p class="text">{{ dataForm.bom }}</p> --> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">封装线OEE(%)</p> |           <p class="title">封装线OEE</p> | ||||||
|           <!-- <p class="text">{{ dataForm.code }}</p> --> |           <!-- <p class="text">{{ dataForm.code }}</p> --> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件良率(%)</p> |           <p class="title">标准组件良率</p> | ||||||
|           <!-- <p class="text">{{ dataForm.productName }}</p> --> |           <!-- <p class="text">{{ dataForm.productName }}</p> --> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件产量(片)</p> |           <p class="title">标准组件产量</p> | ||||||
|           <!-- <p class="text">{{ dataForm.productName }}</p> --> |           <!-- <p class="text">{{ dataForm.productName }}</p> --> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件总功率(MW)</p> |           <p class="title">标准组件总功率</p> | ||||||
|           <p class="text">{{ }}</p> |           <p class="text">{{ }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">封装产能利用率(%)</p> |           <p class="title">封装产能利用率</p> | ||||||
|           <!-- <p class="text">{{ dataForm.code }}</p> --> |           <!-- <p class="text">{{ dataForm.code }}</p> --> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
| @@ -350,6 +350,7 @@ export default { | |||||||
|   margin: 0; |   margin: 0; | ||||||
|   padding: 32px 32px 24px; |   padding: 32px 32px 24px; | ||||||
|   border-bottom: 1px solid #dcdfe6; |   border-bottom: 1px solid #dcdfe6; | ||||||
|  |   margin-bottom: 30px; | ||||||
| } | } | ||||||
| .detailBox p { | .detailBox p { | ||||||
|   margin: 0; |   margin: 0; | ||||||
| @@ -373,9 +374,5 @@ export default { | |||||||
|   color: rgba(102,102,102,0.75); |   color: rgba(102,102,102,0.75); | ||||||
|   padding-bottom: 20px; |   padding-bottom: 20px; | ||||||
| } | } | ||||||
| .detailBox { |  | ||||||
|   width: 98%; |  | ||||||
|   padding-top: 30px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| </style> | </style> | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-04-15 10:49:13 |  * @Date: 2024-04-15 10:49:13 | ||||||
|  * @LastEditTime: 2024-06-07 09:41:56 |  * @LastEditTime: 2024-05-22 15:25:11 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -17,7 +17,7 @@ | |||||||
|         </el-form-item> |         </el-form-item> | ||||||
|         <el-form-item v-show="listQuery.date === 0 || listQuery.date === ''" label="时间范围" prop="reportTime"> |         <el-form-item v-show="listQuery.date === 0 || listQuery.date === ''" label="时间范围" prop="reportTime"> | ||||||
|           <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" range-separator="至" |           <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" range-separator="至" | ||||||
|             start-placeholder="开始日期" value-format="timestamp" format="yyyy-MM-dd" @change="changeDayTime" end-placeholder="结束日期"> |             start-placeholder="开始日期" value-format="timestamp" @change="changeDayTime" end-placeholder="结束日期"> | ||||||
|           </el-date-picker> |           </el-date-picker> | ||||||
|         </el-form-item> |         </el-form-item> | ||||||
|         <el-form-item v-show="listQuery.date === 1" label="时间范围" prop="reportTime"> |         <el-form-item v-show="listQuery.date === 1" label="时间范围" prop="reportTime"> | ||||||
| @@ -48,7 +48,7 @@ | |||||||
|         </el-form-item> |         </el-form-item> | ||||||
|         <el-form-item label="工厂名称" prop="factorys"> |         <el-form-item label="工厂名称" prop="factorys"> | ||||||
|           <el-select size="small" clearable v-model="listQuery.factorys" placeholder="请选择工厂名称" multiple > |           <el-select size="small" clearable v-model="listQuery.factorys" placeholder="请选择工厂名称" multiple > | ||||||
|             <el-option v-for="item in factoryArray" :key="item.id" :label="item.name" :value="item.id"> |             <el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id"> | ||||||
|             </el-option> |             </el-option> | ||||||
|           </el-select> |           </el-select> | ||||||
|         </el-form-item> |         </el-form-item> | ||||||
| @@ -59,7 +59,7 @@ | |||||||
|           </el-select> |           </el-select> | ||||||
|         </el-form-item> --> |         </el-form-item> --> | ||||||
|         <el-form-item label="玻璃类型" prop="type"> |         <el-form-item label="玻璃类型" prop="type"> | ||||||
|           <el-select size="small" clearable v-model="listQuery.type" multiple placeholder="请选择玻璃类型"> |           <el-select size="small" clearable v-model="listQuery.type" placeholder="请选择玻璃类型"> | ||||||
|             <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"> |             <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"> | ||||||
|             </el-option> |             </el-option> | ||||||
|           </el-select> |           </el-select> | ||||||
| @@ -107,29 +107,27 @@ | |||||||
|  |  | ||||||
| <script> | <script> | ||||||
| // import { parseTime } from '../../core/mixins/code-filter'; | // import { parseTime } from '../../core/mixins/code-filter'; | ||||||
| import { getProduceDataPage, prodOutputDataList, exportOutPutExcel } from '@/api/produceData'; | import { getProduceDataPage, exportOutPutExcel } from '@/api/produceData'; | ||||||
| // import inputTable from './inputTable.vue'; | // import inputTable from './inputTable.vue'; | ||||||
| import lineChart from './lineChart'; | import lineChart from './lineChart'; | ||||||
| import moment from 'moment' | import moment from 'moment' | ||||||
| import ButtonNav from '@/components/ButtonNav' | import ButtonNav from '@/components/ButtonNav' | ||||||
| import basicPage from '@/mixins/basic-page' | import basicPage from '@/mixins/basic-page' | ||||||
| import AddOrUpdate from './add-or-updata' | import AddOrUpdate from './add-or-updata'; | ||||||
| import { factoryList, factoryArray, factoryArray1 } from "@/utils/constants"; |  | ||||||
|  |  | ||||||
|  | // import FileSaver from 'file-saver' | ||||||
|  | // import * as XLSX from 'xlsx' | ||||||
| export default { | export default { | ||||||
|   components: { lineChart, ButtonNav, AddOrUpdate }, |   components: { lineChart, ButtonNav, AddOrUpdate }, | ||||||
|   mixins: [basicPage], |   mixins: [basicPage], | ||||||
| 	data() { | 	data() { | ||||||
|     return { |     return { | ||||||
|       factoryList, |  | ||||||
|       factoryArray, |  | ||||||
|       factoryArray1, |  | ||||||
|       listQuery: { |       listQuery: { | ||||||
|         size: 20, |         size: 20, | ||||||
|         current: 1, |         current: 1, | ||||||
|         factorys: undefined, |         factorys: [], | ||||||
|         total: 0, |         total: 0, | ||||||
|         date: 0, |         date: 1, | ||||||
|         type:undefined, |         type:undefined, | ||||||
|         // reportType: 2, |         // reportType: 2, | ||||||
|         beginTime: undefined, |         beginTime: undefined, | ||||||
| @@ -165,6 +163,31 @@ export default { | |||||||
|           id: 2, |           id: 2, | ||||||
|         }, |         }, | ||||||
|       ], |       ], | ||||||
|  |       // weekNum: undefined, | ||||||
|  |       dataList: [ | ||||||
|  |         { | ||||||
|  |           id:'first', | ||||||
|  |         }, | ||||||
|  |          { | ||||||
|  |           id: 'second', | ||||||
|  |         }, | ||||||
|  |          { | ||||||
|  |           id: 'third', | ||||||
|  |         }, | ||||||
|  |          { | ||||||
|  |           id: 'fourth', | ||||||
|  |         }, | ||||||
|  |          { | ||||||
|  |           id: 'fifth', | ||||||
|  |         }, | ||||||
|  |          { | ||||||
|  |           id: 'sixth', | ||||||
|  |         }, | ||||||
|  |       ], | ||||||
|  | 			urlOptions: { | ||||||
|  | 				// getDataListURL: getGlassPage, | ||||||
|  | 				// exportURL: exportGlasscExcel | ||||||
|  |       }, | ||||||
|       formConfig: [ |       formConfig: [ | ||||||
|         { |         { | ||||||
|           type: 'title', |           type: 'title', | ||||||
| @@ -195,9 +218,39 @@ export default { | |||||||
|           label: '年' |           label: '年' | ||||||
|         } |         } | ||||||
|       ], |       ], | ||||||
|  |       factoryList: [ | ||||||
|  |         { | ||||||
|  |           name: '瑞昌中建材光电材料有限公司', | ||||||
|  |           id: 0 | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           name: '邯郸中建材光电材料有限公司', | ||||||
|  |           id: 1 | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           name: '中建材株洲光电材料有限公司', | ||||||
|  |           id: 2 | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           name:  '佳木斯中建材光电材料有限公司', | ||||||
|  |           id: 3 | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           name:  '成都中建材光电材料有限公司', | ||||||
|  |           id: 4 | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           name:  '凯盛光伏材料有限公司', | ||||||
|  |           id: 5 | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           name:  '蚌埠兴科玻璃有限公司', | ||||||
|  |           id: 6 | ||||||
|  |         } | ||||||
|  |       ], | ||||||
|       tableProps: [ |       tableProps: [ | ||||||
|         { |         { | ||||||
|           prop: 'groupTime', |           prop: 'tableTime', | ||||||
|           label: '日期', |           label: '日期', | ||||||
|           minWidth: 100, |           minWidth: 100, | ||||||
|           showOverflowtooltip: true |           showOverflowtooltip: true | ||||||
| @@ -205,7 +258,7 @@ export default { | |||||||
|         { |         { | ||||||
|           prop: 'factory', |           prop: 'factory', | ||||||
|           label: '工厂名称', |           label: '工厂名称', | ||||||
|           filter: (val) => factoryList[val], |           filter: (val) => ['瑞昌中建材光电材料有限公司', '邯郸中建材光电材料有限公司', '中建材株洲光电材料有限公司', '佳木斯中建材光电材料有限公司', '成都中建材光电材料有限公司', '凯盛光伏材料有限公司', '蚌埠兴科玻璃有限公司'][val], | ||||||
|           minWidth: 200, |           minWidth: 200, | ||||||
|           showOverflowtooltip: true |           showOverflowtooltip: true | ||||||
|         }, |         }, | ||||||
| @@ -229,30 +282,21 @@ export default { | |||||||
|         { |         { | ||||||
|           prop: 'yieldRate', |           prop: 'yieldRate', | ||||||
|           label: '良品率%', |           label: '良品率%', | ||||||
|           filter: (val) => (val * 100) + '%' |  | ||||||
|         }, |         }, | ||||||
|       ], |       ], | ||||||
|       tableData: [], |       tableData: [], | ||||||
|       lineData: [], |       xAxis: [] | ||||||
|       chart: null, |  | ||||||
|       seriesList: [] |  | ||||||
| 			// proLineList: [], | 			// proLineList: [], | ||||||
| 			// all: {} | 			// all: {} | ||||||
| 		};  | 		}; | ||||||
|   }, |   }, | ||||||
|   computed: { |   computed: { | ||||||
|     weekNum() { |     weekNum() { | ||||||
|       return Math.round((this.listQuery.end - this.listQuery.start) / (24 * 60 * 60 * 1000 * 7)) + 1 |       return Math.round((this.listQuery.end - this.listQuery.start) / (24 * 60 * 60 * 1000 * 7)) + 1 | ||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
|   created() { |  | ||||||
|     const today = new Date() |  | ||||||
|     const sevenDaysAgo = new Date(today.getTime() - (7 * 24 * 60 * 60 * 1000)) |  | ||||||
|     this.listQuery.beginTime = sevenDaysAgo.getTime() |  | ||||||
|     this.listQuery.endTime = today.getTime() |  | ||||||
|     this.listQuery.reportTime = [this.listQuery.beginTime, this.listQuery.endTime] |  | ||||||
| 	}, |  | ||||||
| 	mounted() { | 	mounted() { | ||||||
|  |     this.getDataList() | ||||||
| 	}, | 	}, | ||||||
|   methods: { |   methods: { | ||||||
|     otherMethods(val) { |     otherMethods(val) { | ||||||
| @@ -262,6 +306,9 @@ export default { | |||||||
|         this.$refs.detailOrUpdate.init(val.data.id); |         this.$refs.detailOrUpdate.init(val.data.id); | ||||||
|       }); |       }); | ||||||
|     }, |     }, | ||||||
|  |     // buttonClick() { | ||||||
|  |  | ||||||
|  |     // }, | ||||||
|     getYear(e) { |     getYear(e) { | ||||||
|       if (this.listQuery.end - this.listQuery.start > 10*365*24*60*60*1000) { |       if (this.listQuery.end - this.listQuery.start > 10*365*24*60*60*1000) { | ||||||
|         this.$message({ |         this.$message({ | ||||||
| @@ -333,100 +380,75 @@ export default { | |||||||
|         console.log(this.listQuery.reportTime[0]) |         console.log(this.listQuery.reportTime[0]) | ||||||
|       } |       } | ||||||
|     }, |     }, | ||||||
|  |     // async getDict() { | ||||||
|  | 			// 产线列表 | ||||||
|  | 			// const res = await getCorePLList(); | ||||||
|  | 			// this.proLineList = res.data; | ||||||
|  | 		// }, | ||||||
|  |     // 获取数据列表 | ||||||
|  |     multipliedByHundred(str) { | ||||||
|  |       console.log(str); | ||||||
|  |       // console.log(str) | ||||||
|  |       if ( str != 0) { | ||||||
|  |         let floatVal = parseFloat(str); | ||||||
|  |         if (isNaN(floatVal)) { | ||||||
|  |           return 0; | ||||||
|  |         } | ||||||
|  |         floatVal = Math.round(str * 10000) / 100; | ||||||
|  |         let strVal = floatVal.toString(); | ||||||
|  |         let searchVal = strVal.indexOf('.'); | ||||||
|  |         if (searchVal < 0) { | ||||||
|  |           searchVal = strVal.length; | ||||||
|  |           strVal += '.'; | ||||||
|  |         } | ||||||
|  |         while (strVal.length <= searchVal + 2) { | ||||||
|  |           strVal += '0'; | ||||||
|  |         } | ||||||
|  |         return parseFloat(strVal); | ||||||
|  |       } | ||||||
|  |  | ||||||
|  |     }, | ||||||
|     async getDataList() { |     async getDataList() { | ||||||
|       const res = await getProduceDataPage(this.listQuery) |       const res = await getProduceDataPage(this.listQuery) | ||||||
|       console.log(res) |       console.log(res) | ||||||
|       if (res.code === 0) { |       this.tableData = res.data.records | ||||||
|         this.tableData = res.data.records |       this.tableData.forEach(item => { | ||||||
|         this.listQuery.total = res.data.total |         item.tableTime = item?.reportDate?.length > 0 ? item.reportDate[0] + '-' + item.reportDate[1] + '-' + item.reportDate[2] : '--' | ||||||
|         // if (this.listQuery.total > 0) { |  | ||||||
|         //   this.tableData.forEach(item => { |  | ||||||
|         //     item.tableTime = item?.reportDate?.length > 0 ? item.reportDate[0] + '-' + item.reportDate[1] + '-' + item.reportDate[2] : '--' |  | ||||||
|         //   }) |  | ||||||
|         // } |  | ||||||
|       } |  | ||||||
|  |  | ||||||
|       // 图表 |  | ||||||
|       await prodOutputDataList({ |  | ||||||
|         current: 1, |  | ||||||
|         size: 99, |  | ||||||
|         beginTime: this.listQuery.beginTime, |  | ||||||
|         endTime: this.listQuery.endTime, |  | ||||||
|         factorys: this.listQuery.factorys, |  | ||||||
|         date: this.listQuery.date, |  | ||||||
|         type: this.listQuery.type |  | ||||||
|       }).then(resp => { |  | ||||||
|         console.log('Aaa', resp.data) |  | ||||||
|         this.lineData = resp?.data || [] |  | ||||||
|         if (this.lineData.length > 0) { |  | ||||||
|           this.buildChart(this.lineData) |  | ||||||
|         } |  | ||||||
|       }) |       }) | ||||||
|       // this.buildChart(this.tableData) |       this.listQuery.total = res.data.total | ||||||
|  |       this.buildChart(this.tableData) | ||||||
|     }, |     }, | ||||||
|     buildChart(list) { |     buildChart(list) { | ||||||
|       let temp = [] |       const chartList = Object.groupBy(list, (item) => item.tableTime) | ||||||
|       let xAxisData = [] |       this.xAxis = [] | ||||||
|       list.forEach(item => { |       this.seriesList = [] | ||||||
|         temp.push(item.groupTime) |       for (const keyIndex in chartList) { | ||||||
|       }) |         // X坐标轴数据 | ||||||
|       // x轴数据 |         this.xAxis.push(keyIndex) | ||||||
|       xAxisData = Array.from(new Set(temp)) |       } | ||||||
|        |  | ||||||
|       // y轴数据 |       // y轴数据 | ||||||
|       for (const y of this.factoryArray1) { |       for (const y of this.factoryList) { | ||||||
|         for (const type of this.typeList) { |         // y: {name: , id: } | ||||||
|           const seriesItem = { |         const seriesItem = { | ||||||
|             name: y.name, |           name: y.name, | ||||||
|             record: type.name, |  | ||||||
|             type: 'bar', |             type: 'bar', | ||||||
|             emphasis: { |             emphasis: { | ||||||
|               focus: 'series' |               focus: 'series' | ||||||
|             }, |             }, | ||||||
|             data: Array(xAxisData.length).fill(0) |           data: Array(this.xAxis.length).fill(0) | ||||||
|           } |         } | ||||||
|           list.forEach(data => { |         for (const a in chartList) { | ||||||
|             xAxisData.forEach((x, index) => { |           for (const z of chartList[a]) { | ||||||
|               if (x === data.groupTime && y.id === data.factory && type.id === data.glassType) { |             this.xAxis.forEach((item, index) => { | ||||||
|                 seriesItem.data[index] = data.goodNumber |               if (z.factory === y.id && a === item) { | ||||||
|  |                 seriesItem.data[index] = z.goodNumber | ||||||
|               } |               } | ||||||
|             }) |             }) | ||||||
|           }) |           } | ||||||
|           this.seriesList.push(seriesItem) |  | ||||||
|         } |         } | ||||||
|  |         this.seriesList.push(seriesItem) | ||||||
|       } |       } | ||||||
|       console.log('啊啊', this.seriesList) |       this.$refs.lineChart.initChart(this.xAxis, this.seriesList) | ||||||
|       this.$refs.lineChart.initChart(xAxisData, this.seriesList) |  | ||||||
|       // const chartList = Object.groupBy(list, (item) => item.tableTime) |  | ||||||
|       // this.xAxis = [] |  | ||||||
|       // this.seriesList = [] |  | ||||||
|       // for (const keyIndex in chartList) { |  | ||||||
|       //   // X坐标轴数据 |  | ||||||
|       //   this.xAxis.push(keyIndex) |  | ||||||
|       // } |  | ||||||
|       // // y轴数据 |  | ||||||
|       // for (const y of this.factoryArray) { |  | ||||||
|       //   // y: {name: , id: } |  | ||||||
|       //   const seriesItem = { |  | ||||||
|       //     name: y.name, |  | ||||||
|       //       type: 'bar', |  | ||||||
|       //       emphasis: { |  | ||||||
|       //         focus: 'series' |  | ||||||
|       //       }, |  | ||||||
|       //     data: Array(this.xAxis.length).fill(0) |  | ||||||
|       //   } |  | ||||||
|       //   for (const a in chartList) { |  | ||||||
|       //     for (const z of chartList[a]) { |  | ||||||
|       //       this.xAxis.forEach((item, index) => { |  | ||||||
|       //         if (z.factory === y.id && a === item) { |  | ||||||
|       //           seriesItem.data[index] = z.goodNumber |  | ||||||
|       //         } |  | ||||||
|       //       }) |  | ||||||
|       //     } |  | ||||||
|       //   } |  | ||||||
|       //   this.seriesList.push(seriesItem) |  | ||||||
|       // } |  | ||||||
|       // this.$refs.lineChart.initChart(this.xAxis, this.seriesList) |  | ||||||
|     }, |     }, | ||||||
| 		buttonClick(val) { | 		buttonClick(val) { | ||||||
| 			this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined; | 			this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined; | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
|  * @Author: zwq |  * @Author: zwq | ||||||
|  * @Date: 2022-01-21 14:43:06 |  * @Date: 2022-01-21 14:43:06 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @LastEditTime: 2024-05-30 14:52:05 |  * @LastEditTime: 2024-05-22 13:48:58 | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-04-17 16:31:51 |  * @Date: 2024-04-17 16:31:51 | ||||||
|  * @LastEditTime: 2024-06-17 16:55:04 |  * @LastEditTime: 2024-05-20 18:09:09 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| @@ -11,7 +11,7 @@ | |||||||
|       {{ dataForm.id ? '编辑' : '新增' }} |       {{ dataForm.id ? '编辑' : '新增' }} | ||||||
|     </small-title> |     </small-title> | ||||||
|     <div class="detailBox"> |     <div class="detailBox"> | ||||||
|       <el-form ref="form" :model="dataForm" label-width="80px" :rules="dataRule" label-position="top"> |       <el-form ref="form" :model="dataForm" label-width="80px" label-position="top"> | ||||||
|         <el-row :gutter="24" style="padding: 0 32px;"> |         <el-row :gutter="24" style="padding: 0 32px;"> | ||||||
|           <el-col :span="8"> |           <el-col :span="8"> | ||||||
|             <el-form-item v-if="ftype === 0" label="工厂名称" prop="factory"> |             <el-form-item v-if="ftype === 0" label="工厂名称" prop="factory"> | ||||||
| @@ -31,28 +31,18 @@ | |||||||
|             <el-form-item label="时间维度" prop="targetType"> |             <el-form-item label="时间维度" prop="targetType"> | ||||||
|               <el-select v-model="dataForm.targetType" placeholder="请选择时间维度" clearable @change="clearTime"> |               <el-select v-model="dataForm.targetType" placeholder="请选择时间维度" clearable @change="clearTime"> | ||||||
|                 <!-- <el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id"> --> |                 <!-- <el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id"> --> | ||||||
|                 <el-option label="日" :value="0" /> |                 <el-option label="月" :value="0" /> | ||||||
|                 <el-option label="周" :value="1" /> |                 <el-option label="年" :value="1" /> | ||||||
|                 <el-option label="月" :value="2" /> |  | ||||||
|                 <el-option label="年" :value="3" /> |  | ||||||
|               </el-select> |               </el-select> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="8"> |           <el-col :span="8"> | ||||||
|             <el-form-item v-show="dataForm.targetType === 0 || dataForm.targetType === ''" label="时间" prop="reportTime"> |             <el-form-item v-show="dataForm.targetType !== 1" label="时间" prop="reportTime"> | ||||||
|               <el-date-picker v-model="dataForm.reportTime" value-format="yyyyMMdd" type="date" placeholder="选择日"> |               <el-date-picker v-model="dataForm.reportTime" value-format="yyyy-MM" type="month" placeholder="选择月份"> | ||||||
|               </el-date-picker> |               </el-date-picker> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|             <el-form-item v-show="dataForm.targetType === 1" label="时间" prop="reportTime"> |             <el-form-item v-show="dataForm.targetType === 1" label="时间" prop="targetYear"> | ||||||
|               <el-date-picker v-model="week" type="week" format="yyyy 第 WW 周" placeholder="选择周" @change="setReportTime"> |               <el-date-picker clearable v-model="dataForm.showYear" value-format="yyyy" type="year" placeholder="开始时间"> | ||||||
|               </el-date-picker> |  | ||||||
|             </el-form-item> |  | ||||||
|             <el-form-item v-show="dataForm.targetType === 2" label="时间" prop="reportTime"> |  | ||||||
|               <el-date-picker v-model="dataForm.reportTime" value-format="yyyyMM" type="month" placeholder="选择月份"> |  | ||||||
|               </el-date-picker> |  | ||||||
|             </el-form-item> |  | ||||||
|             <el-form-item v-show="dataForm.targetType === 3" label="时间" prop="reportTime"> |  | ||||||
|               <el-date-picker clearable v-model="dataForm.reportTime" value-format="yyyy" type="year" placeholder="开始时间"> |  | ||||||
|               </el-date-picker> |               </el-date-picker> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
| @@ -63,12 +53,12 @@ | |||||||
|         </small-title> |         </small-title> | ||||||
|         <el-row :gutter="24" style="padding: 0 32px;"> |         <el-row :gutter="24" style="padding: 0 32px;"> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片产量(片)" prop="chipYield"> |             <el-form-item label="芯片产量" prop="chipYield"> | ||||||
|               <el-input-number v-model="dataForm.chipYield" :precision="0" controls-position="right" placeholder="请输入芯片产量" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipYield" :precision="0" controls-position="right" placeholder="请输入芯片产量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片良率(%)" prop="chipYieldRate"> |             <el-form-item label="芯片良率" prop="chipYieldRate"> | ||||||
|               <el-input-number v-model="dataForm.chipYieldRate" :precision="2" :max="100" controls-position="right" placeholder="请输入芯片良率" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipYieldRate" :precision="2" :max="100" controls-position="right" placeholder="请输入芯片良率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
| @@ -78,47 +68,47 @@ | |||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片总功率(MW)" prop="chipTotalPower"> |             <el-form-item label="芯片总功率" prop="chipTotalPower"> | ||||||
|               <el-input-number v-model="dataForm.chipTotalPower" :precision="2" controls-position="right" placeholder="请输入芯片总功率" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipTotalPower" :precision="2" controls-position="right" placeholder="请输入芯片总功率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|         </el-row> |         </el-row> | ||||||
|         <el-row :gutter="24" style="padding: 0 32px;"> |         <el-row :gutter="24" style="padding: 0 32px;"> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item v-if="ftype === 0" label="FTO投入量(片)" prop="ftoInput"> |             <el-form-item v-if="ftype === 0" label="FTO投入量" prop="ftoInput"> | ||||||
|               <el-input-number v-model="dataForm.ftoInput" :precision="0" controls-position="right" placeholder="请输入FTO投入量" style="width: 100%" /> |               <el-input-number v-model="dataForm.ftoInput" :precision="0" controls-position="right" placeholder="请输入FTO投入量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|             <el-form-item v-else label="钼电极投入量(片)" prop="molybdenumElectrodeInput"> |             <el-form-item v-else label="钼电极投入量" prop="molybdenumElectrodeInput"> | ||||||
|               <el-input-number v-model="dataForm.molybdenumElectrodeInput" :precision="0" controls-position="right" placeholder="请输入钼电极投入量" style="width: 100%" /> |               <el-input-number v-model="dataForm.molybdenumElectrodeInput" :precision="0" controls-position="right" placeholder="请输入钼电极投入量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item v-if="ftype === 0" label="CSS稼动率(%)" prop="chipCssMarriageRate"> |             <el-form-item v-if="ftype === 0" label="CSS稼动率" prop="chipCssMarriageRate"> | ||||||
|               <el-input-number v-model="dataForm.chipCssMarriageRate" :precision="2" controls-position="right" placeholder="请输入CSS稼动率" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipCssMarriageRate" :precision="2" controls-position="right" placeholder="请输入CSS稼动率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|             <el-form-item v-else label="PID6稼动率(%)" prop="chipCssMarriageRate"> |             <el-form-item v-else label="PID6稼动率" prop="chipCssMarriageRate"> | ||||||
|               <el-input-number v-model="dataForm.chipCssMarriageRate" :precision="2" controls-position="right" placeholder="请输入PID6稼动率" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipCssMarriageRate" :precision="2" controls-position="right" placeholder="请输入PID6稼动率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片段OEE(%)" prop="chipOee"> |             <el-form-item label="芯片段OEE" prop="chipOee"> | ||||||
|               <el-input-number v-model="dataForm.chipOee" :precision="2" controls-position="right" placeholder="请输入芯片段OEE" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipOee" :precision="2" controls-position="right" placeholder="请输入芯片段OEE" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片平均功率(W)" prop="chipAveragePower"> |             <el-form-item label="芯片平均功率" prop="chipAveragePower"> | ||||||
|               <el-input-number v-model="dataForm.chipAveragePower" :precision="2" controls-position="right" placeholder="请输入芯片平均功率" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipAveragePower" :precision="2" controls-position="right" placeholder="请输入芯片平均功率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|         </el-row> |         </el-row> | ||||||
|         <el-row :gutter="24" style="padding: 0 32px;"> |         <el-row :gutter="24" style="padding: 0 32px;"> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片人均产量(片/人)" prop="chipAnnualAverageProduction"> |             <el-form-item label="芯片人均产量" prop="chipAnnualAverageProduction"> | ||||||
|               <el-input-number v-model="dataForm.chipAnnualAverageProduction" :precision="2" controls-position="right" placeholder="请输入芯片人均产量" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipAnnualAverageProduction" :precision="2" controls-position="right" placeholder="请输入芯片人均产量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片产能利用率(%)" prop="chipCapacityUtilizationRate"> |             <el-form-item label="芯片产能利用率" prop="chipCapacityUtilizationRate"> | ||||||
|               <el-input-number v-model="dataForm.chipCapacityUtilizationRate" :precision="2" controls-position="right" placeholder="请输入芯片产能利用率" style="width: 100%" /> |               <el-input-number v-model="dataForm.chipCapacityUtilizationRate" :precision="2" controls-position="right" placeholder="请输入芯片产能利用率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
| @@ -134,47 +124,42 @@ | |||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="封装线OEE(%)" prop="componentOee"> |             <el-form-item label="封装线OEE" prop="componentOee"> | ||||||
|               <el-input-number v-model="dataForm.componentOee" :precision="2" controls-position="right" placeholder="请输入封装线OEE" style="width: 100%" /> |               <el-input-number v-model="dataForm.componentOee" :precision="2" controls-position="right" placeholder="请输入封装线OEE" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="标准组件良率(%)" prop="componentYieldRate"> |             <el-form-item label="标准组件良率" prop="componentYieldRate"> | ||||||
|               <el-input-number v-model="dataForm.componentYieldRate" :precision="2" controls-position="right" placeholder="请输入标准组件良率" style="width: 100%" /> |               <el-input-number v-model="dataForm.componentYieldRate" :precision="2" controls-position="right" placeholder="请输入标准组件良率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="标准组件产量(片)" prop="componentYield"> |             <el-form-item label="标准组件产量" prop="componentYield"> | ||||||
|               <el-input-number v-model="dataForm.componentYield" :precision="0" controls-position="right" placeholder="请输入标准组件产量" style="width: 100%" /> |               <el-input-number v-model="dataForm.componentYield" :precision="0" controls-position="right" placeholder="请输入标准组件产量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|         </el-row> |         </el-row> | ||||||
|         <el-row :gutter="24" style="padding: 0 32px;"> |         <el-row :gutter="24" style="padding: 0 32px;"> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="标准组件总功率(MW)" prop="componentTotalPower"> |             <el-form-item label="标准组件总功率" prop="componentTotalPower"> | ||||||
|               <el-input-number v-model="dataForm.componentTotalPower" :precision="2" controls-position="right" placeholder="请输入标准组件总功率" style="width: 100%" /> |               <el-input-number v-model="dataForm.componentTotalPower" :precision="2" controls-position="right" placeholder="请输入标准组件总功率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="封装产能利用率(%)" prop="componentCapacityUtilizationRate"> |             <el-form-item label="封装产能利用率" prop="componentCapacityUtilizationRate"> | ||||||
|               <el-input-number v-model="dataForm.componentCapacityUtilizationRate" :precision="2" controls-position="right" placeholder="请输入封装产能利用率" style="width: 100%" /> |               <el-input-number v-model="dataForm.componentCapacityUtilizationRate" :precision="2" controls-position="right" placeholder="请输入封装产能利用率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="标准组件人均产量(片/人)" prop="componentAnnualAverageProduction"> |             <el-form-item label="标准组件人均产量" prop="componentAnnualAverageProduction"> | ||||||
|               <el-input-number v-model="dataForm.componentAnnualAverageProduction" :precision="2" controls-position="right" placeholder="请输入标准组件人均产量" style="width: 100%" /> |               <el-input-number v-model="dataForm.componentAnnualAverageProduction" :precision="2" controls-position="right" placeholder="请输入标准组件人均产量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="标准组件平均功率(W)" prop="componentAveragePower"> |             <el-form-item label="标准组件平均功率" prop="componentAveragePower"> | ||||||
|               <el-input-number v-model="dataForm.componentAveragePower" :precision="2" controls-position="right" placeholder="请输入标准组件平均功率" style="width: 100%" /> |               <el-input-number v-model="dataForm.componentAveragePower" :precision="2" controls-position="right" placeholder="请输入标准组件平均功率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |  | ||||||
|             <el-form-item label="标准组件转化效率" prop="componentConversionEfficiency"> |  | ||||||
|               <el-input-number v-model="dataForm.componentConversionEfficiency" :precision="2" controls-position="right" placeholder="请输入标准组件转化效率" style="width: 100%" /> |  | ||||||
|             </el-form-item> |  | ||||||
|           </el-col> |  | ||||||
|         </el-row> |         </el-row> | ||||||
|         <el-divider></el-divider> |         <el-divider></el-divider> | ||||||
|  |  | ||||||
| @@ -183,39 +168,39 @@ | |||||||
|         </small-title> |         </small-title> | ||||||
|         <el-row :gutter="24" style="padding: 0 32px;"> |         <el-row :gutter="24" style="padding: 0 32px;"> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="产品产量(㎡)" prop="bipvProductOutput"> |             <el-form-item label="产品产量" prop="bipvProductOutput"> | ||||||
|               <el-input-number v-model="dataForm.bipvProductOutput" :precision="0" controls-position="right" placeholder="请输入产品产量" style="width: 100%" /> |               <el-input-number v-model="dataForm.bipvProductOutput" :precision="0" controls-position="right" placeholder="请输入产品产量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="人均产量(㎡/人)" prop="bipvAnnualAverageProduction"> |             <el-form-item label="人均产量" prop="bipvAnnualAverageProduction"> | ||||||
|               <el-input-number v-model="dataForm.bipvAnnualAverageProduction" :precision="2" controls-position="right" placeholder="请输入人均产量" style="width: 100%" /> |               <el-input-number v-model="dataForm.bipvAnnualAverageProduction" :precision="2" controls-position="right" placeholder="请输入人均产量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片使用量(片)" prop="bipvChipUsage"> |             <el-form-item label="芯片使用量" prop="bipvChipUsage"> | ||||||
|               <el-input-number v-model="dataForm.bipvChipUsage" :precision="0" controls-position="right" placeholder="请输入芯片使用量" style="width: 100%" /> |               <el-input-number v-model="dataForm.bipvChipUsage" :precision="0" controls-position="right" placeholder="请输入芯片使用量" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="芯片利用率(%)" prop="bipvChipUtilizationRate"> |             <el-form-item label="芯片利用率" prop="bipvChipUtilizationRate"> | ||||||
|               <el-input-number v-model="dataForm.bipvChipUtilizationRate" :precision="2" controls-position="right" placeholder="请输入芯片利用率" style="width: 100%" /> |               <el-input-number v-model="dataForm.bipvChipUtilizationRate" :precision="2" controls-position="right" placeholder="请输入芯片利用率" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|         </el-row> |         </el-row> | ||||||
|         <el-row :gutter="24" style="padding: 0 32px;"> |         <el-row :gutter="24" style="padding: 0 32px;"> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="内部材料成本(元/㎡)" prop="bipvInsideMaterialCost"> |             <el-form-item label="内部材料成本" prop="bipvInsideMaterialCost"> | ||||||
|               <el-input-number v-model="dataForm.bipvInsideMaterialCost" :precision="2" controls-position="right" placeholder="请输入内部材料成本" style="width: 100%" /> |               <el-input-number v-model="dataForm.bipvInsideMaterialCost" :precision="2" controls-position="right" placeholder="请输入内部材料成本" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="OEM及委外材料成本(元/㎡)" prop="bipvOeeMaterialCost"> |             <el-form-item label="OEM及委外材料成本" prop="bipvOeeMaterialCost"> | ||||||
|               <el-input-number v-model="dataForm.bipvOeeMaterialCost" :precision="2" controls-position="right" placeholder="请输入OEM及委外材料成本" style="width: 100%" /> |               <el-input-number v-model="dataForm.bipvOeeMaterialCost" :precision="2" controls-position="right" placeholder="请输入OEM及委外材料成本" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
|           <el-col :span="6"> |           <el-col :span="6"> | ||||||
|             <el-form-item label="综合材料成本(元/㎡)" prop="bipvComprehensiveMaterialCost"> |             <el-form-item label="综合材料成本" prop="bipvComprehensiveMaterialCost"> | ||||||
|               <el-input-number v-model="dataForm.bipvComprehensiveMaterialCost" :precision="2" controls-position="right" placeholder="请输入综合材料成本" style="width: 100%" /> |               <el-input-number v-model="dataForm.bipvComprehensiveMaterialCost" :precision="2" controls-position="right" placeholder="请输入综合材料成本" style="width: 100%" /> | ||||||
|             </el-form-item> |             </el-form-item> | ||||||
|           </el-col> |           </el-col> | ||||||
| @@ -240,7 +225,6 @@ | |||||||
| import SmallTitle from './SmallTitle'; | import SmallTitle from './SmallTitle'; | ||||||
| import { createProduce, getProduceTargetDetail, updateProduceTarget } from '@/api/produceData'; | import { createProduce, getProduceTargetDetail, updateProduceTarget } from '@/api/produceData'; | ||||||
| import { factoryList, tyjxfactoryList, dhgfactoryList } from "@/utils/constants"; | import { factoryList, tyjxfactoryList, dhgfactoryList } from "@/utils/constants"; | ||||||
| import moment from 'moment' |  | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   components: { |   components: { | ||||||
| @@ -263,17 +247,57 @@ export default { | |||||||
|       workOrderList: [], |       workOrderList: [], | ||||||
|       detList: [], |       detList: [], | ||||||
|       teamList: [], |       teamList: [], | ||||||
|  |       sourceList: [ | ||||||
|  |         { | ||||||
|  |           id: 1, | ||||||
|  |           name: '手动', | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           id: 2, | ||||||
|  |           name: '自动', | ||||||
|  |         } | ||||||
|  |       ], | ||||||
|  |       // factoryList: [ | ||||||
|  |       //   { | ||||||
|  |       //     name: '瑞昌中建材光电材料有限公司', | ||||||
|  |       //     id: 0 | ||||||
|  |       //   }, | ||||||
|  |       //   { | ||||||
|  |       //     name: '邯郸中建材光电材料有限公司', | ||||||
|  |       //     id: 1 | ||||||
|  |       //   }, | ||||||
|  |       //   { | ||||||
|  |       //     name: '中建材株洲光电材料有限公司', | ||||||
|  |       //     id: 2 | ||||||
|  |       //   }, | ||||||
|  |       //   { | ||||||
|  |       //     name: '佳木斯中建材光电材料有限公司', | ||||||
|  |       //     id: 3 | ||||||
|  |       //   }, | ||||||
|  |       //   { | ||||||
|  |       //     name: '成都中建材光电材料有限公司', | ||||||
|  |       //     id: 4 | ||||||
|  |       //   }, | ||||||
|  |       //   { | ||||||
|  |       //     name: '凯盛光伏材料有限公司', | ||||||
|  |       //     id: 5 | ||||||
|  |       //   }, | ||||||
|  |       //   { | ||||||
|  |       //     name: '蚌埠兴科玻璃有限公司', | ||||||
|  |       //     id: 6 | ||||||
|  |       //   } | ||||||
|  |       // ], | ||||||
|       sectionList: [], |       sectionList: [], | ||||||
|       visible: false, |       visible: false, | ||||||
|       // reportTime: undefined, |  | ||||||
|       week: undefined, |  | ||||||
|       dataForm: { |       dataForm: { | ||||||
|         reportTime: undefined, |  | ||||||
|         factoryType: 0, |         factoryType: 0, | ||||||
|         id: undefined, |         id: undefined, | ||||||
|  |         reportTime: undefined, // 月时间 | ||||||
|         factory: undefined, |         factory: undefined, | ||||||
|         targetTime: undefined, |         targetType: undefined, | ||||||
|         targetType: 0, |         targetYear: undefined, | ||||||
|  |         showYear: undefined, | ||||||
|  |         targetMonth: undefined, | ||||||
|         chipYield: undefined, |         chipYield: undefined, | ||||||
|         chipYieldRate: undefined, |         chipYieldRate: undefined, | ||||||
|         chipBom: undefined, |         chipBom: undefined, | ||||||
| @@ -299,14 +323,13 @@ export default { | |||||||
|         bipvInsideMaterialCost: undefined, |         bipvInsideMaterialCost: undefined, | ||||||
|         bipvOeeMaterialCost: undefined, |         bipvOeeMaterialCost: undefined, | ||||||
|         bipvComprehensiveMaterialCost: undefined, |         bipvComprehensiveMaterialCost: undefined, | ||||||
|         molybdenumElectrodeInput: undefined, |         molybdenumElectrodeInput: undefined | ||||||
|         componentConversionEfficiency: undefined |  | ||||||
|       }, |       }, | ||||||
|       // materialList: [], |       // materialList: [], | ||||||
|       dataRule: { |       dataRule: { | ||||||
|         factory: [{ required: true, message: "工厂名称不能为空", trigger: "chnage" }], |         // materialId: [{ required: true, message: "", trigger: "blur" }], | ||||||
|         reportTime: [{ required: true, message: "时间不能为空", trigger: "change" }], |         // workOrderId: [{ required: true, message: "工单号不能为空", trigger: "change" }], | ||||||
|         targetType: [{ required: true, message: "时间维度不能为空", trigger: "change" }] |         // num: [{ required: true, message: "数量不能为空", trigger: "blur" }], | ||||||
|         // detId: [{ required: true, message: "报废原因不能为空", trigger: "change" }], |         // detId: [{ required: true, message: "报废原因不能为空", trigger: "change" }], | ||||||
|  |  | ||||||
|         // logTime: [{ required: true, message: "报废时间不能为空", trigger: "change" }], |         // logTime: [{ required: true, message: "报废时间不能为空", trigger: "change" }], | ||||||
| @@ -317,57 +340,57 @@ export default { | |||||||
|     // this.getCurrentTime() |     // this.getCurrentTime() | ||||||
|   }, |   }, | ||||||
|   methods: { |   methods: { | ||||||
|     setReportTime() { |  | ||||||
|       this.dataForm.reportTime = this.week |  | ||||||
|     }, |  | ||||||
|     clearTime() { |  | ||||||
|       this.week = undefined |  | ||||||
|       this.dataForm.reportTime = undefined |  | ||||||
|     }, |  | ||||||
|     formClear() { |     formClear() { | ||||||
|       if (this.$refs.dataForm !== undefined) { |       if (this.$refs.dataForm !== undefined) { | ||||||
|         this.$refs.dataForm.resetFields() |         this.$refs.dataForm.resetFields() | ||||||
|       } |       } | ||||||
|     }, |     }, | ||||||
|     // clearTime() { |     clearTime() { | ||||||
|     //   this.dataForm.targetTime = undefined |       this.dataForm.targetYear = undefined | ||||||
|     // },  |       this.dataForm.targetMonth = undefined | ||||||
|  |     }, | ||||||
|     handleClose() { |     handleClose() { | ||||||
|       this.$refs["form"].validate(valid => { |       // 新增 | ||||||
|         if (valid) { |       if (this.dataForm.targetType === 0) { | ||||||
|           // 新增 |         const timeArray = this.dataForm.reportTime.split('-') | ||||||
|           if (this.dataForm.targetType === 1) { |         this.dataForm.targetYear = Number(timeArray[0]) | ||||||
|             this.dataForm.targetTime = this.week ? Number(moment(this.week.getTime()).format('YYYYWW')) : '' |         this.dataForm.targetMonth = Number(timeArray[1]) | ||||||
|           } else { |       } | ||||||
|             this.dataForm.targetTime = this.dataForm.reportTime ? Number(this.dataForm.reportTime) : '' |       if (this.dataForm.targetType === 1) { | ||||||
|  |         this.dataForm.targetYear = Number(this.dataForm.showYear) | ||||||
|  |       } | ||||||
|  |       // if (this.dataForm.factory === 5) { | ||||||
|  |       //   this.dataForm.factoryType = 1 | ||||||
|  |       // } else { | ||||||
|  |       //   this.dataForm.factoryType = 0 | ||||||
|  |       // } | ||||||
|  |       if (this.dataForm.id) { | ||||||
|  |         // 修改 | ||||||
|  |         updateProduceTarget({ | ||||||
|  |           ...this.dataForm, | ||||||
|  |           showYear: undefined, | ||||||
|  |           reportTime: undefined | ||||||
|  |         }).then(res => { | ||||||
|  |           if (res.code === 0) { | ||||||
|  |             this.$message.success('修改成功!') | ||||||
|  |             this.visible = false | ||||||
|  |             this.$emit('refreshDataList') | ||||||
|           } |           } | ||||||
|           if (this.dataForm.id) { |         }) | ||||||
|             // 修改 |       } else { | ||||||
|             updateProduceTarget({ |         // 新增 | ||||||
|               ...this.dataForm, |         createProduce({ | ||||||
|               reportTime: undefined |           ...this.dataForm, | ||||||
|             }).then(res => { |           showYear: undefined, | ||||||
|               if (res.code === 0) { |           reportTime: undefined | ||||||
|                 this.$message.success('修改成功!') |         }).then(res => { | ||||||
|                 this.visible = false |           if (res.code === 0) { | ||||||
|                 this.$emit('refreshDataList') |             this.$message.success('新增成功!') | ||||||
|               } |             this.visible = false | ||||||
|             }) |             this.$emit('refreshDataList') | ||||||
|           } else { |  | ||||||
|             // 新增 |  | ||||||
|             createProduce({ |  | ||||||
|               ...this.dataForm, |  | ||||||
|               reportTime: undefined |  | ||||||
|             }).then(res => { |  | ||||||
|               if (res.code === 0) { |  | ||||||
|                 this.$message.success('新增成功!') |  | ||||||
|                 this.visible = false |  | ||||||
|                 this.$emit('refreshDataList') |  | ||||||
|               } |  | ||||||
|             }) |  | ||||||
|           } |           } | ||||||
|         } |         }) | ||||||
|       }) |       } | ||||||
|     }, |     }, | ||||||
|     init(id) { |     init(id) { | ||||||
|       this.dataForm.id = id || undefined |       this.dataForm.id = id || undefined | ||||||
| @@ -376,18 +399,19 @@ export default { | |||||||
|       if (this.dataForm.id) { |       if (this.dataForm.id) { | ||||||
|         getProduceTargetDetail(this.dataForm.id).then(res => { |         getProduceTargetDetail(this.dataForm.id).then(res => { | ||||||
|           this.dataForm = res.data |           this.dataForm = res.data | ||||||
|           if (this.dataForm.targetType === 0 || this.dataForm.targetType === 2 || this.dataForm.targetType === 3) { |  | ||||||
|             // this.dataForm.reportTime = String(this.dataForm.targetTime) |  | ||||||
|             this.$set(this.dataForm, 'reportTime', String(this.dataForm.targetTime)) |  | ||||||
|           } |  | ||||||
|           if (this.dataForm.targetType === 1) { |           if (this.dataForm.targetType === 1) { | ||||||
|             const date = new Date() |             if (this.dataForm.targetYear) { | ||||||
|             date.setFullYear(String(this.dataForm.targetTime).slice(0, 4)) |               this.$set(this.dataForm, 'showYear', String(this.dataForm.targetYear)) | ||||||
|             date.setMonth(0) |             } | ||||||
|             date.setDate((Number(String(this.dataForm.targetTime).slice(4)) - 1)* 7 + 1) |           } | ||||||
|             // console.log('你好', date, moment(date).format('yyyyWW'), String(this.dataForm.targetTime).slice(4)) |           if (this.dataForm.targetType === 0) { | ||||||
|             this.week = date |             if (this.dataForm.targetYear && this.dataForm.targetMonth !== null) { | ||||||
|             this.$set(this.dataForm, 'reportTime', date) |               if (this.dataForm.targetMonth < 10) { | ||||||
|  |                 this.$set(this.dataForm, 'reportTime', String(this.dataForm.targetYear) + '-0' + String(this.dataForm.targetMonth)) | ||||||
|  |               } else { | ||||||
|  |                 this.$set(this.dataForm, 'reportTime', String(this.dataForm.targetYear) + '-' + String(this.dataForm.targetMonth)) | ||||||
|  |               } | ||||||
|  |             } | ||||||
|           } |           } | ||||||
|         }) |         }) | ||||||
|       } |       } | ||||||
| @@ -400,7 +424,6 @@ export default { | |||||||
|   position: absolute; |   position: absolute; | ||||||
|   bottom: 1%; |   bottom: 1%; | ||||||
|   right: 2%; |   right: 2%; | ||||||
|   z-index: 999; |  | ||||||
| } | } | ||||||
| .drawer-footer { | .drawer-footer { | ||||||
|   width: 100%; |   width: 100%; | ||||||
|   | |||||||
| @@ -1,15 +1,14 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2023-11-06 15:15:30 |  * @Date: 2023-11-06 15:15:30 | ||||||
|  * @LastEditTime: 2024-06-14 10:41:23 |  * @LastEditTime: 2024-05-22 15:29:18 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
|   <el-drawer class="drawer" :visible.sync="visible" size="70%" @closed="$emit('destroy')"> |   <el-drawer class="drawer" :visible.sync="visible" size="58%" @closed="$emit('destroy')"> | ||||||
|     <small-title slot="title" :no-padding="true"> |     <small-title slot="title" :no-padding="true"> | ||||||
|       <!-- {{ ftype === 0 ? '碲化镉工厂生产数据详情' : '铜铟镓硒工厂生产数据详情' }} --> |       {{ ftype === 0 ? '碲化镉工厂生产数据详情' : '铜铟镓硒工厂生产数据详情' }} | ||||||
|       生产目标详情 |  | ||||||
|     </small-title> |     </small-title> | ||||||
|     <div class="detailBox"> |     <div class="detailBox"> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
| @@ -19,11 +18,11 @@ | |||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="8"> |         <el-col :span="8"> | ||||||
|           <p class="title">时间维度</p> |           <p class="title">时间维度</p> | ||||||
|           <p class="text">{{ ['日', '周', '月', '年'][dataForm.targetType] }}</p> |           <p class="text">{{ dataForm.targetType === 0 ? '月' : '年' }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="8"> |         <el-col :span="8"> | ||||||
|           <p class="title">时间</p> |           <p class="title">时间</p> | ||||||
|           <p class="text">{{ dataForm.targetTime}}</p> |           <p class="text">{{ dataForm.targetType === 1 ? dataForm.targetYear + '年' : dataForm.targetYear + '年' + dataForm.targetMonth + '月'}}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-divider></el-divider> |       <el-divider></el-divider> | ||||||
| @@ -32,11 +31,11 @@ | |||||||
|       </small-title> |       </small-title> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片产量(片)</p> |           <p class="title">芯片产量</p> | ||||||
|           <p class="text">{{ dataForm.chipYield }}</p> |           <p class="text">{{ dataForm.chipYield }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片良率(%)</p> |           <p class="title">芯片良率</p> | ||||||
|           <p class="text">{{ dataForm.chipYieldRate }}</p> |           <p class="text">{{ dataForm.chipYieldRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
| @@ -44,35 +43,35 @@ | |||||||
|           <p class="text">{{ dataForm.chipBom }}</p> |           <p class="text">{{ dataForm.chipBom }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片总功率(MW)</p> |           <p class="title">芯片总功率</p> | ||||||
|           <p class="text">{{ dataForm.chipTotalPower }}</p> |           <p class="text">{{ dataForm.chipTotalPower }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">{{ ['FTO投入量(片)', '钼电极投入量(片)'][ftype] }}</p> |           <p class="title">{{ ftype === 0 ? 'FTO投入量' : '钼电极投入量' }}</p> | ||||||
|           <p class="text">{{ [dataForm.ftoInput, dataForm.molybdenumElectrodeInput][ftype] }}</p> |           <p class="text">{{ ftype === 0 ? dataForm.ftoInput : dataForm.molybdenumElectrodeInput }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">{{ ['CSS稼动率(%)', 'PID6稼动率(%)'][ftype] }}</p> |           <p class="title">{{ ftype === 0 ? 'CSS稼动率' : 'PID6稼动率' }}</p> | ||||||
|           <p class="text">{{ dataForm.chipCssMarriageRate }}</p> |           <p class="text">{{ dataForm.chipCssMarriageRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片段OEE(%)</p> |           <p class="title">芯片段OEE</p> | ||||||
|           <p class="text">{{ dataForm.chipOee }}</p> |           <p class="text">{{ dataForm.chipOee }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片平均功率(W)</p> |           <p class="title">芯片平均功率</p> | ||||||
|           <p class="text">{{ dataForm.chipAveragePower }}</p> |           <p class="text">{{ dataForm.chipAveragePower }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片人均产量(片/人)</p> |           <p class="title">芯片人均产量</p> | ||||||
|           <p class="text">{{ dataForm.chipAnnualAverageProduction }}</p> |           <p class="text">{{ dataForm.chipAnnualAverageProduction }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片产能利用率(%)</p> |           <p class="title">芯片产能利用率</p> | ||||||
|           <p class="text">{{ dataForm.chipCapacityUtilizationRate }}</p> |           <p class="text">{{ dataForm.chipCapacityUtilizationRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
| @@ -85,72 +84,68 @@ | |||||||
|           <p class="text">{{ dataForm.componentBom }}</p> |           <p class="text">{{ dataForm.componentBom }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">封装线OEE(%)</p> |           <p class="title">封装线OEE</p> | ||||||
|           <p class="text">{{ dataForm.componentOee }}</p> |           <p class="text">{{ dataForm.componentOee }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件良率(%)</p> |           <p class="title">标准组件良率</p> | ||||||
|           <p class="text">{{ dataForm.componentYieldRate }}</p> |           <p class="text">{{ dataForm.componentYieldRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件产量(片)</p> |           <p class="title">标准组件产量</p> | ||||||
|           <p class="text">{{ dataForm.componentYield }}</p> |           <p class="text">{{ dataForm.componentYield }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件总功率(MW)</p> |           <p class="title">标准组件总功率</p> | ||||||
|           <p class="text">{{ dataForm.componentTotalPower }}</p> |           <p class="text">{{ dataForm.componentTotalPower }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">封装产能利用率(%)</p> |           <p class="title">封装产能利用率</p> | ||||||
|           <p class="text">{{ dataForm.componentCapacityUtilizationRate }}</p> |           <p class="text">{{ dataForm.componentCapacityUtilizationRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件人均产量(片/人)</p> |           <p class="title">标准组件人均产量</p> | ||||||
|           <p class="text">{{ dataForm.componentAnnualAverageProduction }}</p> |           <p class="text">{{ dataForm.componentAnnualAverageProduction }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">标准组件平均功率(W)</p> |           <p class="title">标准组件平均功率</p> | ||||||
|           <p class="text">{{ dataForm.componentAveragePower }}</p> |           <p class="text">{{ dataForm.componentAveragePower }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |  | ||||||
|           <p class="title">标准组件转化效率</p> |  | ||||||
|           <p class="text">{{ dataForm.componentConversionEfficiency }}</p> |  | ||||||
|         </el-col> |  | ||||||
|       </el-row> |       </el-row> | ||||||
|       <small-title style=" margin: 0;padding: 26px 32px 24px;margin-bottom: 22px;" :no-padding="false"> |       <small-title style=" margin: 0;padding: 26px 32px 24px;margin-bottom: 22px;" :no-padding="false"> | ||||||
|         {{ 'BIPV产品' }} |         {{ 'BIPV产品' }} | ||||||
|       </small-title> |       </small-title> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">产品产量(㎡)</p> |           <p class="title">产品产量</p> | ||||||
|           <p class="text">{{ dataForm.bipvProductOutput }}</p> |           <p class="text">{{ dataForm.bipvProductOutput }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">人均产量(㎡/人)</p> |           <p class="title">人均产量</p> | ||||||
|           <p class="text">{{ dataForm.bipvAnnualAverageProduction }}</p> |           <p class="text">{{ dataForm.bipvAnnualAverageProduction }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片使用量(片)</p> |           <p class="title">芯片使用量</p> | ||||||
|           <p class="text">{{ dataForm.bipvChipUsage }}</p> |           <p class="text">{{ dataForm.bipvChipUsage }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">芯片利用率(%)</p> |           <p class="title">芯片利用率</p> | ||||||
|           <p class="text">{{ dataForm.bipvChipUtilizationRate }}</p> |           <p class="text">{{ dataForm.bipvChipUtilizationRate }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
|       <el-row :gutter="24"> |       <el-row :gutter="24"> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">内部材料成本(元/㎡)</p> |           <p class="title">内部材料成本</p> | ||||||
|           <p class="text">{{ dataForm.bipvInsideMaterialCost }}</p> |           <p class="text">{{ dataForm.bipvInsideMaterialCost }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">OEM及委外材料成本(元/㎡)</p> |           <p class="title">OEM及委外材料成本</p> | ||||||
|           <p class="text">{{ dataForm.bipvOeeMaterialCost }}</p> |           <p class="text">{{ dataForm.bipvOeeMaterialCost }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|         <el-col :span="6"> |         <el-col :span="6"> | ||||||
|           <p class="title">综合材料成本(元/㎡)</p> |           <p class="title">综合材料成本</p> | ||||||
|           <p class="text">{{ dataForm.bipvComprehensiveMaterialCost }}</p> |           <p class="text">{{ dataForm.bipvComprehensiveMaterialCost }}</p> | ||||||
|         </el-col> |         </el-col> | ||||||
|       </el-row> |       </el-row> | ||||||
| @@ -202,9 +197,35 @@ export default { | |||||||
|       ], |       ], | ||||||
|       sectionList: [], |       sectionList: [], | ||||||
|       visible: false, |       visible: false, | ||||||
|       dataForm: {} |       dataForm: { | ||||||
|  |         id: undefined, | ||||||
|  |         logTime: undefined, | ||||||
|  |         source: 1, | ||||||
|  |         detId: undefined, | ||||||
|  |         workOrderId: null, | ||||||
|  |         teamId: undefined, | ||||||
|  |         num: undefined, | ||||||
|  |         lineId: undefined, | ||||||
|  |         description: undefined, | ||||||
|  |         // description: undefined, | ||||||
|  |         remark: undefined, | ||||||
|  |       }, | ||||||
|  |       // materialList: [], | ||||||
|  |       dataRule: { | ||||||
|  |         // materialId: [{ required: true, message: "", trigger: "blur" }], | ||||||
|  |         workOrderId: [{ required: true, message: "工单号不能为空", trigger: "change" }], | ||||||
|  |         num: [{ required: true, message: "数量不能为空", trigger: "blur" }], | ||||||
|  |         detId: [{ required: true, message: "报废原因不能为空", trigger: "change" }], | ||||||
|  |  | ||||||
|  |         logTime: [{ required: true, message: "报废时间不能为空", trigger: "change" }], | ||||||
|  |       } | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
|  |   mounted() { | ||||||
|  |     this.getDict() | ||||||
|  |     console.log('我看看', this.dataForm) | ||||||
|  |     // this.getCurrentTime() | ||||||
|  |   }, | ||||||
|   methods: { |   methods: { | ||||||
|     init(id) { |     init(id) { | ||||||
|       this.visible = true |       this.visible = true | ||||||
| @@ -214,7 +235,102 @@ export default { | |||||||
|           this.dataForm = res.data |           this.dataForm = res.data | ||||||
|         }) |         }) | ||||||
|       } |       } | ||||||
|     } |     }, | ||||||
|  |     // getCurrentTime() { | ||||||
|  |     //   // new Date().Format("yyyy-MM-dd HH:mm:ss") | ||||||
|  |     //   this.dataForm.logTime = new Date() | ||||||
|  |     //   // this.dataForm.logTime = year + "-" + month + "-" + day; | ||||||
|  |     //   console.log(this.dataForm.logTime); | ||||||
|  |     // }, | ||||||
|  |     async getDict() { | ||||||
|  |     //   // 物料列表 | ||||||
|  |     //   const res = await getList() | ||||||
|  |     //   this.typeList = res.data | ||||||
|  |     //   getWorkOrderList().then((res) => { | ||||||
|  |     //     console.log(res); | ||||||
|  |     //     // console.log(response); | ||||||
|  |     //     this.workOrderList = res.data.map((item) => { | ||||||
|  |     //       return { | ||||||
|  |     //         name: item.name, | ||||||
|  |     //         id: item.id | ||||||
|  |     //       } | ||||||
|  |     //     }) | ||||||
|  |     //     // console.log(this.formConfig[0].selectOptions); | ||||||
|  |     //     // this.listQuery.total = response.data.total; | ||||||
|  |     //   }) | ||||||
|  |     //   getLineList().then((res) => { | ||||||
|  |     //     console.log(res); | ||||||
|  |     //     // console.log(response); | ||||||
|  |     //     this.lineList = res.data.map((item) => { | ||||||
|  |     //       return { | ||||||
|  |     //         name: item.name, | ||||||
|  |     //         id: item.id | ||||||
|  |     //       } | ||||||
|  |     //     }) | ||||||
|  |     //     // console.log(this.formConfig[0].selectOptions); | ||||||
|  |     //     // this.listQuery.total = response.data.total; | ||||||
|  |     //   }) | ||||||
|  |     //   getDetList().then((res) => { | ||||||
|  |     //     console.log(res); | ||||||
|  |     //     // console.log(response); | ||||||
|  |     //     this.detList = res.data.map((item) => { | ||||||
|  |     //       return { | ||||||
|  |     //         name: item.content, | ||||||
|  |     //         id: item.id | ||||||
|  |     //       } | ||||||
|  |     //     }) | ||||||
|  |     //     // console.log(this.formConfig[0].selectOptions); | ||||||
|  |     //     // this.listQuery.total = response.data.total; | ||||||
|  |     //   }) | ||||||
|  |     //   getTeamList().then((res) => { | ||||||
|  |     //     console.log(res); | ||||||
|  |     //     // console.log(response); | ||||||
|  |     //     this.teamList = res.data.map((item) => { | ||||||
|  |     //       return { | ||||||
|  |     //         name: item.name, | ||||||
|  |     //         id: item.id | ||||||
|  |     //       } | ||||||
|  |     //     }) | ||||||
|  |     //     // console.log(this.formConfig[0].selectOptions); | ||||||
|  |     //     // this.listQuery.total = response.data.total; | ||||||
|  |     //   }) | ||||||
|  |     // }, | ||||||
|  |     // async getWorksectionById(lineId) { | ||||||
|  |     //   if (lineId) { | ||||||
|  |     //     const { code, data } = await this.$axios({ | ||||||
|  |     //       url: '/base/core-workshop-section/listByParentId', | ||||||
|  |     //       method: 'get', | ||||||
|  |     //       params: { | ||||||
|  |     //         id: lineId, | ||||||
|  |     //       }, | ||||||
|  |     //     }); | ||||||
|  |     //     if (code == 0) { | ||||||
|  |     //       console.log(data) | ||||||
|  |     //       this.sectionList = data.map((item) => { | ||||||
|  |     //         return { | ||||||
|  |     //           name: item.name, | ||||||
|  |     //           id: item.id, | ||||||
|  |     //         }; | ||||||
|  |     //       }); | ||||||
|  |     //     } | ||||||
|  |     //   } else { | ||||||
|  |     //     this.$axios({ | ||||||
|  |     //       url: '/base/core-workshop-section/listAll', | ||||||
|  |     //       method: 'get', | ||||||
|  |     //       // params: { | ||||||
|  |     //       //   id: lineId, | ||||||
|  |     //       // }, | ||||||
|  |     //     }).then((res) => { | ||||||
|  |     //       // console.log(data) | ||||||
|  |     //       this.sectionList = res.data.map((item) => { | ||||||
|  |     //         return { | ||||||
|  |     //           name: item.name, | ||||||
|  |     //           id: item.id, | ||||||
|  |     //         }; | ||||||
|  |     //       }); | ||||||
|  |     //     }) | ||||||
|  |     //   } | ||||||
|  |     }, | ||||||
|   }, |   }, | ||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
| @@ -255,8 +371,5 @@ export default { | |||||||
|   color: rgba(102,102,102,0.75); |   color: rgba(102,102,102,0.75); | ||||||
|   padding-bottom: 20px; |   padding-bottom: 20px; | ||||||
| } | } | ||||||
| .detailBox { |  | ||||||
|   width: 98%; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| </style> | </style> | ||||||
|   | |||||||
| @@ -1,15 +1,15 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2024-04-15 10:49:13 |  * @Date: 2024-04-15 10:49:13 | ||||||
|  * @LastEditTime: 2024-06-17 09:49:15 |  * @LastEditTime: 2024-05-22 16:22:57 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
|   <div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 32px)"> |   <div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 31px)"> | ||||||
|     <ButtonNav v-show="false" :menus="['碲化镉工厂', '铜铟镓硒工厂']" :button-mode="true" @change="changeFactory" style="margin-top: -10px"> |     <ButtonNav :menus="['碲化镉工厂', '铜铟镓硒工厂']" :button-mode="true" @change="changeFactory" style="margin-top: -10px"> | ||||||
|     </ButtonNav> |     </ButtonNav> | ||||||
|     <div class="app-container" style="height: auto; flex-grow: 1;"> |     <div class="app-container" style="padding: 16px 24px 0;height: auto; flex-grow: 1;"> | ||||||
|       <el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip"> |       <el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip"> | ||||||
|         <el-form-item v-if="facType === 0" label="工厂名称" prop="factorys"> |         <el-form-item v-if="facType === 0" label="工厂名称" prop="factorys"> | ||||||
|           <el-select size="small" v-model="listQuery.factorys" placeholder="请选择工厂名称" multiple clearable> |           <el-select size="small" v-model="listQuery.factorys" placeholder="请选择工厂名称" multiple clearable> | ||||||
| @@ -24,39 +24,39 @@ | |||||||
|           </el-select> |           </el-select> | ||||||
|         </el-form-item> |         </el-form-item> | ||||||
|         <el-form-item label="时间维度" prop="date"> |         <el-form-item label="时间维度" prop="date"> | ||||||
|           <el-select size="small" clearable v-model="listQuery.date" placeholder="请选择" @change="clearTime"> |           <el-select size="small" clearable v-model="listQuery.date" placeholder="请选择"> | ||||||
|             <el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value"> |             <el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value"> | ||||||
|             </el-option> |             </el-option> | ||||||
|           </el-select> |           </el-select> | ||||||
|         </el-form-item> |         </el-form-item> | ||||||
|         <el-form-item v-show="listQuery.date === 1 || listQuery.date === ''" label="时间范围" prop="reportTime"> |         <!-- <el-form-item v-show="timeSelect === 'day'" label="时间范围" prop="reportTime"> | ||||||
|           <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator="至" |           <el-date-picker v-model="listQuery.reportTime" type="datetimerange" range-separator="至" | ||||||
|             start-placeholder="开始日期" value-format="yyyyMMdd" @change="changeDayTime" end-placeholder="结束日期"> |             start-placeholder="开始日期" value-format="yyyy-MM-dd HH:mm:ss" @change="changeDayTime" end-placeholder="结束日期"> | ||||||
|           </el-date-picker> |           </el-date-picker> | ||||||
|         </el-form-item> |         </el-form-item> --> | ||||||
|         <el-form-item v-show="listQuery.date === 2" label="时间范围" prop="reportTime"> |         <!-- <el-form-item v-show="timeSelect === 'week'" label="时间范围" prop="reportTime"> | ||||||
|           <el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周" |           <el-date-picker v-model="listQuery.reportTime[0]" type="week" format="yyyy 第 WW 周" placeholder="选择周" | ||||||
|             style="width: 180px" @change="onValueChange"> |             style="width: 180px" @change="onValueChange"> | ||||||
|           </el-date-picker> |           </el-date-picker> | ||||||
|           至 |           至 | ||||||
|           <el-date-picker size="small" clearable v-model="end" type="week" format="yyyy 第 WW 周"  placeholder="选择周" |           <el-date-picker v-model="listQuery.reportTime[1]" type="week" format="yyyy 第 WW 周" placeholder="选择周" | ||||||
|             style="width: 180px" @change="onValueChange"> |             style="width: 180px" @change="onValueChange"> | ||||||
|           </el-date-picker> |           </el-date-picker> | ||||||
|           <!-- <span v-if="start && end" style="margin-left: 10px"> |           <span v-if="listQuery.reportTime[0] && listQuery.reportTime[1]" style="margin-left: 10px"> | ||||||
|             {{ date1 }} 至 {{ date2 }},共 {{ weekNum }} 周 |             {{ date1 }} 至 {{ date2 }},共 {{ weekNum }} 周 | ||||||
|           </span> --> |           </span> | ||||||
|         </el-form-item> |         </el-form-item> --> | ||||||
|         <el-form-item v-show="listQuery.date === 3" label="时间值" prop="reportTime"> |         <el-form-item v-show="listQuery.date !== 4" label="时间值" prop="reportTime"> | ||||||
|           <el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange" value-format="yyyyMM" range-separator="至" start-placeholder="开始月份" |           <el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange" value-format="timestamp" range-separator="至" start-placeholder="开始月份" | ||||||
|             end-placeholder="结束月份" @change="changeTime"> |             end-placeholder="结束月份" @change="changeTime"> | ||||||
|           </el-date-picker> |           </el-date-picker> | ||||||
|         </el-form-item> |         </el-form-item> | ||||||
|         <el-form-item v-show="listQuery.date === 4" label="时间值" prop="reportTime"> |         <el-form-item v-show="listQuery.date === 4" label="时间值" prop="reportTime"> | ||||||
|           <el-date-picker size="small" clearable v-model="start" value-format="yyyy" type="year" |           <el-date-picker size="small" clearable v-model="start" value-format="timestamp" type="year" | ||||||
|             placeholder="开始时间"> |             placeholder="开始时间"> | ||||||
|           </el-date-picker> |           </el-date-picker> | ||||||
|           ~ |           ~ | ||||||
|           <el-date-picker size="small" clearable v-model="end" value-format="yyyy" type="year" placeholder="结束时间" |           <el-date-picker size="small" clearable v-model="end" value-format="timestamp" type="year" placeholder="结束时间" | ||||||
|             @change="getYear"> |             @change="getYear"> | ||||||
|           </el-date-picker> |           </el-date-picker> | ||||||
|         </el-form-item> |         </el-form-item> | ||||||
| @@ -173,7 +173,7 @@ export default { | |||||||
|         current: 1, |         current: 1, | ||||||
|         factorys: null, |         factorys: null, | ||||||
|         total: 0, |         total: 0, | ||||||
|         date: 3, |         date: undefined, | ||||||
|         beginTime: undefined, |         beginTime: undefined, | ||||||
|         endTime: undefined, |         endTime: undefined, | ||||||
|         reportTime: [] |         reportTime: [] | ||||||
| @@ -314,17 +314,9 @@ export default { | |||||||
|         }, |         }, | ||||||
|       ], |       ], | ||||||
|       timeList: [ |       timeList: [ | ||||||
|         { |  | ||||||
|           value: 1, |  | ||||||
|           label: '日' |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           value: 2, |  | ||||||
|           label: '周' |  | ||||||
|         }, |  | ||||||
|         { |         { | ||||||
|           value: 3, |           value: 3, | ||||||
|           label: '月' |           label:'月' | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           value: 4, |           value: 4, | ||||||
| @@ -340,13 +332,13 @@ export default { | |||||||
|           showOverflowtooltip: true |           showOverflowtooltip: true | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           prop: 'targetTime', |           prop: 'tagertTime', | ||||||
|           label: '目标时间', |           label: '目标时间', | ||||||
|           minWidth: 150, |           minWidth: 150, | ||||||
|           showOverflowtooltip: true |           showOverflowtooltip: true | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           prop: 'updateTime', |           prop: 'createTime', | ||||||
|           label: '提交时间', |           label: '提交时间', | ||||||
|           filter: parseTime, |           filter: parseTime, | ||||||
|           minWidth: 150, |           minWidth: 150, | ||||||
| @@ -426,11 +418,11 @@ export default { | |||||||
| 			// all: {} | 			// all: {} | ||||||
| 		}; | 		}; | ||||||
|   }, |   }, | ||||||
|   computed: { |   // computed: { | ||||||
|     weekNum() { |   //   weekNum() { | ||||||
|       return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1 |   //     return Math.round((this.listQuery.reportTime[1] - this.listQuery.reportTime[0]) / (24 * 60 * 60 * 1000 * 7)) + 1 | ||||||
|     }, |   //   }, | ||||||
|   }, |   // }, | ||||||
|   watch: { |   watch: { | ||||||
|     facType(value) { |     facType(value) { | ||||||
|       if (value === 0) { |       if (value === 0) { | ||||||
| @@ -450,21 +442,15 @@ export default { | |||||||
|         }) |         }) | ||||||
|         this.upload.url = process.env.VUE_APP_BASE_API + '/admin-api/ip/prod-target/to-target-import-excel' |         this.upload.url = process.env.VUE_APP_BASE_API + '/admin-api/ip/prod-target/to-target-import-excel' | ||||||
|       } |       } | ||||||
|  |       console.log(112, this.tableProps) | ||||||
|     } |     } | ||||||
|   }, |   }, | ||||||
| 	created() { | 	mounted() { | ||||||
|     const currentMonth = new Date() |     // this.getDict() | ||||||
|     this.listQuery.reportTime = [moment(currentMonth).format('yyyyMM'), moment(currentMonth).format('yyyyMM')] |     // this.getCurrentYearFirst() | ||||||
|     this.changeTime() |     this.getDataList() | ||||||
| 	}, | 	}, | ||||||
|   methods: { |   methods: { | ||||||
|   clearTime() { |  | ||||||
|     this.listQuery.beginTime = undefined |  | ||||||
|     this.listQuery.endTime = undefined |  | ||||||
|     this.listQuery.reportTime = [] |  | ||||||
|     this.start = undefined |  | ||||||
|     this.end = undefined |  | ||||||
|   }, |  | ||||||
|     handleImport() { |     handleImport() { | ||||||
|       this.upload.title = "生产目标导入"; |       this.upload.title = "生产目标导入"; | ||||||
|       this.upload.open = true; |       this.upload.open = true; | ||||||
| @@ -474,6 +460,42 @@ export default { | |||||||
|     handleFileUploadProgress(event, file, fileList) { |     handleFileUploadProgress(event, file, fileList) { | ||||||
|       this.upload.isUploading = true; |       this.upload.isUploading = true; | ||||||
|     }, |     }, | ||||||
|  |     // 文件上传成功处理 | ||||||
|  |     // handleFileSuccess(param, type) { | ||||||
|  |     //   console.log('带的', param.file) | ||||||
|  |     //   const formData = new FormData() | ||||||
|  |     //   formData.append('multipartFile', param.file) | ||||||
|  |     //   console.log('送送', param) | ||||||
|  |     //   importDiTarget(formData).then(res => { | ||||||
|  |     //     console.log(res) | ||||||
|  |     //     if (res.code !== 0) { | ||||||
|  |     //       this.$modal.msgError(response.msg) | ||||||
|  |     //       return; | ||||||
|  |     //     } | ||||||
|  |     //     this.upload.open = false; | ||||||
|  |     //     this.upload.isUploading = false; | ||||||
|  |     //     this.$refs.upload.clearFiles(); | ||||||
|  |     //   }).catch(() => { | ||||||
|  |     //     this.upload.open = false | ||||||
|  |     //     this.upload.isUploading = false | ||||||
|  |     //   }) | ||||||
|  |     //   // 拼接提示语 | ||||||
|  |     //   // let data = response.data; | ||||||
|  |     //   // let text = '创建成功数量:' + data.createUsernames.length; | ||||||
|  |     //   // for (const username of data.createUsernames) { | ||||||
|  |     //   //   text += '<br />    ' + username; | ||||||
|  |     //   // } | ||||||
|  |     //   // text += '<br />更新成功数量:' + data.updateUsernames.length; | ||||||
|  |     //   // for (const username of data.updateUsernames) { | ||||||
|  |     //   //   text += '<br />    ' + username; | ||||||
|  |     //   // } | ||||||
|  |     //   // text += '<br />更新失败数量:' + Object.keys(data.failureUsernames).length; | ||||||
|  |     //   // for (const username in data.failureUsernames) { | ||||||
|  |     //   //   text += '<br />    ' + username + ':' + data.failureUsernames[username]; | ||||||
|  |     //   // } | ||||||
|  |     //   this.$message.success('导入成功!'); | ||||||
|  |     //   this.getDataList(); | ||||||
|  |     // }, | ||||||
|         // 文件上传成功处理 |         // 文件上传成功处理 | ||||||
|     handleFileSuccess(response, file, fileList) { |     handleFileSuccess(response, file, fileList) { | ||||||
|       if (response.code !== 0) { |       if (response.code !== 0) { | ||||||
| @@ -499,6 +521,11 @@ export default { | |||||||
|     changeFactory($event) { |     changeFactory($event) { | ||||||
|       this.currentMenu = $event |       this.currentMenu = $event | ||||||
|       this.facType = this.currentMenu === '碲化镉工厂' ? 0 : 1 |       this.facType = this.currentMenu === '碲化镉工厂' ? 0 : 1 | ||||||
|  |       // if (this.facType === 0) { | ||||||
|  |       //   this.upload.url = process.env.VUE_APP_BASE_API + '/admin-api/ip/prod-target/di-target-import-excel' | ||||||
|  |       // } else { | ||||||
|  |       //   this.upload.url = process.env.VUE_APP_BASE_API + '/admin-api/ip/prod-target/to-target-import-excel' | ||||||
|  |       // } | ||||||
|       this.getDataList() |       this.getDataList() | ||||||
|     }, |     }, | ||||||
|     handleClick(val) { |     handleClick(val) { | ||||||
| @@ -509,6 +536,7 @@ export default { | |||||||
|           this.$refs.addOrUpdate.init(val.data.id); |           this.$refs.addOrUpdate.init(val.data.id); | ||||||
|         }); |         }); | ||||||
|       } else if (val.type === "delete") { |       } else if (val.type === "delete") { | ||||||
|  |         console.log('啊啊', val) | ||||||
|         this.deleteHandle(val.data.id, val.data.factory, val.data._pageIndex) |         this.deleteHandle(val.data.id, val.data.factory, val.data._pageIndex) | ||||||
|       } else { |       } else { | ||||||
|         this.otherMethods(val) |         this.otherMethods(val) | ||||||
| @@ -541,98 +569,84 @@ export default { | |||||||
|       this.$nextTick(() => { |       this.$nextTick(() => { | ||||||
|         this.$refs.detailOrUpdate.init(val.data.id); |         this.$refs.detailOrUpdate.init(val.data.id); | ||||||
|       }); |       }); | ||||||
|  |     }, | ||||||
|  |     buttonClick() { | ||||||
|  |  | ||||||
|     }, |     }, | ||||||
|     getYear(e) { |     getYear(e) { | ||||||
|       if (this.end && Number(this.end) - Number(this.start) > 10) { |       if (this.end && e - this.start > 10 * 365*24*60*60*1000) { | ||||||
|         this.$message({ |         this.$message({ | ||||||
|           message: '年份起止时间不能超过十年', |           message: '年份起止时间不能超过十年', | ||||||
|           type: 'warning' |           type: 'warning' | ||||||
|         }); |         }); | ||||||
|         this.start = undefined |  | ||||||
|         this.end = undefined |  | ||||||
|         // console.log(); |         // console.log(); | ||||||
|       } else { |       } else { | ||||||
|         if (Number(this.end) < Number(this.start)) { |         if (this.end < this.start) { | ||||||
|           this.$message({ |           this.$message({ | ||||||
|             message: '结束年份不能小于开始年份', |             message: '结束年份不能小于开始年份', | ||||||
|             type: 'warning' |             type: 'warning' | ||||||
|           }); |           }); | ||||||
|           this.start = undefined |  | ||||||
|           this.end = undefined |  | ||||||
|         } else { |  | ||||||
|           this.listQuery.beginTime = Number(this.start) |  | ||||||
|           this.listQuery.endTime = Number(this.end) |  | ||||||
|         } |         } | ||||||
|       } |       } | ||||||
|       if (!this.start && !this.end) { |  | ||||||
|         this.listQuery.beginTime = undefined |  | ||||||
|         this.listQuery.endTime = undefined |  | ||||||
|       } |  | ||||||
|       // console.log(e); |       // console.log(e); | ||||||
|     }, |     }, | ||||||
|     changeTime() { |     changeTime() { | ||||||
|       if (this.listQuery.reportTime) { |       if (this.listQuery.reportTime) { | ||||||
|         const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4)) |         const numDays = this.listQuery.reportTime[1] - this.listQuery.reportTime[0] | ||||||
|         const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4)) |         if (numDays > 2*365*24*60*60*1000) { | ||||||
|         if (years * 12 + months > 24) { |  | ||||||
|           this.$message({ |           this.$message({ | ||||||
|             message: '时间范围不能超过24个月', |             message: '时间范围不能超过24个月', | ||||||
|             type: 'warning' |             type: 'warning' | ||||||
|           }); |           }); | ||||||
|           this.listQuery.reportTime = []; |           this.listQuery.reportTime = []; | ||||||
|         } else { |  | ||||||
|           this.listQuery.beginTime = Number(this.listQuery.reportTime[0]) |  | ||||||
|           this.listQuery.endTime = Number(this.listQuery.reportTime[1]) |  | ||||||
|         } |         } | ||||||
|       } else { |  | ||||||
|         this.listQuery.beginTime = undefined |  | ||||||
|         this.listQuery.endTime = undefined |  | ||||||
|       } |       } | ||||||
|     }, |     }, | ||||||
|     onValueChange(picker, k) { // 选中近k周后触发的操作 |     // 获取数据列表 | ||||||
|       if (this.start && this.end) { |     multipliedByHundred(str) { | ||||||
|         this.date1 = moment(this.start.getTime() - 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss') |       console.log(str); | ||||||
|         this.date2 = moment(this.end.getTime() + 5 * 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss') |       // console.log(str) | ||||||
|         const numDays = (new Date(this.date2).getTime() - new Date(this.date1).getTime()) / (24 * 3600 * 1000); |       if ( str != 0) { | ||||||
|         if (numDays > 168) { |         let floatVal = parseFloat(str); | ||||||
|           console.log(numDays) |         if (isNaN(floatVal)) { | ||||||
|           this.$message({ |           return 0; | ||||||
|             message: '周范围不能超过24周', |  | ||||||
|             type: 'warning' |  | ||||||
|           }); |  | ||||||
|         } else { |  | ||||||
|           this.listQuery.beginTime = Number(moment(this.start.getTime()).format('YYYYWW')) |  | ||||||
|           this.listQuery.endTime = Number(moment(this.end.getTime()).format('YYYYWW')) |  | ||||||
|         } |         } | ||||||
|       } |         floatVal = Math.round(str * 10000) / 100; | ||||||
|       if (!this.start && !this.end) { |         let strVal = floatVal.toString(); | ||||||
|         this.listQuery.beginTime = undefined |         let searchVal = strVal.indexOf('.'); | ||||||
|         this.listQuery.endTime = undefined |         if (searchVal < 0) { | ||||||
|       } |           searchVal = strVal.length; | ||||||
|     }, |           strVal += '.'; | ||||||
|     changeDayTime() { |  | ||||||
|       if (this.listQuery.reportTime) { |  | ||||||
|         const numDays = Number(this.listQuery.reportTime[1]) - Number(this.listQuery.reportTime[0]) |  | ||||||
|         if (numDays > 30) { |  | ||||||
|           this.$message({ |  | ||||||
|             message: '时间范围不能超过30天', |  | ||||||
|             type: 'warning' |  | ||||||
|           }); |  | ||||||
|           this.listQuery.reportTime = []; |  | ||||||
|         } else { |  | ||||||
|           this.listQuery.beginTime = Number(this.listQuery.reportTime[0]) |  | ||||||
|           this.listQuery.endTime = Number(this.listQuery.reportTime[1]) |  | ||||||
|         } |         } | ||||||
|       } else { |         while (strVal.length <= searchVal + 2) { | ||||||
|         this.listQuery.beginTime = undefined |           strVal += '0'; | ||||||
|         this.listQuery.endTime = undefined |         } | ||||||
|  |         return parseFloat(strVal); | ||||||
|       } |       } | ||||||
|  |  | ||||||
|     }, |     }, | ||||||
|     async getDataList() { |     async getDataList() { | ||||||
|  |       if (this.listQuery.date === 3) { | ||||||
|  |         if (this.listQuery.reportTime?.length > 0) { | ||||||
|  |           this.listQuery.beginTime = this.listQuery.reportTime[0] ? this.listQuery.reportTime[0] : undefined | ||||||
|  |           this.listQuery.endTime = this.listQuery.reportTime[1] ? this.listQuery.reportTime[1] : undefined | ||||||
|  |         } | ||||||
|  |       } | ||||||
|  |       if (this.listQuery.date === 4) { | ||||||
|  |         if (this.listQuery.reportTime?.length > 0) { | ||||||
|  |           this.listQuery.beginTime = this.start ? this.start : undefined | ||||||
|  |           this.listQuery.endTime = this.end ? this.end : undefined | ||||||
|  |         } | ||||||
|  |       } | ||||||
|       if (this.currentMenu === '碲化镉工厂') { |       if (this.currentMenu === '碲化镉工厂') { | ||||||
|         await prodTargetDiPage(this.listQuery).then(res => { |         await prodTargetDiPage(this.listQuery).then(res => { | ||||||
|           if (res.code === 0) { |           if (res.code === 0) { | ||||||
|             this.tableData = res.data.records |             this.tableData = res.data.records | ||||||
|  |             this.tableData.forEach(item => { | ||||||
|  |                 const year = item.targetYear ? item.targetYear + '年' : '' | ||||||
|  |                 const month = item.targetMonth ? item.targetMonth + '月' : '' | ||||||
|  |                 item.tagertTime = year + month | ||||||
|  |             }) | ||||||
|             this.listQuery.total = res.data.total |             this.listQuery.total = res.data.total | ||||||
|           } |           } | ||||||
|         }) |         }) | ||||||
|   | |||||||
| @@ -1,65 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2023-08-01 15:27:31 |  | ||||||
|  * @LastEditors: zwq |  | ||||||
|  * @LastEditTime: 2023-08-01 16:25:54 |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
| 	<div :class="[className, { 'p-0': noPadding }]"> |  | ||||||
| 		<slot /> |  | ||||||
| 	</div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
| 	props: { |  | ||||||
| 		size: { |  | ||||||
| 			// 取值范围:  xl lg md sm |  | ||||||
| 			type: String, |  | ||||||
| 			default: 'de', |  | ||||||
| 			validator: function (val) { |  | ||||||
| 				return ['xl', 'lg', 'de', 'md', 'sm'].indexOf(val) !== -1; |  | ||||||
| 			}, |  | ||||||
| 		}, |  | ||||||
| 		noPadding: { |  | ||||||
| 			type: Boolean, |  | ||||||
| 			default: false, |  | ||||||
| 		}, |  | ||||||
| 	}, |  | ||||||
| 	computed: { |  | ||||||
| 		className: function () { |  | ||||||
| 			return `${this.size}-title`; |  | ||||||
| 		}, |  | ||||||
| 	}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| $pxls: (xl, 28px) (lg, 24px) (de, 20px) (md, 18px) (sm, 16px); |  | ||||||
| $mgr: 8px; |  | ||||||
| @each $size, $height in $pxls { |  | ||||||
| 	.#{$size}-title { |  | ||||||
| 		font-size: 18px; |  | ||||||
| 		line-height: $height; |  | ||||||
| 		color: #000; |  | ||||||
| 		font-weight: 500; |  | ||||||
| 		font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif; |  | ||||||
|  |  | ||||||
| 		&::before { |  | ||||||
| 			content: ''; |  | ||||||
| 			display: inline-block; |  | ||||||
| 			vertical-align: top; |  | ||||||
| 			width: 4px; |  | ||||||
| 			height: $height + 2px; |  | ||||||
| 			border-radius: 1px; |  | ||||||
| 			margin-right: $mgr; |  | ||||||
| 			background-color: #0b58ff; |  | ||||||
| 		} |  | ||||||
| 	} |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .p-0 { |  | ||||||
| 	padding: 0; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,432 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2023-11-06 15:15:30 |  | ||||||
|  * @LastEditTime: 2024-06-17 17:03:17 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <el-drawer class="drawer" :visible.sync="visible" size="85%" @closed="$emit('destroy')"> |  | ||||||
|     <small-title slot="title" :no-padding="true"> |  | ||||||
|       {{ '详情' }} |  | ||||||
|       <el-button type="primary" plain size="small" style="float: right" @click="exportDetail">导出</el-button> |  | ||||||
|     </small-title> |  | ||||||
|     <div ref="detail" class="detailBox"> |  | ||||||
|       <el-row :gutter="20"> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">工单号</p> |  | ||||||
|           <p class="text">{{ dataForm.workOrderNumber }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">订单号</p> |  | ||||||
|           <p class="text">{{ dataForm.orderNumber }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">工单类型</p> |  | ||||||
|           <p class="text">{{ ['', '芯片工单', '组件类型', 'bipv类型'][dataForm.workOrderType] }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">工单来源</p> |  | ||||||
|           <p class="text">{{ ['', '手动', 'ERP'][dataForm.source] }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">工艺流程</p> |  | ||||||
|           <p class="text">{{ dataForm.process }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">BOM</p> |  | ||||||
|           <p class="text">{{ dataForm.bom }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">工单状态</p> |  | ||||||
|           <p class="text">{{ ['', '未开始', '生产中', '已完成'][dataForm.orderStatus] }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">投入状态</p> |  | ||||||
|           <p class="text">{{ getDictDataLabel('work_order_in_status', dataForm.inStatus) }}</p> |  | ||||||
|         </el-col> |  | ||||||
|       </el-row> |  | ||||||
|       <el-row :gutter="20"> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">计划投入量</p> |  | ||||||
|           <p class="text">{{ dataForm.plannedInvestment }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">目标产量</p> |  | ||||||
|           <p class="text">{{ dataForm.targetProduction }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">实际投入</p> |  | ||||||
|           <p class="text">{{ dataForm.actualInvestment }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">实际产出</p> |  | ||||||
|           <p class="text">{{ dataForm.actualProduction }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">创建时间</p> |  | ||||||
|           <p class="text">{{ parseTime(dataForm.createTime) }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">开始时间</p> |  | ||||||
|           <p class="text">{{ dataForm.startDate?.length > 0 ? dataForm.startDate[0] + '-' + dataForm.startDate[1] + '-' + dataForm.startDate[2] : '' }}</p> |  | ||||||
|         </el-col> |  | ||||||
|         <el-col :span="3"> |  | ||||||
|           <p class="title">完成时间</p> |  | ||||||
|           <p class="text">{{ dataForm.endDate?.length > 0 ? dataForm.endDate[0] + '-' + dataForm.endDate[1] + '-' + dataForm.endDate[2] : '' }}</p> |  | ||||||
|         </el-col> |  | ||||||
|       </el-row> |  | ||||||
|       <el-divider></el-divider> |  | ||||||
|       <div class="chartDiv"> |  | ||||||
|         <div ref="bar" :style="{ height: '30vh', width: '40vw' }" /> |  | ||||||
|         <div ref="pie" :style="{ height: '30vh', width: '40vw' }" /> |  | ||||||
|       </div> |  | ||||||
|       <div class="chartDiv"> |  | ||||||
|         <div ref="equipmentLine" :style="{ height: '30vh', width: '40vw' }" /> |  | ||||||
|         <div ref="line" v-show="dataForm.orderStatus === 2" :style="{ height: '30vh', width: '40vw' }" /> |  | ||||||
|       </div> |  | ||||||
|     </div> |  | ||||||
|   </el-drawer> |  | ||||||
|  |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| // import basicAdd from './basic-add'; |  | ||||||
| import * as echarts from 'echarts' |  | ||||||
| import resize from '@/mixins/resize' |  | ||||||
| import { getWorkOrderDetail } from '@/api/produceData/order'; |  | ||||||
| import SmallTitle from './SmallTitle'; |  | ||||||
| import jsPDF from 'jspdf'; |  | ||||||
| import html2canvas from 'html2canvas'; |  | ||||||
| import { getDictDataLabel } from "@/utils/dict"; |  | ||||||
|  |  | ||||||
| export default { |  | ||||||
|   components: { |  | ||||||
|     SmallTitle, |  | ||||||
|   }, |  | ||||||
|   mixins: [resize], |  | ||||||
|   props: { |  | ||||||
|     date: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 0 |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       lineChart: null, |  | ||||||
|       pieChart: null, |  | ||||||
|       barChart: null, |  | ||||||
|       equipmentLineChart: null, |  | ||||||
|       visible: false, |  | ||||||
|       dataForm: {} |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   beforeDestroy() { |  | ||||||
|     if (!this.chart) { |  | ||||||
|       return |  | ||||||
|     } |  | ||||||
|     this.chart.dispose() |  | ||||||
|     this.chart = null |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     // this.getCurrentTime() |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     exportDetail() { |  | ||||||
|       // 导出 |  | ||||||
|       const pdf = new jsPDF('l', 'pt', 'a4'); |  | ||||||
|  |  | ||||||
|       const canvas = document.createElement('canvas') |  | ||||||
|        |  | ||||||
|       const element = this.$refs['detail']; |  | ||||||
|       const width = pdf.internal.pageSize.getWidth() |  | ||||||
|       const height = pdf.internal.pageSize.getHeight() |  | ||||||
|        |  | ||||||
|       canvas.width = width * 2 |  | ||||||
|       canvas.height = height * 2 |  | ||||||
|  |  | ||||||
|       canvas.style.width = width + 'px' |  | ||||||
|       canvas.style.height = height + 'px' |  | ||||||
|        |  | ||||||
|       const options = { |  | ||||||
|         // scale: 2, |  | ||||||
|         dpi: 300, |  | ||||||
|         canvas: canvas, |  | ||||||
|         useCORS: true |  | ||||||
|       }; |  | ||||||
|  |  | ||||||
|       html2canvas(element, options).then((canvas) => { |  | ||||||
|         const imgData = canvas.toDataURL('image/png', 1.0); |  | ||||||
|         pdf.addImage(imgData, 'PNG', 0, 0, width, height); |  | ||||||
|         pdf.save(this.dataForm.workOrderNumber + '详情.pdf'); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     init(id) { |  | ||||||
|       this.visible = true |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.initLineChart() |  | ||||||
|       }) |  | ||||||
|       if (id) { |  | ||||||
|         getWorkOrderDetail(id).then(res => { |  | ||||||
|           if (res.code === 0) { |  | ||||||
|             this.dataForm = res.data.prodWorkOrderDO |  | ||||||
|             this.buildChart(this.dataForm) |  | ||||||
|             // 在制品 |  | ||||||
|             const xAxisList = Object.keys(res.data.inProcessDis) |  | ||||||
|             const yAxisList = Object.values(res.data.inProcessDis) |  | ||||||
|             this.initEqLineChart(xAxisList, yAxisList) |  | ||||||
|             // 趋势图 |  | ||||||
|             const seriesList = [] |  | ||||||
|             const dateList = [] |  | ||||||
|             res.data.his.forEach(element => { |  | ||||||
|               seriesList.push(element.actualProduction) |  | ||||||
|               dateList.push(element.recordTime[0] + '-' + element.recordTime[1] + '-' + element.recordTime[2]) |  | ||||||
|             }) |  | ||||||
|             this.initLineChart(dateList, seriesList) |  | ||||||
|           } |  | ||||||
|           // if (this.dataForm.orderStatus === 1) { |  | ||||||
|           //   this.trend() |  | ||||||
|           // } |  | ||||||
|         }) |  | ||||||
|         // getEqNum(id).then(response => { |  | ||||||
|         //   if (response.code === 0) { |  | ||||||
|         //     const xAxisList = Object.keys(response.data) |  | ||||||
|         //     const yAxisList = Object.values(response.data) |  | ||||||
|         //     this.initEqLineChart(xAxisList, yAxisList) |  | ||||||
|         //   } |  | ||||||
|         // }) |  | ||||||
|          |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     trend() { |  | ||||||
|       // 趋势图 |  | ||||||
|       getDailyTrend({ factory: this.dataForm.id }).then(trendRes => { |  | ||||||
|         if (trendRes?.data.length > 0) { |  | ||||||
|           const seriesList = [] |  | ||||||
|           const dateList = [] |  | ||||||
|           trendRes.data.forEach(element => { |  | ||||||
|             seriesList.push(element.actualProduction) |  | ||||||
|             dateList.push(element.recordTime[0] + '-' + element.recordTime[1] + '-' + element.recordTime[2]) |  | ||||||
|           }) |  | ||||||
|           this.initLineChart(dateList, seriesList) |  | ||||||
|         } |  | ||||||
|       }) |  | ||||||
|     }, |  | ||||||
|     buildChart(data) { |  | ||||||
|       // 生产明细 |  | ||||||
|       const barList = [data.targetProduction, data.plannedInvestment, data.actualInvestment, data.actualProduction, data.wasteNum, data.reworkNum] |  | ||||||
|       this.initChart(barList) |  | ||||||
|       // 良品率 |  | ||||||
|       const pieList = [ |  | ||||||
|         { value: data.actualProduction, name: '实际产出' }, |  | ||||||
|         { value: data.wasteNum, name: '废品数量' }, |  | ||||||
|         { value: data.reworkNum, name: '待再加工数量' } |  | ||||||
|       ] |  | ||||||
|       this.initPieChart(pieList) |  | ||||||
|     }, |  | ||||||
|     initChart(barData) { |  | ||||||
|       this.barChart = echarts.init(this.$refs['bar']) |  | ||||||
|       this.barChart.setOption({ |  | ||||||
|         title: { |  | ||||||
|           text: '生产明细', |  | ||||||
|           left: 'center' |  | ||||||
|           // subtext: 'Fake Data' |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: 'axis' |  | ||||||
|         }, |  | ||||||
|         grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, |  | ||||||
|         calculable: true, |  | ||||||
|         grid: { |  | ||||||
|           top: '20%', |  | ||||||
|           left: "1%", |  | ||||||
|           right: "3%", |  | ||||||
|           bottom: "1%", |  | ||||||
|           containLabel: true |  | ||||||
|         }, |  | ||||||
|         xAxis: { |  | ||||||
|           type: 'category', |  | ||||||
|           data: ['目标产量', '计划投入量', '实际投入', '实际产出', '废品数量', '待再加工数量'], |  | ||||||
|           axisLabel: { |  | ||||||
|             rotate:45 |  | ||||||
|           } |  | ||||||
|         }, |  | ||||||
|         yAxis: { |  | ||||||
|           type: 'value' |  | ||||||
|         }, |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             data: barData, |  | ||||||
|             type: 'bar', |  | ||||||
|             barWidth: '40%' |  | ||||||
|           } |  | ||||||
|         ] |  | ||||||
|       }, true) |  | ||||||
|     }, |  | ||||||
|     initPieChart(pieData) { |  | ||||||
|       this.pieChart = echarts.init(this.$refs['pie']) |  | ||||||
|       this.pieChart.setOption({ |  | ||||||
|         title: { |  | ||||||
|           text: !isNaN((pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100) ? ( '产品良率 ' + (pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100 + '%') : '产品良率 -', |  | ||||||
|           left: 'center' |  | ||||||
|           // subtext: 'Fake Data' |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: 'item' |  | ||||||
|         }, |  | ||||||
|         legend: { |  | ||||||
|           top: '5%', |  | ||||||
|           left: 'right', |  | ||||||
|           orient: 'vertical' |  | ||||||
|         }, |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             // name: 'Access From', |  | ||||||
|             type: 'pie', |  | ||||||
|             radius: ['40%', '70%'], |  | ||||||
|             avoidLabelOverlap: false, |  | ||||||
|             label: { |  | ||||||
|               show: false, |  | ||||||
|               position: 'center' |  | ||||||
|             }, |  | ||||||
|             emphasis: { |  | ||||||
|               label: { |  | ||||||
|                 show: false, |  | ||||||
|                 fontSize: 40, |  | ||||||
|                 fontWeight: 'bold' |  | ||||||
|               } |  | ||||||
|             }, |  | ||||||
|             labelLine: { |  | ||||||
|               show: false |  | ||||||
|             }, |  | ||||||
|             data: pieData |  | ||||||
|           } |  | ||||||
|         ] |  | ||||||
|       }, true) |  | ||||||
|     }, |  | ||||||
|     initEqLineChart(xAxisList, yAxisList) { |  | ||||||
|       this.equipmentLineChart = echarts.init(this.$refs['equipmentLine']) |  | ||||||
|       this.equipmentLineChart.setOption({ |  | ||||||
|         title: { |  | ||||||
|           text: '待制品分布', |  | ||||||
|           left: 'center' |  | ||||||
|           // subtext: 'Fake Data' |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: 'axis' |  | ||||||
|         }, |  | ||||||
|         grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, |  | ||||||
|         calculable: true, |  | ||||||
|         grid: { |  | ||||||
|           top: '20%', |  | ||||||
|           left: "1%", |  | ||||||
|           right: "3%", |  | ||||||
|           bottom: "1%", |  | ||||||
|           containLabel: true |  | ||||||
|         }, |  | ||||||
|         xAxis: { |  | ||||||
|           type: 'category', |  | ||||||
|           data: xAxisList, |  | ||||||
|           axisLabel: { |  | ||||||
|             rotate:45, |  | ||||||
|             // width: '10%' |  | ||||||
|           } |  | ||||||
|         }, |  | ||||||
|         yAxis: { |  | ||||||
|           type: 'value' |  | ||||||
|         }, |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             data: yAxisList, |  | ||||||
|             type: 'bar', |  | ||||||
|             barWidth: '50%' |  | ||||||
|           } |  | ||||||
|         ] |  | ||||||
|       }, true) |  | ||||||
|     }, |  | ||||||
|     initLineChart(xAxisList, seriesList) { |  | ||||||
|       this.lineChart = echarts.init(this.$refs['line']) |  | ||||||
|       this.lineChart.setOption({ |  | ||||||
|         title: { |  | ||||||
|           text: '历史趋势', |  | ||||||
|           left: 'center' // 设置标题居中 |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: 'item' |  | ||||||
|         }, |  | ||||||
|         xAxis: { |  | ||||||
|           type: 'category', |  | ||||||
|           data: xAxisList, |  | ||||||
|           axisLabel: { |  | ||||||
|             rotate:45 |  | ||||||
|           } |  | ||||||
|         }, |  | ||||||
|         yAxis: { |  | ||||||
|           type: 'value' |  | ||||||
|         }, |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             data: seriesList, |  | ||||||
|             type: 'line' |  | ||||||
|           } |  | ||||||
|         ] |  | ||||||
|       }, true) |  | ||||||
|     } |  | ||||||
|     // getCurrentTime() { |  | ||||||
|     //   // new Date().Format("yyyy-MM-dd HH:mm:ss") |  | ||||||
|     //   this.dataForm.logTime = new Date() |  | ||||||
|     //   // this.dataForm.logTime = year + "-" + month + "-" + day; |  | ||||||
|     //   console.log(this.dataForm.logTime); |  | ||||||
|     // }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| <style scoped> |  | ||||||
| .chartDiv { |  | ||||||
|   display: flex; |  | ||||||
|   justify-content: space-between; |  | ||||||
|   width: 100%; |  | ||||||
|   padding: 5px; |  | ||||||
|   padding-left: 30px; |  | ||||||
| } |  | ||||||
|   .drawer >>> .el-drawer { |  | ||||||
|   border-radius: 8px 0 0 8px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .drawer >>> .el-form-item__label { |  | ||||||
|   padding: 0; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .drawer >>> .el-drawer__header { |  | ||||||
|   margin: 0; |  | ||||||
|   padding: 32px 32px 24px; |  | ||||||
|   border-bottom: 1px solid #dcdfe6; |  | ||||||
|   /* margin-bottom: 30px; */ |  | ||||||
| } |  | ||||||
| .detailBox p { |  | ||||||
|   margin: 0; |  | ||||||
|   padding: 0 32px; |  | ||||||
| } |  | ||||||
| .detailBox .title { |  | ||||||
|   /* width: 56px; */ |  | ||||||
|   /* height: 14px; */ |  | ||||||
|   font-family: Source Han Sans CN, Source Han Sans CN; |  | ||||||
|   font-weight: 400; |  | ||||||
|   font-size: 14px; |  | ||||||
|   color: rgba(0, 0, 0, 0.85); |  | ||||||
|   line-height: 16px; |  | ||||||
|   text-align: left; |  | ||||||
|   font-style: normal; |  | ||||||
|   text-transform: none; |  | ||||||
| } |  | ||||||
| .detailBox .text { |  | ||||||
|   font-size: 14px; |  | ||||||
|   font-weight: 400; |  | ||||||
|   color: rgba(102,102,102,0.75); |  | ||||||
|   padding-bottom: 20px; |  | ||||||
| } |  | ||||||
| .detailBox { |  | ||||||
|   padding-top: 30px; |  | ||||||
|   width: 99%; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,402 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-04-15 10:49:13 |  | ||||||
|  * @LastEditTime: 2024-06-17 16:32:02 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 35px)"> |  | ||||||
|     <el-row :gutter="10"> |  | ||||||
|       <el-col :span="4"> |  | ||||||
|         <div class="app-container" style="padding: 16px; height: auto; text-align: left; border-radius: 8px;"> |  | ||||||
|         <!-- <p style="margin-bottom: 0">数据概览</p> --> |  | ||||||
|           <div class="view"> |  | ||||||
|             <div style="padding: 10px 0; width: 100%"> |  | ||||||
|               <div class="topDiv"> |  | ||||||
|                 <div style="width: 4px; height: 52px; background: #71CC8C; border-radius: 2px;"></div> |  | ||||||
|                 <div class="centerDiv"> |  | ||||||
|                   <span style="font-size: 30px; line-height: 30px; color: rgba(0,0,0,0.85);">{{ inputNum }}</span> |  | ||||||
|                   <span style="font-size: 14px; color: rgba(0,0,0,0.85);">在制工单数量</span> |  | ||||||
|                 </div> |  | ||||||
|                 <svg-icon icon-class="workProcess" style="width: 26px; height: 26px" /> |  | ||||||
|               </div> |  | ||||||
|             </div> |  | ||||||
|           </div> |  | ||||||
|         </div> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="20"> |  | ||||||
|         <div class="app-container" style="padding: 16px; height: auto; text-align: left; border-radius: 8px;"> |  | ||||||
|         <!-- <p style="margin-bottom: 0">数据概览</p> --> |  | ||||||
|           <div class="view"> |  | ||||||
|             <div style="padding: 10px 0; width: 100%" v-for="(item, index) in factorys" :key="index"> |  | ||||||
|               <div class="topDiv"> |  | ||||||
|                 <div style="width: 4px; height: 52px; background: #3A79FF; border-radius: 2px;"></div> |  | ||||||
|                 <div class="centerDiv"> |  | ||||||
|                   <span style="font-size: 30px; line-height: 30px; color: rgba(0,0,0,0.85);">{{ factoryNum[index] }}</span> |  | ||||||
|                   <span style="font-size: 14px; color: rgba(0,0,0,0.85);">{{item}}</span> |  | ||||||
|                 </div> |  | ||||||
|                 <svg-icon icon-class="factoryWorkOrder" style="width: 26px; height: 26px" /> |  | ||||||
|               </div> |  | ||||||
|             </div> |  | ||||||
|           </div> |  | ||||||
|         </div> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <!-- <div class="app-container" style="margin-top: 8px; height: auto;"> |  | ||||||
|       <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> |  | ||||||
|     </div> --> |  | ||||||
|     <div class="app-container" style="margin-top: 8px;flex-grow: 1;"> |  | ||||||
|       <!-- <search-bar :formConfigs="formConfig2" ref="searchBarForm" style="margin-bottom: 0" /> --> |  | ||||||
|       <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> |  | ||||||
|       <base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" |  | ||||||
|         :table-data="tableData" :max-height="tableH"> |  | ||||||
|         <method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right" |  | ||||||
|           :method-list="tableBtn" @clickBtn="handleClick" /> |  | ||||||
|       </base-table> |  | ||||||
|       <pagination |  | ||||||
|         :limit.sync="listQuery.pageSize" |  | ||||||
|         :page.sync="listQuery.pageNo" |  | ||||||
|         :total="listQuery.total" |  | ||||||
|         @pagination="getDataList" |  | ||||||
|       /> |  | ||||||
|     </div> |  | ||||||
|     <add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date" @refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| // import { parseTime } from '../../core/mixins/code-filter'; |  | ||||||
| import { getWorkOrderPage, exportExcel, getOverView } from '@/api/produceData/order'; |  | ||||||
| // import inputTable from './inputTable.vue'; |  | ||||||
| import lineChart from './lineChart'; |  | ||||||
| import moment from 'moment' |  | ||||||
| import tableHeightMixin from "@/mixins/tableHeightMixin"; |  | ||||||
| // import ButtonNav from '@/components/ButtonNav' |  | ||||||
| import basicPage from '@/mixins/basic-page' |  | ||||||
| import AddOrUpdate from './add-or-updata'; |  | ||||||
| import { factoryList, factoryArray } from "@/utils/constants"; |  | ||||||
| import { publicFormatter } from "@/utils/dict"; |  | ||||||
|  |  | ||||||
| // import FileSaver from 'file-saver' |  | ||||||
| // import * as XLSX from 'xlsx' |  | ||||||
| export default { |  | ||||||
|   components: { lineChart, AddOrUpdate }, |  | ||||||
|   mixins: [basicPage, tableHeightMixin], |  | ||||||
| 	data() { |  | ||||||
|     return { |  | ||||||
|       factorys: ['瑞昌中建材', '邯郸中建材', '株洲中建材', '佳木斯中建材', '成都中建材', '凯盛光伏', '蚌埠兴科'], |  | ||||||
|       factoryNum: [0, 0, 0, 0, 0, 0, 0], |  | ||||||
|       inputNum: 0, |  | ||||||
|       heightNum: 180, |  | ||||||
|       factoryList, |  | ||||||
|       factoryArray, |  | ||||||
|       listQuery: { |  | ||||||
|         pageSize: 20, |  | ||||||
|         pageNo: 1, |  | ||||||
|         factorys: undefined, |  | ||||||
|         total: 0, |  | ||||||
|         time: undefined, |  | ||||||
|         orderStatus:undefined |  | ||||||
|       }, |  | ||||||
|       detailOrUpdateVisible:false, |  | ||||||
|       tableBtn: [ |  | ||||||
|           { |  | ||||||
|             type: 'detail', |  | ||||||
|             btnName: '详情', |  | ||||||
|         }, |  | ||||||
|         // { |  | ||||||
|         //     type: 'delete', |  | ||||||
|         //     btnName: '删除', |  | ||||||
|         //   }, |  | ||||||
|       ].filter((v) => v), |  | ||||||
|       typeList: [ |  | ||||||
|         { |  | ||||||
|           name: '芯片', |  | ||||||
|           id: 0, |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           name: '标准组件', |  | ||||||
|           id: 1, |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           name: 'BIPV产品', |  | ||||||
|           id: 2, |  | ||||||
|         }, |  | ||||||
|       ], |  | ||||||
|       formConfig: [ |  | ||||||
|         { |  | ||||||
|           type: "select", |  | ||||||
|           label: "工厂名称", |  | ||||||
|           selectOptions: factoryArray, |  | ||||||
|           labelField: 'name', |  | ||||||
|           valueField: 'id', |  | ||||||
|           param: "factory", |  | ||||||
|           multiple: true, |  | ||||||
| 					filterable: true |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: "select", |  | ||||||
|           label: "工单状态", |  | ||||||
|           selectOptions: [ |  | ||||||
|             { |  | ||||||
|               label: '未开始', |  | ||||||
|               value: 1 |  | ||||||
|             }, |  | ||||||
|             { |  | ||||||
|               label: '生产中', |  | ||||||
|               value: 2 |  | ||||||
|             }, |  | ||||||
|             { |  | ||||||
|               label: '已完成', |  | ||||||
|               value: 3 |  | ||||||
|             } |  | ||||||
|           ], |  | ||||||
|           labelField: "label", |  | ||||||
|           valueField: "value", |  | ||||||
|           param: "orderStatus", |  | ||||||
|           multiple: true, |  | ||||||
| 					filterable: true |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: "datePicker", |  | ||||||
|           label: "时间段", |  | ||||||
|           dateType: "daterange", |  | ||||||
|           format: "yyyy-MM-dd", |  | ||||||
|           valueFormat: "yyyy-MM-dd", |  | ||||||
|           rangeSeparator: "-", |  | ||||||
|           startPlaceholder: "开始日期", |  | ||||||
|           endPlaceholder: "结束日期", |  | ||||||
|           param: "timeSlot", |  | ||||||
|           defaultSelect: [], |  | ||||||
|           defaultTime: ["00:00:00", "23:59:59"], |  | ||||||
|           width: 250, |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: "button", |  | ||||||
|           btnName: "查询", |  | ||||||
|           name: "search", |  | ||||||
|           color: "primary", |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: "separate", |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: "button", |  | ||||||
|           btnName: "导出", |  | ||||||
|           name: "export", |  | ||||||
|           color: "primary", |  | ||||||
|           plain: true |  | ||||||
|         }, |  | ||||||
|       ], |  | ||||||
|       formConfig2: [ |  | ||||||
|         { |  | ||||||
|           type: 'title', |  | ||||||
|           label: '工厂信息', |  | ||||||
|         }, |  | ||||||
|       ], |  | ||||||
|       formConfig1: [ |  | ||||||
|         { |  | ||||||
|           type: 'title', |  | ||||||
|           label: '良品数量', |  | ||||||
|         }, |  | ||||||
|       ], |  | ||||||
|       tableProps: [ |  | ||||||
|         { |  | ||||||
|           prop: 'factory', |  | ||||||
|           label: '工厂名称', |  | ||||||
|           filter: (val) => factoryList[val], |  | ||||||
|           minWidth: 200, |  | ||||||
|           showOverflowtooltip: true |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'workOrderNumber', |  | ||||||
|           label: '工单号', |  | ||||||
|           minWidth: 120, |  | ||||||
|           showOverflowtooltip: true |  | ||||||
|           // filter: (val) => ['玻璃芯片', '标准组件', 'BIPV', '定制组件'][val] |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'workOrderType', |  | ||||||
|           label: '工单类型', |  | ||||||
|           // filter: publicFormatter('workorder_status') |  | ||||||
|           filter: (val) => ['', '芯片工单', '组件类型', 'bipv类型'][val], |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'plannedInvestment', |  | ||||||
|           label: '计划投入', |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'actualInvestment', |  | ||||||
|           label: '实际投入', |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'targetProduction', |  | ||||||
|           label: '目标产量', |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'actualProduction', |  | ||||||
|           label: '实际产量', |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'productionProgress', |  | ||||||
|           label: '生产进度', |  | ||||||
|           filter: (val) => (val * 100) + '%' |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'orderStatus', |  | ||||||
|           label: '工单状态', |  | ||||||
|           // filter: publicFormatter('workorder_status') |  | ||||||
|           filter: (val) => ['', '未开始', '生产中', '已完成'][val], |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'startTime', |  | ||||||
|           label: '开始时间', |  | ||||||
|           minWidth: 100, |  | ||||||
|           showOverflowtooltip: true |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: 'endTime', |  | ||||||
|           label: '完成时间', |  | ||||||
|           minWidth: 100, |  | ||||||
|           showOverflowtooltip: true |  | ||||||
|         } |  | ||||||
|       ], |  | ||||||
|       tableData: [], |  | ||||||
|       xAxis: [], |  | ||||||
|       lineData: {} |  | ||||||
|       // data: {} |  | ||||||
| 			// proLineList: [], |  | ||||||
| 			// all: {} |  | ||||||
| 		}; |  | ||||||
|   }, |  | ||||||
| 	created() { |  | ||||||
|     const today = new Date() |  | ||||||
|     const sevenDaysAgo = new Date(today.getTime() - (6 * 24 * 60 * 60 * 1000)) |  | ||||||
|     this.listQuery.time = [moment(sevenDaysAgo).format('yyyy-MM-DD'), moment(today).format('yyyy-MM-DD')] |  | ||||||
|     this.formConfig[2].defaultSelect = this.listQuery.time |  | ||||||
| 	}, |  | ||||||
|   mounted() { |  | ||||||
|     this.getOverView() |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     getOverView() { |  | ||||||
|       getOverView().then(res => { |  | ||||||
|         // this.data = res.data |  | ||||||
|         if (res.code === 0) { |  | ||||||
|           for(const i in res.data) { |  | ||||||
|             if (i === '在制工单数量') { |  | ||||||
|               this.inputNum = res.data[i] |  | ||||||
|             } else { |  | ||||||
|               const index = this.factorys.indexOf(i) |  | ||||||
|               if (index > -1) { |  | ||||||
|                 this.factoryNum[index] = res.data[i] |  | ||||||
|               } |  | ||||||
|             } |  | ||||||
|           } |  | ||||||
|         } |  | ||||||
|       }) |  | ||||||
|     }, |  | ||||||
|     otherMethods(val) { |  | ||||||
|       this.detailOrUpdateVisible = true; |  | ||||||
|       // this.addOrEditTitle = "详情"; |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs.detailOrUpdate.init(val.data.id); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     async getDataList() { |  | ||||||
|       const res = await getWorkOrderPage(this.listQuery) |  | ||||||
|       this.tableData = res.data.list |  | ||||||
|       this.listQuery.total = res.data.total |  | ||||||
|       if (this.listQuery.total > 0) { |  | ||||||
|         this.tableData.forEach(item => { |  | ||||||
|           item.startTime = item.startDate ? item.startDate[0] + '-' + item.startDate[1] + '-' + item.startDate[2] : '--' |  | ||||||
|           item.endTime = item.endDate ? item.endDate[0] + '-' + item.endDate[1] + '-' + item.endDate[2] : '--' |  | ||||||
|         }) |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
| 		buttonClick(val) { |  | ||||||
| 			this.listQuery.factorys = val.factory?.length > 0 ? val.factory : undefined |  | ||||||
|       this.listQuery.orderStatus = val.orderStatus?.length > 0 ? val.orderStatus : undefined |  | ||||||
|       this.listQuery.time = val.timeSlot?.length > 0 ? val.timeSlot : undefined |  | ||||||
| 			switch (val.btnName) { |  | ||||||
| 				case 'search': |  | ||||||
| 					this.listQuery.pageNo = 1; |  | ||||||
| 					this.listQuery.pageSize = 20; |  | ||||||
|           if (this.listQuery.time) { |  | ||||||
|             this.getDataList(); |  | ||||||
|           } else { |  | ||||||
|             this.$message.warning('请选择时间范围!') |  | ||||||
|           } |  | ||||||
| 					break; |  | ||||||
| 				case 'export': |  | ||||||
|           if (this.listQuery.time) { |  | ||||||
|             this.handleExport(); |  | ||||||
|           } else { |  | ||||||
|             this.$message.warning('请选择时间范围!') |  | ||||||
|           } |  | ||||||
| 					break; |  | ||||||
| 				default: |  | ||||||
| 					console.log(val); |  | ||||||
| 			} |  | ||||||
| 		}, |  | ||||||
| 		/** 导出按钮操作 */ |  | ||||||
|     handleExport() { |  | ||||||
|       this.$modal.confirm('是否确认导出工单数据?').then(() => { |  | ||||||
|         // 处理查询参数 |  | ||||||
|         // let params = {...this.listQuery}; |  | ||||||
|         // params.current = 1; |  | ||||||
|         // params.size = 999; |  | ||||||
|         this.exportLoading = true; |  | ||||||
|         return exportExcel({ |  | ||||||
|           factorys: this.listQuery.factorys, |  | ||||||
|           orderStatus: this.listQuery.orderStatus, |  | ||||||
|           time: this.listQuery.time |  | ||||||
|         }); |  | ||||||
|       }).then(response => { |  | ||||||
|         this.$download.excel(response, '工单数据.xls'); |  | ||||||
|         this.exportLoading = false; |  | ||||||
|       }).catch(() => {}) |  | ||||||
|     }, |  | ||||||
| 	}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped> |  | ||||||
| .centerDiv { |  | ||||||
|   display: flex; |  | ||||||
|   flex-direction: column; |  | ||||||
|   justify-content: flex-start; |  | ||||||
| } |  | ||||||
| .topDiv { |  | ||||||
|   display: flex; |  | ||||||
|   flex-direction: row; |  | ||||||
|   justify-content: space-around; |  | ||||||
|   align-items: flex-start; |  | ||||||
|   flex: 1; |  | ||||||
| } |  | ||||||
| .view { |  | ||||||
|   display: flex; |  | ||||||
|   justify-content: space-around; |  | ||||||
|   align-items: center; |  | ||||||
|   flex: 1; |  | ||||||
| } |  | ||||||
| .blueTip::before{ |  | ||||||
|   display: inline-block; |  | ||||||
|   content: ''; |  | ||||||
|   width: 4px; |  | ||||||
|   height: 18px; |  | ||||||
|   background: #0B58FF; |  | ||||||
|   border-radius: 1px; |  | ||||||
|   margin-right: 8PX; |  | ||||||
|   margin-top: 8px; |  | ||||||
| } |  | ||||||
| .app-container { |  | ||||||
|   margin: 0 0px 0; |  | ||||||
|   background-color: #fff; |  | ||||||
|   border-radius: 4px; |  | ||||||
|   padding: 16px 16px 0; |  | ||||||
|   height: calc(100vh - 40px); |  | ||||||
|   overflow: auto; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,169 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2022-01-21 14:43:06 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @LastEditTime: 2024-05-30 09:51:16 |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <!-- <div> --> |  | ||||||
|   <!-- <div :id="id" :class="className" :style="{ height: '65%', width:width}" /> --> |  | ||||||
|   <div :id="id" :class="className" :style="{ height: height, width: width }" /> |  | ||||||
|   <!-- </div> --> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import * as echarts from 'echarts' |  | ||||||
| import 'echarts/theme/macarons' // echarts theme |  | ||||||
| import resize from '@/mixins/resize' |  | ||||||
| export default { |  | ||||||
|   name: 'LineChart', |  | ||||||
|   mixins: [resize], |  | ||||||
|   props: { |  | ||||||
|     id: { |  | ||||||
|       type: String, |  | ||||||
|       default: 'reportChart' |  | ||||||
|     }, |  | ||||||
|     className: { |  | ||||||
|       type: String, |  | ||||||
|       default: 'reportChart' |  | ||||||
|     }, |  | ||||||
|     width: { |  | ||||||
|       type: String, |  | ||||||
|       default: '100%' |  | ||||||
|     }, |  | ||||||
|     beilv: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 1 |  | ||||||
|     }, |  | ||||||
|     height: { |  | ||||||
|       type: String, |  | ||||||
|       default: '30vh' |  | ||||||
|     }, |  | ||||||
|     legendPosition: { |  | ||||||
|       type: String, |  | ||||||
|       default: 'center' |  | ||||||
|     }, |  | ||||||
|     showLegend: { |  | ||||||
|       type: Boolean, |  | ||||||
|       default: false |  | ||||||
|     }, |  | ||||||
|     legendData: { |  | ||||||
|       type: Array, |  | ||||||
|       default: () => [] |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       chart: null |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   // mounted() { |  | ||||||
|   //   this.$nextTick(() => { |  | ||||||
|   //     this.initChart() |  | ||||||
|   //   }) |  | ||||||
|   // }, |  | ||||||
|   beforeDestroy() { |  | ||||||
|     if (!this.chart) { |  | ||||||
|       return |  | ||||||
|     } |  | ||||||
|     this.chart.dispose() |  | ||||||
|     this.chart = null |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     initChart(xAxis, seriesList) { |  | ||||||
|       this.chart = echarts.init(document.getElementById(this.id)) |  | ||||||
|       console.log(this.$parent); |  | ||||||
|       this.chart.setOption({ |  | ||||||
|         title: { |  | ||||||
|           text: '', |  | ||||||
|           // subtext: 'Fake Data' |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: 'axis' |  | ||||||
|         }, |  | ||||||
|         grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, |  | ||||||
|         legend: { |  | ||||||
|           // data: ['工厂1', '工厂2'], |  | ||||||
|           right: '90px', |  | ||||||
|           top: '0%', |  | ||||||
|           icon: 'rect', |  | ||||||
|           itemWidth: 10, |  | ||||||
|           itemHeight: 10, |  | ||||||
|           itemGap: 40, |  | ||||||
|         }, |  | ||||||
|         // toolbox: { |  | ||||||
|         //   show: true, |  | ||||||
|         //   feature: { |  | ||||||
|         //     dataView: { show: true, readOnly: false }, |  | ||||||
|         //     magicType: { show: true, type: ['line', 'bar'] }, |  | ||||||
|         //     restore: { show: true }, |  | ||||||
|         //     saveAsImage: { show: true } |  | ||||||
|         //   } |  | ||||||
|         // }, |  | ||||||
|         calculable: true, |  | ||||||
|         xAxis: [ |  | ||||||
|           { |  | ||||||
|             type: 'category', |  | ||||||
|             // prettier-ignore |  | ||||||
|             data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] |  | ||||||
|           } |  | ||||||
|         ], |  | ||||||
|         yAxis: [ |  | ||||||
|           { |  | ||||||
|             type: 'value' |  | ||||||
|           } |  | ||||||
|         ], |  | ||||||
|         grid: { |  | ||||||
|           top: '20%', |  | ||||||
|           left: "1%", |  | ||||||
|           right: "3%", |  | ||||||
|           bottom: "1%", |  | ||||||
|           containLabel: true |  | ||||||
|         }, |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: 'Email', |  | ||||||
|             type: 'line', |  | ||||||
|             stack: 'Total', |  | ||||||
|             data: [120, 132, 101, 134, 90, 230, 210] |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: 'Union Ads', |  | ||||||
|             type: 'line', |  | ||||||
|             stack: 'Total', |  | ||||||
|             data: [220, 182, 191, 234, 290, 330, 310] |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: 'Video Ads', |  | ||||||
|             type: 'line', |  | ||||||
|             stack: 'Total', |  | ||||||
|             data: [150, 232, 201, 154, 190, 330, 410] |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: 'Direct', |  | ||||||
|             type: 'line', |  | ||||||
|             stack: 'Total', |  | ||||||
|             data: [320, 332, 301, 334, 390, 330, 320] |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: 'Search Engine', |  | ||||||
|             type: 'line', |  | ||||||
|             stack: 'Total', |  | ||||||
|             data: [820, 932, 901, 934, 1290, 1330, 1320] |  | ||||||
|           } |  | ||||||
|         ] |  | ||||||
|       }, true) |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped> |  | ||||||
| /* .reportChart { |  | ||||||
|   position: absolute; |  | ||||||
|   height: 100%; |  | ||||||
|   width: 100%; |  | ||||||
|   top: 10px; |  | ||||||
| } */ |  | ||||||
| </style> |  | ||||||
| @@ -1,345 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <div class="containerTop"> |  | ||||||
|       <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> |  | ||||||
|     </div> |  | ||||||
|     <div class="containerBottom"> |  | ||||||
|       <div class="smallTitle">芯片OEE</div> |  | ||||||
|       <bm-line-bar |  | ||||||
|         :chartHeight="chartHeight" |  | ||||||
|         :legendList="legendList" |  | ||||||
|         :chartMsg="chartMsg" |  | ||||||
|         :chartId="chartId" |  | ||||||
|         :chartNum="chartNum" |  | ||||||
|       /> |  | ||||||
|       <base-table |  | ||||||
|         :table-props="tableProps" |  | ||||||
|         :page="listQuery.current" |  | ||||||
|         :limit="listQuery.size" |  | ||||||
|         :table-data="tableData" |  | ||||||
|         :max-height="tableH" |  | ||||||
|       /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import bmSearchBar from "../components/bmSearchBar.vue"; |  | ||||||
| import BmLineBar from "../components/bmLineBar.vue"; |  | ||||||
| import { |  | ||||||
|   chipoeeComparePage, |  | ||||||
|   chipoeeCompareExport, |  | ||||||
| } from "@/api/report/benchmarking.js"; |  | ||||||
| import moment from "moment"; |  | ||||||
| export default { |  | ||||||
|   name: "ChipOEEBM", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       factoryList: [ |  | ||||||
|         { id: 0, name: "瑞昌" }, |  | ||||||
|         { id: 1, name: "邯郸" }, |  | ||||||
|       ], |  | ||||||
|       tableProps: [], |  | ||||||
|       tableProps1: [ |  | ||||||
|         { |  | ||||||
|           prop: "factory", |  | ||||||
|           label: "工厂名称", |  | ||||||
|           filter: (val) => this.factoryList[val].name, |  | ||||||
|           minWidth: 150, |  | ||||||
|           showOverflowtooltip: true, |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: "item", |  | ||||||
|           label: "科目", |  | ||||||
|           minWidth: 120, |  | ||||||
|           showOverflowtooltip: true, |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           prop: "unit", |  | ||||||
|           label: "单位", |  | ||||||
|           minWidth: 80, |  | ||||||
|           showOverflowtooltip: true, |  | ||||||
|         }, |  | ||||||
|       ], |  | ||||||
|       listQuery: { |  | ||||||
|         current: 1, |  | ||||||
|         size: 100, |  | ||||||
|       }, |  | ||||||
|       tableData: [], |  | ||||||
|       chartHeight: this.tableHeight(269) / 2, |  | ||||||
|       tableH: this.tableHeight(269) / 2, |  | ||||||
|       legendList: [ |  | ||||||
|         { id: 1, name: "", type: 2, color: "#FFCE6A" }, |  | ||||||
|         { id: 2, name: "", type: 1, color: "#8EF0AB" }, |  | ||||||
|         { id: 3, name: "", type: 1, color: "#288AFF" }, |  | ||||||
|       ], |  | ||||||
|       chartMsg: { |  | ||||||
|         color: ["#FFCE6A", "#8EF0AB", "#288AFF"], |  | ||||||
|         xData: [], |  | ||||||
|         yName: "单位/%", |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: "", |  | ||||||
|             data: [], |  | ||||||
|             type: "line", |  | ||||||
|             symbol: "circle", |  | ||||||
|             symbolSize: 6, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               color: "#FFAE17", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "", |  | ||||||
|             data: [], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [-18, -16], |  | ||||||
|               color: "#68C483", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "", |  | ||||||
|             data: [], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [0, -16], |  | ||||||
|               color: "#288AFF", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|         ], |  | ||||||
|       }, |  | ||||||
|       chartId: "chipOEEBMChart", |  | ||||||
|       chartNum: 1, |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   components: { |  | ||||||
|     bmSearchBar, |  | ||||||
|     BmLineBar, |  | ||||||
|   }, |  | ||||||
|   computed: { |  | ||||||
|     isOpen() { |  | ||||||
|       return this.$store.getters.sidebar.opened; |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   watch: { |  | ||||||
|     // 监听左侧菜单栏是否展开 |  | ||||||
|     isOpen(val) { |  | ||||||
|       if (this.$route.name === "ChipOEEBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|     this.tableH = this.tableHeight(269) / 2; |  | ||||||
|     this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|     window.addEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     this.tableProp = this.tableProp1; |  | ||||||
|     this.listQuery.type = 2; |  | ||||||
|     this.listQuery.startDate = moment().format("yyyy-MM-DD"); |  | ||||||
|     this.listQuery.factory = []; |  | ||||||
|     this.getList(); |  | ||||||
|   }, |  | ||||||
|   destroyed() { |  | ||||||
|     window.removeEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   activated() { |  | ||||||
|     // 图重新加载,为了防止窗口变化后尺寸图显示不佳,数据不更新 |  | ||||||
|     if (this.$route.name === "ChipOEEBM") { |  | ||||||
|       this.chartNum++; |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     _setTableHeight() { |  | ||||||
|       this.tableH = this.tableHeight(269) / 2; |  | ||||||
|       this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|       if (this.$route.name === "ChipOEEBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     getSearch(val) { |  | ||||||
|       this.listQuery.type = val.type; |  | ||||||
|       this.listQuery.startDate = val.startDate; |  | ||||||
|       this.listQuery.factory = val.factory; |  | ||||||
|       this.getList(); |  | ||||||
|     }, |  | ||||||
|     getList() { |  | ||||||
|       this.tableProps = []; |  | ||||||
|       chipoeeComparePage({ ...this.listQuery }).then((res) => { |  | ||||||
|         if (res.data && res.data.records.length > 0) { |  | ||||||
|           let msg = res.data.records[0]; |  | ||||||
|           let arr = [ |  | ||||||
|             { |  | ||||||
|               prop: "yoy", |  | ||||||
|               label: msg.yoyColumn, |  | ||||||
|               minWidth: 150, |  | ||||||
|             }, |  | ||||||
|             { |  | ||||||
|               prop: "queryValue", |  | ||||||
|               label: msg.queryColumn, |  | ||||||
|               minWidth: 150, |  | ||||||
|             }, |  | ||||||
|             { |  | ||||||
|               prop: "target", |  | ||||||
|               label: msg.targetColumn, |  | ||||||
|               minWidth: 150, |  | ||||||
|             }, |  | ||||||
|           ]; |  | ||||||
|           this.tableProps = this.tableProps1.concat(arr); |  | ||||||
|           this.tableData = res.data.records; |  | ||||||
|           // 设置图例 |  | ||||||
|           this.legendList[0].name = msg.targetColumn; |  | ||||||
|           this.legendList[1].name = msg.yoyColumn; |  | ||||||
|           this.legendList[2].name = msg.queryColumn; |  | ||||||
|           this.chartMsg.series[0].name = msg.targetColumn; |  | ||||||
|           this.chartMsg.series[1].name = msg.yoyColumn; |  | ||||||
|           this.chartMsg.series[2].name = msg.queryColumn; |  | ||||||
|           // 设置chartMsg的series的数据 |  | ||||||
|           this.setChartMsg(res.data.records); |  | ||||||
|         } else { |  | ||||||
|           // 重置 |  | ||||||
|           this.resetMsg(); |  | ||||||
|         } |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     setChartMsg(val) { |  | ||||||
|       let xData = []; |  | ||||||
|       let lineData = []; |  | ||||||
|       let barData1 = []; |  | ||||||
|       let barData2 = []; |  | ||||||
|       for (let i = 0; i < val.length; i++) { |  | ||||||
|         this.factoryList.map((item) => { |  | ||||||
|           if (item.id === val[i].factory) { |  | ||||||
|             xData.push(item.name); |  | ||||||
|           } |  | ||||||
|         }); |  | ||||||
|         lineData.push({ |  | ||||||
|           name: "%", |  | ||||||
|           value: val[i].target || 0, |  | ||||||
|         }); |  | ||||||
|         barData1.push({ name: "%", value: val[i].yoy || 0 }); |  | ||||||
|         barData2.push({ |  | ||||||
|           name: "%", |  | ||||||
|           value: val[i].queryValue || 0, |  | ||||||
|         }); |  | ||||||
|       } |  | ||||||
|       this.chartMsg.xData = xData; |  | ||||||
|       this.chartMsg.series[0].data = lineData; |  | ||||||
|       this.chartMsg.series[1].data = barData1; |  | ||||||
|       this.chartMsg.series[2].data = barData2; |  | ||||||
|       this.chartMsg.xData = xData; |  | ||||||
|     }, |  | ||||||
|     resetMsg() { |  | ||||||
|       this.tableProps = this.tableProps1; |  | ||||||
|       this.tableData = []; |  | ||||||
|       this.chartMsg = { |  | ||||||
|         color: ["#FFCE6A", "#8EF0AB", "#288AFF"], |  | ||||||
|         xData: [], |  | ||||||
|         yName: "单位/%", |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: "1", |  | ||||||
|             data: [], |  | ||||||
|             type: "line", |  | ||||||
|             symbol: "circle", |  | ||||||
|             symbolSize: 6, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               color: "#FFAE17", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2", |  | ||||||
|             data: [], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [-18, -16], |  | ||||||
|               color: "#68C483", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "3", |  | ||||||
|             data: [], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [0, -16], |  | ||||||
|               color: "#288AFF", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|         ], |  | ||||||
|       }; |  | ||||||
|     }, |  | ||||||
|     handleExport(val) { |  | ||||||
|       this.listQuery.type = val.type; |  | ||||||
|       this.listQuery.startDate = val.startDate; |  | ||||||
|       this.listQuery.factory = val.factory; |  | ||||||
|       let fileName = "芯片OEE对标.xls"; |  | ||||||
|       chipoeeCompareExport({ ...this.listQuery }) |  | ||||||
|         .then((response) => { |  | ||||||
|           this.$download.excel(response, fileName); |  | ||||||
|           this.$message.success("导出成功"); |  | ||||||
|         }) |  | ||||||
|         .catch(() => {}); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .containerTop { |  | ||||||
|   height: 64px; |  | ||||||
| } |  | ||||||
| .containerTop, |  | ||||||
| .containerBottom { |  | ||||||
|   position: relative; |  | ||||||
|   background-color: #fff; |  | ||||||
|   border-radius: 8px; |  | ||||||
|   padding: 16px; |  | ||||||
| } |  | ||||||
| .containerBottom { |  | ||||||
|   height: calc(100vh - 201px); |  | ||||||
|   margin-top: 8px; |  | ||||||
|   .smallTitle { |  | ||||||
|     font-size: 16px; |  | ||||||
|     color: #000; |  | ||||||
|     margin-bottom: 15px; |  | ||||||
|   } |  | ||||||
|   .smallTitle::before { |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 4px; |  | ||||||
|     height: 16px; |  | ||||||
|     background: #0b58ff; |  | ||||||
|     content: ""; |  | ||||||
|     margin-right: 8px; |  | ||||||
|     vertical-align: -3px; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,248 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <div class="containerTop"> |  | ||||||
|       <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> |  | ||||||
|     </div> |  | ||||||
|     <div class="containerBottom"> |  | ||||||
|       <div class="smallTitle">4月芯片产量</div> |  | ||||||
|       <bm-line-bar |  | ||||||
|         :chartHeight="chartHeight" |  | ||||||
|         :legendList="legendList" |  | ||||||
|         :chartMsg="chartMsg" |  | ||||||
|         :chartId="chartId" |  | ||||||
|         :chartNum="chartNum" |  | ||||||
|       /> |  | ||||||
|       <base-table |  | ||||||
|         :table-props="tableProps" |  | ||||||
|         :page="listQuery.current" |  | ||||||
|         :limit="listQuery.size" |  | ||||||
|         :table-data="tableData" |  | ||||||
|         :max-height="tableH" |  | ||||||
|       /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import bmSearchBar from "../components/bmSearchBar.vue"; |  | ||||||
| import BmLineBar from "../components/bmLineBar.vue"; |  | ||||||
| const tableProps = [ |  | ||||||
|   { |  | ||||||
|     prop: "factory", |  | ||||||
|     label: "工厂名称", |  | ||||||
|     // filter: (val) => factoryList[val], |  | ||||||
|     minWidth: 200, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "name", |  | ||||||
|     label: "科目", |  | ||||||
|     minWidth: 120, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "unit", |  | ||||||
|     label: "单位", |  | ||||||
|     minWidth: 80, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time1", |  | ||||||
|     label: "时间1", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time2", |  | ||||||
|     label: "时间2", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "mubiao", |  | ||||||
|     label: "目标值", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
| ]; |  | ||||||
| export default { |  | ||||||
|   name: "ChipOutputBM", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       tableProps, |  | ||||||
|       listQuery: { |  | ||||||
|         current: 1, |  | ||||||
|         size: 1000, |  | ||||||
|       }, |  | ||||||
|       tableData: [ |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|       ], |  | ||||||
|       chartHeight: this.tableHeight(269) / 2, |  | ||||||
|       tableH: this.tableHeight(269) / 2, |  | ||||||
|       legendList: [ |  | ||||||
|         { id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" }, |  | ||||||
|         { id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" }, |  | ||||||
|         { id: 3, name: "2024年4月", type: 1, color: "#288AFF" }, |  | ||||||
|       ], |  | ||||||
|       chartMsg: { |  | ||||||
|         color: ["#FFCE6A", "#8EF0AB", "#288AFF"], |  | ||||||
|         xData: ["成都", "邯郸", "瑞昌"], |  | ||||||
|         yName: "单位/片", |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: "2024年4月目标值", |  | ||||||
|             // data: [3000, 2000, 3000], |  | ||||||
|             // data: [6800, 5000, 8900], |  | ||||||
|             // data: [12000, 17000, 19000], |  | ||||||
|             data: [560000, 540000, 600000], |  | ||||||
|             type: "line", |  | ||||||
|             symbol: "circle", |  | ||||||
|             symbolSize: 6, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               color: "#FFAE17", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2023年4月", |  | ||||||
|             // data: [2100, 800, 1500], |  | ||||||
|             // data: [9500, 7200, 9901], |  | ||||||
|             // data: [14666, 15000, 17888], |  | ||||||
|             data: [550000, 456666, 590000], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               // position: [-5, -16], |  | ||||||
|               // position: [-5, -16], |  | ||||||
|               // position: [-10, -16], |  | ||||||
|               position: [-17, -16], |  | ||||||
|               color: "#68C483", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2024年4月", |  | ||||||
|             // data: [2100, 900, 1300], |  | ||||||
|             // data: [9100, 7300, 9700], |  | ||||||
|             // data: [14666, 15300, 18000], |  | ||||||
|             data: [556666, 456666, 650000], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [0, -16], |  | ||||||
|               color: "#288AFF", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|         ], |  | ||||||
|       }, |  | ||||||
|       chartId: "chipOutputBMChart", |  | ||||||
|       chartNum: 1, |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   components: { |  | ||||||
|     bmSearchBar, |  | ||||||
|     BmLineBar, |  | ||||||
|   }, |  | ||||||
|   computed: { |  | ||||||
|     isOpen() { |  | ||||||
|       return this.$store.getters.sidebar.opened; |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   watch: { |  | ||||||
|     // 监听左侧菜单栏是否展开 |  | ||||||
|     isOpen(val) { |  | ||||||
|       if (this.$route.name === "ChipOutputBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|     this.tableH = this.tableHeight(269) / 2; |  | ||||||
|     this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|     window.addEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   destroyed() { |  | ||||||
|     window.removeEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   activated() { |  | ||||||
|     // 图重新加载,为了防止窗口变化后尺寸图显示不佳,数据不更新 |  | ||||||
|     if (this.$route.name === "ChipOutputBM") { |  | ||||||
|       this.chartNum++; |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     _setTableHeight() { |  | ||||||
|       this.tableH = this.tableHeight(269) / 2; |  | ||||||
|       this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|       if (this.$route.name === "ChipOutputBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     getSearch(val) { |  | ||||||
|       console.log(val); |  | ||||||
|       console.log("========================="); |  | ||||||
|     }, |  | ||||||
|     handleExport() { |  | ||||||
|       console.log("导出"); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .containerTop { |  | ||||||
|   height: 64px; |  | ||||||
| } |  | ||||||
| .containerTop, |  | ||||||
| .containerBottom { |  | ||||||
|   position: relative; |  | ||||||
|   background-color: #fff; |  | ||||||
|   border-radius: 8px; |  | ||||||
|   padding: 16px; |  | ||||||
| } |  | ||||||
| .containerBottom { |  | ||||||
|   height: calc(100vh - 201px); |  | ||||||
|   margin-top: 8px; |  | ||||||
|   .smallTitle { |  | ||||||
|     font-size: 16px; |  | ||||||
|     color: #000; |  | ||||||
|     margin-bottom: 15px; |  | ||||||
|   } |  | ||||||
|   .smallTitle::before { |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 4px; |  | ||||||
|     height: 16px; |  | ||||||
|     background: #0b58ff; |  | ||||||
|     content: ""; |  | ||||||
|     margin-right: 8px; |  | ||||||
|     vertical-align: -3px; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,248 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <div class="containerTop"> |  | ||||||
|       <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> |  | ||||||
|     </div> |  | ||||||
|     <div class="containerBottom"> |  | ||||||
|       <div class="smallTitle">4月芯片人均产量</div> |  | ||||||
|       <bm-line-bar |  | ||||||
|         :chartHeight="chartHeight" |  | ||||||
|         :legendList="legendList" |  | ||||||
|         :chartMsg="chartMsg" |  | ||||||
|         :chartId="chartId" |  | ||||||
|         :chartNum="chartNum" |  | ||||||
|       /> |  | ||||||
|       <base-table |  | ||||||
|         :table-props="tableProps" |  | ||||||
|         :page="listQuery.current" |  | ||||||
|         :limit="listQuery.size" |  | ||||||
|         :table-data="tableData" |  | ||||||
|         :max-height="tableH" |  | ||||||
|       /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import bmSearchBar from "../components/bmSearchBar.vue"; |  | ||||||
| import BmLineBar from "../components/bmLineBar.vue"; |  | ||||||
| const tableProps = [ |  | ||||||
|   { |  | ||||||
|     prop: "factory", |  | ||||||
|     label: "工厂名称", |  | ||||||
|     // filter: (val) => factoryList[val], |  | ||||||
|     minWidth: 200, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "name", |  | ||||||
|     label: "科目", |  | ||||||
|     minWidth: 120, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "unit", |  | ||||||
|     label: "单位", |  | ||||||
|     minWidth: 80, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time1", |  | ||||||
|     label: "时间1", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time2", |  | ||||||
|     label: "时间2", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "mubiao", |  | ||||||
|     label: "目标值", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
| ]; |  | ||||||
| export default { |  | ||||||
|   name: "ChipPerCapitaBM", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       tableProps, |  | ||||||
|       listQuery: { |  | ||||||
|         current: 1, |  | ||||||
|         size: 1000, |  | ||||||
|       }, |  | ||||||
|       tableData: [ |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|       ], |  | ||||||
|       chartHeight: this.tableHeight(269) / 2, |  | ||||||
|       tableH: this.tableHeight(269) / 2, |  | ||||||
|       legendList: [ |  | ||||||
|         { id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" }, |  | ||||||
|         { id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" }, |  | ||||||
|         { id: 3, name: "2024年4月", type: 1, color: "#288AFF" }, |  | ||||||
|       ], |  | ||||||
|       chartMsg: { |  | ||||||
|         color: ["#FFCE6A", "#8EF0AB", "#288AFF"], |  | ||||||
|         xData: ["成都", "邯郸", "瑞昌"], |  | ||||||
|         yName: "单位/片", |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: "2024年4月目标值", |  | ||||||
|             // data: [3000, 2000, 3000], |  | ||||||
|             // data: [6800, 5000, 8900], |  | ||||||
|             // data: [12000, 17000, 19000], |  | ||||||
|             data: [560000, 540000, 600000], |  | ||||||
|             type: "line", |  | ||||||
|             symbol: "circle", |  | ||||||
|             symbolSize: 6, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               color: "#FFAE17", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2023年4月", |  | ||||||
|             // data: [2100, 800, 1500], |  | ||||||
|             // data: [9500, 7200, 9901], |  | ||||||
|             // data: [14666, 15000, 17888], |  | ||||||
|             data: [550000, 456666, 590000], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               // position: [-5, -16], |  | ||||||
|               // position: [-5, -16], |  | ||||||
|               // position: [-10, -16], |  | ||||||
|               position: [-17, -16], |  | ||||||
|               color: "#68C483", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2024年4月", |  | ||||||
|             // data: [2100, 900, 1300], |  | ||||||
|             // data: [9100, 7300, 9700], |  | ||||||
|             // data: [14666, 15300, 18000], |  | ||||||
|             data: [556666, 456666, 650000], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [0, -16], |  | ||||||
|               color: "#288AFF", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|         ], |  | ||||||
|       }, |  | ||||||
|       chartId: "chipPerCapitaBMChart", |  | ||||||
|       chartNum: 1, |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   components: { |  | ||||||
|     bmSearchBar, |  | ||||||
|     BmLineBar, |  | ||||||
|   }, |  | ||||||
|   computed: { |  | ||||||
|     isOpen() { |  | ||||||
|       return this.$store.getters.sidebar.opened; |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   watch: { |  | ||||||
|     // 监听左侧菜单栏是否展开 |  | ||||||
|     isOpen(val) { |  | ||||||
|       if (this.$route.name === "ChipPerCapitaBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|     this.tableH = this.tableHeight(269) / 2; |  | ||||||
|     this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|     window.addEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   destroyed() { |  | ||||||
|     window.removeEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   activated() { |  | ||||||
|     // 图重新加载,为了防止窗口变化后尺寸图显示不佳,数据不更新 |  | ||||||
|     if (this.$route.name === "ChipPerCapitaBM") { |  | ||||||
|       this.chartNum++; |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     _setTableHeight() { |  | ||||||
|       this.tableH = this.tableHeight(269) / 2; |  | ||||||
|       this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|       if (this.$route.name === "ChipPerCapitaBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     getSearch(val) { |  | ||||||
|       console.log(val); |  | ||||||
|       console.log("========================="); |  | ||||||
|     }, |  | ||||||
|     handleExport() { |  | ||||||
|       console.log("导出"); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .containerTop { |  | ||||||
|   height: 64px; |  | ||||||
| } |  | ||||||
| .containerTop, |  | ||||||
| .containerBottom { |  | ||||||
|   position: relative; |  | ||||||
|   background-color: #fff; |  | ||||||
|   border-radius: 8px; |  | ||||||
|   padding: 16px; |  | ||||||
| } |  | ||||||
| .containerBottom { |  | ||||||
|   height: calc(100vh - 201px); |  | ||||||
|   margin-top: 8px; |  | ||||||
|   .smallTitle { |  | ||||||
|     font-size: 16px; |  | ||||||
|     color: #000; |  | ||||||
|     margin-bottom: 15px; |  | ||||||
|   } |  | ||||||
|   .smallTitle::before { |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 4px; |  | ||||||
|     height: 16px; |  | ||||||
|     background: #0b58ff; |  | ||||||
|     content: ""; |  | ||||||
|     margin-right: 8px; |  | ||||||
|     vertical-align: -3px; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,257 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <div class="containerTop"> |  | ||||||
|       <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> |  | ||||||
|     </div> |  | ||||||
|     <div class="containerBottom"> |  | ||||||
|       <div class="smallTitle">4月芯片良率</div> |  | ||||||
|       <bm-line-bar |  | ||||||
|         :chartHeight="chartHeight" |  | ||||||
|         :legendList="legendList" |  | ||||||
|         :chartMsg="chartMsg" |  | ||||||
|         :chartId="chartId" |  | ||||||
|         :chartNum="chartNum" |  | ||||||
|       /> |  | ||||||
|       <base-table |  | ||||||
|         :table-props="tableProps" |  | ||||||
|         :page="listQuery.current" |  | ||||||
|         :limit="listQuery.size" |  | ||||||
|         :table-data="tableData" |  | ||||||
|         :max-height="tableH" |  | ||||||
|       /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import bmSearchBar from "../components/bmSearchBar.vue"; |  | ||||||
| import BmLineBar from "../components/bmLineBar.vue"; |  | ||||||
| const tableProps = [ |  | ||||||
|   { |  | ||||||
|     prop: "factory", |  | ||||||
|     label: "工厂名称", |  | ||||||
|     // filter: (val) => factoryList[val], |  | ||||||
|     minWidth: 200, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "name", |  | ||||||
|     label: "科目", |  | ||||||
|     minWidth: 120, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "unit", |  | ||||||
|     label: "单位", |  | ||||||
|     minWidth: 80, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time1", |  | ||||||
|     label: "时间1", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time2", |  | ||||||
|     label: "时间2", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "mubiao", |  | ||||||
|     label: "目标值", |  | ||||||
|     minWidth: 150, |  | ||||||
|     showOverflowtooltip: true, |  | ||||||
|   }, |  | ||||||
| ]; |  | ||||||
| export default { |  | ||||||
|   name: "ChipYieldBM", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       tableProps, |  | ||||||
|       listQuery: { |  | ||||||
|         current: 1, |  | ||||||
|         size: 1000, |  | ||||||
|       }, |  | ||||||
|       tableData: [ |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|       ], |  | ||||||
|       chartHeight: this.tableHeight(269) / 2, |  | ||||||
|       tableH: this.tableHeight(269) / 2, |  | ||||||
|       legendList: [ |  | ||||||
|         { id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" }, |  | ||||||
|         { id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" }, |  | ||||||
|         { id: 3, name: "2024年4月", type: 1, color: "#288AFF" }, |  | ||||||
|       ], |  | ||||||
|       chartMsg: { |  | ||||||
|         color: ["#FFCE6A", "#8EF0AB", "#288AFF"], |  | ||||||
|         xData: ["成都", "邯郸", "瑞昌"], |  | ||||||
|         yName: "单位/%", |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: "2024年4月目标值", |  | ||||||
|             data: [ |  | ||||||
|               { name: "%", value: 85 }, |  | ||||||
|               { name: "%", value: 85 }, |  | ||||||
|               { name: "%", value: 85 }, |  | ||||||
|             ], |  | ||||||
|             type: "line", |  | ||||||
|             symbol: "circle", |  | ||||||
|             symbolSize: 6, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               color: "#FFAE17", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2023年4月", |  | ||||||
|             data: [ |  | ||||||
|               { name: "%", value: 57.5 }, |  | ||||||
|               { name: "%", value: 21.66 }, |  | ||||||
|               { name: "%", value: 18.4 }, |  | ||||||
|             ], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [-18, -16], |  | ||||||
|               color: "#68C483", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2024年4月", |  | ||||||
|             data: [ |  | ||||||
|               { name: "%", value: 23.33 }, |  | ||||||
|               { name: "%", value: 7.02 }, |  | ||||||
|               { name: "%", value: 80.2 }, |  | ||||||
|             ], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: [0, -16], |  | ||||||
|               color: "#288AFF", |  | ||||||
|               formatter: function (params) { |  | ||||||
|                 return params.value.toFixed(2) + "%"; |  | ||||||
|               }, |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|         ], |  | ||||||
|       }, |  | ||||||
|       chartId: "chipYieldBMChart", |  | ||||||
|       chartNum: 1, |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   components: { |  | ||||||
|     bmSearchBar, |  | ||||||
|     BmLineBar, |  | ||||||
|   }, |  | ||||||
|   computed: { |  | ||||||
|     isOpen() { |  | ||||||
|       return this.$store.getters.sidebar.opened; |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   watch: { |  | ||||||
|     // 监听左侧菜单栏是否展开 |  | ||||||
|     isOpen(val) { |  | ||||||
|       if (this.$route.name === "ChipYieldBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|     this.tableH = this.tableHeight(269) / 2; |  | ||||||
|     this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|     window.addEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   destroyed() { |  | ||||||
|     window.removeEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   activated() { |  | ||||||
|     // 图重新加载,为了防止窗口变化后尺寸图显示不佳,数据不更新 |  | ||||||
|     if (this.$route.name === "ChipYieldBM") { |  | ||||||
|       this.chartNum++; |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     _setTableHeight() { |  | ||||||
|       this.tableH = this.tableHeight(269) / 2; |  | ||||||
|       this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|       if (this.$route.name === "ChipYieldBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     getSearch(val) { |  | ||||||
|       console.log(val); |  | ||||||
|       console.log("========================="); |  | ||||||
|     }, |  | ||||||
|     handleExport() { |  | ||||||
|       console.log("导出"); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .containerTop { |  | ||||||
|   height: 64px; |  | ||||||
| } |  | ||||||
| .containerTop, |  | ||||||
| .containerBottom { |  | ||||||
|   position: relative; |  | ||||||
|   background-color: #fff; |  | ||||||
|   border-radius: 8px; |  | ||||||
|   padding: 16px; |  | ||||||
| } |  | ||||||
| .containerBottom { |  | ||||||
|   height: calc(100vh - 201px); |  | ||||||
|   margin-top: 8px; |  | ||||||
|   .smallTitle { |  | ||||||
|     font-size: 16px; |  | ||||||
|     color: #000; |  | ||||||
|     margin-bottom: 15px; |  | ||||||
|   } |  | ||||||
|   .smallTitle::before { |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 4px; |  | ||||||
|     height: 16px; |  | ||||||
|     background: #0b58ff; |  | ||||||
|     content: ""; |  | ||||||
|     margin-right: 8px; |  | ||||||
|     vertical-align: -3px; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,227 +0,0 @@ | |||||||
| <!-- 只适用于指标完成情况对标 --> |  | ||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <!-- 暂无数据 --> |  | ||||||
|     <div |  | ||||||
|       :style="{ height: chartHeight + 'px' }" |  | ||||||
|       v-show="this.chartMsg.series[0].data.length === 0" |  | ||||||
|     > |  | ||||||
|       <div |  | ||||||
|         class="no-data-bg" |  | ||||||
|         style="position: relative; left: 50%; transform: translateX(-50%)" |  | ||||||
|       ></div> |  | ||||||
|     </div> |  | ||||||
|     <!-- 图例 --> |  | ||||||
|     <div v-show="this.chartMsg.series[0].data.length > 0"> |  | ||||||
|       <div class="legend"> |  | ||||||
|         <span class="item" v-for="item in legendList" :key="item.id"> |  | ||||||
|           <span |  | ||||||
|             v-if="item.type === 1" |  | ||||||
|             class="block" |  | ||||||
|             :style="{ backgroundColor: item.color }" |  | ||||||
|           ></span> |  | ||||||
|           <span |  | ||||||
|             v-if="item.type === 2" |  | ||||||
|             class="line" |  | ||||||
|             :style="{ backgroundColor: item.color }" |  | ||||||
|           > |  | ||||||
|             <span |  | ||||||
|               class="line-block" |  | ||||||
|               :style="{ backgroundColor: item.color }" |  | ||||||
|             ></span> |  | ||||||
|           </span> |  | ||||||
|           {{ item.name }}</span |  | ||||||
|         > |  | ||||||
|       </div> |  | ||||||
|       <div |  | ||||||
|         :id="chartId" |  | ||||||
|         :style="{ width: '100%', height: chartHeight + 'px' }" |  | ||||||
|       ></div> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
| <script> |  | ||||||
| import * as echarts from "echarts"; |  | ||||||
| import { debounce } from "@/utils/debounce"; |  | ||||||
| export default { |  | ||||||
|   name: "bmBarComplete", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       myChart: "", |  | ||||||
|       option: { |  | ||||||
|         color: [], |  | ||||||
|         // color: ["#8EF0AB", "#63BDFF", "#288AFF"], |  | ||||||
|         grid: { |  | ||||||
|           left: 70, |  | ||||||
|           right: 10, |  | ||||||
|           bottom: 30, |  | ||||||
|           top: 30, |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: "axis", |  | ||||||
|           axisPointer: { |  | ||||||
|             // type: "cross", |  | ||||||
|             crossStyle: { |  | ||||||
|               color: "rgba(237,237,237,0.5)", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           formatter: function (params) { |  | ||||||
|             var res = `<span style='color:rgba(0,0,0,0.8)'>${params[0].axisValueLabel}</span>`; |  | ||||||
|             for (var i = 0, l = params.length; i < l; i++) { |  | ||||||
|               res += |  | ||||||
|                 "<br/>" + |  | ||||||
|                 `${ |  | ||||||
|                   params[i].seriesType === "line" |  | ||||||
|                     ? '<img width="10" height="10" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />' |  | ||||||
|                     : `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}"></span>` |  | ||||||
|                 }` + |  | ||||||
|                 `<span style='display:inline-block;width:180px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` + |  | ||||||
|                 `<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${ |  | ||||||
|                   params[i].name === "%" |  | ||||||
|                     ? (params[i].value ? params[i].value.toFixed(2) : "0.00") + |  | ||||||
|                       params[i].name |  | ||||||
|                     : String(params[i].value).replace( |  | ||||||
|                         /\B(?=(\d{3})+(?!\d))/g, |  | ||||||
|                         "," |  | ||||||
|                       ) |  | ||||||
|                 }</span>`; |  | ||||||
|             } |  | ||||||
|             return res; |  | ||||||
|           }, |  | ||||||
|         }, |  | ||||||
|         xAxis: { |  | ||||||
|           type: "category", |  | ||||||
|           data: [], |  | ||||||
|           axisTick: { |  | ||||||
|             show: false, |  | ||||||
|           }, |  | ||||||
|           axisPointer: { |  | ||||||
|             type: "shadow", |  | ||||||
|           }, |  | ||||||
|         }, |  | ||||||
|         yAxis: { |  | ||||||
|           type: "value", |  | ||||||
|           name: "", |  | ||||||
|           nameTextStyle: { |  | ||||||
|             fontSize: 12, |  | ||||||
|             align: "right", |  | ||||||
|           }, |  | ||||||
|           axisLabel: {}, |  | ||||||
|         }, |  | ||||||
|         series: [], |  | ||||||
|       }, |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   props: { |  | ||||||
|     chartHeight: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 300, |  | ||||||
|     }, |  | ||||||
|     legendList: { |  | ||||||
|       type: Array, |  | ||||||
|       default: () => [], |  | ||||||
|     }, |  | ||||||
|     chartMsg: { |  | ||||||
|       type: Object, |  | ||||||
|       default: () => {}, |  | ||||||
|     }, |  | ||||||
|     chartId: { |  | ||||||
|       type: String, |  | ||||||
|       default: "bmChart", |  | ||||||
|     }, |  | ||||||
|     chartNum: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 1, |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   watch: { |  | ||||||
|     chartHeight: { |  | ||||||
|       handler(newVal) { |  | ||||||
|         this.chartHeight = newVal; |  | ||||||
|       }, |  | ||||||
|     }, |  | ||||||
|     chartNum(val) { |  | ||||||
|       this.canvasReset(); |  | ||||||
|     }, |  | ||||||
|     chartMsg: { |  | ||||||
|       handler(newVal) { |  | ||||||
|         this.canvasReset(); |  | ||||||
|       }, |  | ||||||
|       deep: true, |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     this.canvasReset(); |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     canvasReset() { |  | ||||||
|       debounce(() => { |  | ||||||
|         this.getMes(); |  | ||||||
|       }, 500)(); |  | ||||||
|     }, |  | ||||||
|     getMes() { |  | ||||||
|       if (this.myChart) { |  | ||||||
|         this.myChart.dispose(); |  | ||||||
|       } |  | ||||||
|       var chartDom = document.getElementById(this.chartId); |  | ||||||
|       this.myChart = echarts.init(chartDom); |  | ||||||
|       this.option.color = this.chartMsg.color; |  | ||||||
|       this.option.xAxis.data = this.chartMsg.xData; |  | ||||||
|       this.option.yAxis.name = this.chartMsg.yName; |  | ||||||
|       if ( |  | ||||||
|         this.chartMsg.series.length > 0 && |  | ||||||
|         this.chartMsg.series[0].data[0].name === "%" |  | ||||||
|       ) { |  | ||||||
|         this.option.yAxis.axisLabel = { |  | ||||||
|           formatter: function (value) { |  | ||||||
|             return value + ".00%"; |  | ||||||
|           }, |  | ||||||
|         }; |  | ||||||
|       } else { |  | ||||||
|         this.option.yAxis.axisLabel = { |  | ||||||
|           formatter: function (value) { |  | ||||||
|             return value; |  | ||||||
|           }, |  | ||||||
|         }; |  | ||||||
|       } |  | ||||||
|       // this.option.yAxis.axisLabel = this.chartMsg.yAxisLabel; |  | ||||||
|       this.option.series = this.chartMsg.series; |  | ||||||
|       this.myChart.setOption(this.option); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .legend { |  | ||||||
|   position: absolute; |  | ||||||
|   right: 10px; |  | ||||||
|   top: 15px; |  | ||||||
|   .item { |  | ||||||
|     display: inline-block; |  | ||||||
|     margin-right: 10px; |  | ||||||
|     font-size: 14px; |  | ||||||
|     color: #8c8c8c; |  | ||||||
|     .block { |  | ||||||
|       width: 10px; |  | ||||||
|       height: 10px; |  | ||||||
|       display: inline-block; |  | ||||||
|       margin-right: 4px; |  | ||||||
|     } |  | ||||||
|     .line { |  | ||||||
|       width: 10px; |  | ||||||
|       height: 10px; |  | ||||||
|       border-radius: 5px; |  | ||||||
|       display: inline-block; |  | ||||||
|       margin-right: 4px; |  | ||||||
|       position: relative; |  | ||||||
|       .line-block { |  | ||||||
|         position: absolute; |  | ||||||
|         width: 20px; |  | ||||||
|         height: 2px; |  | ||||||
|         left: -5px; |  | ||||||
|         top: 4px; |  | ||||||
|       } |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,138 +0,0 @@ | |||||||
| <!-- 只使用于指标完成情况对标页面 --> |  | ||||||
| <template> |  | ||||||
|   <el-form :model="form" :inline="true" ref="bmSearchBarForm" class="blueTip"> |  | ||||||
|     <el-form-item label="时间维度" prop="type"> |  | ||||||
|       <el-select |  | ||||||
|         size="small" |  | ||||||
|         v-model="form.type" |  | ||||||
|         placeholder="请选择" |  | ||||||
|         style="width: 100px" |  | ||||||
|       > |  | ||||||
|         <el-option |  | ||||||
|           v-for="item in typeList" |  | ||||||
|           :key="item.id" |  | ||||||
|           :label="item.name" |  | ||||||
|           :value="item.id" |  | ||||||
|         > |  | ||||||
|         </el-option> |  | ||||||
|       </el-select> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 0" label="时间" prop="dayTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         size="small" |  | ||||||
|         clearable |  | ||||||
|         v-model="form.dayTime" |  | ||||||
|         type="date" |  | ||||||
|         placeholder="选择日期" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 1" label="时间" prop="weekTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         v-model="form.weekTime" |  | ||||||
|         type="week" |  | ||||||
|         format="yyyy-MM-dd" |  | ||||||
|         placeholder="选择周" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 2" label="时间" prop="monthTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         v-model="form.monthTime" |  | ||||||
|         type="month" |  | ||||||
|         placeholder="选择月份" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 3" label="时间" prop="yearTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         v-model="form.yearTime" |  | ||||||
|         type="year" |  | ||||||
|         placeholder="选择年份" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item> |  | ||||||
|       <el-button type="primary" size="small" @click="getDataList" |  | ||||||
|         >查询</el-button |  | ||||||
|       > |  | ||||||
|       <el-divider direction="vertical"></el-divider> |  | ||||||
|       <el-button type="primary" size="small" plain @click="handleExport" |  | ||||||
|         >导出</el-button |  | ||||||
|       > |  | ||||||
|     </el-form-item> |  | ||||||
|   </el-form> |  | ||||||
| </template> |  | ||||||
| <script> |  | ||||||
| import moment from "moment"; |  | ||||||
| export default { |  | ||||||
|   name: "bmSearchBarComplete", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       form: { |  | ||||||
|         type: 2, |  | ||||||
|         dayTime: moment().format("yyyy-MM-DD"), |  | ||||||
|         weekTime: moment().format("yyyy-MM-DD"), |  | ||||||
|         monthTime: moment().format("yyyy-MM-DD"), |  | ||||||
|         yearTime: moment().format("yyyy-MM-DD"), |  | ||||||
|       }, |  | ||||||
|       typeList: [ |  | ||||||
|         { id: 0, name: "日" }, |  | ||||||
|         { id: 1, name: "周" }, |  | ||||||
|         { id: 2, name: "月" }, |  | ||||||
|         { id: 3, name: "年" }, |  | ||||||
|       ], |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     getDataList() { |  | ||||||
|       console.log(this.form); |  | ||||||
|       let params = {}; |  | ||||||
|       switch (this.form.type) { |  | ||||||
|         case 0: |  | ||||||
|           params.startDate = this.form.dayTime; |  | ||||||
|           break; |  | ||||||
|         case 1: |  | ||||||
|           params.startDate = this.form.weekTime; |  | ||||||
|           break; |  | ||||||
|         case 2: |  | ||||||
|           params.startDate = this.form.monthTime; |  | ||||||
|           break; |  | ||||||
|         case 3: |  | ||||||
|           params.startDate = this.form.yearTime; |  | ||||||
|           break; |  | ||||||
|         default: |  | ||||||
|           break; |  | ||||||
|       } |  | ||||||
|       params.type = this.form.type; |  | ||||||
|       this.$emit("getSearch", params); |  | ||||||
|     }, |  | ||||||
|     handleExport() { |  | ||||||
|       this.$emit("handleExport"); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .el-divider--vertical { |  | ||||||
|   height: 24px; |  | ||||||
| } |  | ||||||
| .blueTip::before { |  | ||||||
|   display: inline-block; |  | ||||||
|   content: ""; |  | ||||||
|   width: 4px; |  | ||||||
|   height: 18px; |  | ||||||
|   background: #0b58ff; |  | ||||||
|   border-radius: 1px; |  | ||||||
|   margin-right: 8px; |  | ||||||
|   margin-top: 8px; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,208 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <div class="containerTop"> |  | ||||||
|       <bm-search-bar-complete |  | ||||||
|         @getSearch="getSearch" |  | ||||||
|         @handleExport="handleExport" |  | ||||||
|       /> |  | ||||||
|     </div> |  | ||||||
|     <div class="containerBottom"> |  | ||||||
|       <div class="smallTitle">凯盛玻璃控股指标完成情况</div> |  | ||||||
|       <bm-bar-complete |  | ||||||
|         :chartHeight="chartHeight" |  | ||||||
|         :legendList="legendList" |  | ||||||
|         :chartMsg="chartMsg" |  | ||||||
|         :chartId="chartId" |  | ||||||
|         :chartNum="chartNum" |  | ||||||
|       /> |  | ||||||
|       <base-table |  | ||||||
|         :table-props="tableProps" |  | ||||||
|         :page="listQuery.current" |  | ||||||
|         :limit="listQuery.size" |  | ||||||
|         :table-data="tableData" |  | ||||||
|         :max-height="tableH" |  | ||||||
|       /> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import BmSearchBarComplete from "./components/bmSearchBarComplete.vue"; |  | ||||||
| import BmBarComplete from "./components/bmBarComplete.vue"; |  | ||||||
| const tableProps = [ |  | ||||||
|   { |  | ||||||
|     prop: "factory", |  | ||||||
|     label: "指标名称", |  | ||||||
|     // filter: (val) => factoryList[val], |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "unit", |  | ||||||
|     label: "单位", |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time1", |  | ||||||
|     label: "时间1", |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: "time2", |  | ||||||
|     label: "时间2", |  | ||||||
|   }, |  | ||||||
| ]; |  | ||||||
| export default { |  | ||||||
|   name: "CompletionStatusIntrBM", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       tableProps, |  | ||||||
|       listQuery: { |  | ||||||
|         current: 1, |  | ||||||
|         size: 1000, |  | ||||||
|       }, |  | ||||||
|       tableData: [ |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|         { factory: "工厂1" }, |  | ||||||
|       ], |  | ||||||
|       chartHeight: this.tableHeight(269) / 2, |  | ||||||
|       tableH: this.tableHeight(269) / 2, |  | ||||||
|       legendList: [ |  | ||||||
|         { id: 1, name: "2023年4月", type: 1, color: "#288AFF33" }, |  | ||||||
|         { id: 2, name: "2024年4月", type: 1, color: "#288AFF" }, |  | ||||||
|       ], |  | ||||||
|       chartMsg: { |  | ||||||
|         color: ["#288AFF33", "#288AFF"], |  | ||||||
|         xData: ["成都", "邯郸", "瑞昌"], |  | ||||||
|         yName: "单位/MW", |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: "2023年4月", |  | ||||||
|             data: [5505, 6578, 5500], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: "top", |  | ||||||
|               color: "#2789FF", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: "2024年4月", |  | ||||||
|             data: [3503, 3456, 4500], |  | ||||||
|             type: "bar", |  | ||||||
|             barWidth: 20, |  | ||||||
|             barGap: "-100%", |  | ||||||
|             label: { |  | ||||||
|               show: true, |  | ||||||
|               position: "top", |  | ||||||
|               color: "#288AFF", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|         ], |  | ||||||
|       }, |  | ||||||
|       chartId: "completionStatusIntrBMChart", |  | ||||||
|       chartNum: 1, |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   components: { |  | ||||||
|     BmBarComplete, |  | ||||||
|     BmSearchBarComplete, |  | ||||||
|   }, |  | ||||||
|   computed: { |  | ||||||
|     isOpen() { |  | ||||||
|       return this.$store.getters.sidebar.opened; |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   watch: { |  | ||||||
|     // 监听左侧菜单栏是否展开 |  | ||||||
|     isOpen(val) { |  | ||||||
|       if (this.$route.name === "CompletionStatusIntrBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|     this.tableH = this.tableHeight(269) / 2; |  | ||||||
|     this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|     window.addEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   destroyed() { |  | ||||||
|     window.removeEventListener("resize", this._setTableHeight); |  | ||||||
|   }, |  | ||||||
|   activated() { |  | ||||||
|     // 图重新加载,为了防止窗口变化后尺寸图显示不佳,数据不更新 |  | ||||||
|     if (this.$route.name === "CompletionStatusIntrBM") { |  | ||||||
|       this.chartNum++; |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     _setTableHeight() { |  | ||||||
|       this.tableH = this.tableHeight(269) / 2; |  | ||||||
|       this.chartHeight = this.tableHeight(269) / 2; |  | ||||||
|       if (this.$route.name === "CompletionStatusIntrBM") { |  | ||||||
|         this.chartNum++; |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     getSearch(val) { |  | ||||||
|       console.log(val); |  | ||||||
|       console.log("========================="); |  | ||||||
|     }, |  | ||||||
|     handleExport() { |  | ||||||
|       console.log("导出"); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .containerTop { |  | ||||||
|   height: 64px; |  | ||||||
| } |  | ||||||
| .containerTop, |  | ||||||
| .containerBottom { |  | ||||||
|   position: relative; |  | ||||||
|   background-color: #fff; |  | ||||||
|   border-radius: 8px; |  | ||||||
|   padding: 16px; |  | ||||||
| } |  | ||||||
| .containerBottom { |  | ||||||
|   height: calc(100vh - 201px); |  | ||||||
|   margin-top: 8px; |  | ||||||
|   .smallTitle { |  | ||||||
|     font-size: 16px; |  | ||||||
|     color: #000; |  | ||||||
|     margin-bottom: 15px; |  | ||||||
|   } |  | ||||||
|   .smallTitle::before { |  | ||||||
|     display: inline-block; |  | ||||||
|     width: 4px; |  | ||||||
|     height: 16px; |  | ||||||
|     background: #0b58ff; |  | ||||||
|     content: ""; |  | ||||||
|     margin-right: 8px; |  | ||||||
|     vertical-align: -3px; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,243 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <!-- 暂无数据 --> |  | ||||||
|     <div |  | ||||||
|       :style="{ height: chartHeight + 'px' }" |  | ||||||
|       v-show="this.chartMsg.series[0].data.length === 0" |  | ||||||
|     > |  | ||||||
|       <div |  | ||||||
|         class="no-data-bg" |  | ||||||
|         style="position: relative; left: 50%; transform: translateX(-50%)" |  | ||||||
|       ></div> |  | ||||||
|     </div> |  | ||||||
|     <!-- 图例 --> |  | ||||||
|     <div v-show="this.chartMsg.series[0].data.length > 0"> |  | ||||||
|       <div class="legend"> |  | ||||||
|         <span class="item" v-for="item in legendList" :key="item.id"> |  | ||||||
|           <span |  | ||||||
|             v-if="item.type === 1" |  | ||||||
|             class="block" |  | ||||||
|             :style="{ backgroundColor: item.color }" |  | ||||||
|           ></span> |  | ||||||
|           <span |  | ||||||
|             v-if="item.type === 2" |  | ||||||
|             class="line" |  | ||||||
|             :style="{ backgroundColor: item.color }" |  | ||||||
|           > |  | ||||||
|             <span |  | ||||||
|               class="line-block" |  | ||||||
|               :style="{ backgroundColor: item.color }" |  | ||||||
|             ></span> |  | ||||||
|           </span> |  | ||||||
|           {{ item.name }}</span |  | ||||||
|         > |  | ||||||
|       </div> |  | ||||||
|       <div |  | ||||||
|         :id="chartId" |  | ||||||
|         :style="{ width: '100%', height: chartHeight + 'px' }" |  | ||||||
|       ></div> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
| <script> |  | ||||||
| import * as echarts from "echarts"; |  | ||||||
| import { debounce } from "@/utils/debounce"; |  | ||||||
| export default { |  | ||||||
|   name: "bmLineBar", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       myChart: "", |  | ||||||
|       option: { |  | ||||||
|         color: [], |  | ||||||
|         // color: ["#8EF0AB", "#63BDFF", "#288AFF"], |  | ||||||
|         grid: { |  | ||||||
|           left: 70, |  | ||||||
|           right: 10, |  | ||||||
|           bottom: 30, |  | ||||||
|           top: 30, |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: "axis", |  | ||||||
|           axisPointer: { |  | ||||||
|             // type: "cross", |  | ||||||
|             crossStyle: { |  | ||||||
|               color: "rgba(237,237,237,0.5)", |  | ||||||
|             }, |  | ||||||
|           }, |  | ||||||
|           formatter: function (params) { |  | ||||||
|             var res = `<span style='color:rgba(0,0,0,0.8)'>${params[0].axisValueLabel}</span>`; |  | ||||||
|             for (var i = 0, l = params.length; i < l; i++) { |  | ||||||
|               res += |  | ||||||
|                 "<br/>" + |  | ||||||
|                 `${ |  | ||||||
|                   params[i].seriesType === "line" |  | ||||||
|                     ? '<img width="10" height="10" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />' |  | ||||||
|                     : `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}"></span>` |  | ||||||
|                 }` + |  | ||||||
|                 `<span style='display:inline-block;width:180px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` + |  | ||||||
|                 `<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${ |  | ||||||
|                   params[i].name === "%" |  | ||||||
|                     ? (params[i].value ? params[i].value.toFixed(2) : "0.00") + |  | ||||||
|                       params[i].name |  | ||||||
|                     : String(params[i].value).replace( |  | ||||||
|                         /\B(?=(\d{3})+(?!\d))/g, |  | ||||||
|                         "," |  | ||||||
|                       ) |  | ||||||
|                 }</span>`; |  | ||||||
|             } |  | ||||||
|             return res; |  | ||||||
|           }, |  | ||||||
|           // formatter: function (params) { |  | ||||||
|           //   console.log(params); |  | ||||||
|           //   var res = `<span style='color:rgba(0,0,0,0.8)'>${params[0].axisValueLabel}</span>`; |  | ||||||
|           //   for (var i = 0, l = params.length; i < l; i++) { |  | ||||||
|           //     res += |  | ||||||
|           //       "<br/>" + |  | ||||||
|           //       `<span style='display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}'></span>` + |  | ||||||
|           //       `<span style='display:inline-block;width:150px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` + |  | ||||||
|           //       `<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${ |  | ||||||
|           //         params[i].name === "%" |  | ||||||
|           //           ? (params[i].value ? params[i].value.toFixed(2) : 0.0) + |  | ||||||
|           //             params[i].name |  | ||||||
|           //           : params[i].value |  | ||||||
|           //       }</span>`; |  | ||||||
|           //   } |  | ||||||
|           //   return res; |  | ||||||
|           // }, |  | ||||||
|         }, |  | ||||||
|         xAxis: { |  | ||||||
|           type: "category", |  | ||||||
|           data: [], |  | ||||||
|           axisTick: { |  | ||||||
|             show: false, |  | ||||||
|           }, |  | ||||||
|           axisPointer: { |  | ||||||
|             type: "shadow", |  | ||||||
|           }, |  | ||||||
|         }, |  | ||||||
|         yAxis: { |  | ||||||
|           type: "value", |  | ||||||
|           name: "", |  | ||||||
|           nameTextStyle: { |  | ||||||
|             fontSize: 12, |  | ||||||
|             align: "right", |  | ||||||
|           }, |  | ||||||
|           axisLabel: {}, |  | ||||||
|         }, |  | ||||||
|         series: [], |  | ||||||
|       }, |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   props: { |  | ||||||
|     chartHeight: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 300, |  | ||||||
|     }, |  | ||||||
|     legendList: { |  | ||||||
|       type: Array, |  | ||||||
|       default: () => [], |  | ||||||
|     }, |  | ||||||
|     chartMsg: { |  | ||||||
|       type: Object, |  | ||||||
|       default: () => {}, |  | ||||||
|     }, |  | ||||||
|     chartId: { |  | ||||||
|       type: String, |  | ||||||
|       default: "bmChart", |  | ||||||
|     }, |  | ||||||
|     chartNum: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 1, |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   watch: { |  | ||||||
|     chartHeight: { |  | ||||||
|       handler(newVal) { |  | ||||||
|         this.chartHeight = newVal; |  | ||||||
|       }, |  | ||||||
|     }, |  | ||||||
|     chartNum(val) { |  | ||||||
|       this.canvasReset(); |  | ||||||
|     }, |  | ||||||
|     chartMsg: { |  | ||||||
|       handler(newVal) { |  | ||||||
|         this.canvasReset(); |  | ||||||
|       }, |  | ||||||
|       deep: true, |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     this.canvasReset(); |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     canvasReset() { |  | ||||||
|       debounce(() => { |  | ||||||
|         this.getMes(); |  | ||||||
|       }, 500)(); |  | ||||||
|     }, |  | ||||||
|     getMes() { |  | ||||||
|       if (this.myChart) { |  | ||||||
|         this.myChart.dispose(); |  | ||||||
|       } |  | ||||||
|       var chartDom = document.getElementById(this.chartId); |  | ||||||
|       this.myChart = echarts.init(chartDom); |  | ||||||
|       this.option.color = this.chartMsg.color; |  | ||||||
|       this.option.xAxis.data = this.chartMsg.xData; |  | ||||||
|       this.option.yAxis.name = this.chartMsg.yName; |  | ||||||
|       if ( |  | ||||||
|         this.chartMsg.series.length > 0 && |  | ||||||
|         this.chartMsg.series[0].data[0].name === "%" |  | ||||||
|       ) { |  | ||||||
|         this.option.yAxis.axisLabel = { |  | ||||||
|           formatter: function (value) { |  | ||||||
|             return value + ".00%"; |  | ||||||
|           }, |  | ||||||
|         }; |  | ||||||
|       } else { |  | ||||||
|         this.option.yAxis.axisLabel = { |  | ||||||
|           formatter: function (value) { |  | ||||||
|             return value; |  | ||||||
|           }, |  | ||||||
|         }; |  | ||||||
|       } |  | ||||||
|       // this.option.yAxis.axisLabel = this.chartMsg.yAxisLabel; |  | ||||||
|       this.option.series = this.chartMsg.series; |  | ||||||
|       this.myChart.setOption(this.option); |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .legend { |  | ||||||
|   position: absolute; |  | ||||||
|   right: 10px; |  | ||||||
|   top: 15px; |  | ||||||
|   .item { |  | ||||||
|     display: inline-block; |  | ||||||
|     margin-right: 10px; |  | ||||||
|     font-size: 14px; |  | ||||||
|     color: #8c8c8c; |  | ||||||
|     .block { |  | ||||||
|       width: 10px; |  | ||||||
|       height: 10px; |  | ||||||
|       display: inline-block; |  | ||||||
|       margin-right: 4px; |  | ||||||
|     } |  | ||||||
|     .line { |  | ||||||
|       width: 10px; |  | ||||||
|       height: 10px; |  | ||||||
|       border-radius: 5px; |  | ||||||
|       display: inline-block; |  | ||||||
|       margin-right: 4px; |  | ||||||
|       position: relative; |  | ||||||
|       .line-block { |  | ||||||
|         position: absolute; |  | ||||||
|         width: 20px; |  | ||||||
|         height: 2px; |  | ||||||
|         left: -5px; |  | ||||||
|         top: 4px; |  | ||||||
|       } |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,165 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <el-form :model="form" :inline="true" ref="bmSearchBarForm" class="blueTip"> |  | ||||||
|     <el-form-item label="时间维度" prop="type"> |  | ||||||
|       <el-select |  | ||||||
|         size="small" |  | ||||||
|         v-model="form.type" |  | ||||||
|         placeholder="请选择" |  | ||||||
|         style="width: 100px" |  | ||||||
|       > |  | ||||||
|         <el-option |  | ||||||
|           v-for="item in typeList" |  | ||||||
|           :key="item.id" |  | ||||||
|           :label="item.name" |  | ||||||
|           :value="item.id" |  | ||||||
|         > |  | ||||||
|         </el-option> |  | ||||||
|       </el-select> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 0" label="时间" prop="dayTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         size="small" |  | ||||||
|         clearable |  | ||||||
|         v-model="form.dayTime" |  | ||||||
|         type="date" |  | ||||||
|         placeholder="选择日期" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 1" label="时间" prop="weekTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         v-model="form.weekTime" |  | ||||||
|         type="week" |  | ||||||
|         format="yyyy-MM-dd" |  | ||||||
|         placeholder="选择周" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 2" label="时间" prop="monthTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         v-model="form.monthTime" |  | ||||||
|         type="month" |  | ||||||
|         placeholder="选择月份" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item v-show="form.type === 3" label="时间" prop="yearTime"> |  | ||||||
|       <el-date-picker |  | ||||||
|         v-model="form.yearTime" |  | ||||||
|         type="year" |  | ||||||
|         placeholder="选择年份" |  | ||||||
|         value-format="yyyy-MM-dd" |  | ||||||
|         style="width: 150px" |  | ||||||
|       > |  | ||||||
|       </el-date-picker> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item label="工厂" prop="factory"> |  | ||||||
|       <el-select |  | ||||||
|         size="small" |  | ||||||
|         multiple |  | ||||||
|         v-model="form.factory" |  | ||||||
|         placeholder="请选择" |  | ||||||
|         style="width: 250px" |  | ||||||
|       > |  | ||||||
|         <el-option |  | ||||||
|           v-for="item in factoryList" |  | ||||||
|           :key="item.id" |  | ||||||
|           :label="item.name" |  | ||||||
|           :value="item.id" |  | ||||||
|         > |  | ||||||
|         </el-option> |  | ||||||
|       </el-select> |  | ||||||
|     </el-form-item> |  | ||||||
|     <el-form-item> |  | ||||||
|       <el-button type="primary" size="small" @click="getDataList('search')" |  | ||||||
|         >查询</el-button |  | ||||||
|       > |  | ||||||
|       <el-divider direction="vertical"></el-divider> |  | ||||||
|       <el-button |  | ||||||
|         type="primary" |  | ||||||
|         size="small" |  | ||||||
|         plain |  | ||||||
|         @click="getDataList('export')" |  | ||||||
|         >导出</el-button |  | ||||||
|       > |  | ||||||
|     </el-form-item> |  | ||||||
|   </el-form> |  | ||||||
| </template> |  | ||||||
| <script> |  | ||||||
| import moment from "moment"; |  | ||||||
| export default { |  | ||||||
|   name: "bmSearchBar", |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       form: { |  | ||||||
|         type: 2, |  | ||||||
|         dayTime: moment().format("yyyy-MM-DD"), |  | ||||||
|         weekTime: moment().format("yyyy-MM-DD"), |  | ||||||
|         monthTime: moment().format("yyyy-MM-DD"), |  | ||||||
|         yearTime: moment().format("yyyy-MM-DD"), |  | ||||||
|         factory: [], |  | ||||||
|       }, |  | ||||||
|       typeList: [ |  | ||||||
|         { id: 0, name: "日" }, |  | ||||||
|         { id: 1, name: "周" }, |  | ||||||
|         { id: 2, name: "月" }, |  | ||||||
|         { id: 3, name: "年" }, |  | ||||||
|       ], |  | ||||||
|       factoryList: [ |  | ||||||
|         { id: 0, name: "瑞昌" }, |  | ||||||
|         { id: 1, name: "邯郸" }, |  | ||||||
|       ], |  | ||||||
|     }; |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     getDataList(val) { |  | ||||||
|       console.log(this.form); |  | ||||||
|       let params = {}; |  | ||||||
|       params.factory = this.form.factory; |  | ||||||
|       switch (this.form.type) { |  | ||||||
|         case 0: |  | ||||||
|           params.startDate = this.form.dayTime; |  | ||||||
|           break; |  | ||||||
|         case 1: |  | ||||||
|           params.startDate = this.form.weekTime; |  | ||||||
|           break; |  | ||||||
|         case 2: |  | ||||||
|           params.startDate = this.form.monthTime; |  | ||||||
|           break; |  | ||||||
|         case 3: |  | ||||||
|           params.startDate = this.form.yearTime; |  | ||||||
|           break; |  | ||||||
|         default: |  | ||||||
|           break; |  | ||||||
|       } |  | ||||||
|       params.type = this.form.type; |  | ||||||
|       if (val === "search") { |  | ||||||
|         this.$emit("getSearch", params); |  | ||||||
|       } else { |  | ||||||
|         this.$emit("handleExport", params); |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| <style lang="scss" scoped> |  | ||||||
| .el-divider--vertical { |  | ||||||
|   height: 24px; |  | ||||||
| } |  | ||||||
| .blueTip::before { |  | ||||||
|   display: inline-block; |  | ||||||
|   content: ""; |  | ||||||
|   width: 4px; |  | ||||||
|   height: 18px; |  | ||||||
|   background: #0b58ff; |  | ||||||
|   border-radius: 1px; |  | ||||||
|   margin-right: 8px; |  | ||||||
|   margin-top: 8px; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,148 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-07 08:37:17 |  | ||||||
|  * @LastEditTime: 2024-06-07 11:04:41 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
|   <button |  | ||||||
|     class="chart-btn" |  | ||||||
|     :class="[active ? 'active' : '']" |  | ||||||
|     @click="$emit('click', label)" |  | ||||||
|   > |  | ||||||
|     {{ label }} |  | ||||||
|   </button> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
|   name: "CopilotButton", |  | ||||||
|   props: { |  | ||||||
|     label: { |  | ||||||
|       type: String, |  | ||||||
|       required: true, |  | ||||||
|     }, |  | ||||||
|     active: { |  | ||||||
|       type: Boolean, |  | ||||||
|       default: false, |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|   }, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style> |  | ||||||
| button { |  | ||||||
|   appearance: none; |  | ||||||
|   outline: none; |  | ||||||
|   border: none; |  | ||||||
|   background: none; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
|  |  | ||||||
| <style scoped> |  | ||||||
| .skate { |  | ||||||
|   /* flex: 1; */ |  | ||||||
|   position: relative; |  | ||||||
|   width: 88px; |  | ||||||
|   height: 32px; |  | ||||||
|   background: #01306C; |  | ||||||
|   /* border-radius: 4px 0px 0px 4px; */ |  | ||||||
|   backdrop-filter: blur(3px); |  | ||||||
|   /* text-align: center; |  | ||||||
|   padding: 12px; |  | ||||||
|   padding-left: 20px; |  | ||||||
|   color: #fff; |  | ||||||
|   font-size: 18px; */ |  | ||||||
|   font-family: PingFangSC, PingFang SC; |  | ||||||
|   font-weight: 400; |  | ||||||
|   font-size: 12px; |  | ||||||
|   color: #FFFFFF; |  | ||||||
|   line-height: 22px; |  | ||||||
|   letter-spacing: 5px; |  | ||||||
|   text-align: center; |  | ||||||
|   font-style: normal; |  | ||||||
|   /* margin-right: 1px; */ |  | ||||||
|   /* letter-spacing: 10px; */ |  | ||||||
|   cursor: pointer; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .chart-btn:nth-child(6)::after { |  | ||||||
|   content: ''; |  | ||||||
|   width: 0; |  | ||||||
|   height: 0; |  | ||||||
|   display: none; |  | ||||||
| } |  | ||||||
| .chart-btn { |  | ||||||
|   /* flex: 1; */ |  | ||||||
|   position: relative; |  | ||||||
|   width: 88px; |  | ||||||
|   height: 32px; |  | ||||||
|   background: #01306C; |  | ||||||
|   /* border-radius: 4px 0px 0px 4px; */ |  | ||||||
|   backdrop-filter: blur(3px); |  | ||||||
|   /* text-align: center; |  | ||||||
|   padding: 12px; |  | ||||||
|   padding-left: 20px; |  | ||||||
|   color: #fff; |  | ||||||
|   font-size: 18px; */ |  | ||||||
|   font-family: PingFangSC, PingFang SC; |  | ||||||
|   font-weight: 400; |  | ||||||
|   font-size: 12px; |  | ||||||
|   color: #FFFFFF; |  | ||||||
|   line-height: 22px; |  | ||||||
|   letter-spacing: 5px; |  | ||||||
|   text-align: center; |  | ||||||
|   font-style: normal; |  | ||||||
|   /* margin-right: 1px; */ |  | ||||||
|   /* letter-spacing: 10px; */ |  | ||||||
|   cursor: pointer; |  | ||||||
| } |  | ||||||
| .chart-btn::after { |  | ||||||
|   /* flex: 1; */ |  | ||||||
|   /* position: relative; */ |  | ||||||
|   content: ""; |  | ||||||
|   position: absolute; |  | ||||||
|     /* width: 16px; */ |  | ||||||
|     /* height: 16px; */ |  | ||||||
|   top: px; |  | ||||||
|   right: -1px; |  | ||||||
|   width: 1px; |  | ||||||
|   height: 23px; |  | ||||||
|   border: 1px solid #010D18; |  | ||||||
| } |  | ||||||
| .chart-btn.active { |  | ||||||
|   background: #1D74D8; |  | ||||||
|   /* border-radius: 4px;; */ |  | ||||||
| } |  | ||||||
| .chart-btn.active::after { |  | ||||||
|   display: none; |  | ||||||
|   /* border-radius: 4px;; */ |  | ||||||
| } |  | ||||||
| /* .copilot-btn::before, |  | ||||||
| .copilot-btn::after { |  | ||||||
|   content: ""; |  | ||||||
|   position: absolute; |  | ||||||
|   width: 16px; |  | ||||||
|   height: 16px; |  | ||||||
|   top: 0; |  | ||||||
|   background: transparent; |  | ||||||
|   border-style: solid; |  | ||||||
|   border-width: 2px; |  | ||||||
|   border-color: transparent; |  | ||||||
|   border-top-color: #007be4; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .copilot-btn::before { |  | ||||||
|   left: 0; |  | ||||||
|   border-left-color: #007be4; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .copilot-btn::after { |  | ||||||
|   right: 0; |  | ||||||
|   border-right-color: #007be4; |  | ||||||
| } */ |  | ||||||
| </style> |  | ||||||
| @@ -1,218 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2024-06-11 09:48:40 |  | ||||||
|  * @LastEditTime: 2024-06-11 10:22:05 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <!-- <div> --> |  | ||||||
|     <!-- <div :id="id" :class="className" :style="{ height: '65%', width:width}" /> --> |  | ||||||
|     <div :id="id" :class="className" style="height: 100%,width: 100%;;" /> |  | ||||||
|   <!-- </div> --> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import * as echarts from 'echarts' |  | ||||||
| import { debounce } from "@/utils/debounce"; |  | ||||||
| export default { |  | ||||||
|   name: 'OverviewBar', |  | ||||||
|   // mixins: [resize], |  | ||||||
|   props: { |  | ||||||
|     id: { |  | ||||||
|       type: String, |  | ||||||
|       default: 'reportChart' |  | ||||||
|     }, |  | ||||||
|     className: { |  | ||||||
|       type: String, |  | ||||||
|       default: 'reportChart' |  | ||||||
|     }, |  | ||||||
|     width: { |  | ||||||
|       type: String, |  | ||||||
|       default: '100%' |  | ||||||
|     }, |  | ||||||
|     beilv: { |  | ||||||
|       type: Number, |  | ||||||
|       default: 1 |  | ||||||
|     }, |  | ||||||
|     height: { |  | ||||||
|       type: String, |  | ||||||
|       default: '100%' |  | ||||||
|     }, |  | ||||||
|     legendPosition: { |  | ||||||
|       type: String, |  | ||||||
|       default: 'center' |  | ||||||
|     }, |  | ||||||
|     showLegend: { |  | ||||||
|       type: Boolean, |  | ||||||
|       default: false |  | ||||||
|     }, |  | ||||||
|     legendData: { |  | ||||||
|       type: Array, |  | ||||||
|       default: () => [] |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       chart: null |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     this.$nextTick(() => { |  | ||||||
|       this.initChart() |  | ||||||
|     }) |  | ||||||
|   }, |  | ||||||
|   beforeDestroy() { |  | ||||||
|     if (!this.chart) { |  | ||||||
|       return |  | ||||||
|     } |  | ||||||
|     this.chart.dispose() |  | ||||||
|     this.chart = null |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     // if (screenfull.isEnabled) { |  | ||||||
|     //   screenfull.on("change", () => { |  | ||||||
|     //     this.isFullscreen = screenfull.isFullscreen; |  | ||||||
|     //   }); |  | ||||||
|     // } |  | ||||||
|     this.canvasReset(); |  | ||||||
|     window.addEventListener("resize", this.canvasReset); |  | ||||||
|   }, |  | ||||||
|   beforeDestroy() { |  | ||||||
|     if (this.chart) { |  | ||||||
|       this.chart.dispose(); |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   destroyed() { |  | ||||||
|     window.removeEventListener("resize", this.canvasReset); |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     canvasReset() { |  | ||||||
|       debounce(() => { |  | ||||||
|         this.initChart(); |  | ||||||
|       }, 500)(); |  | ||||||
|     }, |  | ||||||
|     initChart() { |  | ||||||
|       console.log(1111) |  | ||||||
|       this.chart = echarts.init(document.getElementById(this.id)) |  | ||||||
|       console.log(this.$parent); |  | ||||||
|       this.chart.setOption({ |  | ||||||
|         title: { |  | ||||||
|           text: '', |  | ||||||
|           // subtext: 'Fake Data' |  | ||||||
|         }, |  | ||||||
|         tooltip: { |  | ||||||
|           trigger: 'axis' |  | ||||||
|         }, |  | ||||||
|         grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, |  | ||||||
|         legend: { |  | ||||||
|           data: ['芯片总功率', '标准组件总功率', '转化效率'], |  | ||||||
|           right: '90px', |  | ||||||
|           top: '0%', |  | ||||||
|           icon: 'rect', |  | ||||||
|           itemWidth: 10, |  | ||||||
|           itemHeight: 10, |  | ||||||
|           itemGap: 40, |  | ||||||
|         }, |  | ||||||
|         // toolbox: { |  | ||||||
|         //   show: true, |  | ||||||
|         //   feature: { |  | ||||||
|         //     dataView: { show: true, readOnly: false }, |  | ||||||
|         //     magicType: { show: true, type: ['line', 'bar'] }, |  | ||||||
|         //     restore: { show: true }, |  | ||||||
|         //     saveAsImage: { show: true } |  | ||||||
|         //   } |  | ||||||
|         // }, |  | ||||||
|         calculable: true, |  | ||||||
|         xAxis: [ |  | ||||||
|           { |  | ||||||
|             type: 'category', |  | ||||||
|             // prettier-ignore |  | ||||||
|             data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] |  | ||||||
|           } |  | ||||||
|         ], |  | ||||||
|         yAxis: [ |  | ||||||
|           { |  | ||||||
|             type: 'value' |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             type: 'value', |  | ||||||
|             // name: 'Temperature', |  | ||||||
|             min: 0, |  | ||||||
|             max: 100, |  | ||||||
|             interval: 20, |  | ||||||
|             axisLabel: { |  | ||||||
|               formatter: '{value}%' |  | ||||||
|             } |  | ||||||
|           } |  | ||||||
|         ], |  | ||||||
|         grid: { |  | ||||||
|           top: '20%', |  | ||||||
|           left: "1%", |  | ||||||
|           right: "3%", |  | ||||||
|           bottom: "1%", |  | ||||||
|           containLabel: true |  | ||||||
|         }, |  | ||||||
|         series: [ |  | ||||||
|           { |  | ||||||
|             name: '芯片总功率', |  | ||||||
|             type: 'bar', |  | ||||||
|             itemStyle: { |  | ||||||
|               normal: { |  | ||||||
|                 color: 'rgba(142, 240, 171, 1)', //改变折线点的颜色 |  | ||||||
|                 lineStyle: { |  | ||||||
|                   color: 'rgba(142, 240, 171, 1)' //改变折线颜色 |  | ||||||
|                 } |  | ||||||
|               } |  | ||||||
|             }, |  | ||||||
|             data: [ |  | ||||||
|               2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3 |  | ||||||
|             ], |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: '标准组件总功率', |  | ||||||
|             type: 'bar', |  | ||||||
|             itemStyle: { |  | ||||||
|               normal: { |  | ||||||
|                 color: '#288AFF', //改变折线点的颜色 |  | ||||||
|                 lineStyle: { |  | ||||||
|                   color: '#288AFF' //改变折线颜色 |  | ||||||
|                 } |  | ||||||
|               } |  | ||||||
|             }, |  | ||||||
|             data: [ |  | ||||||
|               2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3 |  | ||||||
|             ], |  | ||||||
|           }, |  | ||||||
|           { |  | ||||||
|             name: '转化效率', |  | ||||||
|             type: 'bar', |  | ||||||
|             type: 'line', |  | ||||||
|             yAxisIndex: 1, |  | ||||||
|             itemStyle: { |  | ||||||
|               normal: { |  | ||||||
|                 color: '#FFCE6A', //改变折线点的颜色 |  | ||||||
|                 lineStyle: { |  | ||||||
|                   color: '#FFCE6A' //改变折线颜色 |  | ||||||
|                 } |  | ||||||
|               } |  | ||||||
|             }, |  | ||||||
|             data: [ |  | ||||||
|               2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 75.6, 82.2, 48.7, 18.8, 6.0, 2.3 |  | ||||||
|             ], |  | ||||||
|           } |  | ||||||
|         ] |  | ||||||
|       }) |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped> |  | ||||||
| /* .reportChart { |  | ||||||
|   position: absolute; |  | ||||||
|   height: 100%; |  | ||||||
|   width: 100%; |  | ||||||
|   top: 10px; |  | ||||||
| } */ |  | ||||||
| </style> |  | ||||||