Merge pull request 'projects/mescc/develop' (#24) from projects/mescc/develop into projects/mescc/main

Reviewed-on: #24

.env.dev

@@ -1,7 +1,7 @@
 ###
  # @Author: zhp
  # @Date: 2024-04-28 13:42:51
- # @LastEditTime: 2024-07-26 10:50:10
+ # @LastEditTime: 2024-05-29 17:06:55
  # @LastEditors: zhp
  # @Description:
 ###
@@ -9,23 +9,12 @@
 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.81:48080'
-# 徐
-# VUE_APP_BASE_API = 'http://192.168.1.56:48080'
-# 郭
-# VUE_APP_BASE_API = 'http://192.168.1.61:48080'
-# sara
-# VUE_APP_BASE_API = 'http://192.168.1.63:8080'
-# 张一丁
-# VUE_APP_BASE_API = 'http://192.168.4.139:48080'
-# 蔡
-# VUE_APP_BASE_API = 'http://192.168.1.54:48080'
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true
 
@@ -33,7 +22,7 @@ VUE_CLI_BABEL_TRANSPILE_MODULES = true
 VUE_APP_TENANT_ENABLE = true
 
 # 验证码的开关
-VUE_APP_CAPTCHA_ENABLE = false
+VUE_APP_CAPTCHA_ENABLE = true
 
 # 文档的开关
 VUE_APP_DOC_ENABLE = true

.env.front

@@ -2,7 +2,7 @@
 ENV = 'development'
 
 # 页面标题
-VUE_APP_TITLE = 发电玻璃智能管控平台
+VUE_APP_TITLE = 芋道管理系统
 
 # 芋道管理系统/本地环境
 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_CAPTCHA_ENABLE = false
+VUE_APP_CAPTCHA_ENABLE = true
 
 # 文档的开关
 VUE_APP_DOC_ENABLE = true

.env.prod

@@ -2,7 +2,7 @@
 NODE_ENV = 'production'
 
 # 页面标题
-VUE_APP_TITLE = 发电玻璃智能管控平台
+VUE_APP_TITLE = 玻璃控股信息平台
 
 # 芋道管理系统/生产环境
 VUE_APP_BASE_API = ''
@@ -16,7 +16,7 @@ PUBLIC_PATH = ''
 VUE_APP_TENANT_ENABLE = true
 
 # 验证码的开关
-VUE_APP_CAPTCHA_ENABLE = false
+VUE_APP_CAPTCHA_ENABLE = true
 
 # 文档的开关
 VUE_APP_DOC_ENABLE = false

.env.stage

@@ -1,7 +1,7 @@
 NODE_ENV = production
 
 # 页面标题
-VUE_APP_TITLE = 发电玻璃智能管控平台
+VUE_APP_TITLE = 芋道管理系统
 
 # 测试环境配置
 ENV = 'staging'
@@ -16,7 +16,7 @@ PUBLIC_PATH = 'http://static.yudao.iocoder.cn/'
 VUE_APP_TENANT_ENABLE = true
 
 # 验证码的开关
-VUE_APP_CAPTCHA_ENABLE = false
+VUE_APP_CAPTCHA_ENABLE = true
 
 # 文档的开关
 VUE_APP_DOC_ENABLE = false

.env.static

@@ -4,7 +4,7 @@ NODE_ENV = development
 ENV = 'staging'
 
 # 页面标题
-VUE_APP_TITLE = 发电玻璃智能管控平台
+VUE_APP_TITLE = 芋道管理系统
 
 # 芋道管理系统/测试环境
 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_CAPTCHA_ENABLE = false
+VUE_APP_CAPTCHA_ENABLE = true
 
 # 文档的开关
 VUE_APP_DOC_ENABLE = true

package.json

@@ -51,14 +51,10 @@
     "crypto-js": "^4.0.0",
     "echarts": "5.4.0",
     "element-ui": "2.15.12",
-    "exceljs": "^4.4.0",
-    "file-saver": "^2.0.5",
     "fuse.js": "6.6.2",
     "highlight.js": "^11.9.0",
-    "html2canvas": "^1.4.1",
     "js-beautify": "^1.15.1",
     "jsencrypt": "3.3.1",
-    "jspdf": "^2.5.1",
     "lodash": "^4.17.21",
     "mockjs": "^1.1.0",
     "moment": "^2.30.1",
@@ -73,8 +69,7 @@
     "vue-quill-editor": "^3.0.6",
     "vue-router": "3.4.9",
     "vuedraggable": "2.24.3",
-    "vuex": "3.6.2",
+    "vuex": "3.6.2"
-    "xlsx": "^0.18.5"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "4.5.18",

src/api/cost/index.js

@@ -1,24 +1,32 @@
 /*
  * @Author: zhp
  * @Date: 2024-04-26 14:53:45
- * @LastEditTime: 2024-07-26 09:32:26
+ * @LastEditTime: 2024-05-06 14:55:33
  * @LastEditors: zhp
  * @Description:
  */
 import request from '@/utils/request'
-export function getCostMainPage(data) {
+
+// 查询部门列表
+export function getOrderList(data) {
   return request({
-    url: 'ip/cost-main/page',
+    url: 'ip/prod-order/prodOrderList',
+    method: 'post',
+    data: data
+  })
+}
+export function getCostPage(data) {
+  return request({
+    url: 'ip/cost/costPage',
     method: 'post',
     data: data
   })
 }
 
-export function exportExcel(data) {
+export function getCostList(data) {
   return request({
-    url: 'ip/cost-main/export-excel',
+    url: 'ip/cost/costList',
     method: 'post',
-    data: data,
+    data: data
-    responseType: 'blob'
   })
 }

src/api/produceData/index.js

@@ -1,57 +1,38 @@
 /*
  * @Author: zhp
  * @Date: 2024-05-07 08:54:59
- * @LastEditTime: 2024-06-19 15:22:10
+ * @LastEditTime: 2024-05-22 16:31:08
  * @LastEditors: DY
  * @Description:
  */
 import request from '@/utils/request'
 
-// 查询生产数据管理分页
+// 查询部门列表
 export function getProduceDataPage(data) {
   return request({
-    url: '/ip/proddata/page',
+    url: 'ip/prod-output/prodOutputDataPage',
     method: 'post',
     data: data
   })
 }
 
-// 查询图数据
+export function getProduceDataDetail(id){
-export function getproddata(data) {
   return request({
-    url: '/ip/proddata/list',
+     url: '/ip/prod-output/get?id=' + id,
-    method: 'post',
+    method: 'get'
-    data: data
-  })
-}
-
-export function getProduceDataDetail(data){
-  return request({
-    url: '/ip/proddata/get',
-    method: 'post',
-    data: data
   })
 }
 
 // 导出生产数据
 export function exportOutPutExcel(data) {
   return request({
-    url: '/ip/proddata/export-excel',
+    url: '/ip/prod-output/output-export-excel',
     method: 'post',
     data: data,
     responseType: 'blob'
   })
 }
 
-// 获取生产数据管理列表
-export function prodOutputDataList(data) {
-  return request({
-    url: '/ip/prod-output/prodOutputDataList',
-    method: 'post',
-    data: data
-  })
-}
-
 // 获取生产管理生产目标管理碲化镉工厂分页
 export function prodTargetDiPage(data) {
   return request({
@@ -129,7 +110,7 @@ export function importToTarget(data) {
   return request({
     url: '/ip/prod-target/to-target-import-excel',
     method: 'post',
-    data: data
+    data
   })
 }
 
@@ -138,7 +119,7 @@ export function importDiTarget(data) {
   return request({
     url: '/ip/prod-target/di-target-import-excel',
     method: 'post',
-    data: data
+    data
   })
 }
 
@@ -157,12 +138,3 @@ export function cockpitDataMonitor(data) {
     data: data
   })
 }
-
-export function exportFactoryDataExcel(data) {
-  return request({
-    url: '/ip/prod-output-month/export/excel',
-    method: 'post',
-    data: data,
-    responseType: 'blob'
-  })
-}

src/api/produceData/order.js

@@ -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'
-  })
-}

src/api/report/benchmarking.js

@@ -1,219 +0,0 @@
-// 对标报表的接口
-import request from '@/utils/request'
-
-// 产量对标FTO
-export function fTOReportByDateRangePage(data) {
-  return request({
-    url: '/ip/prod-output/queryOBFTOReportByDateRange',
-    method: 'post',
-    data: data
-  })
-}
-// 产量对标FTO导出
-export function fTOReportByDateRangeExport(data) {
-  return request({
-    url: '/ip/prod-output/queryOBFTOReportByDateRangeExcel',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 芯片产量对标
-export function cPReportByDateRangePage(data) {
-  return request({
-    url: '/ip/prod-output/queryCPReportByDateRange',
-    method: 'post',
-    data: data
-  })
-}
-// 芯片产量对标导出
-export function cPReportByDateRangeExport(data) {
-  return request({
-    url: '/ip/prod-output/queryCPReportByDateRangeExport',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 标准组件产量对标
-export function sCPReportByDateRangePage(data) {
-  return request({
-    url: '/ip/prod-output/querySCPReportByDateRange',
-    method: 'post',
-    data: data
-  })
-}
-// 标准组件产量对标导出
-export function sCPReportByDateRangeExport(data) {
-  return request({
-    url: '/ip/prod-output/querySCPReportByDateRangeExport',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 转化效率对标
-export function componentconvertrateCPage(data) {
-  return request({
-    url: '/ip/componentconvertrate-compare/page',
-    method: 'post',
-    data: data
-  })
-}
-// 转化效率对标导出
-export function componentconvertrateCExport(data) {
-  return request({
-    url: '/ip/componentconvertrate-compare/export-excel',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 芯片良率对标
-export function chipyieldRatePage(data) {
-  return request({
-    url: '/ip/chipyield-rate/page',
-    method: 'post',
-    data: data
-  })
-}
-// 芯片良率对标导出
-export function chipyieldRateExport(data) {
-  return request({
-    url: '/ip/chipyield-rate/export-excel',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 标准组件良率对标
-export function componentyieldRatePage(data) {
-  return request({
-    url: '/ip/componentyield-rate/page',
-    method: 'post',
-    data: data
-  })
-}
-// 标准组件良率对标导出
-export function componentyieldRateExport(data) {
-  return request({
-    url: '/ip/componentyield-rate/export-excel',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-
-// 稼动率对标
-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
-  })
-}
-
-// 封装OEE对标
-export function componentOEEPage(data) {
-  return request({
-    url: '/ip/component-oee/page',
-    method: 'post',
-    data: data
-  })
-}
-// 封装OEE对标导出
-export function componentOEEExport(data) {
-  return request({
-    url: '/ip/component-oee/export',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 芯片人均产量
-export function chipAnnualAverageProductionPage(data) {
-  return request({
-    url: '/ip/chip-annual-average-production/page',
-    method: 'post',
-    data: data
-  })
-}
-// 芯片人均产量导出
-export function chipAnnualAverageProductionExport(data) {
-  return request({
-    url: '/ip/chip-annual-average-production/export',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 标准组件人均产量对标
-export function componentAapPage(data) {
-  return request({
-    url: '/ip/prod-output/componentAap',
-    method: 'post',
-    data: data
-  })
-}
-// 标准组件人均产量对标导出
-export function componentAapExport(data) {
-  return request({
-    url: '/ip/prod-output/componentAap-export',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}
-
-// 指标完成情况对标
-export function targetCompletionPage(data) {
-  return request({
-    url: '/ip/prod-output/TargetCompletion',
-    method: 'post',
-    data: data
-  })
-}
-// 指标完成情况对标导出
-export function targetCompletionExport(data) {
-  return request({
-    url: '/ip/prod-output/TargetCompletion-export',
-    method: 'post',
-    responseType: 'blob',
-    data: data
-  })
-}

src/api/report/index.js

@@ -1,95 +0,0 @@
-/*
- * @Author: zhp
- * @Date: 2024-06-17 09:41:03
- * @LastEditTime: 2024-06-20 15:39:21
- * @LastEditors: zhp
- * @Description:
- */
-import request from '@/utils/request'
-export function getComprehensiveDataPage(data) {
-  return request({
-    url: 'ip/comprehensive/data/get/comprehensive/data',
-    method: 'post',
-    data: data
-  })
-}
-
-export function exportComprehensiveDataPage(data) {
-   return request({
-    url: 'ip/comprehensive/data/export/comprehensive/data',
-    method: 'post',
-    data: data,
-    responseType: 'blob',
-  })
-}
-
-
-export function getProduceTransData(data) {
-   return request({
-    url: 'ip/prod-output/queryYCEReportByDateRange',
-    method: 'post',
-    data: data
-  })
-}
-
-export function exportProduceTransData(data) {
-   return request({
-    url: 'ip/prod-output/queryYCEReportByDateRangeExcel',
-    method: 'post',
-    data: data,
-    responseType: 'blob',
-  })
-}
-
-
-export function getProduceSituationData(data) {
-   return request({
-    url: 'ip/production/situation/get/production/situation',
-    method: 'post',
-    data: data
-  })
-}
-
-export function exportProduceSituationData(data) {
-   return request({
-    url: 'ip/production/situation/export/production/situation',
-    method: 'post',
-     data: data,
-      responseType: 'blob',
-  })
-}
-
-export function getProductionSituationMWData(data) {
-   return request({
-    url: 'ip/production/situation/power/get/production/situation',
-    method: 'post',
-    data: data
-  })
-}
-
-export function exportProductionSituationMWData(data) {
-   return request({
-    url: 'ip/production/situation/power/export/production/situation',
-    method: 'post',
-     data: data,
-      responseType: 'blob',
-  })
-}
-
-
-export function getProductionYieldSituationMWData(data) {
-   return request({
-    url: 'ip/product/yield/get/production/situation',
-    method: 'post',
-    data: data
-  })
-}
-
-export function exportProductionYieldSituationMWData(data) {
-   return request({
-    url: 'ip/product/yield/export/production/situation',
-    method: 'post',
-    data: data,
-    responseType: 'blob',
-  })
-}

src/api/wareHouse/index.js

@@ -1,24 +1,15 @@
 /*
  * @Author: zhp
  * @Date: 2024-04-28 09:28:12
- * @LastEditTime: 2024-07-25 15:05:43
+ * @LastEditTime: 2024-04-28 15:52:36
  * @LastEditors: zhp
  * @Description:
  */
 import request from '@/utils/request'
-export function getStockRealTimePage(data) {
+export function getStockPage(data) {
   return request({
-    url: 'ip/stock-realtime/page',
+    url: 'ip/stock/page',
     method: 'post',
     data: data
   })
 }
-
-export function exportExcel(data) {
-  return request({
-    url: '/ip/stock-realtime/export-excel',
-    method: 'get',
-    data: data,
-    responseType: 'blob'
-  })
-}

src/assets/icons/svg/darkHome.svg

@@ -1,14 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>编组</title>
-    <g id="01数字驾驶舱" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="产量驾驶舱" transform="translate(-1438.000000, -12.000000)" fill="#FFFFFF" fill-rule="nonzero">
-            <g id="编组-20" transform="translate(1438.000000, 8.000000)">
-                <g id="编组" transform="translate(0.000000, 4.000000)">
-                    <rect id="矩形" opacity="0" x="0" y="0" width="24" height="24"></rect>
-                    <path d="M11.1710783,2.42919989 C11.7298936,2.09409047 12.4328291,2.12455473 12.9654367,2.52059014 L20.3218013,7.99000647 L20.4665209,8.10559268 C21.0744501,8.62656431 21.4302636,9.40344805 21.4302636,10.227099 L21.4302636,19.0470569 L21.4250327,19.2212289 C21.3382831,20.6611171 20.1833875,21.8011882 18.7715031,21.8011882 L5.2284969,21.8011882 L5.06035624,21.7957697 C3.67032883,21.7059084 2.56973638,20.5095861 2.56973638,19.0470569 L2.56973638,10.2273587 L2.57600507,10.0381789 C2.63012926,9.22282649 3.03207443,8.47038558 3.67819781,7.99000711 L11.034559,2.52059336 Z M12.0713092,3.55793652 C11.9772762,3.53774358 11.8769764,3.55793433 11.7954857,3.6185066 L4.43911542,9.0879271 L4.32641124,9.18150853 C4.04059293,9.44596068 3.87451485,9.82573182 3.87451485,10.2273587 L3.87451485,19.0470569 L3.880713,19.1821318 C3.94632222,19.8933667 4.52470053,20.4496068 5.2284969,20.4496068 L11.2507497,20.4487759 L11.3507364,20.3451977 L11.3512202,14.4627186 L11.3582338,14.3683764 C11.4044406,14.0603828 11.6734228,13.8227675 12,13.8227675 C12.3345637,13.8227675 12.6123182,14.0734451 12.6454705,14.3976012 L12.6489183,14.4681588 L12.6487364,20.3451881 L12.7487231,20.4487759 L18.7714898,20.4496068 L18.9018895,20.4431864 C19.5885066,20.3752237 20.1254851,19.7760987 20.1254851,19.0470569 L20.1254851,10.2273587 L20.1177907,10.0779557 C20.0769951,9.68325297 19.8759128,9.32208831 19.5608746,9.08791971 L12.2045243,3.61851399 L12.1402672,3.58065321 Z" id="形状结合" stroke="#FFFFFF" stroke-width="0.1"></path>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>

src/assets/icons/svg/factoryWorkOrder.svg

@@ -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>

src/assets/icons/svg/workProcess.svg

@@ -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>

src/assets/styles/index.scss

@@ -232,8 +232,6 @@ aside {
   background-color: #d9d9d9;
 }
 
-// 大屏滚动表格
-
 .no-data-bg {
   position: absolute;
   display: inline-block;
@@ -254,13 +252,3 @@ aside {
     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;
-}

src/components/Breadcrumb/index.vue

@@ -1,13 +1,11 @@
 <template>
   <el-breadcrumb class="app-breadcrumb" separator="/">
     <transition-group name="breadcrumb">
-      <el-breadcrumb-item v-for=" (item, index) in levelList" :key="item.path">
+      <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
-        <span :style="{ color: (changeColor == true ? 'rgba(255, 255, 255, 0.45)' :' rgba(0, 0, 0, .65)')}"
+        <span v-if="item.redirect === 'noRedirect' || index === levelList.length - 1" class="no-redirect">{{
-          v-if="item.redirect === 'noRedirect' || index === levelList.length - 1" class="no-redirect">{{
+        item.meta.title
-          item.meta.title
+      }}</span>
-          }}</span>
+        <a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
-        <a :style="{ color: (changeColor == true ? 'rgba(255, 255, 255, 0.45)' :' rgba(0, 0, 0, .45)')}" v-else
-          @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
       </el-breadcrumb-item>
     </transition-group>
   </el-breadcrumb>
@@ -20,29 +18,7 @@ export default {
       levelList: null
     }
   },
-  computed: {
-    changeColor() {
-      // console.log(this.$route);
-      if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') {
-        return true
-      } else {
-        return false
-      }
-    }
-  },
   watch: {
-    changeColor(val) {
-      if (val == true) {
-        let item = document.getElementsByClassName('el-breadcrumb__separator')
-        // let item  =document.getElementsByClassName('')
-        item[0].style.color = rgba(255, 255, 255, 0.45)
-        item[1].style.color = rgba(255, 255, 255, 0.45)
-      } else {
-        let item = document.getElementsByClassName('el-breadcrumb__separator')
-        item[0].style.color = ''
-          item[1].style.color = ''
-      }
-    },
     $route(route) {
       // if you go to the redirect page, do not update the breadcrumbs
       if (route.path.startsWith('/redirect/')) {
@@ -94,20 +70,13 @@ export default {
   margin-left: 8px;
 
   .no-redirect {
-    color: rgba(0, 0, 0, .45);
+    color: rgba(0, 0, 0, 0.65);
     cursor: text;
   }
 }
+
 .app-breadcrumb .el-breadcrumb__inner a,
 .el-breadcrumb__inner.is-link {
-  color:rgba(0, 0, 0, 0.65)
+  color: rgba(0, 0, 0, 0.45);
 }
 </style>
-<!-- <style lang="scss">
-.changeColor {
-  --theme-color: rgba(255, 255, 255, 0.45);
-}
-.el-breadcrumb__separator {
-  color:var(--theme-color);
-}
-</style> -->

src/components/Hamburger/index.vue

@@ -1,16 +1,14 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-03 15:38:31
- * @LastEditTime: 2024-07-22 16:15:21
- * @LastEditors: zhp
- * @Description:
--->
 <template>
   <div style="padding: 0 15px;" @click="toggleClick">
-    <svg :class="{'is-active':isActive}" class="hamburger" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"
+    <svg
-      width="64" height="64" :fill="changeColor === true ? 'rgba(255, 255, 255,.65)' : '' ">
+      :class="{'is-active':isActive}"
-      <path
+      class="hamburger"
-        d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
+      viewBox="0 0 1024 1024"
+      xmlns="http://www.w3.org/2000/svg"
+      width="64"
+      height="64"
+    >
+      <path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
     </svg>
   </div>
 </template>
@@ -24,15 +22,6 @@ export default {
       default: false
     }
   },
-  computed: {
-    changeColor() {
-      if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') {
-        return true
-      } else {
-        return false
-      }
-    },
-  },
   methods: {
     toggleClick() {
       this.$emit('toggleClick')

src/layout/components/Navbar.vue

@@ -1,7 +1,6 @@
 <template>
-  <div ref="navbar" class="navbar"
+  <div class="navbar">
-    :style="changeColor ? 'background: rgba(0, 21, 41, 1);boxShadow:0px 1px 8px 0px rgba(0,131,255,0.35);' : ''">
+    <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
-    <hamburger style="margin-left: 20px;" id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
       @toggleClick="toggleSideBar" />
 
     <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" />
@@ -42,13 +41,6 @@ export default {
       'nickname',
       'device'
     ]),
-    changeColor() {
-      if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') {
-        return true
-      } else {
-        return false
-      }
-    },
     setting: {
       get() {
         return this.$store.state.settings.showSettings
@@ -66,23 +58,6 @@ export default {
       }
     }
   },
-  watch: {
-    // changeColor: {
-    //   handler(val){
-    //     if (val == true) {
-    //       let svg = document.getElementsByClassName('hamburger')
-    //       console.log('svg', svg)
-    //       svg[0].style.color = 'rgba(255, 255, 255, 1)'
-    //       svg[0].setAttribute('fill', 'rgba(255, 255, 255, 1)')
-    //     } else {
-    //       let svg = document.getElementsByClassName('hamburger')
-    //       console.log('svg', svg);
-    //       svg[0].setAttribute('fill', '')
-    //     }
-    //   },
-    //   immediate: true, //立即执行
-    // }
-  },
   methods: {
     toggleSideBar() {
       this.$store.dispatch('app/toggleSideBar')

src/layout/components/NavbarRight.vue

@@ -1,31 +1,25 @@
 <template>
   <div class="right-msg" :style="blackTitle ? 'color: #000' : 'color: #fff'">
     <div class="home-icon" v-if='blackTitle'>
-      <svg-icon :icon-class="changeColor === true ? 'darkHome' : 'home'"
+      <svg-icon icon-class="home" style="font-size: 24px; cursor: pointer;" @click="toHome" />
-        style="font-size: 24px; cursor: pointer;color: aqua;" @click="toHome" />
     </div>
     <div class="time-msg">
-      <div class="line1" :style="changeColor === true ? 'color:rgba(255, 255, 255, 1)' : ''">{{ timeZone
+      <div class="line1">{{ timeZone }}&nbsp;&nbsp;&nbsp;&nbsp;{{ topTime }}</div>
-        }}&nbsp;&nbsp;&nbsp;&nbsp;{{ topTime }}</div>
+      <div class="line2">{{ topDate }}</div>
-      <div :style="changeColor === true ? 'color:rgba(255, 255, 255, .65)' : ''" class="line2">{{ topDate }}</div>
     </div>
     <div class="base-msg">
       <div class="avatar">
         <el-dropdown>
           <img :src="require(`../../assets/images/choicepart/avatar.png`)" alt="" width="32" height="32" />
           <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item>
+            <el-dropdown-item><svg-icon icon-class="helpbtn" />帮助文档</el-dropdown-item>
-              <svg-icon icon-class="helpbtn" />帮助文档
+            <el-dropdown-item @click.native="logout"><svg-icon icon-class="exitbtn" />退出登录</el-dropdown-item>
-            </el-dropdown-item>
-            <el-dropdown-item @click.native="logout">
-              <svg-icon icon-class="exitbtn" />退出登录
-            </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
       <div class="use-msg">
-        <div :style="changeColor === true ? 'color:rgba(255, 255, 255, 1)' : ''" class="line1">{{ nickname }}</div>
+        <div class="line1">{{ nickname }}</div>
-        <div :style="changeColor === true ? 'color:rgba(255, 255, 255, .65)' : ''" class="line2">{{ dept }}</div>
+        <div class="line2">{{ dept }}</div>
       </div>
     </div>
   </div>
@@ -54,15 +48,6 @@ export default {
       }
     }
   },
-  computed: {
-    changeColor() {
-      if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') {
-        return true
-      } else {
-        return false
-      }
-    },
-  },
   created() {
     // this.getUserMsg()
     this.getTime()
@@ -139,4 +124,4 @@ export default {
     opacity: 0.65;
   }
 }
-</style>
+</style>

src/layout/components/Sidebar/Logo.vue

@@ -49,7 +49,7 @@
 </template>
 
 <script>
-import logoImg from "@/assets/logo/cnbm.png";
+import logoImg from "@/assets/logo/logo.png";
 import variables from "@/assets/styles/variables.scss";
 
 export default {
@@ -70,7 +70,7 @@ export default {
   },
   data() {
     return {
-      title: "发电玻璃智能管控平台",
+      title: "玻璃控股信息平台",
       logo: logoImg,
     };
   },
@@ -104,7 +104,7 @@ export default {
       width: 32px;
       height: 32px;
       vertical-align: middle;
-      margin-right: 10px;
+      margin-right: 12px;
     }
 
     & .sidebar-title {
@@ -113,7 +113,7 @@ export default {
       color: #fff;
       font-weight: 600;
       line-height: 50px;
-      font-size: 19px;
+      font-size: 14px;
       font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
       vertical-align: middle;
     }

src/layout/components/TagsView/ScrollPane.vue

@@ -1,10 +1,3 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-03 15:38:31
- * @LastEditTime: 2024-07-04 10:44:35
- * @LastEditors: zhp
- * @Description:
--->
 <template>
   <el-scrollbar ref="scrollContainer" :vertical="false" class="scroll-container" @wheel.native.prevent="handleScroll">
     <slot />
@@ -24,9 +17,7 @@ export default {
   computed: {
     scrollWrapper() {
       return this.$refs.scrollContainer.$refs.wrap
-    },
+    }
-  },
-  watch: {
   },
   mounted() {
     this.scrollWrapper.addEventListener('scroll', this.emitScroll, true)

src/layout/components/TagsView/index.vue

@@ -1,7 +1,5 @@
 <template>
-  <div ref="tagsViewContainer"
+  <div id="tags-view-container" class="tags-view-container">
-    :style="changeColor === true ? 'background:rgba(0, 21, 41, 1);borderTop:0px solid #d8dce5' : ''" id="tags-view-container"
-    class="tags-view-container">
     <scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll">
       <router-link v-for="tag in visitedViews" ref="tag" :key="tag.path" :class="isActive(tag) ? 'active' : ''"
         :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }" tag="span" class="tags-view-item"
@@ -38,13 +36,6 @@ export default {
     }
   },
   computed: {
-    changeColor() {
-      if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') {
-        return true
-      } else {
-        return false
-      }
-    },
     visitedViews() {
       return this.$store.state.tagsView.visitedViews
     },
@@ -53,31 +44,9 @@ export default {
     },
     theme() {
       return this.$store.state.settings.theme;
-    },
+    }
   },
   watch: {
-    changeColor(val) {
-      if (val == true) {
-        // console.log('this.$refs.tagsViewContainer', this.$refs.tagsViewContainer);
-        // this.$refs.tagsViewContainer.style.backgroundColor = 'rgba(0, 21, 41, 1)'
-        // this.$refs.tagsViewContainer.style.borderTop = '0px solid #d8dce5'
-        var tag = document.getElementsByClassName("tags-view-item")
-        console.log('tag', tag)
-        for (let i in tag) {
-          tag[i].classList.add("changeColor")
-          // tag[i].classList.remove("default")
-        }
-        // console.log('this.$refs.scrollContainer', this.$refs.tag);
-      } else {
-        // this.$refs.tagsViewContainer.style.backgroundColor = ''
-        // this.$refs.tagsViewContainer.style.borderTop = '1px solid #d8dce5'
-        var tag = document.getElementsByClassName("tags-view-item")
-        for (let i in tag) {
-          tag[i].classList.remove("changeColor")
-          // tag[i].classList.add("default")
-        }
-      }
-    },
     $route() {
       this.addTags()
       this.moveToCurrentTag()
@@ -91,7 +60,6 @@ export default {
     }
   },
   mounted() {
-    console.log(this.$route, this.changeColor);
     this.initTags()
     this.addTags()
   },
@@ -100,23 +68,11 @@ export default {
       return route.path === this.$route.path
     },
     activeStyle(tag) {
-      if (this.changeColor) {
+      if (!this.isActive(tag)) return {};
-        if (!this.isActive(tag)) return {
+      return {
-          "background-color": 'rgba(0, 59, 115, 1)',
+        "background-color": this.theme,
-          "border-color": 'rgba(0, 59, 115, 1)',
+        "border-color": this.theme
-          "color": 'rgba(255, 255, 255, 1)'
+      };
-        };
-        return {
-          "background-color": this.theme,
-          "border-color": this.theme
-        };
-      } else {
-        if (!this.isActive(tag)) return {};
-        return {
-          "background-color": this.theme,
-          "border-color": this.theme
-        };
-      }
     },
     isAffix(tag) {
       return tag.meta && tag.meta.affix
@@ -274,14 +230,6 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-// :root{
-//   --theme-color: rgba(0, 0, 0, 0.45);
-//   --theme-background: #f4f4f4ff;
-// }
-.changeColor{
-  --theme-background: rgba(0, 59, 115, 1);
-  --theme-color: rgba(255, 255, 255, 1);
-}
 .tags-view-container {
   height: 42px;
   width: 100%;
@@ -297,8 +245,8 @@ export default {
       cursor: pointer;
       height: 28px;
       line-height: 28px;
-      color: var(--theme-color,rgba(0, 0, 0, 0.45));
+      color: rgba(0, 0, 0, 0.45);
-      background:var(--theme-background,#f4f4f4ff);
+      background: #F4F4F4FF;
       padding: 0 8px 0 12px;
       font-size: 14px;
       letter-spacing: 1px;
@@ -383,7 +331,7 @@ export default {
       .el-icon-close {
         &:hover {
           background-color: #fff;
-          color: rgba(62, 142, 247, 1);
+          color: #409eff;
         }
       }
     }

src/layout/index.vue

@@ -2,8 +2,7 @@
   <div :class="classObj" class="app-wrapper" :style="{ '--current-color': theme }">
     <div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
     <sidebar v-if="!sidebar.hide" class="sidebar-container" />
-    <div :style="changeColor ? 'background: rgba(0, 21, 41, 1)' : ''" ref="mainContainer"
+    <div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
-      :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
       <div :class="{ 'fixed-header': fixedHeader }">
         <navbar />
         <tags-view v-if="needTagsView" />
@@ -40,13 +39,6 @@ export default {
       needTagsView: state => state.settings.tagsView,
       fixedHeader: state => state.settings.fixedHeader
     }),
-    changeColor() {
-      if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') {
-        return true
-      } else {
-        return false
-      }
-    },
     classObj() {
       return {
         hideSidebar: !this.sidebar.opened,
@@ -59,16 +51,6 @@ export default {
       return variables;
     }
   },
-  watch: {
-    // changeColor(val) {
-    //   if (val == true) {
-    //     // console.log('this.$refs.mainContainer', this.$refs.mainContainer);
-    //     this.$refs.mainContainer.style.backgroundColor = 'rgba(0, 21, 41, 1)'
-    //   } else {
-    //     this.$refs.mainContainer.style.backgroundColor = ''
-    //   }
-    // },
-  },
   methods: {
     handleClickOutside() {
       this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })

src/main.js

@@ -1,12 +1,12 @@
 /*
  * @Author: zhp
  * @Date: 2024-04-12 11:13:06
- * @LastEditTime: 2024-07-26 09:31:09
+ * @LastEditTime: 2024-04-12 16:20:31
  * @LastEditors: zhp
  * @Description:
  */
 import Vue from 'vue'
-import Element, { DatePicker } from 'element-ui'
+import Element from 'element-ui'
 
 // 修改如下样式文件，覆盖样式，或者新增样式文件
 import "./assets/styles/element-variables.scss";
@@ -44,7 +44,7 @@ import {
 } from "@/utils/dict";
 import CodeBrickZj from 'code-brick-zj';
 import "./theme/index.css"; // 自定义主题包 - code-brick-zj
-// Vue.component(Select.name, Select)
+
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts;
 Vue.prototype.parseTime = parseTime;
@@ -68,8 +68,7 @@ Vue.component("RightToolbar", RightToolbar);
 import DictTag from "@/components/DictTag";
 // 头部标签插件
 import VueMeta from "vue-meta";
-// import locale from './views/cost/zh';  // 请根据实际路径修改
+
-// Vue.use(ElementUI, { locale });
 Vue.use(directive)
 Vue.use(plugins)
 Vue.use(VueMeta)

src/mixins/chart.js

@@ -8,10 +8,10 @@ function __resizeHandler(entries) {
           ? entry.contentBoxSize[0]
           : entry.contentBoxSize;
         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,
           height: contentBoxSize.blockSize,
         });
     } else {

src/router/index.js

@@ -127,8 +127,7 @@ Router.prototype.push = function push(location) {
 
 export default new Router({
   base: process.env.VUE_APP_APP_NAME ? process.env.VUE_APP_APP_NAME : "/",
-  // mode: "history", // 去掉url中的#
+  mode: "history", // 去掉url中的#
-  mode: "hash",
   scrollBehavior: () => ({ y: 0 }),
   routes: constantRoutes,
 });

src/store/modules/home.js

@@ -92,12 +92,10 @@ const actions = {
   /** 初始化首页数据 */
   async initHome({ commit }) {
     const dataArr = await getHomeInfo();
-    // console.log('dataArr', dataArr);
+    console.log('dataArr',dataArr);
-      let preData = dataArr.previousProdOutputOutDO
-      let preFtoData = dataArr.previousProdOutputFtoDO
     // 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);
   },
   /** 初始化驾驶舱数据 */
@@ -127,7 +125,6 @@ const actions = {
     //   const payload = handler(factoryData)
     //   commit("SET_COPILOT_INFO", { type, payload });
     // } else {
-      // console.log('factoryList',factoryList)
       let factoryData = factoryList.prodOutputOutDO ? factoryList.prodOutputOutDO : factoryList.prodOutputRateDO
       let preData = factoryList.previousProdOutputOutDO ? factoryList.previousProdOutputOutDO : factoryList.previousProdOutputRateDO
       let preFtoData = factoryList.previousProdOutputFtoDO ? factoryList.previousProdOutputFtoDO : []
@@ -289,7 +286,7 @@ function splitCurrentAndPreviousB(factoryListResponse) {
 }
 
 function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodOutputFtoListRes,preData,preFtoData) {
-  // console.log('工厂',preData);
+  console.log('工厂',targetListResponse);
 
   // 初始数据
   const { chipOeeRate, transformRate, chipRate, stdRate } = initA();
@@ -343,24 +340,17 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO
   //     componentYieldRate: 0.73,
   //   },
   // ];
-  if (preData) {
+  if (preData && preData[0] != null) {
     for (const factory of preData) {
-      const fId = getPreFactoryId(factory)
+      const fId = getPreFactoryId(factory);
-      // console.log('factory',factory.previousYearOee);
+         chipInvest.previous[fId] = factory.previousYearInputNumber;
-        //  chipInvest.previous[fId] = factory.previousYearInputNumber;
       // chipOeeRate.current[fId] = factory.oee;
-      if (factory.previousGlassType === 0) {
+      chipOeeRate.previous[fId] = factory.previousYearOee;
-         chipOeeRate.previous[fId] = factory.previousYearOee;
-      }
-      // chipOeeRate.previous[fId] = factory.previousYearOee;
       // 转化效率
-        if (factory.previousGlassType === 1) {
+      transformRate.previous[fId] =factory.previousYearComponentConversionEfficiency ;
-        transformRate.previous[fId] = factory.previousYearComponentConversionEfficiency;
-      }
-      // transformRate.previous[fId] =factory.previousYearComponentConversionEfficiency ;
       // 芯片良率 与 标准组件良率
-      if (![0, 1].includes(factory.previousGlassType)) continue;
+      if (![0, 1].includes(factory.glassType)) continue;
-      const _t = [chipRate, stdRate][factory.previousGlassType]
+      const _t = [chipRate, stdRate][factory.glassType]
       // _t.current[fId] = factory.yieldRate ;
       _t.previous[fId] = factory.previousYearYieldRate ;
       // }
@@ -385,14 +375,10 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO
         transformRate.target[fId] = componentConversionEfficiency
       }
       // 芯片OEE
-      if (factory.glassType === 0) {
+      chipOeeRate.current[fId] = factory.oee;
-         chipOeeRate.current[fId] = factory.oee;
-      }
       // chipOeeRate.previous[fId] = factory.previousYearOee;
       // 转化效率
-      if (factory.glassType === 1) {
+      transformRate.current[fId] = factory.componentConversionEfficiency;
-        transformRate.current[fId] = factory.componentConversionEfficiency;
-      }
       // transformRate.previous[fId] = factory.previousYearComponentConversionEfficiency ;
       // 芯片良率 与 标准组件良率
       if (![0, 1].includes(factory.glassType)) continue;
@@ -400,7 +386,6 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO
       _t.current[fId] = factory.yieldRate ;
       // _t.previous[fId] = factory.previousYearYieldRate ;
     }
-    // console.log('chipOeeRate',stdRate);
     // console.log('chipOeeRate',chipOeeRate);
     return {
       chipOeeRate,
@@ -412,12 +397,12 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO
 }
 
 function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOutputFtoListRes,preData,preFtoData) {
-  // console.log('prodOutputFtoListRes',preFtoData);
+  console.log('prodOutputFtoListRes',preData);
   // 初始数据
   const { chipInvest, ftoInvest, chipOutput, stdOutput, bipvOutput } = init()
-   if (prodOutputFtoListRes.length !== 0 ) {
+   if (prodOutputFtoListRes) {
     for (const factory of prodOutputFtoListRes) {
-      // console.log(factory);
+      console.log(factory);
       const fId = getFactoryId(factory);
       // const preFId = getPreFactoryId(factory);
       // if (fId) {
@@ -430,7 +415,7 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
    }
    if (preFtoData) {
     for (const factory of preFtoData) {
-      // console.log(factory);
+      console.log(factory);
       const fId = getPreFactoryId(factory);
       // const preFId = getPreFactoryId(factory);
       // if (fId) {
@@ -441,13 +426,10 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
       // }
     }
    }
-    if (preData) {
+    if (preData && preData[0] != null) {
     for (const factory of preData) {
       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;
       const _t = [chipOutput, stdOutput, bipvOutput][factory.previousGlassType];
       // if (fId) {
@@ -460,14 +442,11 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
     }
   }
     // console.log('ftoInvest',ftoInvest)
-  if (factoryListResponse) {
+  if (factoryListResponse && factoryListResponse[0] != null) {
     for (const factory of factoryListResponse) {
       const fId = getFactoryId(factory);
-      // console.log('factory.inputNumber', factory, fId);
-      if (factory.glassType === 0) {
-      chipInvest.current[fId] = factory.inputNumber
-      }
       // const preFId = getPreFactoryId(factory);
+
       // 获取目标值
       if (targetListResponse) {
         const { chipYield, componentYield, bipvProductOutput } =
@@ -477,6 +456,7 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
         bipvOutput.target[fId] = bipvProductOutput;
       }
       // 芯片投入
+          chipInvest.current[fId] = factory.inputNumber;
 
       // 产出数据, 0 - （玻璃）芯片产出， 1 - 标准组件产出， 2 - BIPV产出
       // 因为后端写的垃圾数据，所以这里要做一下判断
@@ -484,7 +464,6 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
       const _t = [chipOutput, stdOutput, bipvOutput][factory.glassType];
         _t.current[fId] = factory.outputNumber;
     }
-    // console.log('chipInvest',ftoInvest);
     return {
       chipInvest,
       // ftoInvest,
@@ -493,6 +472,15 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
       stdOutput,
       bipvOutput,
     };
+  }else{
+      return {
+      chipInvest,
+      // ftoInvest,
+      ftoInvest,
+      chipOutput,
+      stdOutput,
+      bipvOutput,
+    }
   }
 }
 
@@ -551,15 +539,15 @@ function getFactoryTargetValueA(targetList, factoryId) {
  */
 function initA() {
   const t_ = {
-    current: Array(2).fill(0),
+    current: Array(7).fill(0),
-    previous: Array(2).fill(0),
+    previous: Array(7).fill(0),
   };
   // 芯片OEE
   // 转化效率
   // 标准组件良率
   const stdRate = {
     ...deepClone(t_),
-    target: Array(2).fill(0),
+    target: Array(7).fill(0),
   };
   // 芯片良率
   const transformRate = deepClone(stdRate);
@@ -579,8 +567,8 @@ function initA() {
  */
 function init() {
   const t_ = {
-    current: Array(2).fill(0),
+    current: Array(7).fill(0),
-    previous: Array(2).fill(0),
+    previous: Array(7).fill(0),
   };
   // 芯片投入
   const chipInvest = deepClone(t_);
@@ -589,7 +577,7 @@ function init() {
   // 芯片产出
   const chipOutput = {
     ...deepClone(t_),
-    target: Array(2).fill(0),
+    target: Array(7).fill(0),
   };
   // 标准组件产出
   const stdOutput = deepClone(chipOutput);

src/styles/index.scss

@@ -163,4 +163,4 @@ textarea {
 
 .el-upload__tip {
   line-height: 1.2;
-}
+}

src/utils/constants.js

@@ -74,9 +74,9 @@ export const SystemDataScopeEnum = {
 /**
  * 工厂名称
  */
-// export const factoryList =['瑞昌中建材光电材料有限公司', '邯郸中建材光电材料有限公司', '中建材株洲光电材料有限公司', '佳木斯中建材光电材料有限公司', '成都中建材光电材料有限公司', '凯盛光伏材料有限公司', '蚌埠兴科玻璃有限公司']
+export const factoryList =['瑞昌中建材光电材料有限公司', '邯郸中建材光电材料有限公司', '中建材株洲光电材料有限公司', '佳木斯中建材光电材料有限公司', '成都中建材光电材料有限公司', '凯盛光伏材料有限公司', '蚌埠兴科玻璃有限公司']
 
-export const factoryArray1 =[
+export const dhgfactoryList =[
   {
     name: '瑞昌中建材光电材料有限公司',
     id: 0
@@ -97,43 +97,12 @@ export const factoryArray1 =[
     name: '成都中建材光电材料有限公司',
     id: 4
   },
-  {
-    name: '凯盛光伏材料有限公司',
-    id: 5
-  },
   {
     name: '蚌埠兴科玻璃有限公司',
     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 =[
   {
     name: '凯盛光伏材料有限公司',
@@ -141,32 +110,6 @@ export const tyjxfactoryList =[
   }
 ]
 
-// 暂时只有瑞昌邯郸数据
-export const factoryList =['瑞昌中建材光电材料有限公司', '邯郸中建材光电材料有限公司']
-
-export const factoryListabbr =['瑞昌', '邯郸']
-export const factoryArray =[
-  {
-    name: '瑞昌中建材光电材料有限公司',
-    id: 0
-  },
-  {
-    name: '邯郸中建材光电材料有限公司',
-    id: 1
-  }
-]
-
-export const dhgfactoryList =[
-  {
-    name: '瑞昌中建材光电材料有限公司',
-    id: 0
-  },
-  {
-    name: '邯郸中建材光电材料有限公司',
-    id: 1
-  }
-]
-
 /**
  * 代码生成模板类型
  */

src/views/components/ChartContainer.vue

@@ -1,16 +1,8 @@
-<!--
+<!-- 
- * @Author: zhp
- * @Date: 2024-07-10 15:17:28
- * @LastEditTime: 2024-07-23 17:03:42
- * @LastEditors: zhp
- * @Description:
--->
-
-<!--
     filename: ChartContainer.vue
     author: liubin
     date: 2024-04-10 08:54:33
-    description:
+    description: 
     todo: 驾驶舱和首页的 ChartContainer, 实现滑动条 和动态宽高
 -->
 
@@ -27,7 +19,7 @@ export default {
   props: {
     noScroll: {
       type: Boolean,
-      default: true,
+      default: false,
     },
   },
   data() {

src/views/copilot/components/BarChartBase.vue

@@ -9,7 +9,7 @@
   <chart-container class="bar-chart-base">
     <div class="legend">
       <span v-for="item in legend" :key="item.label" class="legend-item"
-        :style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
+        :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
     </div>
     <div ref="chart" style="height:94%;width:100%"></div>
   </chart-container>
@@ -62,36 +62,7 @@ export default {
           top: "15%",
           containLabel: true,
         },
-        tooltip: {
+        tooltip: {},
-          trigger: "axis",
-          axisPointer: {
-            // type: "cross",
-            crossStyle: {
-              color: "rgba(237,237,237,0.5)",
-            },
-          },
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-          formatter: params => {
-            var res = `<span style='color:rgba(255,255,255,0.85);display:inline-block;margin-bottom:8px;'>${params[0].axisValueLabel}</span>`;
-            for (var i = 0, l = params.length; i < l; i++) {
-              let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : ''
-              // console.log(item.color, color);
-              res +=
-                "<br/>" +
-                `<span style='border-radius:2px;display:inline-block;margin-right:4px;width:12px;height:12px;background-color:${color}'></span>` +
-                `<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:16px;letter-spacing: 2px;'>${params[i].seriesName}</span>` +
-                `<span style='display:inline-block;width:60px;color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;text-align: right;'>${params[i].value ? params[i].value : 0}</span>`;
-            }
-            const htmlContent = `
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                ${res}
-              </div>
-              `;
-
-            return htmlContent;
-          },
-        },
         xAxis: {
           axisTick: {
             show: false,
@@ -102,24 +73,23 @@ export default {
             },
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           data: this.xAxis,
         },
         yAxis: {
           name: "单位/片",
           nameTextStyle: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
-            align: "right",
           },
           axisTick: {
             show: false,
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           axisLine: {
             show: true,
@@ -129,7 +99,7 @@ export default {
           },
           splitLine: {
             lineStyle: {
-              color: "rgba(69,97,174,.4)",
+              color: "#4561AE",
             },
           },
         },
@@ -137,7 +107,7 @@ export default {
           {
             name: "", // this.series[0].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             itemStyle: {
               borderRadius: [10, 10, 0, 0],
               color: {
@@ -172,7 +142,7 @@ export default {
           {
             name: "", // this.series[1].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             // tooltip: {
             //   valueFormatter: function (value) {
             //     return value + " ml";
@@ -217,19 +187,19 @@ export default {
       this.canvasReset()
     },
     isFullscreen(val) {
-      this.options.series.map((item) => {
+      this.actualOptions.series.map((item) => {
-        item.barWidth = val ? 18 : 16;
+        item.barWidth = val ? 18 : 12;
       });
-      this.options.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      this.options.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      this.options.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
-      this.initChart(this.options);
+      this.initChart(this.actualOptions);
       // this.actualOptions.series.map((item) => {
-      //   item.barWidth = val ? 18 : 16;
+      //   item.barWidth = val ? 18 : 12;
       // });
-      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
       // this.initChart(this.actualOptions);
       this.canvasReset()
     },
@@ -238,14 +208,14 @@ export default {
         this.initChart(this.options);
         return;
       }
-      // const actualOptions = JSON.parse(JSON.stringify(this.options));
+      const actualOptions = JSON.parse(JSON.stringify(this.options));
-      // console.log('actualOptions', this.options)
+      console.log('actualOptions', this.options)
-      this.options.series[0].data = val[0].data;
+      actualOptions.series[0].data = val[0].data;
-      this.options.series[0].name = val[0].name;
+      actualOptions.series[0].name = val[0].name;
-      this.options.series[1].data = val?.[1]?.data || [];
+      actualOptions.series[1].data = val?.[1]?.data || [];
-      this.options.series[1].name = val?.[1]?.name || "";
+      actualOptions.series[1].name = val?.[1]?.name || "";
-      // this.actualOptions = actualOptions;
+      this.actualOptions = actualOptions;
-      this.initChart(this.options);
+      this.initChart(actualOptions);
     },
   },
   mounted() {
@@ -254,7 +224,7 @@ export default {
         this.isFullscreen = screenfull.isFullscreen;
       });
     }
-    // this.actualOptions = this.options
+    this.actualOptions = this.options
     this.canvasReset();
     window.addEventListener("resize", this.canvasReset);
   },
@@ -278,7 +248,7 @@ export default {
         this.chart.dispose();
       }
       this.chart = echarts.init(this.$refs.chart);
-      this.chart.setOption(this.options);
+      this.chart.setOption(this.actualOptions);
     },
   },
 };

src/views/copilot/components/ChartContainer.vue

@@ -1,15 +1,8 @@
-<!--
+<!-- 
- * @Author: zhp
- * @Date: 2024-06-03 15:38:31
- * @LastEditTime: 2024-07-24 10:29:26
- * @LastEditors: zhp
- * @Description:
--->
-<!--
     filename: ChartContainer.vue
     author: liubin
     date: 2024-04-10 08:54:33
-    description:
+    description: 
     todo: 驾驶舱和首页的 ChartContainer, 实现滑动条 和动态宽高
 -->
 
@@ -26,7 +19,7 @@ export default {
   props: {
     noScroll: {
       type: Boolean,
-      default: true,
+      default: false,
     },
   },
   data() {

src/views/copilot/components/Container.vue

@@ -8,7 +8,9 @@
 <template>
   <div class="copilot-container">
     <!-- refresh btn  -->
-    <button v-if="0" style="
+    <button
+      v-if="0"
+      style="
         appearance: none;
         outline: none;
         border: none;
@@ -18,11 +20,22 @@
         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"
+      @click="$emit('refresh')"
-        style="width: 24px; height: 24px">
+    >
-        <path stroke-linecap="round" stroke-linejoin="round"
+      <svg
-          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" />
+        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  -->
@@ -31,13 +44,19 @@
     <div v-if="side == 'left'" class="corner bl"></div>
     <div v-if="side == 'right'" class="corner br"></div>
     <!-- content  -->
-    <div class="container-head" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
+    <div
-      <Icon style="margin-left: 16px;" :icon="icon"></Icon>
+      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="[
+    <div
+      class="container-body"
+      :class="[
         side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left',
-      ]">
+      ]"
+    >
       <slot />
     </div>
   </div>
@@ -73,7 +92,6 @@ export default {
 </script>
 
 <style scoped lang="scss">
-
 .copilot-container {
   height: 0;
   flex: 1;
@@ -123,7 +141,7 @@ export default {
     gap: 8px;
 
     .container-title {
-      font-size: 1vw;
+      font-size: 1.18vw;
       line-height: 1.39vw;
       font-weight: normal;
       letter-spacing: 2px;
@@ -143,8 +161,8 @@ export default {
     position: absolute;
     // width: 16px;
     // height: 16px;
-    width: 0.7vw;
+    width: 0.95vw;
-    height: 0.7vw;
+    height: 0.95vw;
   }
 
   .corner.tl {

src/views/copilot/components/ContainerIcon.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-04-28 13:42:51
- * @LastEditTime: 2024-07-09 16:55:58
+ * @LastEditTime: 2024-05-07 16:54:54
  * @LastEditors: zhp
  * @Description:
 -->
@@ -61,8 +61,8 @@ export default {
 .container-icon {
   //   width: 32px;
   //   height: 32px;
-  width: 1.4vw;
+  width: 1.701vw;
-  height: 1.4vw;
+  height: 1.701vw;
   background: #ccc2;
 }
 </style>

src/views/copilot/components/CopilotHeader.vue

@@ -7,7 +7,7 @@
 
 <template>
   <div class="copilot-header">
-    <section class="menu left">
+    <section class="menu">
       <CopilotButton v-for="i in ['产量', '效率']" :key="i" :label="i" :active="i === active"
         @click="() => $emit('update:active', i)" />
       <div class="type-name"></div>
@@ -15,11 +15,11 @@
         @click="() => $emit('update:than', i)" />
     </section>
     <div class="page-title">{{ active }}驾驶舱</div>
-    <section class="menu right" style="width: 24vw;float: right;">
+    <section class="menu" style="width: 24vw;float: right;">
       <CopilotButton v-for="i in ['日', '周', '月', '年']" :key="i" :label="i" :active="i === period"
         @click="() => $emit('update:period', i)" />
       <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' : '']"
           @click="toggleFullScreen" />
         <!-- <button class="times-btn"> {{ times }} </button> -->
@@ -31,7 +31,6 @@
 <script>
 import CopilotButton from "./button.vue";
 import screenfull from "screenfull";
-import { exportFactoryDataExcel } from "@/api/produceData";
 
 export default {
   name: "CopilotHeader",
@@ -59,15 +58,6 @@ export default {
   },
   computed: {},
   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() {
       setInterval(this.getTimesInterval, 60000);
     },
@@ -132,13 +122,7 @@ export default {
   justify-content: space-between;
 }
 
-.copilot-header > .left {
+.copilot-header > section {
-  width: 26vw;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-.copilot-header >.right {
   width: 26vw;
   display: flex;
   align-items: center;
@@ -190,7 +174,7 @@ export default {
       /* top: 10px; */
     }
 .page-title {
-  width: 26vw;
+  width: 25vw;
   font-size: 54px;
   line-height: 70px;
   letter-spacing: 5px;

src/views/copilot/components/FactoryDataHeader.vue

@@ -4,22 +4,18 @@
       <!-- <CopilotButton v-for="i in ['产量', '效率']" :key="i" :label="i" :active="i === active"
         @click="() => $emit('update:active', i)" />
       <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>
     <div class="page-title">{{ companyName }}</div>
     <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 v-if="showPeriod" 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>
   </div>
 </template>
@@ -29,8 +25,6 @@
 import FactorySelect from "./FactorySelect.vue";
 import screenfull from "screenfull";
 import CopilotButton from "./button.vue";
-import { exportFactoryDataExcel } from "@/api/produceData";
-
 export default {
   name: "FactoryDataHeader",
   components: { CopilotButton, FactorySelect },
@@ -48,20 +42,9 @@ export default {
       type: String,
     },
   },
-  watch: {
-    period(val) {
-      if (val != 1) {
-        this.showPeriod = true
-      } else {
-        this.showPeriod = false
-      }
-    }
-  },
   data() {
     return {
       isFullscreen: false,
-      content: '全屏',
-      showPeriod:false,
       dataList: [
         { id: 1, name: "日" },
         { id: 2, name: "周" },
@@ -72,22 +55,6 @@ export default {
   },
   computed: {},
   methods: {
-    handleExport() {
-      // if (this.period != 1) {
-        this.showPeriod = true
-        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(() => { });
-      // } else {
-      //   this.showPeriod = false
-      // }
-
-    },
     toggleFullScreen() {
       this.isFullscreen = !this.isFullscreen;
 
@@ -123,16 +90,14 @@ export default {
   gap: 8px;
 }
 .factory-header > .menu2 {
-  width: 20vw;
+  width: 26vw;
   display: flex;
-  justify-content: flex-end;
   align-items: center;
   gap: 8px;
 }
 
 .export-btn,
 .fullscreen-btn {
-  /* float: right; */
   width: 32px;
   height: 32px;
   margin-left: 24px;
@@ -154,15 +119,14 @@ export default {
 }
 
 .page-title {
-  flex: 1;
+  flex: 1 1 auto;
   font-size: 40px;
   line-height: 70px;
-  justify-content: center;
   letter-spacing: 5px;
   font-family: 优设标题黑;
   color: #6db6ff;
   text-align: center;
   user-select: none;
-  background: url(../../../assets/images/homeindex/page-title-two.png) center no-repeat;
+  background: url(../../../assets/images/homeindex/page-title-two.png) 0 0 / 100% 100% no-repeat;
 }
 </style>

src/views/copilot/components/bottomLeftContainer.vue

@@ -1,227 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-07-09 15:07:50
- * @LastEditTime: 2024-07-22 13:41:40
- * @LastEditors: zhp
- * @Description:
--->
-<!--
- * @Author: zhp
- * @Date: 2024-06-05 09:43:51
- * @LastEditTime: 2024-07-09 15:06: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 style="margin-left: 16px;" :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;
-  border-right: .13vw solid;
-    // border-image: linear-gradient(to bottom,transparent 10%,
-    //   #024798 20%,
-    //   transparent 90%) 1;
-    border-image: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-    box-sizing: border-box;
-    backdrop-filter: blur(4px);
-
-    &::before {
-      content: "";
-      position: absolute;
-      display: inline-block;
-      height: 92%;
-      width: 0.13vw;
-      border-radius: 2px;
-      top: 0%;
-      left: 0;
-      background: radial-gradient(circle at center,
-          #1481fd 2%,
-          #024798 90%,
-          transparent);
-      z-index: 1;
-    }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 90%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    left: 8%;
-    bottom: 0;
-    background: linear-gradient(to right, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      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>

src/views/copilot/components/bottomRightContainer.vue

@@ -1,220 +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" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
-      <Icon style="margin-left: 16px;" :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;
-  border-right: .13vw solid;
-  // border-image: linear-gradient(to bottom,transparent 10%,
-  //   #024798 20%,
-  //   transparent 90%) 1;
-  border-image: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-  box-sizing: border-box;
-  backdrop-filter: blur(4px);
-
-  &::before {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    height: 92%;
-    width: 0.13vw;
-    border-radius: 2px;
-    top: 0%;
-    left: 0;
-    background: radial-gradient(circle at center,
-        #1481fd 2%,
-        #024798 90%,
-        transparent);
-    z-index: 1;
-  }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 95%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    right: 3%;
-    bottom: 0;
-    background: linear-gradient(to left, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      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>

src/views/copilot/components/button.vue

@@ -1,15 +1,8 @@
-<!--
+<!-- 
- * @Author: zhp
- * @Date: 2024-04-28 13:42:51
- * @LastEditTime: 2024-07-31 08:52:25
- * @LastEditors: zhp
- * @Description:
--->
-<!--
     filename: button.vue
     author: liubin
     date: 2024-04-16 15:02:34
-    description:
+    description: 
 -->
 
 <template>
@@ -54,10 +47,10 @@ button {
   background: #006acd40;
   backdrop-filter: blur(3px);
   text-align: center;
-  padding: 16px 24px 16px 24px;
+  padding: 12px;
-  padding-left: 32px;
+  padding-left: 20px;
   color: #fff;
-  font-size: 18px;
+  font-size: 22px;
   letter-spacing: 10px;
   cursor: pointer;
 }
@@ -75,8 +68,8 @@ button {
 .copilot-btn::after {
   content: "";
   position: absolute;
-  width: 0.7vw;
+  width: 16px;
-  height: 0.7vw;
+  height: 16px;
   top: 0;
   background: transparent;
   border-style: solid;

src/views/copilot/components/efficiencyLeftContainer.vue

@@ -1,220 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-07-09 15:15:00
- * @LastEditTime: 2024-07-22 13:42:08
- * @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 style="margin-left: 16px;" :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;
-border-right: .13vw solid;
-  // border-image: linear-gradient(to bottom,transparent 10%,
-  //   #024798 20%,
-  //   transparent 90%) 1;
-  border-image: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-  box-sizing: border-box;
-  backdrop-filter: blur(4px);
-
-  &::before {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    height: 92%;
-    width: 0.13vw;
-    border-radius: 2px;
-    top: 0%;
-    left: 0;
-    background: radial-gradient(circle at center,
-        #1481fd 2%,
-        #024798 90%,
-        transparent);
-    z-index: 1;
-  }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 90%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    left: 10%;
-    bottom: 0;
-    background: linear-gradient(to right, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      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.7vw;
-    height: 0.7vw;
-  }
-
-  .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>

src/views/copilot/components/efficiencyRightContainer.vue

@@ -1,220 +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" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
-      <Icon style="margin-left: 16px;" :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;
-  border-right: .13vw solid;
-    // border-image: linear-gradient(to bottom,transparent 10%,
-    //   #024798 20%,
-    //   transparent 90%) 1;
-    border-image: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-    box-sizing: border-box;
-    backdrop-filter: blur(4px);
-
-    &::before {
-      content: "";
-      position: absolute;
-      display: inline-block;
-      height: 92%;
-      width: 0.13vw;
-      border-radius: 2px;
-      top: 0%;
-      left: 0;
-      background: radial-gradient(circle at center,
-          #1481fd 2%,
-          #024798 90%,
-          transparent);
-      z-index: 1;
-    }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 95%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    right: 3%;
-    bottom: 0;
-    background: linear-gradient(to left, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      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.7vw;
-    height: 0.7vw;
-  }
-
-  .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>

src/views/copilot/components/ftoBarChartBase.vue

@@ -1,16 +1,22 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-23 15:49:14
- * @LastEditTime: 2024-07-25 14:29:40
+ * @LastEditTime: 2024-05-29 10:56:21
  * @LastEditors: zhp
  * @Description:
 -->
+<!--
+    filename: BarChartBase.vue
+    author: liubin
+    date: 2024-04-10 08:59:28
+    description:
+-->
 
 <template>
   <chart-container class="bar-chart-base">
     <div class="legend">
       <span v-for="item in legend" :key="item.label" class="legend-item"
-        :style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
+        :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
     </div>
     <div ref="ftoChart" style="height:94%;width:100%"></div>
   </chart-container>
@@ -63,36 +69,7 @@ export default {
           top: "15%",
           containLabel: true,
         },
-        tooltip: {
+        tooltip: {},
-          trigger: "axis",
-          axisPointer: {
-            // type: "cross",
-            crossStyle: {
-              color: "rgba(237,237,237,0.5)",
-            },
-          },
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-          formatter: params => {
-            var res = `<span style='color:rgba(255,255,255,0.85);display:inline-block;margin-bottom:8px;'>${params[0].axisValueLabel}</span>`;
-            for (var i = 0, l = params.length; i < l; i++) {
-              let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : ''
-              // console.log(item.color, color);
-              res +=
-                "<br/>" +
-                `<span style='border-radius:2px;display:inline-block;margin-right:4px;width:12px;height:12px;background-color:${color}'></span>` +
-                `<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:16px;letter-spacing: 2px;'>${params[i].seriesName}</span>` +
-                `<span style='display:inline-block;width:60px;color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;text-align: right;'>${params[i].value ? params[i].value : 0 }</span>`;
-            }
-            const htmlContent = `
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                ${res}
-              </div>
-              `;
-
-            return htmlContent;
-          },
-        },
         xAxis: {
           axisTick: {
             show: false,
@@ -103,24 +80,23 @@ export default {
             },
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           data: this.xAxis,
         },
         yAxis: {
           name: "单位/片",
           nameTextStyle: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
-            align: "right",
           },
           axisTick: {
             show: false,
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           axisLine: {
             show: true,
@@ -130,7 +106,7 @@ export default {
           },
           splitLine: {
             lineStyle: {
-              color: "rgba(69,97,174,.4)",
+              color: "#4561AE",
             },
           },
         },
@@ -138,7 +114,7 @@ export default {
           {
             name: "", // this.series[0].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             itemStyle: {
               borderRadius: [10, 10, 0, 0],
               color: {
@@ -173,7 +149,7 @@ export default {
           {
             name: "", // this.series[1].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             // tooltip: {
             //   valueFormatter: function (value) {
             //     return value + " ml";
@@ -218,19 +194,19 @@ export default {
       this.canvasReset()
     },
     isFullscreen(val) {
-      this.options.series.map((item) => {
+      this.actualOptions.series.map((item) => {
-        item.barWidth = val ? 18 : 16;
+        item.barWidth = val ? 18 : 12;
       });
-      this.options.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      this.options.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      this.options.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
-      this.initChart(this.options);
+      this.initChart(this.actualOptions);
       // this.actualOptions.series.map((item) => {
-      //   item.barWidth = val ? 18 : 16;
+      //   item.barWidth = val ? 18 : 12;
       // });
-      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
       // this.initChart(this.actualOptions);
       this.canvasReset()
     },
@@ -239,14 +215,14 @@ export default {
         this.initChart(this.options);
         return;
       }
-      // const actualOptions = JSON.parse(JSON.stringify(this.options));
+      const actualOptions = JSON.parse(JSON.stringify(this.options));
-      // console.log('actualOptions', this.options)
+      console.log('actualOptions', this.options)
-      this.options.series[0].data = val[0].data;
+      actualOptions.series[0].data = val[0].data;
-      this.options.series[0].name = val[0].name;
+      actualOptions.series[0].name = val[0].name;
-      this.options.series[1].data = val[1].data;
+      actualOptions.series[1].data = val[1].data;
-      this.options.series[1].name = val[1].name;
+      actualOptions.series[1].name = val[1].name;
-      // this.actualOptions = actualOptions;
+      this.actualOptions = actualOptions;
-      this.initChart(this.options);
+      this.initChart(actualOptions);
     },
   },
   mounted() {
@@ -255,7 +231,7 @@ export default {
         this.isFullscreen = screenfull.isFullscreen;
       });
     }
-    // this.actualOptions = this.options
+    this.actualOptions = this.options
     this.canvasReset();
     window.addEventListener("resize", this.canvasReset);
   },
@@ -279,7 +255,7 @@ export default {
         this.chart.dispose();
       }
       this.chart = echarts.init(this.$refs.ftoChart);
-      this.chart.setOption(this.options);
+      this.chart.setOption(this.actualOptions);
     },
   },
 };

src/views/copilot/components/leftContainer.vue

@@ -1,218 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-05 09:43:51
- * @LastEditTime: 2024-07-22 13:36:30
- * @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 style="margin-left: 16px;" :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;
-  border-right: .13vw solid;
-    // border-image: linear-gradient(to bottom,transparent 10%,
-    //   #024798 20%,
-    //   transparent 90%) 1;
-    border-image: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-    box-sizing: border-box;
-    backdrop-filter: blur(4px);
-    &::before {
-      content: "";
-      position: absolute;
-      display: inline-block;
-      height: 92%;
-      width: 0.13vw;
-      border-radius: 2px;
-      top: 0%;
-      left: 0;
-      background: radial-gradient(circle at center,
-          #1481fd 2%,
-          #024798 90%,
-          transparent);
-      z-index: 1;
-    }
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 90%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    left: 7%;
-    bottom: 0;
-    background: linear-gradient(to right, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      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.7vw;
-    height: 0.7vw;
-  }
-
-  .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>

src/views/copilot/components/rightContainer.vue

@@ -1,222 +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" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
-      <Icon style="margin-left: 16px;" :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;
-  border-right: .13vw solid;
-  // padding-right: .2vw;
-  box-sizing: border-box;  // border-image: linear-gradient(to bottom,transparent 10%,
-  //   #024798 20%,
-  //   transparent 90%) 1;
-  border-image: linear-gradient(to bottom,transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-  backdrop-filter: blur(4px);
-
-  &::before {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    height: 92%;
-    width: 0.13vw;
-    border-radius: 2px;
-    top: 0%;
-    left: 0;
-    background: radial-gradient(
-      circle at center,
-      #1481fd 2%,
-      #024798 90%,
-      transparent
-    );
-    z-index: 1;
-  }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 95%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    right: 1%;
-    bottom: 0;
-    background: linear-gradient(to left, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      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.7vw;
-    height: 0.7vw;
-  }
-
-  .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>

src/views/copilot/components/twoContainer.vue

@@ -1,245 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-05 09:48:37
- * @LastEditTime: 2024-07-22 13:37:48
- * @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;
-  border-right: .13vw solid;
-    // border-image: linear-gradient(to bottom,transparent 10%,
-    //   #024798 20%,
-    //   transparent 90%) 1;
-    border-image: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-    box-sizing: border-box;
-    backdrop-filter: blur(4px);
-
-    &::before {
-      content: "";
-      position: absolute;
-      display: inline-block;
-      height: 92%;
-      width: 0.13vw;
-      border-radius: 2px;
-      top: 0%;
-      left: 0;
-      background: radial-gradient(circle at center,
-          #1481fd 2%,
-          #024798 90%,
-          transparent);
-      z-index: 1;
-    }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 95%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    left: 6%;
-    bottom: 0;
-    background: linear-gradient(to left, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      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.7vw;
-      height: 0.7vw;
-  }
-
-  .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>

src/views/copilot/container.vue

@@ -25,7 +25,7 @@ import YieldCopilot from "./yield/index.vue";
 // import EfficiencyCopilot from "./efficiency/index.vue";
 
 export default {
-  name: "copilotContainer",
+  name: "CopilotContainer",
   components: {
     CopilotHeaderVue,
     YieldCopilot,
@@ -35,7 +35,7 @@ export default {
   data() {
     return {
       page: "产量",
-      period: "月",
+      period: "日",
       than:'同比',
       currentsStyles: '',
     };

src/views/copilot/efficiency/components/ChipOee.vue

@@ -36,9 +36,7 @@ export default {
   },
   data() {
     // 城市数组的顺序必须是固定的
-    const cities = ["瑞昌", "邯郸",
+    const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"];
-      // "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
-    ];
     return {
       xAxis: cities,
     };
@@ -47,11 +45,8 @@ export default {
     legend() {
       let items = [];
       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()
       //今天的时间
       // var day2 = new Date();
       // day2.setTime(day2.getTime());
@@ -63,47 +58,44 @@ export default {
       const year = new Date().getFullYear();
       if (this.period === '日' && this.than === '同比') {
         items = [
-          { label: `${yesterday}日目标`, color: "#58adfa" },
+          { label: `去年${month}月${today}日`, color: "#12f7f1" },
-          { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" },
+          { label: `${month}月${today}日`, color: "#58adfa" },
-          { label: `${yesterday}日`, color: "#58adfa" },
         ];
       } else if (this.period === '日' && this.than === '环比') {
         items = [
-          { label: `${yesterday}日目标`, color: "#58adfa" },
+          { label: `${yesterday}日`, color: "#12f7f1" },
-          { label: `${dayBeYes}日`, color: "#12f7f1" },
+          { label: `${month}月${today}日`, color: "#58adfa" },
-          { label: `${yesterday}日`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '同比') {
         items = [
-          { label: `本周目标`, color: "#58adfa" },
+          { label: `去年本周`, color: "#12f7f1" },
-          { label: `${year - 1}年本周`, color: "#12f7f1" },
           { label: `本周`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '环比') {
         items = [
-          { label: `本周目标`, color: "#58adfa" },
           { label: `上周`, color: "#12f7f1" },
           { label: `本周`, color: "#58adfa" },
         ];
       } else if (this.period === '月' && this.than === '同比') {
         items = [
-          { label: `${month}月目标`, color: "#58adfa" },
+          { label: `去年${month}月`, color: "#12f7f1" },
-          { label: `${year - 1}年${month}月`, color: "#12f7f1" },
           { label: `${month}月`, color: "#58adfa" },
+          { label: `${month}月目标`, color: "#58adfa" },
           // { label: `${month}月目标`, value: valueTuple[2] },
         ];
       } else if (this.period === '月' && this.than === '环比') {
         items = [
-          { label: `${month}月目标`, color: "#58adfa" },
           { label: `${lastMonth}月`, color: "#12f7f1" },
           { label: `${month}月`, color: "#58adfa" },
+          { label: `${month}月目标`, color: "#58adfa" },
           // { label: `${month}月目标`, value: valueTuple[2] },
         ];
       } else {
         items = [
-          { label: `${year}年目标`, color: "#58adfa" },
           { label: `${year - 1}年`, color: "#12f7f1" },
           { label: `${year}年`, color: "#58adfa" },
+          { label:  `${year}年`, color: "#58adfa" },
+
           // { label: `${year}年目标`, value: valueTuple[2] },
         ];
       }
@@ -144,6 +136,14 @@ export default {
       // console.log('chipOee', chipOeeRate)
       let dataList = null
       switch (this.period) {
+        case "日":
+          dataList = [];
+          dataList[0] = chipOeeRate?.previous;
+          dataList[1] = chipOeeRate?.current;
+        case "周":
+          dataList = [];
+          dataList[0] = chipOeeRate?.previous;
+          dataList[1] = chipOeeRate?.current;
           default:
           dataList = [];
           dataList[0] = chipOeeRate?.previous;
@@ -161,11 +161,8 @@ function getTemplate(period, dataList, than) {
   // console.log('dataList',dataList);
   let items = [];
   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()
   //今天的时间
   // var day2 = new Date();
   // day2.setTime(day2.getTime());
@@ -178,48 +175,31 @@ function getTemplate(period, dataList, than) {
   if (period === '日' && than === '同比') {
     items = [
       {
-        name: `${yesterday}日目标`,
+        name: `去年${month}月${today}日`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
-      {
-        name: `${year - 1}年${yesterday}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '日' && than === '环比') {
     items = [
       {
-        name: `${yesterday}日目标`,
+        name: `${yesterday}日`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
-      {
-        name: `${dayBeYes}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '周' && than === '同比') {
     items = [
       {
-        name: `本周目标`,
+        name: `去年本周`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
-      {
-        name: `${year-1}年本周`,
         data: dataList ? dataList[0] : [],
       },
       {
@@ -227,15 +207,9 @@ function getTemplate(period, dataList, than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '周' && than === '环比') {
     items = [
-      {
-        name: `本周目标`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
       {
         name: `上周`,
         data: dataList ? dataList[0] : [],
@@ -245,17 +219,11 @@ function getTemplate(period, dataList, than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '月' && than === '同比') {
     items = [
       {
-        name: `${month}月目标`,
+        name: `去年${month}月`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
-      {
-        name: `${year-1}年${month}月`,
         data: dataList ? dataList[0] : [],
       },
       {
@@ -263,33 +231,31 @@ function getTemplate(period, dataList, than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
+      {
+        name: `${month}目标`,
+        data: dataList ? dataList[2] : [],
+        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
+      },
     ];
   } else if (period === '月' && than === '环比') {
     items = [
+      {
+        name: `${lastMonth}月`,
+        data: dataList ? dataList[0] : [],
+      },
       {
         name: `${month}月`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
       {
-        name: `${month}月目标`,
+        name: `${month}目标`,
         data: dataList ? dataList[2] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-      {
-        name: `${lastMonth}月`,
-        data: dataList ? dataList[0] : [],
-      },
-
     ];
   } else {
     items = [
-      {
-        name: `${year}目标`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
       {
         name: `${year - 1}年`,
         data: dataList ? dataList[0] : [],
@@ -299,7 +265,11 @@ function getTemplate(period, dataList, than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
+      {
+        name: `${year}目标`,
+        data: dataList ? dataList[2] : [],
+        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
+      },
     ];
   }
   return items

src/views/copilot/efficiency/components/ChipRate.vue

@@ -1,15 +1,15 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-10 11:10:54
- * @LastEditTime: 2024-06-06 10:04:49
+ * @LastEditTime: 2024-05-30 13:23:03
  * @LastEditors: zhp
  * @Description:
 -->
 
 <template>
   <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>
 </template>
 

src/views/copilot/efficiency/components/StdRate.vue

@@ -1,21 +1,21 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-07 10:25:10
- * @LastEditTime: 2024-06-06 13:55:10
+ * @LastEditTime: 2024-05-30 11:19:51
  * @LastEditors: zhp
  * @Description:
 -->
 
 <template>
   <!-- <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]" />
-      </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>
 </template>
 
 <script>
@@ -33,15 +33,7 @@ export default {
       default: "同比",
     },
   },
-  data() {
-    return {
-      // data: null
-    }
-  },
   computed: {
-    stdData() {
-      return this.$store.getters.copilot.efficiency.stdRate
-    },
     cities() {
       console.log('ztl', this.$store.getters.copilot.efficiency.stdRate)
       // let getterName = "";
@@ -57,30 +49,30 @@ export default {
       //     break;
       // }
       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, },
       ]
-      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) => {
             _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) => {
             _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) => {
             _cities[idx].current = v ?? 0;
           }
@@ -88,30 +80,22 @@ export default {
       }
       // 删掉凯盛光伏
       // _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: {},
 };
 </script>
@@ -119,12 +103,12 @@ export default {
 <style scoped lang="scss">
 .std-rate {
   display: flex;
-  gap: 16px;
+  // gap: 1px;
   // flex: 1 1 auto;
-  flex-direction: column;
+
   // display: -webkit-box;
   flex-wrap: wrap;
-  // align-items: center;
+  align-items: center;
   // grid-template-columns: repeat(2, 1fr);
   // grid-template-rows: repeat(4, 1fr);
 }
@@ -133,7 +117,7 @@ export default {
 }
 .flex-item{
   // flex: 1 1 auto;
-  // width: 50%;
+  width: 50%;
 }
 .span-2 {
   // flex: 1 1 auto;

src/views/copilot/efficiency/components/TransformRate.vue

@@ -36,9 +36,7 @@ export default {
   },
   data() {
     // 城市数组的顺序必须是固定的
-    const cities = ["瑞昌", "邯郸",
+    const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"];
-      // "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
-    ];
     return {
       xAxis: cities,
     };
@@ -47,11 +45,8 @@ export default {
     legend() {
       let items = [];
       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()
       //今天的时间
       // var day2 = new Date();
       // day2.setTime(day2.getTime());
@@ -63,47 +58,44 @@ export default {
       const year = new Date().getFullYear();
       if (this.period === '日' && this.than === '同比') {
         items = [
-          { label: `${yesterday}日目标`, color: "#58adfa" },
+          { label: `去年${month}月${today}日`, color: "#12f7f1" },
-          { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" },
+          { label: `${month}月${today}日`, color: "#58adfa" },
-          { label: `${yesterday}日`, color: "#58adfa" },
         ];
       } else if (this.period === '日' && this.than === '环比') {
         items = [
-          { label: `${yesterday}日目标`, color: "#58adfa" },
+          { label: `${yesterday}日`, color: "#12f7f1" },
-          { label: `${dayBeYes}日`, color: "#12f7f1" },
+          { label: `${month}月${today}日`, color: "#58adfa" },
-          { label: `${yesterday}日`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '同比') {
         items = [
-          { label: `本周目标`, color: "#58adfa" },
+          { label: `去年本周`, color: "#12f7f1" },
-          { label: `${year - 1}年本周`, color: "#12f7f1" },
           { label: `本周`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '环比') {
         items = [
-          { label: `本周目标`, color: "#58adfa" },
           { label: `上周`, color: "#12f7f1" },
           { label: `本周`, color: "#58adfa" },
         ];
       } else if (this.period === '月' && this.than === '同比') {
         items = [
-          { label: `${month}月目标`, color: "#58adfa" },
+          { label: `去年${month}月`, color: "#12f7f1" },
-          { label: `${year - 1}年${month}月`, color: "#12f7f1" },
           { label: `${month}月`, color: "#58adfa" },
+          { label: `${month}月目标`, color: "#58adfa" },
           // { label: `${month}月目标`, value: valueTuple[2] },
         ];
       } else if (this.period === '月' && this.than === '环比') {
         items = [
-          { label: `${month}月目标`, color: "#58adfa" },
           { label: `${lastMonth}月`, color: "#12f7f1" },
           { label: `${month}月`, color: "#58adfa" },
+          { label: `${month}月目标`, color: "#58adfa" },
           // { label: `${month}月目标`, value: valueTuple[2] },
         ];
       } else {
         items = [
-          { label: `${year}年目标`, color: "#58adfa" },
           { label: `${year - 1}年`, color: "#12f7f1" },
           { label: `${year}年`, color: "#58adfa" },
+          { label: `${year}年`, color: "#58adfa" },
+
           // { label: `${year}年目标`, value: valueTuple[2] },
         ];
       }
@@ -115,9 +107,17 @@ export default {
     series() {
       // console.log('aaaaaaaa', this.$store.getters.copilot.efficiency.chipOee);
       const transformRate = this.transformRate
-      console.log('chipOee', transformRate)
+      // console.log('chipOee', chipOeeRate)
       let dataList = null;
       switch (this.period) {
+        case "日":
+          dataList = [];
+          dataList[0] = transformRate.previous;
+          dataList[1] = transformRate.current;
+        case "周":
+          dataList = [];
+          dataList[0] = transformRate.previous;
+          dataList[1] = transformRate.current;
         default:
           dataList = [];
           dataList[0] = transformRate.previous;
@@ -152,11 +152,8 @@ function getTemplate(period, dataList,than) {
   // console.log('dataList',dataList);
   let items = [];
   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()
   //今天的时间
   // var day2 = new Date();
   // day2.setTime(day2.getTime());
@@ -169,48 +166,31 @@ function getTemplate(period, dataList,than) {
   if (period === '日' && than === '同比') {
     items = [
       {
-        name: `${yesterday}日目标`,
+        name: `去年${month}月${today}日`,
-        data: dataList ? dataList[2].splice(0,2) : [],
+        data: dataList ? dataList[0] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
       {
-        name: `${year - 1}年${yesterday}日`,
+        name: `${month}月${today}日`,
-        data: dataList ? dataList[0].splice(0, 2) : [],
+        data: dataList ? dataList[1] : [],
-      },
-      {
-        name: `${yesterday}日`,
-        data: dataList ? dataList[1].splice(0, 2) : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '日' && than === '环比') {
     items = [
       {
-        name: `${yesterday}日目标`,
+        name: `${yesterday}日`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
-      {
-        name: `${dayBeYes}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '周' && than === '同比') {
     items = [
       {
-        name: `本周目标`,
+        name: `去年本周`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
-      {
-        name: `${year - 1}年本周`,
         data: dataList ? dataList[0] : [],
       },
       {
@@ -218,15 +198,9 @@ function getTemplate(period, dataList,than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '周' && than === '环比') {
     items = [
-      {
-        name: `本周目标`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
       {
         name: `上周`,
         data: dataList ? dataList[0] : [],
@@ -236,17 +210,11 @@ function getTemplate(period, dataList,than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
     ];
   } else if (period === '月' && than === '同比') {
     items = [
       {
-        name: `${month}月目标`,
+        name: `去年${month}月`,
-        data: dataList ? dataList[2] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
-      },
-      {
-        name: `${year - 1}年${month}月`,
         data: dataList ? dataList[0] : [],
       },
       {
@@ -254,34 +222,31 @@ function getTemplate(period, dataList,than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
+      {
+        name: `${month}目标`,
+        data: dataList ? dataList[2] : [],
+        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
+      },
     ];
   } else if (period === '月' && than === '环比') {
     items = [
       {
-        name: `${month}月目标`,
+        name: `${lastMonth}月`,
-        data: dataList ? dataList[2] : [],
+        data: dataList ? dataList[0] : [],
-        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
       {
         name: `${month}月`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
       {
-        name: `${lastMonth}月`,
+        name: `${month}目标`,
-        data: dataList ? dataList[0] : [],
-      },
-
-    ];
-  } else {
-    items = [
-      {
-        name: `${year}目标`,
         data: dataList ? dataList[2] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
+    ];
+  } else {
+    items = [
       {
         name: `${year - 1}年`,
         data: dataList ? dataList[0] : [],
@@ -291,7 +256,11 @@ function getTemplate(period, dataList,than) {
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
-
+      {
+        name: `${year}目标`,
+        data: dataList ? dataList[2] : [],
+        // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
+      },
     ];
   }
   return items

src/views/copilot/efficiency/components/sub/bar/BarChartChipOEE.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-07 13:22:43
- * @LastEditTime: 2024-07-25 14:29:04
+ * @LastEditTime: 2024-05-29 14:09:08
  * @LastEditors: zhp
  * @Description:
 -->
@@ -9,9 +9,9 @@
   <chart-container class="bar-chart-base">
     <div class="legend">
       <span v-for="(item,index) in legend" :key="index" class="legend-item"
-        :style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
+        :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
     </div>
-    <div ref="oeeChart" style="height:94%;width:100%"></div>
+    <div ref="oeeChart" style="height:96%;width:100%"></div>
   </chart-container>
 </template>
 
@@ -22,7 +22,7 @@ import ChartContainer from "../../../../components/ChartContainer.vue";
 import { debounce } from "@/utils/debounce";
 import * as echarts from "echarts";
 export default {
-  name: "barChartBaseoee",
+  name: "BarChartBase",
   components: {
     ChartContainer,
   },
@@ -56,48 +56,13 @@ export default {
       actualOptions: null,
       options: {
         grid: {
-          left: "6%",
+          left: "5%",
           right: "0%",
           bottom: "3%",
           top: "15%",
           containLabel: true,
         },
-        tooltip: {
+        tooltip: {},
-          trigger: "axis",
-          axisPointer: {
-            // type: "cross",
-            crossStyle: {
-              color: "rgba(237,237,237,0.5)",
-            },
-          },
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-          formatter: params => {
-            console.log('params', params)
-            var res = `<span style='color:rgba(255,255,255,0.85);margin-bottom:8px'>${params[0].axisValueLabel}</span>`;
-            for (var i = 0, l = params.length; i < l; i++) {
-              let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : ''
-              // console.log(item.color, color);
-              res +=
-                "<br/>" +
-                `${params[i].seriesType === "line"
-                ? `<span style='display:inline-block; width: 20px;height: 2px;background-color: #f3c000;position: absolute;top:39%;left:3.05%;'></span>
-                <span style='display:inline-block;width: 8px;height: 8px;border-radius: 100%;background-color: #f3c000;position: absolute;top:36%;left:4.8%;'></span>
-                <span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:16px;margin-left:20px'>${params[i].seriesName}</span>`
-                  : `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:${color}"></span>
-                <span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:16px'>${params[i].seriesName}</span>`
-                }` +
-              `<span style='display:inline-block;text-align: right;width:180px;color:rgba(255,255,255,0.65);;font-size:16px;letter-spacing: 2px;'>${params[i].value ? params[i].value.toFixed(2) + '%' : "0.00" + '%'}</span>`;
-            }
-            const htmlContent = `
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                ${res}
-              </div>
-              `;
-
-            return htmlContent;
-          },
-        },
         xAxis: {
           axisTick: {
             show: false,
@@ -108,24 +73,23 @@ export default {
             },
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           data: this.xAxis,
         },
         yAxis: {
           name: "单位/%",
           nameTextStyle: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
-            align: "right",
           },
           axisTick: {
             show: false,
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           axisLine: {
             show: true,
@@ -135,50 +99,15 @@ export default {
           },
           splitLine: {
             lineStyle: {
-              color: "rgba(69,97,174,.4)",
+              color: "#4561AE",
             },
           },
         },
         series: [
-          {
-            name: "", // "2024年目标值",
-            type: "line",
-            lineStyle: {
-              color: "#f3c000",
-            },
-            itemStyle: {
-              color: "#f3c000",
-            },
-            // areaStyle: {
-            //   color: {
-            //     type: "linear",
-            //     x: 0,
-            //     y: 0,
-            //     x2: 0,
-            //     y2: 1,
-            //     colorStops: [
-            //       {
-            //         offset: 0,
-            //         color: "#f3c000", // 0% 处的颜色
-            //       },
-            //       {
-            //         offset: 0.55,
-            //         color: "#f3c00033",
-            //       },
-            //       {
-            //         offset: 1,
-            //         color: "transparent", // 100% 处的颜色
-            //       },
-            //     ],
-            //     global: false, // 缺省为 false
-            //   },
-            // },
-            data: [], // this.series[0].data,
-          },
           {
             name: "", // this.series[0].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             itemStyle: {
               borderRadius: [10, 10, 0, 0],
               color: {
@@ -213,7 +142,7 @@ export default {
           {
             name: "", // this.series[1].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             // tooltip: {
             //   valueFormatter: function (value) {
             //     return value + " ml";
@@ -241,7 +170,42 @@ export default {
               },
             },
             data: [], // this.series[1].data,
-          }
+          },
+          {
+            name: "", // "2024年目标值",
+            type: "line",
+            lineStyle: {
+              color: "#f3c000",
+            },
+            itemStyle: {
+              color: "#f3c000",
+            },
+            areaStyle: {
+              color: {
+                type: "linear",
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: "#f3c000", // 0% 处的颜色
+                  },
+                  {
+                    offset: 0.55,
+                    color: "#f3c00033",
+                  },
+                  {
+                    offset: 1,
+                    color: "transparent", // 100% 处的颜色
+                  },
+                ],
+                global: false, // 缺省为 false
+              },
+            },
+            data: [], // this.series[0].data,
+          },
         ],
       },
     };
@@ -257,12 +221,12 @@ export default {
     },
     /** 全屏状态切换时，对柱子粗细和字体大小进行相应调整 */
     isFullscreen(val) {
-      // this.actualOptions.series.map((item) => {
+      this.actualOptions.series.map((item) => {
-      //   item.barWidth = val ? 18 : 16;
+        item.barWidth = val ? 18 : 12;
-      // });
+      });
-      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
       // if (val === false && this.isOpen === true) {
       //   console.log(val)
       //   this.width = 97 + '%'
@@ -272,12 +236,12 @@ export default {
       //   this.canvasReset()
       // }
       // this.actualOptions.series.map((item) => {
-      //   item.barWidth = val ? 18 : 16;
+      //   item.barWidth = val ? 18 : 12;
       // });
-      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
-      this.initChart(this.options)
+      this.initChart(this.actualOptions)
       this.canvasReset()
     },
     series(val) {
@@ -288,14 +252,14 @@ export default {
       // console.log('val', val)
       const actualOptions = JSON.parse(JSON.stringify(this.options))
       console.log(actualOptions)
-      this.options.series[0].data = val[0].data;
+      actualOptions.series[0].data = val[0].data;
-      this.options.series[0].name = val[0].name;
+      actualOptions.series[0].name = val[0].name;
-      this.options.series[1].data = val?.[1]?.data;
+      actualOptions.series[1].data = val?.[1]?.data;
-      this.options.series[1].name = val?.[1]?.name;
+      actualOptions.series[1].name = val?.[1]?.name;
-      this.options.series[2].data = val?.[2]?.data || [];
+      actualOptions.series[2].data = val?.[2]?.data || [];
-      this.options.series[2].name = val?.[2]?.name || "";
+      actualOptions.series[2].name = val?.[2]?.name || "";
       this.actualOptions = actualOptions;
-      this.initChart(this.options);
+      this.initChart(actualOptions);
     },
   },
   mounted() {
@@ -304,12 +268,12 @@ export default {
     //     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();
     window.addEventListener("resize", this.canvasReset);
   },
@@ -332,14 +296,13 @@ export default {
         this.chart.dispose();
       }
       this.chart = echarts.init(this.$refs.oeeChart);
-      this.chart.setOption(this.options);
+      this.chart.setOption(this.actualOptions);
     },
   },
 };
 </script>
 
 <style scoped lang="scss">
-
 .bar-chart-base {
   // position: relative;
 
@@ -364,42 +327,39 @@ export default {
       margin-right: 0.22vw;
     }
   }
-     .legend-item:nth-child(1) {
+ .legend-item:nth-child(3):before {
-       margin-left: 1vw;
+   // width: 12px;
-     }
+   // height: 2px;
-    .legend-item:nth-child(1):before {
+   width: 1vw;
-      // width: 12px;
+   height: 0.1064vw;
-      // height: 2px;
+   background-color: #f3c000;
-      width: 1vw;
+   position: absolute;
-      height: 0.1064vw;
+   top: 50%;
-      background-color: #f3c000;
+   // left: -16px;
-      position: absolute;
+   left: -0.951vw;
-      top: 50%;
+   transform: translateY(-50%);
-      // left: -16px;
+ }
-      left: -1.2vw;
-      transform: translateY(-50%);
-    }
 
-    .legend-item:nth-child(1):after {
+ .legend-item:nth-child(3):after {
-      background-color: #f3c000;
+   background-color: #f3c000;
-      content: "";
+   content: "";
-      display: inline-block;
+   display: inline-block;
-      position: absolute;
+   position: absolute;
-      // width: 6px;
+   // width: 6px;
-      // height: 6px;
+   // height: 6px;
-      width: 0.4vw;
+   width: 0.3191vw;
-      height: 0.4vw;
+   height: 0.3191vw;
-      border-radius: 100%;
+   border-radius: 100%;
-      top: 50%;
+   top: 50%;
-      left: -1.1vw;
+   left: -0.851vw;
-      // left: -16px;
+   // left: -16px;
-      transform: translateY(-50%) translateX(50%);
+   transform: translateY(-50%) translateX(50%);
-    }
+ }
-  .legend-item:nth-child(2):before {
+  .legend-item:nth-child(1):before {
     background-color: #12f7f1;
   }
 
-  .legend-item:nth-child(3):before {
+  .legend-item:nth-child(2):before {
     background-color: #58adfa;
   }
 }

src/views/copilot/efficiency/components/sub/bar/BarChartChipTrans.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-23 15:50:44
- * @LastEditTime: 2024-07-25 14:29:09
+ * @LastEditTime: 2024-05-29 14:25:10
  * @LastEditors: zhp
  * @Description:
 -->
@@ -9,9 +9,9 @@
   <chart-container class="bar-chart-base">
     <div class="legend">
       <span v-for="(item,index) in legend" :key="index" class="legend-item"
-        :style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
+        :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
     </div>
-    <div ref="oeeChart" style="height:94%;width:100%"></div>
+    <div ref="oeeChart" style="height:96%;width:100%"></div>
   </chart-container>
 </template>
 
@@ -22,7 +22,7 @@ import ChartContainer from "../../../../components/ChartContainer.vue";
 import { debounce } from "@/utils/debounce";
 import * as echarts from "echarts";
 export default {
-  name: "barChartBaseoee",
+  name: "BarChartBase",
   components: {
     ChartContainer,
   },
@@ -56,48 +56,13 @@ export default {
       actualOptions: null,
       options: {
         grid: {
-          left: "6%",
+          left: "5%",
           right: "0%",
           bottom: "3%",
           top: "15%",
           containLabel: true,
         },
-        tooltip: {
+        tooltip: {},
-          trigger: "axis",
-          axisPointer: {
-            // type: "cross",
-            crossStyle: {
-              color: "rgba(237,237,237,0.5)",
-            },
-          },
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-          formatter: params => {
-            console.log('params', params)
-            var res = `<span style='color:rgba(255,255,255,0.85);margin-bottom:8px'>${params[0].axisValueLabel}</span>`;
-            for (var i = 0, l = params.length; i < l; i++) {
-              let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : ''
-              // console.log(item.color, color);
-              res +=
-                "<br/>" +
-                `${params[i].seriesType === "line"
-                  ? `<span style='display:inline-block; width: 20px;height: 2px;background-color: #f3c000;position: absolute;top:39%;left:3.05%;'></span>
-                <span style='display:inline-block;width: 8px;height: 8px;border-radius: 100%;background-color: #f3c000;position: absolute;top:36%;left:4.8%;'></span>
-                <span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:16px;margin-left:20px'>${params[i].seriesName}</span>`
-                  : `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:${color}"></span>
-                <span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:16px'>${params[i].seriesName}</span>`
-                }` +
-              `<span style='display:inline-block;text-align: right;width:180px;color:rgba(255,255,255,0.65);;font-size:16px;letter-spacing: 2px;'>${params[i].value ? params[i].value.toFixed(2) + '%' : "0.00" + '%'}</span>`;
-            }
-            const htmlContent = `
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                ${res}
-              </div>
-              `;
-
-            return htmlContent;
-          },
-        },
         xAxis: {
           axisTick: {
             show: false,
@@ -108,24 +73,23 @@ export default {
             },
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           data: this.xAxis,
         },
         yAxis: {
           name: "单位/%",
           nameTextStyle: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
-            align: "right",
           },
           axisTick: {
             show: false,
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           axisLine: {
             show: true,
@@ -135,50 +99,15 @@ export default {
           },
           splitLine: {
             lineStyle: {
-              color: "rgba(69,97,174,.4)",
+              color: "#4561AE",
             },
           },
         },
         series: [
-          {
-            name: "", // "2024年目标值",
-            type: "line",
-            lineStyle: {
-              color: "#f3c000",
-            },
-            itemStyle: {
-              color: "#f3c000",
-            },
-            // areaStyle: {
-            //   color: {
-            //     type: "linear",
-            //     x: 0,
-            //     y: 0,
-            //     x2: 0,
-            //     y2: 1,
-            //     colorStops: [
-            //       {
-            //         offset: 0,
-            //         color: "#f3c000", // 0% 处的颜色
-            //       },
-            //       {
-            //         offset: 0.55,
-            //         color: "#f3c00033",
-            //       },
-            //       {
-            //         offset: 1,
-            //         color: "transparent", // 100% 处的颜色
-            //       },
-            //     ],
-            //     global: false, // 缺省为 false
-            //   },
-            // },
-            data: [], // this.series[0].data,
-          },
           {
             name: "", // this.series[0].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             itemStyle: {
               borderRadius: [10, 10, 0, 0],
               color: {
@@ -213,7 +142,7 @@ export default {
           {
             name: "", // this.series[1].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             // tooltip: {
             //   valueFormatter: function (value) {
             //     return value + " ml";
@@ -242,7 +171,41 @@ export default {
             },
             data: [], // this.series[1].data,
           },
-
+          {
+            name: "", // "2024年目标值",
+            type: "line",
+            lineStyle: {
+              color: "#f3c000",
+            },
+            itemStyle: {
+              color: "#f3c000",
+            },
+            areaStyle: {
+              color: {
+                type: "linear",
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: "#f3c000", // 0% 处的颜色
+                  },
+                  {
+                    offset: 0.55,
+                    color: "#f3c00033",
+                  },
+                  {
+                    offset: 1,
+                    color: "transparent", // 100% 处的颜色
+                  },
+                ],
+                global: false, // 缺省为 false
+              },
+            },
+            data: [], // this.series[0].data,
+          },
         ],
       },
     };
@@ -258,12 +221,12 @@ export default {
     },
     /** 全屏状态切换时，对柱子粗细和字体大小进行相应调整 */
     isFullscreen(val) {
-      // this.actualOptions.series.map((item) => {
+      this.actualOptions.series.map((item) => {
-      //   item.barWidth = val ? 18 : 16;
+        item.barWidth = val ? 18 : 12;
-      // });
+      });
-      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
       // if (val === false && this.isOpen === true) {
       //   console.log(val)
       //   this.width = 97 + '%'
@@ -273,13 +236,13 @@ export default {
       //   this.canvasReset()
       // }
       // this.actualOptions.series.map((item) => {
-      //   item.barWidth = val ? 18 : 16;
+      //   item.barWidth = val ? 18 : 12;
       // });
-      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
-      this.initChart(this.options)
+      this.initChart(this.actualOptions)
-      this.canvasReset()
+      // this.canvasReset()
     },
     series(val) {
       if (!val) {
@@ -287,15 +250,15 @@ export default {
         return;
       }
       console.log(val)
-      // const actualOptions = JSON.parse(JSON.stringify(this.options))
+      const actualOptions = JSON.parse(JSON.stringify(this.options))
-      this.options.series[0].data = val[0].data;
+      actualOptions.series[0].data = val[0].data;
-      this.options.series[0].name = val[0].name;
+      actualOptions.series[0].name = val[0].name;
-      this.options.series[1].data = val?.[1]?.data || [];
+      actualOptions.series[1].data = val?.[1]?.data || [];
-      this.options.series[1].name = val?.[1]?.name || "";
+      actualOptions.series[1].name = val?.[1]?.name || "";
-      this.options.series[2].data = val?.[2]?.data || [];
+      actualOptions.series[2].data = val?.[2]?.data || [];
-      this.options.series[2].name = val?.[2]?.name || "";
+      actualOptions.series[2].name = val?.[2]?.name || "";
-      // this.actualOptions = actualOptions;
+      this.actualOptions = actualOptions;
-      this.initChart(this.options);
+      this.initChart(actualOptions);
     },
   },
   mounted() {
@@ -304,12 +267,12 @@ export default {
     //     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();
     window.addEventListener("resize", this.canvasReset);
   },
@@ -332,14 +295,13 @@ export default {
         this.chart.dispose();
       }
       this.chart = echarts.init(this.$refs.oeeChart);
-      this.chart.setOption(this.options);
+      this.chart.setOption(this.actualOptions);
     },
   },
 };
 </script>
 
 <style scoped lang="scss">
-
 .bar-chart-base {
   // position: relative;
 
@@ -364,17 +326,15 @@ export default {
       margin-right: 0.22vw;
     }
   }
- .legend-item:nth-child(1) {
+
-   margin-left: 1vw;
+  .legend-item:nth-child(1):before {
- }
-  .legend-item:nth-child(2):before {
     background-color: #12f7f1;
   }
 
-  .legend-item:nth-child(3):before {
+  .legend-item:nth-child(2):before {
     background-color: #58adfa;
   }
-    .legend-item:nth-child(1):before {
+    .legend-item:nth-child(3):before {
       // width: 12px;
       // height: 2px;
       width: 1vw;
@@ -383,22 +343,22 @@ export default {
       position: absolute;
       top: 50%;
       // left: -16px;
-      left: -1.2vw;
+      left: -0.951vw;
       transform: translateY(-50%);
     }
 
-    .legend-item:nth-child(1):after {
+    .legend-item:nth-child(3):after {
       background-color: #f3c000;
       content: "";
       display: inline-block;
       position: absolute;
       // width: 6px;
       // height: 6px;
-      width: 0.4vw;
+      width: 0.3191vw;
-      height: 0.4vw;
+      height: 0.3191vw;
       border-radius: 100%;
       top: 50%;
-      left: -1.1vw;
+      left: -0.851vw;
       // left: -16px;
       transform: translateY(-50%) translateX(50%);
     }

src/views/copilot/efficiency/components/sub/chip/ChipRateItem.vue

@@ -13,11 +13,10 @@
     <!-- <div style="flex:1;padding: 0 20%;"> -->
     <div class="chart" ref="chart"></div>
     <!-- </div> -->
-    <div class="legend">
+    <div class="legend" >
       <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__label">{{ lgd.label }}</span>
       </div>
     </div>
   </div>
@@ -65,13 +64,13 @@ export default {
     valueTuple() {
       const getter = this.chipRate;
       // console.log(getter)
-      // if (this.period === "日" || this.period === "周") {
+      if (this.period === "日" || this.period === "周") {
-      //   return [
+        return [
-      //     getter.previous[this.factoryId],
+          getter.previous[this.factoryId],
-      //     getter.current[this.factoryId],
+          getter.current[this.factoryId],
-      //     0,
+          0,
-      //   ];
+        ];
-      // }
+      }
       // [100, 200, 200]
       return [
         getter.previous[this.factoryId],
@@ -80,90 +79,27 @@ export default {
       ];
     },
     options() {
-      // const single = this.period === "日" || this.period === "周";
+      const single = this.period === "日" || this.period === "周";
-      const today = new Date().getDate();
       const year = new Date().getFullYear();
       const month = new Date().getMonth() + 1;
       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}日良率` },
-          { label: `${yesterday}日目标` },
-        ];
-      } else if (this.period === '日' && this.than === '环比') {
-        items = [
-          { label: `${yesterday}日良率` },
-          { label: `${dayBeYes}日良率` },
-          { label: `${yesterday}日目标` },
-        ];
-      } else if (this.period === '周' && this.than === '同比') {
-        items = [
-          { label: `本周良率`, },
-          { label: `${year - 1}年本周良率` },
-          { label: `本周目标`, },
-        ];
-      } else if (this.period === '周' && this.than === '环比') {
-        items = [
-          { label: `本周良率`, },
-          { 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 = {
-          日: "昨日良率",
+          日: "本日良率",
           周: "本周良率",
           月: `${month}月良率`,
           年: `${year}良率`,
         }[this.period];
-      console.log(vt[0]);
+
-      let titleSize = this.fontSize(0.35)
-      let subtitleSize = this.fontSize(0.14)
       const t = getOptions({
-        // single,
+        single,
         color: this.color == 1 ? "#4CF0E8" : "#1065ff",
         titleValue,
-        titleSize,
-        subtitleSize,
         subtitle,
-        yesterday,
-        currentName: items[0].label,
-        preName: items[1].label,
         previousSum: vt[0],
         currentSum: vt[1],
         targetSum: vt[2],
@@ -173,11 +109,8 @@ export default {
     legend() {
       let items = [];
       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()
       //今天的时间
       // var day2 = new Date();
       // day2.setTime(day2.getTime());
@@ -189,48 +122,41 @@ export default {
       const year = new Date().getFullYear();
       if (this.period === '日' && this.than === '同比') {
         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]) + "%" },
-          { label: `${yesterday}日目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" },
         ];
       } else if (this.period === '日' && this.than === '环比') {
         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]) + "%" },
-          { label: `${yesterday}日目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" },
         ];
       } else if (this.period === '周' && this.than === '同比') {
         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]) + "%" },
-          { label: `本周目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" },
         ];
       } else if (this.period === '周' && this.than === '环比') {
         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]) + "%" },
-          { label: `本周目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" },
         ];
       } else if (this.period === '月' && this.than === '同比') {
         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 === '环比') {
         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 {
         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
@@ -265,22 +191,6 @@ export default {
     },
   },
   methods: {
-  fontSize(res){
-    let clientWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
-    if (!clientWidth) return;
-    let fontSize = 100 * (clientWidth / 1920);
-    return res * fontSize;
-  },
-    formatNumber(num) {
-      console.log(num);
-      // 判断是否为整数
-      if (Number.isInteger(num)) {
-        return num; // 如果是整数，直接转换为字符串
-      } else {
-        // 如果不是整数，保留两位小数并转换为字符串
-        return num.toFixed(2);
-      }
-    },
     handleCityUpdate(id) {
       this.factoryId = id;
     },
@@ -296,47 +206,39 @@ export default {
     display: flex;
     flex-direction: column;
     align-items: center;
-    // padding: 0 3px;
+    justify-content: center;
-    // justify-content: center;
     gap: 3px;
     backdrop-filter: blur(24px);
-  // .cities {
+  .cities {
-  //   // height: 40px;
+    height: 40px;
-  // }
+  }
 
     .chart {
       // margin-left: 5%;
       // width: 290px;
-      flex: 1 1 auto;
-      padding: 0 20%;
-      /* margin: 10%; */
-      height: 0;
-      /* min-width: 300px; */
       align-self: stretch;
+      // flex: 1 1 auto;
+    // align-items: center;
+      // margin:0 auto;
+      // padding: 0 10%;;
+      /* margin: 10%; */
+      /* min-width: 300px; */
+      height: 200px;
     }
   .legend {
-    // height: 80px;
+    height: 80px;
     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 {
-    margin-left: 15px;
     display: flex;
-    font-size: 16px;
-    // font-weight: 600;
     flex-direction: column;
-    // align-items: center;
+    align-items: center;
-    align-items: flex-start;
     gap: 3px;
 
     &:first-child {
-      // margin-left: 5px;
       .legend-item__value {
         color: #0e61f5;
       }
@@ -348,41 +250,10 @@ 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 {
+    font-size: 24px;
+    font-weight: 600;
   }
 }
 </style>

src/views/copilot/efficiency/components/sub/ring/DoubleRingChart.vue

@@ -1,8 +1,8 @@
-<!--
+<!-- 
     filename: DoubleRingChart.vue
     author: liubin
     date: 2024-04-17 11:01:55
-    description:
+    description: 
 -->
 
 <template>
@@ -132,19 +132,19 @@ function calculateItems(period, valueTuple) {
     case "日":
       items = [
         { label: `${month}月${today}日累计`, value: valueTuple[1] },
-        { label: `${year-1}年${month}月${today}日累计`, value: valueTuple[0] },
+        { label: `去年${month}月${today}日累计`, value: valueTuple[0] },
       ];
       break;
     case "周":
       items = [
         { label: `本周累计`, value: valueTuple[1] },
-        { label: `${year-1}年本周累计`, value: valueTuple[0] },
+        { label: `去年本周累计`, value: valueTuple[0] },
       ];
       break;
     case "月":
       items = [
         { label: `${month}月累计`, value: valueTuple[1] },
-        { label: `${year-1}年${month}月累计`, value: valueTuple[0] },
+        { label: `去年${month}月累计`, value: valueTuple[0] },
         { label: `${month}月目标`, value: valueTuple[2] },
       ];
       break;

src/views/copilot/efficiency/components/sub/std/ProgressBar.vue

@@ -6,7 +6,7 @@
 -->
 
 <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>
 </template>
@@ -20,18 +20,6 @@ export default {
       type: Number,
       default: 0,
     },
-    target: {
-      type: Number,
-      default: 0,
-    },
-    previous: {
-      type: Number,
-      default: 0,
-    },
-    current: {
-      type: Number,
-      default: 0,
-    },
     // total: {
     //   type: Number,
     //   default: 0,
@@ -46,16 +34,11 @@ export default {
   },
   computed: {
     dataRate() {
-      // if (this.current != 0 && this.target != 0) {
+      return this.value == 0
-        console.log( '1111111111', this.current, this.target,this.previous);
+        ? "-"
-      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 ? parseFloat(this.current).toFixed(2) + '%' : 0 + '%'
-      // } else if(this.previous != 0) {
-      //   return this.previous + '%'
-      // }
     },
   },
   methods: {},
@@ -73,7 +56,7 @@ export default {
   &:before {
     content: attr(data-title);
     display: inline-block;
-    color:rgba(223,241,254,.8);
+    color: #fff;
     position: absolute;
     bottom: -200%;
     font-size: 12px;
@@ -82,7 +65,7 @@ export default {
   &:after {
     content: attr(data-rate);
     display: inline-block;
-    color: rgba(223, 241, 254, .8);
+    color: #fff;
     position: absolute;
     bottom: -200%;
     right: 0;

src/views/copilot/efficiency/components/sub/std/StdRateItem.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-07 10:25:10
- * @LastEditTime: 2024-07-09 15:04:24
+ * @LastEditTime: 2024-05-29 17:03:00
  * @LastEditors: zhp
  * @Description:
 -->
@@ -10,31 +10,31 @@
   <div v-if="period == '日'" class="std-rate-item">
     <CityName :value="city.name" />
     <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" />
-      <preProgressBar :period="period" :title="titlePre" :previous="city.previous" />
+      <ProgressBar :period="period" :title="titlePre" :value="city.previous" />
     </div>
   </div>
   <div v-else-if="period == '周'" class="std-rate-item">
     <CityName :value="city.name" />
     <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" />
-      <preProgressBar :period="period" :title="titlePre" :previous="city.previous" />
+      <ProgressBar :period="period" :title="titlePre" :value="city.previous" />
     </div>
   </div>
   <div v-else-if="period == '月'" class="std-rate-item">
     <CityName :value="city.name" />
     <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" />
-      <preProgressBar :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 v-else="period == '年'" class="std-rate-item">
     <CityName :value="city.name" />
     <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" />
-      <preProgressBar :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>
 </template>
@@ -42,12 +42,10 @@
 <script>
 import CityName from "./CityName.vue";
 import ProgressBar from "./ProgressBar.vue";
-import preProgressBar from "./preProgressBar.vue";
-
 
 export default {
   name: "StdRateItem",
-  components: { CityName, ProgressBar, preProgressBar },
+  components: { CityName, ProgressBar },
   props: {
     city: {
       type: Object,
@@ -71,25 +69,22 @@ export default {
     titlePre() {
       console.log(this.city);
       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 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 === '同比') {
-        return `${year - 1}年${yesterday}日`
+        return `去年${month}月${today}日`
       } else if (this.period === '日' && this.than === '环比') {
-        return `${dayBeYes}日`
+        return `${yesterday}日`
       } else if (this.period === '周' && this.than === '同比') {
-        return `${year-1}年本周`
+        return `去年本周`
       } else if (this.period === '周' && this.than === '环比') {
         return `上周`
       } else if (this.period === '月' && this.than === '同比') {
-        return `${year-1}年${month}月`
+        return `去年${month}月`
       } else if (this.period === '月' && this.than === '环比') {
         return `${lastMonth}月`
       } else {
@@ -98,18 +93,14 @@ export default {
     },
     title() {
       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 month = new Date().getMonth() + 1;
       const year = new Date().getFullYear();
       if (this.period === '日' && this.than === '同比') {
-        return `${yesterday}日`
+        return `${month}月${today}日`
       } else if (this.period === '日' && this.than === '环比') {
-        return `${yesterday}日`
+        return `${month}月${today}日`
       } else if (this.period === '周' && this.than === '同比') {
         return `本周`
       } else if (this.period === '周' && this.than === '环比') {
@@ -129,13 +120,9 @@ export default {
       const month = new Date().getMonth() + 1;
       const year = new Date().getFullYear();
       if (this.period === '月') {
-        return `${month}月目标${this.city.target}%`
+        return `${month}月目标`
       } 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}%`
       }
     },
   },
@@ -150,7 +137,7 @@ export default {
   align-items: center;
   gap: 8px;
   flex: 1 1 auto;
-  padding: 16px;
+  padding: 12px;
 }
 
 .std-rate-item__value {

src/views/copilot/efficiency/components/sub/std/preProgressBar.vue

@@ -1,132 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-27 09:12:54
- * @LastEditTime: 2024-07-22 17:03:48
- * @LastEditors: zhp
- * @Description:
--->
-
-<template>
-  <div class="progress-bar" :data-title="title" :data-rate="previous + '%'">
-    <div class="progress-bar__rate" :style="{ width: dataRate == '-' ? 0 : dataRate }"></div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "ProgressBar",
-  components: {},
-  props: {
-    value: {
-      type: Number,
-      default: 0,
-    },
-    target: {
-      type: Number,
-      default: 0,
-    },
-    previous: {
-      type: Number,
-      default: 0,
-    },
-    current: {
-      type: Number,
-      default: 0,
-    },
-    // total: {
-    //   type: Number,
-    //   default: 0,
-    // },
-    title: {
-      type: String,
-      default: "",
-    },
-  },
-  data() {
-    return {};
-  },
-  computed: {
-    dataRate() {
-      // if (this.current != 0 && this.target != 0) {
-        // console.log( '1111111111', this.current, this.target,this.previous);
-      return this.previous >= 100 ? 100 + '%' : parseFloat(this.previous).toFixed(2) + '%';
-      // } else if(this.previous != 0) {
-      //   return this.previous + '%'
-      // }
-    },
-  },
-  methods: {},
-};
-</script>
-
-<style scoped lang="scss">
-
-
-.progress-bar {
-  height: 10px;
-  background-color: #002f6b;
-  border-radius: 4px;
-  margin-bottom: 12px;
-  position: relative;
-
-  &:before {
-    content: attr(data-title);
-    display: inline-block;
-    color: rgba(223, 241, 254, .8);
-    position: absolute;
-    bottom: -200%;
-    font-size: 12px;
-  }
-
-  &:after {
-    content: attr(data-rate);
-    display: inline-block;
-    color: rgba(223, 241, 254, .8);
-    position: absolute;
-    bottom: -200%;
-    right: 0;
-    font-size: 12px;
-  }
-
-  &:first-child {
-    &:after {
-      color: #11eae3;
-    }
-  }
-
-  &:nth-child(2) {
-    &:after {
-      color: #0e65fd;
-    }
-  }
-
-  .progress-bar__rate {
-    position: absolute;
-    display: inline-block;
-    height: 100%;
-    width: 0;
-    border-radius: 4px;
-     background: linear-gradient(to right,
-          #004c5e11 10%,
-          #004c5e,
-          #0ac0c0,
-          #11eae3);
-  }
-
-  &:first-child {
-    .progress-bar__rate {
-      background: linear-gradient(to right,
-          #004c5e11 10%,
-          #004c5e,
-          #0ac0c0,
-          #11eae3);
-    }
-  }
-
-  &:nth-child(2) {
-    .progress-bar__rate {
-      background: linear-gradient(to right, #0048a811, #0048a8, #0e65fd);
-    }
-  }
-}
-</style>

src/views/copilot/efficiency/index.vue

@@ -1,48 +1,39 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-07 10:04:53
- * @LastEditTime: 2024-07-09 15:16:43
+ * @LastEditTime: 2024-05-30 11:13:01
  * @LastEditors: zhp
  * @Description:
 -->
 
 <template>
   <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>
 </template>
 
 <script>
-import Container from "@/views/copilot/components/efficiencyRightContainer.vue";
+import Container from "@/views/copilot/components/Container.vue";
-import leftContainer from "@/views/copilot/components/efficiencyLeftContainer.vue";
-
 import ChipOeeVue from "./components/ChipOee.vue";
 import ChipRateVue from "./components/ChipRate.vue";
 import StdRateVue from "./components/StdRate.vue";
 import TransformRateVue from "./components/TransformRate.vue";
 
 export default {
-  name: "efficiencyCopilot",
+  name: "EfficiencyCopilot",
   components: {
     Container,
-    leftContainer,
     ChipOee: ChipOeeVue,
     ChipRate: ChipRateVue,
     StdRate: StdRateVue,
@@ -97,30 +88,7 @@ export default {
 };
 </script>
 
-
 <style scoped>
-.efficiency-copilot {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  gap: 20px;
-}
-
-.flex {
-  display: flex;
-  gap: 20px;
-  flex: 1;
-}
-
-.top > div,
-.bottom > div {
-  height: 100%;
-}
-
-</style>
-
-<!-- <style scoped>
-
 .efficiency-copilot {
   flex: 1;
   display: grid;
@@ -132,4 +100,4 @@ export default {
 .efficiency-copilot > div {
   height: 100%;
 }
-</style> -->
+</style>

src/views/copilot/efficiency/options/chipOptions.js

@@ -1,187 +1,163 @@
- export default ({
+export default function ({
+  single = false,
+  color,
   titleValue,
   subtitle,
-  titleSize,
-  subtitleSize,
   previousSum,
   currentSum,
   targetSum,
-  currentName,
+}) {
-  preName,
+  return {
-  yesterday,
+    grid: {
-}) => ({
+      left: 0,
-  grid: {
+      right: 0,
-    left: 300,
+      bottom: 0,
-    right: 0,
+      top: 0,
-    bottom: 0,
+      containLabel: true,
-    top: 0,
-    containLabel: true,
-  },
-  tooltip: {
-    trigger: "item",
-    extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);',
-    backgroundColor: '#001829',
-    borderColor: '#001829',
-  },
-  title: {
-    text: titleValue,
-    left: "48%",
-    top: "middle",
-    textAlign: "center",
-    textVerticalAlign:'auto',
-    textStyle: {
-      fontWeight: 400,
-      fontSize: titleSize,
-       color: "rgba(223,241,254,1)",
     },
-    subtext: `\u2002${yesterday + '日良率'}\u2002`,
+    tooltip: {
-    subtextStyle: {
+      // formatter(params) {
-      fontSize: subtitleSize,
+      //   return `${params.name}: ${(params.value * 100).toFixed(0)}%`;
-      fontWeight: 100,
+      // }
-      color: "rgba(255,255,255,.7)",
-      align: "right",
     },
-  },
+    title: {
-  series: [
+      text: titleValue,
-    // 背景 series
+      left: "49%",
-    {
+      top: "39%",
-      type: "pie",
+      textAlign: "center",
-      name: "当前良率",
+      textStyle: {
-       radius: ["80%", "92%"],
+        fontWeight: 600,
-       center: ["50%", "50%"],
+        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: ["80%", "92%"],
+        type: "pie",
-      center: ["50%", "50%"],
+        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,
-            backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
+        },
-          extraCssText: 'padding:0;border-width:0',
+        labelLine: {
-          formatter:`
+          show: false,
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
+        },
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
+        data: [
-              <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${currentName}</span>
+          {
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${currentSum}</span>
+            value: currentSum,
-              </div>
+            name: "当前良率",
-              `
+            selected: false,
-          },
+            itemStyle: {
-          selected: false,
+              borderJoin: "round",
-          itemStyle: {
+              borderCap: "round",
-            borderJoin: "round",
+              borderWidth: 12,
-            borderCap: "round",
+              borderRadius: "50%",
-            borderWidth: 12,
+              color: {
-            borderRadius: "50%",
+                type: "linear",
-            color: {
+                x: 1,
-              type: "linear",
+                y: 0,
-              x: 1,
+                x2: 0,
-              y: 0,
+                y2: 1,
-              x2: 0,
+                colorStops: single
-              y2: 1,
+                  ? [
-              colorStops: [
+                      { offset: 0, color: `${color}11` },
-                { offset: 0, color: "#4CF0E811" },
+                      { offset: 1, color: `${color}` },
-                { offset: 1, color: "#4CF0E8" },
+                    ]
-              ],
+                  : [
+                      { 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
-           backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
+                ? currentSum == 0
-          extraCssText: 'padding:0;border-width:0',
+                  ? 1
-          formatter:`
+                  : 0
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
+                : targetSum,
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
+
-              <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${currentName}</span>
+            name: "未达成",
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${currentSum}</span>
+            itemStyle: { color: "transparent" },
-              </div>
+            label: { show: false },
-              `
           },
-          itemStyle: { color: "transparent" },
+        ],
-          label: { show: false },
-        },
-      ],
-    },
-    // 数据 series2 - 2023累计
-    {
-      type: "pie",
-      radius: ["70%", "80%"],
-      center: ["50%", "50%"],
-      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%"],
-           tooltip: {
+            avoidLabelOvervlap: false,
-           backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
+            label: {
-            extraCssText: 'padding:0;border-width:0',
+              show: false,
-            formatter:`
-                <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-                  <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${preName}</span>
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${previousSum}</span>
-                </div>
-                `
-          },
-          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" },
-              ],
             },
+            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: preName,
-          tooltip: {
-             backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-            extraCssText: 'padding:0;border-width:0',
-            formatter:`
-                <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-                  <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${preName}</span>
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${previousSum}</span>
-                </div>
-                `
-          },
-          itemStyle: { color: "transparent" },
-          label: { show: false },
-        },
-      ],
-    },
-  ],
-});

src/views/copilot/efficiencyContainer.vue

@@ -1,13 +1,13 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-20 16:04:18
- * @LastEditTime: 2024-06-03 16:46:11
+ * @LastEditTime: 2024-05-30 11:14:17
  * @LastEditors: zhp
  * @Description:
 -->
 <template>
   <!-- <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"
       @update:period="period = $event" @update:than="updateThan" />
 
@@ -25,7 +25,7 @@ import CopilotHeaderVue from "./components/CopilotHeader.vue";
 import EfficiencyCopilot from "./efficiency/index.vue";
 
 export default {
-  name: "copilotEfficiencyContainer",
+  name: "CopilotContainer",
   components: {
     CopilotHeaderVue,
     EfficiencyCopilot,
@@ -34,7 +34,7 @@ export default {
     return {
       than:'同比',
       page: "效率",
-      period: "月",
+      period: "日",
       currentsStyles: '',
     };
   },
@@ -95,14 +95,13 @@ export default {
 </script>
 <style>
 
-
 .copilot-layout {
   padding: 16px;
   background: url(../../assets/images/copilot-bg.png) 0 0 / 100% 100% no-repeat;
   position: absolute;
   left: -16px;
   /* top: -8px; */
-  height: calc(100% + 30px);
+  /* height: calc(100% + 38px); */
   width: calc(100% + 30px);
   z-index: 1001;
   color: #fff;
@@ -111,12 +110,12 @@ export default {
   gap: 8px;
 }
 
-/* .produce{
+.produce{
   height: calc(100% + 38px);
-} */
+}
-/* .other { */
+.other {
-  /* height: calc(100% + 240px); */
+  height: calc(100% + 240px);
-/* } */
+}
 .copilot-footer {
   /** position: absolute;
   bottom: 10px; **/

src/views/copilot/factoryData/bbIndex.vue

@@ -1,16 +1,16 @@
 <template>
   <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">
       <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"
             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
         </db-container>
-        <left-container title="工单监控" icon="order">
+        <db-container title="工单监控" icon="order">
           <order :prodOrder="prodOrder" />
-        </left-container>
+        </db-container>
         <!-- <db-container title="" icon="store"> -->
         <!-- <store :stock="stock" /> -->
         <!-- </db-container> -->
@@ -26,9 +26,8 @@
 </template>
 <script>
 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/bipvProdMonitor.vue";
 import { deepClone } from "@/utils";
 // import Store from "./components/Store.vue";
 // import Energy from "./components/Energy.vue";
@@ -39,7 +38,6 @@ export default {
   components: {
     FactoryDataHeader,
     DbContainer: Container,
-    LeftContainer: leftContainer,
     ProdMonitor,
     // Store,
     // Energy,

src/views/copilot/factoryData/cdIndex.vue

@@ -8,9 +8,9 @@
           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
         </db-container>
-        <left-container title="工单监控" icon="order">
+        <db-container title="工单监控" icon="order">
           <order :prodOrder="prodOrder" />
-        </left-container>
+        </db-container>
         <!-- <db-container title="" icon="store"> -->
         <!-- <store :stock="stock" /> -->
         <!-- </db-container> -->
@@ -26,9 +26,8 @@
 </template>
 <script>
 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/bipvProdMonitor";
 import { deepClone } from "@/utils";
 // import Store from "./components/Store.vue";
 // import Energy from "./components/Energy.vue";
@@ -39,7 +38,6 @@ export default {
   components: {
     FactoryDataHeader,
     DbContainer: Container,
-    LeftContainer: leftContainer,
     ProdMonitor,
     // Store,
     // Energy,

src/views/copilot/factoryData/components/BarChartBase.vue

@@ -1,36 +1,22 @@
 <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"
         :style="{ fontSize: isFullscreen ? '0.85vw' : '0.73vw' }">{{ item.label }}</span>
     </div> -->
-
+    <div id="factoryEnergyChart" style="width: 100%; height: 100%"></div>
-      <div v-if="energyCockpits.length != 0" id="factoryEnergyChart" style="width: 100%; height: 100%"></div>
+  </div>
-    </div>
-  </chart-container>
 </template>
 <script>
 import { debounce } from "@/utils/debounce";
 import * as echarts from "echarts";
-import ChartContainer from "../../components/ChartContainer.vue";
-
-// import CopilotButton from "./chartButton"
 export default {
-  components: {
-    ChartContainer
-    // CopilotButton,
-  },
   name: "Energy",
   props: {
     // legend: {
     //   type: Array,
     //   required: true,
     // },
-    type: {
-      type: String,
-      default:'目标产量'
-    },
     energyCockpits: {
       type: Array,
       required: true,
@@ -41,54 +27,16 @@ export default {
       isFullscreen: false,
       actualOptions: null,
       chart: "",
-      data: [],
-      orderXAxis:[],
-      // obj:{
-      //   seriesArr: [],
-      //   targetProduceArr: [],
-      //   planIn: [],
-      //   acIn: [],
-      //   acProduceArr: [],
-      //   scrapNum: [],
-      //   processNum: [],
-      // },
       options: {
         color: ["#FFD160", "#2760FF", "#12FFF5"],
         grid: {
-          left: "9%",
+          left: "7%",
-          right: "0%",
+          right: "7%",
-          bottom: "15%",
+          bottom: "8%",
           top: "15%",
         },
         tooltip: {
           trigger: "axis",
-          axisPointer: {
-            // type: "cross",
-            crossStyle: {
-              color: "rgba(237,237,237,0.5)",
-            },
-          },
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-          formatter: params => {
-            var res = ``;
-            for (var i = 0, l = params.length; i < l; i++) {
-              let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : ''
-              // console.log(item.color, color);
-              res +=
-                `<span style='border-radius:2px;display:inline-block;margin-right:4px;width:12px;height:12px;background-color:${color}'></span>` +
-                `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${params[0].axisValueLabel}</span>` +
-                `<span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${params[i].value ? params[i].value  : 0}</span>`;
-            }
-            const htmlContent = `
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                ${res}
-              </div>
-              `;
-
-            return htmlContent;
-            // return res;
-          },
         },
         xAxis: {
           axisTick: {
@@ -100,40 +48,25 @@ export default {
             },
           },
           axisLabel: {
-            interval: 0,//设置横坐标为斜
+            color: "rgba(255, 255, 255, 0.7)",
-            rotate:45,
+            fontSize: 12,
-            color: "rgba(223,241,254,.8)",
-            fontSize: 16,
-            // formatter: function (value) {
-            //   console.log(value);
-
-            //   return value;
-            // },
           },
           data: [],
         },
-        // dataZoom: [
-        //   {
-        //     // show: true,
-        //     start: 0,
-        //     end: 50
-        //   }
-        //   ],
         yAxis: {
             type: "value",
             name: "单位/片",
-            position: 'left',
             nameTextStyle: {
-              color: "rgba(223,241,254,.8)",
+              color: "rgba(255, 255, 255, 0.7)",
-              fontSize: 16,
+              fontSize: 12,
               align: "right",
             },
             axisTick: {
               show: false,
             },
             axisLabel: {
-              color: "rgba(223,241,254,.8)",
+              color: "rgba(255, 255, 255, 0.7)",
-              fontSize:16,
+              fontSize: 12,
             },
             axisLine: {
               show: true,
@@ -143,7 +76,7 @@ export default {
             },
             splitLine: {
               lineStyle: {
-                color: "rgba(69,97,174,.4)",
+                color: "#4561AE",
               },
             },
           },
@@ -201,7 +134,7 @@ export default {
             //     { offset: 1, color: "#12FFF5" + "00" },
             //   ]),
             // },
-            barWidth: 16,
+            barWidth: 12,
             itemStyle: {
               borderRadius: [10, 10, 0, 0],
               color: {
@@ -239,17 +172,14 @@ export default {
     },
   },
   watch: {
-    type(val) {
-      this.initChart()
-    },
     /** 全屏状态切换时，对柱子粗细和字体大小进行相应调整 */
     // isFullscreen(val) {
     //   this.actualOptions.series.map((item) => {
-    //     item.barWidth = val ? 18 : 16;
+    //     item.barWidth = val ? 18 : 12;
     //   });
-    //   this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+    //   this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-    //   this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+    //   this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-    //   this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+    //   this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
     //   this.initOptions(this.actualOptions);
     // },
     // series(val) {
@@ -267,9 +197,9 @@ export default {
     //   this.actualOptions = actualOptions;
     //   this.initOptions(actualOptions);
     // },
-    // energyCockpits() {
+    energyCockpits() {
-    //   this.initChart();
+      this.initChart();
-    // },
+    },
     isOpen(val) {
       this.canvasReset();
     },
@@ -298,81 +228,17 @@ export default {
       }, 500)();
     },
     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 = [
       //   {
@@ -414,21 +280,20 @@ export default {
       //     }
       //   }
       // }
-
+      if (this.chart) {
+        this.chart.dispose();
+      }
+      this.chart = echarts.init(document.getElementById("factoryEnergyChart"));
+      const actualOptions = JSON.parse(JSON.stringify(this.options));
+      actualOptions.xAxis.data = orderXAxis;
+      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;
-      if (this.chart) {
+      this.actualOptions = actualOptions;
-        this.chart.dispose();
+      this.chart.setOption(actualOptions);
-      }
-      this.chart = echarts.init(document.getElementById("factoryEnergyChart"));
-      // const actualOptions = JSON.parse(JSON.stringify(this.options));
-      this.options.xAxis.data = this.orderXAxis;
-      this.options.series[0].data = this.data;
-      // this.actualOptions = actualOptions;
-      this.chart.setOption(this.options);
     },
   },
 };

src/views/copilot/factoryData/components/BarChartChipOEE.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-30 08:58:39
- * @LastEditTime: 2024-07-26 16:48:15
+ * @LastEditTime: 2024-05-30 10:38:32
  * @LastEditors: zhp
  * @Description:
 -->
@@ -9,9 +9,9 @@
   <chart-container class="bar-chart-base">
     <div class="legend">
       <span v-for="(item,index) in legend" :key="index" class="legend-item"
-        :style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
+        :style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
     </div>
-    <div ref="oeeChart" style="height:100%"></div>
+    <div ref="oeeChart" style="height:96%;width:100%"></div>
   </chart-container>
 </template>
 
@@ -56,70 +56,13 @@ export default {
       actualOptions: null,
       options: {
         grid: {
-          left: "10%",
+          left: "5%",
-          right: "3%",
+          right: "0%",
-          bottom: "14%",
+          bottom: "3%",
-          top: "20%",
+          top: "15%",
-          // containLabel: true,
+          containLabel: true,
-        },
-        // tooltip: {
-        //   trigger: "axis",
-        //   axisPointer: {
-        //     // type: "cross",
-        //     crossStyle: {
-        //       color: "rgba(237,237,237,0.5)",
-        //     },
-        //   },
-        //   extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);',
-        //   backgroundColor: '#001829',
-        //   borderColor: '#001829',
-        //   // textStyle: {
-        //   //   color:'rgba(255, 255, 255, 0.85)'
-        //   // },
-        //   formatter: params => {
-        //     console.log('params', params)
-        //     var res = `<span style='color:rgba(255,255,255,0.85)'>${params[0].axisValueLabel}</span>`;
-        //     for (var i = 0, l = params.length; i < l; i++) {
-        //       res +=
-        //         "<br/>" +
-        //         `<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${params[i].color}'></span>` +
-        //         `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].seriesName}</span>` +
-        //         `<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value}</span>`;
-        //     }
-        //     return res;
-        //   },
-        // },
-        tooltip: {
-          trigger: "axis",
-          axisPointer: {
-            // type: "cross",
-            crossStyle: {
-              color: "rgba(237,237,237,0.5)",
-            },
-          },
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-          formatter: params => {
-            var res = `<span style='display:inline-block;color:rgba(255,255,255,0.85);margin-bottom:8px;font-size:16px;letter-spacing: 2px;'>${params[0].axisValueLabel}</span>`;
-            for (var i = 0, l = params.length; i < l; i++) {
-              let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : ''
-              // console.log(item.color, color);
-              res +=
-                "<br/>" +
-                `<span style='border-radius:2px;display:inline-block;margin-right:4px;width:12px;height:12px;background-color:${color}'></span>` +
-                `<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:16px;letter-spacing: 2px;'>${params[i].seriesName}</span>` +
-                `<span style='display:inline-block;width:60px;color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;text-align:right'>${params[i].value ? params[i].value : 0}</span>`;
-            }
-            const htmlContent = `
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                ${res}
-              </div>
-              `;
-
-            return htmlContent;
-            // return res;
-          },
         },
+        tooltip: {},
         xAxis: {
           axisTick: {
             show: false,
@@ -130,25 +73,23 @@ export default {
             },
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           data: this.xAxis,
         },
         yAxis: {
-          name: "单位/片",
+          name: "单位/%",
-          position: 'left',
           nameTextStyle: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
-            align: "right",
           },
           axisTick: {
             show: false,
           },
           axisLabel: {
-            color: "rgba(223,241,254,.8)",
+            color: "#fff",
-            fontSize: 16,
+            fontSize: 12,
           },
           axisLine: {
             show: true,
@@ -158,15 +99,15 @@ export default {
           },
           splitLine: {
             lineStyle: {
-              color: "rgba(69,97,174,.4)",
+              color: "#4561AE",
             },
           },
         },
         series: [
           {
-            name: "FTO", // this.series[0].name,
+            name: "fto", // this.series[0].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             itemStyle: {
               borderRadius: [10, 10, 0, 0],
               color: {
@@ -201,7 +142,7 @@ export default {
           {
             name: "", // this.series[1].name,
             type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             // tooltip: {
             //   valueFormatter: function (value) {
             //     return value + " ml";
@@ -232,11 +173,32 @@ export default {
           },
           {
             name: "", // "2024年目标值",
-            type: "line",
+            type: "bar",
-            barWidth: 16,
+            barWidth: 12,
             itemStyle: {
               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,
           },
@@ -259,12 +221,12 @@ export default {
     },
     /** 全屏状态切换时，对柱子粗细和字体大小进行相应调整 */
     isFullscreen(val) {
-      this.options.series.map((item) => {
+      this.actualOptions.series.map((item) => {
-        item.barWidth = val ? 18 : 16;
+        item.barWidth = val ? 18 : 12;
       });
-      this.options.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      this.options.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      this.options.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
       // if (val === false && this.isOpen === true) {
       //   console.log(val)
       //   this.width = 97 + '%'
@@ -274,12 +236,12 @@ export default {
       //   this.canvasReset()
       // }
       // this.actualOptions.series.map((item) => {
-      //   item.barWidth = val ? 18 : 16;
+      //   item.barWidth = val ? 18 : 12;
       // });
-      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
-      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 16;
+      // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
-      this.initChart(this.options)
+      this.initChart(this.actualOptions)
       this.canvasReset()
     },
     series(val) {
@@ -289,17 +251,16 @@ export default {
       }
       // console.log('val', val)
       const actualOptions = JSON.parse(JSON.stringify(this.options))
-      console.log(actualOptions);
       // actualOptions.xAxis.data = val
       console.log(actualOptions)
-      this.options.series[0].data = val[0].data;
+      actualOptions.series[0].data = val[0].data;
-      this.options.series[0].name = val[0].name;
+      actualOptions.series[0].name = val[0].name;
-      this.options.series[1].data = val?.[1]?.data;
+      actualOptions.series[1].data = val?.[1]?.data;
-      this.options.series[1].name = val?.[1]?.name;
+      actualOptions.series[1].name = val?.[1]?.name;
-      this.options.series[2].data = val?.[2]?.data || [];
+      actualOptions.series[2].data = val?.[2]?.data || [];
-      this.options.series[2].name = val?.[2]?.name || "";
+      actualOptions.series[2].name = val?.[2]?.name || "";
       this.actualOptions = actualOptions;
-      this.initChart(this.options);
+      this.initChart(actualOptions);
     },
   },
   mounted() {
@@ -336,28 +297,27 @@ export default {
         this.chart.dispose();
       }
       this.chart = echarts.init(this.$refs.oeeChart);
-      this.chart.setOption(this.options);
+      this.chart.setOption(this.actualOptions);
     },
   },
 };
 </script>
 
 <style scoped lang="scss">
-
 .bar-chart-base {
   // position: relative;
 
   .legend {
     position: absolute;
-    top: 6vh;
+    top: 5.2vh;
-    right: 13vw;
+    right: 1vw;
   }
 
   .legend-item {
     position: relative;
-    font-size: 1.2vw;
+    // font-size: 12px;
-    margin-right:1.2vw;
+    margin-right: 1.3vw;
-    color: #DFF1FE;
+
     &::before {
       content: "";
       display: inline-block;
@@ -368,9 +328,7 @@ export default {
       margin-right: 0.22vw;
     }
   }
-  .legend-item:nth-child(3) {
+
-      margin-left: 1vw;
-  }
   .legend-item:nth-child(1):before {
     background-color: #12f7f1;
   }
@@ -378,37 +336,8 @@ export default {
   .legend-item:nth-child(2):before {
     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%);
- }
 }
- .echarts-tooltip-dark {
-   background: #001829;
-
- }
 </style>

src/views/copilot/factoryData/components/ChartContainer.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-30 09:00:01
- * @LastEditTime: 2024-07-24 10:31:52
+ * @LastEditTime: 2024-05-30 09:50:02
  * @LastEditors: zhp
  * @Description:
 -->
@@ -19,7 +19,7 @@ export default {
   props: {
     noScroll: {
       type: Boolean,
-      default: true,
+      default: false,
     },
   },
   data() {

src/views/copilot/factoryData/components/ChipOee.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-29 14:48:06
- * @LastEditTime: 2024-06-18 14:49:25
+ * @LastEditTime: 2024-05-30 10:54:00
  * @LastEditors: zhp
  * @Description:
 -->
@@ -41,7 +41,7 @@ export default {
   },
   data() {
     // 城市数组的顺序必须是固定的
-    const cities = ["FTO投入", "芯片产量", "标准组件产量"];
+    const cities = ["fto投入", "芯片产量", "标准组件产量"];
     return {
       // xAxis: cities,
     };
@@ -49,25 +49,13 @@ export default {
   computed: {
     xAxis() {
       console.log(' this.companyId', this.companyId);
-      return this.companyId === 0 ? ["FTO投入", "芯片产量", "标准组件产量"] : ["FTO投入", "芯片产量", "标准组件产量", 'BIPV产量'];
+      return this.companyId === 0 ? ["fto投入", "芯片产量", "标准组件产量"] : ["fto投入", "芯片产量", "标准组件产量", 'BIPV产量'];
     },
     legend() {
       let items = [];
       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()
-      //今天的时间
-      // 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();
       // day2.setTime(day2.getTime());
@@ -77,22 +65,19 @@ export default {
       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 === 1 && this.than === '同比') {
+      if (this.period === 1  && this.than === '同比') {
         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 = [
-          { label: `${dayBeYes}日累计` },
+          { label: `${yesterday}日`, color: "#12f7f1" },
-          { label: `${yesterday}日累计` },
+          { label: `${month}月${today}日`, color: "#58adfa" },
-          // { label: `${month}月${today}日目标`, },
         ];
       } else if (this.period === 2 && this.than === '同比') {
         items = [
-          { label: `${year-1}年本周`, color: "#12f7f1" },
+          { label: `去年本周`, color: "#12f7f1" },
           { label: `本周`, color: "#58adfa" },
         ];
       } else if (this.period === 2 && this.than === '环比') {
@@ -102,7 +87,7 @@ export default {
         ];
       } else if (this.period === 3 && this.than === '同比') {
         items = [
-          { label: `${year-1}年${month}月`, color: "#12f7f1" },
+          { label: `去年${month}月`, color: "#12f7f1" },
           { label: `${month}月`, color: "#58adfa" },
           { label: `${month}月目标`, color: "#58adfa" },
           // { label: `${month}月目标`, value: valueTuple[2] },
@@ -173,11 +158,8 @@ function getTemplate(period, dataList, than) {
   // console.log('dataList',dataList);
   let items = [];
   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()
   //今天的时间
   // var day2 = new Date();
   // day2.setTime(day2.getTime());
@@ -190,11 +172,11 @@ function getTemplate(period, dataList, than) {
   if (period === 1 && than === '同比') {
     items = [
       {
-        name: `${year - 1}年${yesterday}日`,
+        name: `去年${month}月${today}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
@@ -202,11 +184,11 @@ function getTemplate(period, dataList, than) {
   } else if (period ===1 && than === '环比') {
     items = [
       {
-        name: `${dayBeYes}日`,
+        name: `${yesterday}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
@@ -214,7 +196,7 @@ function getTemplate(period, dataList, than) {
   } else if (period === 2 && than === '同比') {
     items = [
       {
-        name: `${year-1}年本周`,
+        name: `去年本周`,
         data: dataList ? dataList[0] : [],
       },
       {
@@ -238,7 +220,7 @@ function getTemplate(period, dataList, than) {
   } else if (period === 3 && than === '同比') {
     items = [
       {
-        name: `${year-1}年${month}月`,
+        name: `去年${month}月`,
         data: dataList ? dataList[0] : [],
       },
       {

src/views/copilot/factoryData/components/Container.vue

@@ -1,17 +1,26 @@
-<!--
+<!-- 
- * @Author: zhp
+    filename: Container.vue
- * @Date: 2024-07-08 13:51:30
+    author: liubin
- * @LastEditTime: 2024-07-19 10:43:18
+    date: 2024-04-09 10:44:09
- * @LastEditors: zhp
+    description: 
- * @Description:
 -->
 
 <template>
-  <div class="dashboard-container">
+  <div class="copilot-container">
     <!-- refresh btn  -->
     <button
-      v-if="0"
+      v-if="false"
-      style="appearance: none; outline: none; border: none; background: none; color:#fff; cursor: pointer; position: absolute; top: 8px; right: 8px"
+      style="
+        appearance: none;
+        outline: none;
+        border: none;
+        background: none;
+        color: #fff;
+        cursor: pointer;
+        position: absolute;
+        top: 8px;
+        right: 8px;
+      "
       @click="$emit('refresh')"
     >
       <svg
@@ -39,7 +48,7 @@
       class="container-head"
       :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']"
     >
-      <Icon style="margin-left: 16px;" :icon="icon"></Icon>
+      <Icon :icon="icon"></Icon>
       <h2 class="container-title">{{ title }}</h2>
     </div>
     <div
@@ -83,19 +92,38 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.dashboard-container {
+.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: 85%;
+    width: 60%;
     height: 0.31415vh;
     border-radius: 2px;
     left: 8%;
@@ -106,14 +134,14 @@ export default {
 
   .container-head {
     // height: 40px;
-    height:4vh;
+    height: 3.8vh;
     padding: 8px;
     display: flex;
     align-items: center;
     gap: 8px;
 
     .container-title {
-      font-size: 1vw;
+      font-size: 1.18vw;
       line-height: 1.39vw;
       font-weight: normal;
       letter-spacing: 2px;
@@ -133,8 +161,8 @@ export default {
     position: absolute;
     // width: 16px;
     // height: 16px;
-    width: 0.7vw;
+    width: 0.95vw;
-    height: 0.7vw;
+    height: 0.95vw;
   }
 
   .corner.tl {

src/views/copilot/factoryData/components/ContainerIcon.vue

@@ -1,15 +1,8 @@
-<!--
+<!-- 
- * @Author: zhp
- * @Date: 2024-06-03 15:38:31
- * @LastEditTime: 2024-07-09 16:49:22
- * @LastEditors: zhp
- * @Description:
--->
-<!--
     filename: ContainerIcon.vue
     author: liubin
     date: 2024-04-09 16:41:36
-    description:
+    description: 
 -->
 
 <template>
@@ -56,8 +49,8 @@ export default {
 .container-icon {
   //   width: 32px;
   //   height: 32px;
-  width: 1.4vw;
+  width: 1.701vw;
-  height: 1.4vw;
+  height: 1.701vw;
   background: #ccc2;
 }
 </style>

src/views/copilot/factoryData/components/Order.vue

@@ -1,20 +1,14 @@
 <template>
   <div class="order-container">
     <div class="table">
-      <dv-scroll-board v-if="showTable" :config="config"
+      <dv-scroll-board v-if="showTable" :config="config" style="width: 100%; height: 100%" ref="orderScrollBoard" />
-        style="width: 100%; height: 100%; color: rgba(255, 255, 255,1);font-size:16," ref="orderScrollBoard" />
     </div>
     <div class="chart">
       <div class="chart-title">
-        <span class="title">工单情况</span>
+        <span class="title">生产情况</span>
         <span class="line"></span>
       </div>
-      <div class="button-type" style="margin-left: auto;position: absolute;right: 3%;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>
 
@@ -22,18 +16,14 @@
 <script>
 import { debounce } from "@/utils/debounce";
 import barChartBase from './BarChartBase'
-// import barChartBase from './BarChartBase'
-import CopilotButton from "./chartButton"
 export default {
   name: "Order",
   components: {
     barChartBase,
-    CopilotButton,
   },
   data() {
     return {
       showTable: true,
-      // type: '目标产量',
       config: {
         header: ["工单号", "工单状态", "计划投入", "实际投入", "目标产量", "实际产量", "生产进度"],
         headerBGC: "rgba(0, 106, 205, 0.22)",
@@ -41,19 +31,14 @@ export default {
         evenRowBGC: "rgba(rgba(2, 13, 45, 0.18)",
         data: [],
         rowNum: 12,
-        fontSize:16,
         waitTime: 3000,
-        columnWidth: [150],
+        columnWidth: [100],
-        align: ["left"],
+        align: ["center"],
         carousel: "page",
       },
     };
   },
   props: {
-    type: {
-      type: String,
-      default: "目标产量",
-    },
     prodOrder: {
       type: Array,
       default: [],
@@ -73,18 +58,9 @@ export default {
     },
   },
   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: {
-
     tableReset() {
       this.showTable = false;
       debounce(() => {
@@ -101,39 +77,53 @@ export default {
           let arr = [];
           // arr.push(i + 1);
           arr.push(
-            `<span title=${this.prodOrder[i].workOrderNumber || ""} style='color: rgba(223,241,254,.8);font-size:16px' >${
+            `<span title=${this.prodOrder[i].workOrderNumber || ""}>${
             this.prodOrder[i].workOrderNumber || ""
-            }</span>`,
+            }</span>`
-              `<span style='color: rgba(223,241,254,.8);font-size:16px' title=${this.prodOrder[i].orderStatus || ""}>${this.prodOrder[i].orderStatus === 1 ? '未开始' : this.prodOrder[i].orderStatus === 2 ? '进行中' : '已完成' || ""
+          );
-              }</span>`,
+          arr.push(
-              `<span style='color: rgba(223,241,254,.8);font-size:1.2em' title=${this.prodOrder[i].plannedInvestment || ""}>${this.prodOrder[i].plannedInvestment || ""
+            `<span title=${this.prodOrder[i].inStatus || ""}>${
-              }</span>`,
+            this.prodOrder[i].inStatus || ""
-              `<span style='color: rgba(223,241,254,.8);font-size:16px' title=${this.prodOrder[i].actualInvestment || ""}>${this.prodOrder[i].actualInvestment || ""
+            }</span>`
-              }</span>`,
+          );
-              `<span style='color: rgba(223,241,254,.8);font-size:16px' title=${this.prodOrder[i].targetProduction || ""}>${this.prodOrder[i].targetProduction || ""
+          arr.push(
-              }</span>`,
+            `<span title=${this.prodOrder[i].plannedInvestment || ""}>${
-              `<span style='color: rgba(223,241,254,.8);font-size:16px' title=${this.prodOrder[i].actualProduction || ""}>${this.prodOrder[i].actualProduction || ""
+            this.prodOrder[i].plannedInvestment || ""
-              }</span>`,
+            }</span>`
-              `<span style="display:inline-block;width:45px;color: rgba(223,241,254,.8)">${this.prodOrder[i].productionProgress
+          );
-                ? parseFloat((this.prodOrder[i].productionProgress * 100).toFixed(2)) + "%"
+          arr.push(
-                : "0%"
+            `<span title=${this.prodOrder[i].actualInvestment || ""}>${this.prodOrder[i].actualInvestment || ""
-              }</span>
+            }</span>`
-            <div style="display:inline-block;height:20px;vertical-align:top;margin-top:3px;">
+          );
-            <svg xmlns="http://www.w3.org/200/svg" height="18" width="18">
+          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;">
+            <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 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(2) *100 *
+            this.prodOrder[i].productionProgress
-                37.68 *
+            ? this.prodOrder[i].productionProgress.toFixed(0) *
-                0.01 +
+                      37.68 *
-                "," +
+                      0.01 +
-                (1 -
+                    "," +
-                  this.prodOrder[i].productionProgress.toFixed(2) * 0.01) * 100 *
+                    (1 -
-                37.68
+              this.prodOrder[i].productionProgress.toFixed(0) * 0.01) *
-                : 0 + "," + 37.68
+                      37.68
+                  : 0 + "," + 37.68
               }"/>
             </svg>
-          </div>`
+          </div>`);
-          )
           outArr.push(arr);
         }
         this.config.data = outArr;
@@ -157,6 +147,7 @@ export default {
           flex: 1;
           display: flex;
           flex-direction: column;
+
           // gap: 6px;
           .chart-title {
             margin-top: 5px;
@@ -189,9 +180,8 @@ export default {
               height: 1px; // display: inline-block;
               border: 1px solid;
               // display: inline-block;
-              // border-image: linear-gradient(to right, transparent 5%, rgba(95, 190, 249, 1) 20%, transparent 90%, )1;
+              border-image: linear-gradient(90deg, rgba(25, 146, 255, 0) 10%, rgba(95, 190, 249, 1), rgba(0, 120, 228, 0) 90%, ) 2 2;
-              border-image: linear-gradient(to right, transparent 10%, rgba(95, 190, 249, 1 )30%, transparent 90%,)1;
+              backdrop-filter: blur(3px);
-              // backdrop-filter: blur(3px);
             }
           }
         }

src/views/copilot/factoryData/components/ProdMonitor.vue

@@ -8,11 +8,11 @@
         </div>
         <div class="middle-box">
           <span class="type">玻璃类型</span>
-          <span class="type-name">FTO</span>
+          <span class="type-name">FTO投入</span>
         </div>
         <div class="right-box">
           <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 class="std-box">
@@ -23,12 +23,12 @@
           <div class="separate">
             <div>
               <span class="type">玻璃类型</span>
-              <span class="type-name">标准组件</span>
+              <span class="type-name">标准组检产量</span>
             </div>
             <div>
               <span class="type">良品数量</span>
               <span class="type-name">{{
-              msgObj.stand.goodNumber ? msgObj.stand.goodNumber.toLocaleString() : 0
+              msgObj.stand.goodNumber ? msgObj.stand.goodNumber : 0
               }}</span>
             </div>
           </div>
@@ -38,12 +38,12 @@
             <div>
               <span class="type">生产数量</span>
               <span class="num">{{
-              msgObj.stand.outputNumber ? msgObj.stand.outputNumber.toLocaleString() : 0
+              msgObj.stand.outputNumber ? msgObj.stand.outputNumber : 0
               }}</span>
             </div>
             <div>
               <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>
@@ -56,12 +56,12 @@
           <div class="separate">
             <div>
               <span class="type">玻璃类型</span>
-              <span class="type-name">芯片</span>
+              <span class="type-name">芯片产量</span>
             </div>
             <div>
               <span class="type">良品数量</span>
               <span class="type-name">{{
-              msgObj.chip.goodNumber ? msgObj.chip.goodNumber.toLocaleString() : 0
+              msgObj.chip.goodNumber ? msgObj.chip.goodNumber : 0
               }}</span>
             </div>
           </div>
@@ -71,12 +71,12 @@
             <div>
               <span class="type">生产数量</span>
               <span class="num">{{
-              msgObj.chip.outputNumber ? msgObj.chip.outputNumber.toLocaleString() : 0
+              msgObj.chip.outputNumber ? msgObj.chip.outputNumber : 0
               }}</span>
             </div>
             <div>
               <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>
@@ -89,12 +89,12 @@
           <div class="separate">
             <div>
               <span class="type">玻璃类型</span>
-              <span class="type-name">BIPV</span>
+              <span class="type-name">BIPV产量</span>
             </div>
             <div>
               <span class="type">良品数量</span>
               <span class="type-name">{{
-              msgObj.bipv.goodNumber ? msgObj.bipv.goodNumber.toLocaleString() : 0
+              msgObj.bipv.goodNumber ? msgObj.bipv.goodNumber : 0
               }}</span>
             </div>
           </div>
@@ -104,12 +104,12 @@
             <div>
               <span class="type">生产数量</span>
               <span class="num">{{
-              msgObj.bipv.outputNumber ? msgObj.bipv.outputNumber.toLocaleString() : 0
+              msgObj.bipv.outputNumber ? msgObj.bipv.outputNumber : 0
               }}</span>
             </div>
             <div>
               <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>
@@ -118,14 +118,10 @@
     <div class="chart">
       <div class="chart-title">
         <span class="title">生产情况</span>
-        <div class="button-than" style="position: absolute;right: 0%;">
+        <span class="line"></span>
-          <CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than"
-            @click="() => $emit('update:than', i)" />
-        </div>
-        <!-- <span class="line"></span> -->
       </div>
-      <barChartBase v-if="factoryData.length != 0" :companyId="companyId" :than="than" :period="period" :data="factoryData"
+      <barChartBase :companyId="companyId" :than="than" :period="period" :data="factoryData" ref="barChart"
-        ref="barChart" style="height: 0;flex:1">
+        style="height: 0;flex:1">
       </barChartBase>
     </div>
   </div>
@@ -133,12 +129,11 @@
 <script>
 import { number } from 'echarts';
 import barChartBase from './ChipOee'
-import CopilotButton from "./button.vue"
+
 export default {
   name: "ProdMonitor",
   components: {
     barChartBase,
-    CopilotButton
   },
   data() {
     return {
@@ -159,9 +154,6 @@ export default {
       type: Number,
       default:0
     },
-    than: {
-      type: String,
-    },
     than: {
       type: String,
       default: '同比',
@@ -190,14 +182,10 @@ export default {
   },
   mounted() {
     this.makeData();
-    this.$nextTick(() => {
-      let button = document.getElementsByClassName('button-than')
-      button[0].children[0].style.borderRadius = '4px 0 0 4px'
-      button[0].children[1].style.borderRadius = '0px 4px 4px 0'
-    })
   },
   methods: {
     makeData() {
+      console.log('msgObj', this.msgObj);
       this.msgObj.chip = {};
       this.msgObj.stand = {};
       this.msgObj.bipv = {};
@@ -222,13 +210,13 @@ export default {
   display: flex;
   flex-direction: column;
   .chart{
-    flex: 1.3;
+    flex: 1;
     display: flex;
     flex-direction: column;
     position: relative;
     // gap: 6px;
     .chart-title{
-      margin-top: 20px;
+      margin-top: 5px;
       // flex: 1;
       // gap: 6px;
       height: 1.5vw;
@@ -246,19 +234,19 @@ export default {
           // width: 5vw;
           color: #FFFFFF;
           line-height: 24px;
-          // text-align: left;
+          text-align: left;
           font-style: normal;
           display: inline-block;
       }
-      // .line{
+      .line{
-      //   flex: 1;
+        flex: 1;
-      //   // width: 80%;
+        // width: 80%;
-      //   height: 1px;        // display: inline-block;
+        height: 1px;        // display: inline-block;
-      //   border: 1px solid;
+        border: 1px solid;
-      //   // display: inline-block;
+        // display: inline-block;
-      //   border-image: linear-gradient(90deg, rgba(25, 146, 255, 0) 10%, rgba(95, 190, 249, 1), rgba(0, 120, 228, 0) 90%,) 2 2;
+        border-image: linear-gradient(90deg, rgba(25, 146, 255, 0) 10%, rgba(95, 190, 249, 1), rgba(0, 120, 228, 0) 90%,) 2 2;
-      //   backdrop-filter: blur(3px);
+        backdrop-filter: blur(3px);
-      // }
+      }
     }
   }
   .data{
@@ -360,7 +348,7 @@ export default {
         }
 
         .fto-box {
-          flex: .5;
+          flex: 1;
 
           .type::before {
             content: "";
@@ -379,15 +367,15 @@ export default {
         }
 
         .std-box {
-          flex: .6;
+          flex: 1.3;
         }
 
         .chip-box {
-          flex: .6;
+          flex: 1.3;
         }
 
         .bipv-box {
-          flex: .6;
+          flex: 1.3;
         }
 
         .std-box,

src/views/copilot/factoryData/components/bipvProdMonitor.vue

@@ -1,422 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-07-25 10:10:07
- * @LastEditTime: 2024-07-26 16:47:15
- * @LastEditors: zhp
- * @Description:
--->
-<template>
-  <div class="prod-monitor">
-
-    <div class="data">
-      <div class="fto-box">
-        <div class="icon">
-          <img src="./../assets/images/fto.png" alt="" style="width: 2.1875vw; height: 2.2875vw" />
-        </div>
-        <div class="middle-box">
-          <span class="type">玻璃类型</span>
-          <span class="type-name">FTO</span>
-        </div>
-        <div class="right-box">
-          <span class="type">投入数量</span>
-          <span class="num">{{ prodFto[0] ? prodFto[0].chipInput.toLocaleString() : 0 }}</span>
-        </div>
-      </div>
-      <div class="std-box">
-        <div class="icon">
-          <img src="./../assets/images/std.png" alt="" style="width: 2.1875vw; height: 2.1875vw" />
-        </div>
-        <div class="middle-box">
-          <div class="separate">
-            <div>
-              <span class="type">玻璃类型</span>
-              <span class="type-name">标准组件</span>
-            </div>
-            <div>
-              <span class="type">良品数量</span>
-              <span class="type-name">{{
-              msgObj.stand.goodNumber ? msgObj.stand.goodNumber.toLocaleString() : 0
-              }}</span>
-            </div>
-          </div>
-        </div>
-        <div class="right-box">
-          <div class="separate">
-            <div>
-              <span class="type">生产数量</span>
-              <span class="num">{{
-              msgObj.stand.outputNumber ? msgObj.stand.outputNumber.toLocaleString() : 0
-              }}</span>
-            </div>
-            <div>
-              <span class="type1">良品率</span>
-              <span class="num">{{ msgObj.stand.yieldRate ? msgObj.stand.yieldRate.toFixed(2) : 0 }}%</span>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="chip-box">
-        <div class="icon">
-          <img src="./../assets/images/chip.png" alt="" style="width: 2.1875vw; height: 2.1875vw" />
-        </div>
-        <div class="middle-box">
-          <div class="separate">
-            <div>
-              <span class="type">玻璃类型</span>
-              <span class="type-name">芯片</span>
-            </div>
-            <div>
-              <span class="type">良品数量</span>
-              <span class="type-name">{{
-              msgObj.chip.goodNumber ? msgObj.chip.goodNumber.toLocaleString() : 0
-              }}</span>
-            </div>
-          </div>
-        </div>
-        <div class="right-box">
-          <div class="separate">
-            <div>
-              <span class="type">生产数量</span>
-              <span class="num">{{
-              msgObj.chip.outputNumber ? msgObj.chip.outputNumber.toLocaleString() : 0
-              }}</span>
-            </div>
-            <div>
-              <span class="type1">良品率</span>
-              <span class="num">{{ msgObj.chip.yieldRate ? msgObj.chip.yieldRate.toFixed(2) : 0 }}%</span>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="bipv-box" v-if="companyId != 0">
-        <div class="icon">
-          <img src="./../assets/images/bipv.png" alt="" style="width: 2.1875vw; height: 2.1875vw" />
-        </div>
-        <div class="middle-box">
-          <div class="separate">
-            <div>
-              <span class="type">玻璃类型</span>
-              <span class="type-name">BIPV</span>
-            </div>
-            <div>
-              <span class="type">良品数量</span>
-              <span class="type-name">{{
-              msgObj.bipv.goodNumber ? msgObj.bipv.goodNumber.toLocaleString() : 0
-              }}</span>
-            </div>
-          </div>
-        </div>
-        <div class="right-box">
-          <div class="separate">
-            <div>
-              <span class="type">生产数量</span>
-              <span class="num">{{
-              msgObj.bipv.outputNumber ? msgObj.bipv.outputNumber.toLocaleString() : 0
-              }}</span>
-            </div>
-            <div>
-              <span class="type1">良品率</span>
-              <span class="num">{{ msgObj.bipv.yieldRate ? msgObj.bipv.yieldRate.toFixed(2) : 0 }}%</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div class="chart">
-      <div class="chart-title">
-        <span class="title">生产情况</span>
-        <div class="button-than" style="position: absolute;right: 0%;">
-          <CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than"
-            @click="() => $emit('update:than', i)" />
-        </div>
-        <!-- <span class="line"></span> -->
-      </div>
-      <barChartBase v-if="factoryData.length != 0" :companyId="companyId" :than="than" :period="period" :data="factoryData"
-        ref="barChart" style="height: 0;flex:1">
-      </barChartBase>
-    </div>
-  </div>
-</template>
-<script>
-import { number } from 'echarts';
-import barChartBase from './ChipOee'
-import CopilotButton from "./button.vue"
-export default {
-  name: "ProdMonitor",
-  components: {
-    barChartBase,
-    CopilotButton
-  },
-  data() {
-    return {
-      bipvVis:false,
-      msgObj: {
-        stand: {},
-        chip: {},
-        bipv: {},
-      },
-    };
-  },
-  props: {
-    period: {
-      type: Number,
-      default: 1,
-    },
-    companyId: {
-      type: Number,
-      default:0
-    },
-    than: {
-      type: String,
-    },
-    than: {
-      type: String,
-      default: '同比',
-    },
-    prodOutPut: {
-      type: Array,
-      default: [],
-    },
-    prodFto: {
-      type: Array,
-      default: [],
-    },
-    factoryData: {
-      type: Object,
-      default: {},
-    },
-    showBipv: {
-      type: Boolean,
-      default:true,
-    }
-  },
-  watch: {
-    prodOutPut() {
-      this.makeData();
-    },
-  },
-  mounted() {
-    this.makeData();
-    this.$nextTick(() => {
-      let button = document.getElementsByClassName('button-than')
-      button[0].children[0].style.borderRadius = '4px 0 0 4px'
-      button[0].children[1].style.borderRadius = '0px 4px 4px 0'
-    })
-  },
-  methods: {
-    makeData() {
-      this.msgObj.chip = {};
-      this.msgObj.stand = {};
-      this.msgObj.bipv = {};
-      if (this.prodOutPut.length > 0) {
-        this.prodOutPut.map((item) => {
-          if (item.glassType === 0) {
-            this.msgObj.chip = item;
-          } else if (item.glassType === 1) {
-            this.msgObj.stand = item;
-          } else if (item.glassType === 2) {
-            this.msgObj.bipv = item;
-          }
-        });
-      }
-    },
-  },
-};
-</script>
-<style lang="scss" scoped>
-
-.prod-monitor {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  .chart{
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    position: relative;
-    // gap: 6px;
-    .chart-title{
-      margin-top: 20px;
-      // flex: 1;
-      // gap: 6px;
-      height: 1.5vw;
-      width: 100%;
-      display: flex;
-      align-items: center;
-      // flex-direction: column;
-      // flex-wrap: nowrap;
-      // justify-content: end
-      // margin-top: 10px;
-      .title{
-        // flex: 1;
-         font-weight: 400;
-          font-size: 24px;
-          // width: 5vw;
-          color: #FFFFFF;
-          line-height: 24px;
-          // text-align: left;
-          font-style: normal;
-          display: inline-block;
-      }
-      // .line{
-      //   flex: 1;
-      //   // width: 80%;
-      //   height: 1px;        // display: inline-block;
-      //   border: 1px solid;
-      //   // display: inline-block;
-      //   border-image: linear-gradient(90deg, rgba(25, 146, 255, 0) 10%, rgba(95, 190, 249, 1), rgba(0, 120, 228, 0) 90%,) 2 2;
-      //   backdrop-filter: blur(3px);
-      // }
-    }
-  }
-  .data{
-      flex: 1;
-      display: flex;
-        gap: 6px;
-        flex-direction: column;
-      .fto-box,
-        .std-box,
-        .chip-box,
-        .bipv-box {
-          box-shadow: inset 0 0 12px 2px #fff3;
-          border-radius: 4px;
-          display: flex;
-          align-items: center;
-
-          .icon {
-            flex: 1;
-            text-align: center;
-          }
-
-          .middle-box {
-            flex: 2.086;
-            position: relative;
-          }
-
-          .right-box {
-            flex: 2.424;
-            position: relative;
-          }
-
-          .type {
-            display: inline-block;
-            font-size: 0.9375vw;
-            color: #6db6ff;
-            position: relative;
-            text-align: right;
-            padding-right: 0.417vw;
-            letter-spacing: 2px;
-            width: 6.25vw;
-          }
-
-          .type1 {
-            display: inline-block;
-            font-size: 0.9375vw;
-            color: #6db6ff;
-            position: relative;
-            text-align: right;
-            padding-right: 0.6vw;
-            width: 6.25vw;
-            padding-left: 1.6vw;
-            text-align: justify;
-            text-align-last: justify;
-          }
-
-          .type-name {
-            font-size: 1.042vw;
-            color: #fff;
-            position: relative;
-            text-align: left;
-            padding-left: 0.573vw;
-          }
-
-          .type-name::before {
-            content: "";
-            display: inline-block;
-            width: 1px;
-            height: 1.042vw;
-            border: 1px solid;
-            border-image: linear-gradient(180deg,
-                rgba(0, 176, 243, 0),
-                rgba(31, 143, 255, 1)) 2 2;
-            position: absolute;
-            left: 0;
-            top: 4px;
-          }
-
-          .num {
-            font-size: 1.042vw;
-            color: #fff;
-            position: relative;
-            text-align: left;
-            padding-left: 0.573vw;
-          }
-
-          .num::before {
-            content: "";
-            display: inline-block;
-            width: 1px;
-            height: 1.042vw;
-            border: 1px solid;
-            border-image: linear-gradient(180deg,
-                rgba(0, 176, 243, 0),
-                rgba(31, 143, 255, 1)) 2 2;
-            position: absolute;
-            left: 0;
-            top: 4px;
-          }
-        }
-
-        .fto-box {
-          flex: 1;
-
-          .type::before {
-            content: "";
-            display: inline-block;
-            width: 1px;
-            height: 1.6146vw;
-            border: 1px solid;
-            border-image: linear-gradient(135deg,
-                rgba(0, 176, 243, 0),
-                rgba(31, 143, 255, 1),
-                rgba(31, 143, 255, 0)) 2 2;
-            position: absolute;
-            left: 0;
-            top: -2px;
-          }
-        }
-
-        .std-box {
-          flex: 1;
-        }
-
-        .chip-box {
-          flex: 1;
-        }
-
-        .bipv-box {
-          flex: 1;
-        }
-
-        .std-box,
-        .chip-box,
-        .bipv-box {
-          .separate::before {
-            content: "";
-            display: inline-block;
-            width: 1px;
-            height: 3.125vw;
-            border: 1px solid;
-            border-image: linear-gradient(135deg,
-                rgba(0, 176, 243, 0),
-                rgba(31, 143, 255, 1),
-                rgba(31, 143, 255, 0)) 2 2;
-            position: absolute;
-            left: 0;
-            top: -2px;
-          }
-        }
-  }
-
-}
-</style>

src/views/copilot/factoryData/components/button.vue

@@ -1,99 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-06 14:22:56
- * @LastEditTime: 2024-07-02 13:54:08
- * @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>

src/views/copilot/factoryData/components/chartButton.vue

@@ -1,148 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-07 08:37:17
- * @LastEditTime: 2024-07-18 16:16:24
- * @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: 14px;
-  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: 14px;
-  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>

src/views/copilot/factoryData/components/leftContainer.vue

@@ -1,222 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-06-05 09:36:07
- * @LastEditTime: 2024-07-24 13:39:01
- * @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 style="margin-left: 16px;" :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;
-  border-right: .13vw solid;
-    // border-image: linear-gradient(to bottom,transparent 10%,
-    //   #024798 20%,
-    //   transparent 90%) 1;
-    border-image:radial-gradient(circle at center,
-        #1481fd 2%,
-        #024798 95%,
-        transparent)1;
-    box-sizing: border-box;
-    backdrop-filter: blur(4px);
-
-    &::before {
-      content: "";
-      position: absolute;
-      display: inline-block;
-      height: 92%;
-      width: 0.13vw;
-      border-radius: 2px;
-      top: 0%;
-      left: 0;
-      background: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%);
-      z-index: 1;
-    }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 80%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    right: 4%;
-    bottom: 0;
-    background: linear-gradient(to right, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      line-height: 1.39vw;
-      font-weight: normal;
-      letter-spacing: 2px;
-    }
-  }
-
-  .container-body {
-    padding: 20px;
-    display: flex;
-    flex-direction: column;
-    flex: 1;
-    height: 0;
-  }
-
-  .corner {
-    z-index: 1;
-    position: absolute;
-    // width: 16px;
-    // height: 16px;
-    width: 0.7vw;
-    height: 0.7vw;
-  }
-
-  .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>

src/views/copilot/factoryData/components/rightContainer.vue

@@ -1,225 +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 style="margin-left: 16px;" :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: {},
-  mounted() {
-
-  },
-  methods: {},
-};
-</script>
-
-<style scoped lang="scss">
-
-
-.copilot-container {
-  height: 100%;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  position: relative;
-  box-shadow: inset 0 0 20px 1px #fff1;
-  border-right: .13vw solid;
-    // border-image: linear-gradient(to bottom,transparent 10%,
-    //   #024798 20%,
-    //   transparent 90%) 1;
-    border-image: linear-gradient(to bottom, transparent 10%, rgba(5, 138, 237, 1) 30%, rgba(2, 82, 215, 0.24) 90%)1;
-    box-sizing: border-box;
-    backdrop-filter: blur(4px);
-
-    &::before {
-      content: "";
-      position: absolute;
-      display: inline-block;
-      height: 92%;
-      width: 0.13vw;
-      border-radius: 2px;
-      top: 0%;
-      left: 0;
-      background: radial-gradient(circle at center,
-          #1481fd 2%,
-          #024798 95%,
-          transparent);
-      z-index: 1;
-    }
-
-  &::after {
-    content: "";
-    position: absolute;
-    display: inline-block;
-    width: 80%;
-    height: 0.31415vh;
-    border-radius: 2px;
-    left: 3%;
-    bottom: 0;
-    background: linear-gradient(to left, transparent 60%, #4197f9 98%, transparent 98%);
-    z-index: 0;
-  }
-
-  .container-head {
-    // height: 40px;
-    height: 3.8vh;
-    padding: 8px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .container-title {
-      font-size: 1vw;
-      line-height: 1.39vw;
-      font-weight: normal;
-      letter-spacing: 2px;
-    }
-  }
-
-  .container-body {
-    padding: 20px;
-    display: flex;
-    flex-direction: column;
-    flex: 1;
-    height: 0;
-  }
-
-  .corner {
-    z-index: 1;
-    position: absolute;
-    // width: 16px;
-    // height: 16px;
-    width: 0.7vw;
-    height: 0.7vw;
-  }
-
-  .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>

src/views/copilot/factoryData/hdIndex.vue

@@ -5,12 +5,12 @@
     <div class="factory-section">
       <section class="top flex">
         <db-container title="生产监控" icon="prod">
-          <prod-monitor @update:than="updateThan" :companyId="companyId" :factoryData="factoryData" :than="than"
+          <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
-            :period="period" :data="data" :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
+            :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
+        </db-container>
+        <db-container title="工单监控" icon="order">
+          <order :prodOrder="prodOrder" />
         </db-container>
-        <left-container title="工单监控" icon="order">
-          <order @update:type="updateType" :type="type" :prodOrder="prodOrder" />
-        </left-container>
         <!-- <db-container title="" icon="store"> -->
         <!-- <store :stock="stock" /> -->
         <!-- </db-container> -->
@@ -26,9 +26,8 @@
 </template>
 <script>
 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/bipvProdMonitor";
 import { deepClone } from "@/utils";
 // import Store from "./components/Store.vue";
 // import Energy from "./components/Energy.vue";
@@ -39,7 +38,6 @@ export default {
   components: {
     FactoryDataHeader,
     DbContainer: Container,
-    LeftContainer: leftContainer,
     ProdMonitor,
     // Store,
     // Energy,
@@ -47,7 +45,6 @@ export default {
   },
   data() {
     return {
-      type: '目标产量',
       companyId: 1,
       companyName: "邯郸中建材光电材料有限公司",
       period: 1,
@@ -76,10 +73,6 @@ export default {
     this.getMes();
   },
   methods: {
-    updateType(val) {
-      console.log(val)
-      this.type = val
-    },
     updateCompany(obj) {
       this.companyId = obj.companyId;
       this.companyName = obj.companyName;
@@ -88,7 +81,7 @@ export default {
     updateThan(val) {
       console.log(val);
       this.than = val;
-      this.getMes()
+      // this.getMes();
     },
     updatePeriod(val) {
       this.period = val;
@@ -134,11 +127,11 @@ export default {
         if (preData && preData[0] != null) {
           for (const factory of preData) {
             if (factory.previousGlassType === 0) {
-              preDataDetail[1] = factory.previousOutputNumber
+              preDataDetail[1] = factory.previousYearOutputNumber
             } else if (factory.previousGlassType === 1) {
-              preDataDetail[2] = factory.previousOutputNumber
+              preDataDetail[2] = factory.previousYearOutputNumber
-            } else if (factory.previousGlassType === 2) {
+            } else if (factory.previousYearOutputNumber === 2) {
-              preDataDetail[3] = factory.previousOutputNumber
+              currentDataDetail[3] = factory.outputNumber
             }
           }
         }

src/views/copilot/factoryData/index.vue

@@ -1,16 +1,16 @@
 <template>
   <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">
       <section class="top flex">
         <db-container title="生产监控" icon="prod">
-          <prod-monitor @update:than="updateThan" :than="than" :companyId="companyId" :factoryData="factoryData"
+          <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
-             :period="period" :data="data" :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
+            :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
+        </db-container>
+        <db-container title="工单监控" icon="order">
+          <order :prodOrder="prodOrder" />
         </db-container>
-        <left-container title="工单监控" icon="order">
-          <order @update:type="updateType" :type="type" :prodOrder="prodOrder" />
-        </left-container>
         <!-- <db-container title="" icon="store"> -->
         <!-- <store :stock="stock" /> -->
         <!-- </db-container> -->
@@ -26,10 +26,8 @@
 </template>
 <script>
 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";
 import { deepClone } from "@/utils";
 // import Store from "./components/Store.vue";
 // import Energy from "./components/Energy.vue";
@@ -40,7 +38,6 @@ export default {
   components: {
     FactoryDataHeader,
     DbContainer: Container,
-    LeftContainer:leftContainer,
     ProdMonitor,
     // Store,
     // Energy,
@@ -49,7 +46,6 @@ export default {
   data() {
     return {
       companyId: 0,
-      type:'目标产量',
       companyName: "瑞昌中建材光电材料有限公司",
       period: 1,
       show:false,
@@ -77,10 +73,6 @@ export default {
     this.getMes();
   },
   methods: {
-    updateType(val) {
-      console.log(val)
-      this.type = val
-    },
     updateCompany(obj) {
       this.companyId = obj.companyId;
       this.companyName = obj.companyName;
@@ -89,7 +81,7 @@ export default {
     updateThan(val) {
       console.log(val);
       this.than = val;
-      this.getMes()
+      // this.getMes();
     },
     updatePeriod(val) {
       this.period = val;
@@ -132,17 +124,16 @@ export default {
             // }
           }
         }
-        if (preData) {
+        if (preData && preData[0] != null) {
           for (const factory of preData) {
             if (factory.previousGlassType === 0) {
-              console.log('factory', factory)
+              preDataDetail[1] = factory.previousYearOutputNumber
-              preDataDetail[1] = factory.previousOutputNumber
             } else if (factory.previousGlassType === 1) {
-              preDataDetail[2] = factory.previousOutputNumber
+              preDataDetail[2] = factory.previousYearOutputNumber
             }
           }
         }
-        if (targetListResponse) {
+        if (targetListResponse && targetListResponse[0] != null) {
           for (const factory of targetListResponse) {
             targetDataDetail[0] = factory.ftoInput
             // if (factory.previousGlassType === 0) {
@@ -154,7 +145,7 @@ export default {
           }
         }
         // console.log('ftoInvest',ftoInvest)
-        if (factoryListResponse) {
+        if (factoryListResponse && factoryListResponse[0] != null) {
           for (const factory of factoryListResponse) {
             // targetDataDetail[0] = factory.ftoInput
             if (factory.glassType === 0) {
@@ -164,7 +155,6 @@ export default {
             }
           }
         }
-        console.log('  this.factoryData.preDataDetail', preDataDetail);
         this.factoryData.preDataDetail = preDataDetail
         this.factoryData.currentDataDetail = currentDataDetail
         this.factoryData.targetDataDetail = targetDataDetail

src/views/copilot/factoryData/jmsIndex.vue

@@ -8,9 +8,9 @@
           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
         </db-container>
-        <left-container title="工单监控" icon="order">
+        <db-container title="工单监控" icon="order">
           <order :prodOrder="prodOrder" />
-        </left-container>
+        </db-container>
         <!-- <db-container title="" icon="store"> -->
         <!-- <store :stock="stock" /> -->
         <!-- </db-container> -->
@@ -26,9 +26,8 @@
 </template>
 <script>
 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/bipvProdMonitor.vue";
 import { deepClone } from "@/utils";
 // import Store from "./components/Store.vue";
 // import Energy from "./components/Energy.vue";
@@ -39,7 +38,6 @@ export default {
   components: {
     FactoryDataHeader,
     DbContainer: Container,
-    LeftContainer: leftContainer,
     ProdMonitor,
     // Store,
     // Energy,

src/views/copilot/factoryData/ksIndex.vue

@@ -8,9 +8,9 @@
           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
         </db-container>
-        <left-container title="工单监控" icon="order">
+        <db-container title="工单监控" icon="order">
           <order :prodOrder="prodOrder" />
-        </left-container>
+        </db-container>
         <!-- <db-container title="" icon="store"> -->
         <!-- <store :stock="stock" /> -->
         <!-- </db-container> -->
@@ -26,9 +26,8 @@
 </template>
 <script>
 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/bipvProdMonitor.vue";
 import { deepClone } from "@/utils";
 // import Store from "./components/Store.vue";
 // import Energy from "./components/Energy.vue";
@@ -39,7 +38,6 @@ export default {
   components: {
     FactoryDataHeader,
     DbContainer: Container,
-    LeftContainer: leftContainer,
     ProdMonitor,
     // Store,
     // Energy,

src/views/copilot/factoryData/oldIndex.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-21 13:24:03
- * @LastEditTime: 2024-07-25 10:52:35
+ * @LastEditTime: 2024-05-21 13:24:03
  * @LastEditors: zhp
  * @Description:
 -->
@@ -37,8 +37,8 @@
 </template>
 <script>
 import FactoryDataHeader from "./../components/FactoryDataHeader.vue";
-// import Container from "./components/Container.vue";
+import Container from "./components/Container.vue";
-import ProdMonitor from "./components/bipvProdMonitor.vue";
+import ProdMonitor from "./components/ProdMonitor.vue";
 import Store from "./components/Store.vue";
 import Energy from "./components/Energy.vue";
 import Order from "./components/Order.vue";
@@ -47,7 +47,7 @@ export default {
   name: "factoryData",
   components: {
     FactoryDataHeader,
-    // DbContainer: Container,
+    DbContainer: Container,
     ProdMonitor,
     Store,
     Energy,

src/views/copilot/factoryData/zzIndex.vue

@@ -8,9 +8,9 @@
           <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
             :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
         </db-container>
-        <left-container title="工单监控" icon="order">
+        <db-container title="工单监控" icon="order">
           <order :prodOrder="prodOrder" />
-        </left-container>
+        </db-container>
         <!-- <db-container title="" icon="store"> -->
         <!-- <store :stock="stock" /> -->
         <!-- </db-container> -->
@@ -26,10 +26,8 @@
 </template>
 <script>
 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/bipvProdMonitor.vue";
 import { deepClone } from "@/utils";
 // import Store from "./components/Store.vue";
 // import Energy from "./components/Energy.vue";
@@ -40,7 +38,6 @@ export default {
   components: {
     FactoryDataHeader,
     DbContainer: Container,
-    LeftContainer: leftContainer,
     ProdMonitor,
     // Store,
     // Energy,

src/views/copilot/yield/components/ChipInvest.vue

@@ -23,10 +23,7 @@ export default {
   components: { BarChartBase },
   data() {
     // 城市数组的顺序必须是固定的
-    const cities = ["瑞昌", "邯郸",
+    const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"];
-      // "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
-
-    ];
     return {
       xAxis: cities,
     };
@@ -45,11 +42,8 @@ export default {
     legend() {
       let items = [];
       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()
       //今天的时间
       // var day2 = new Date();
       // day2.setTime(day2.getTime());
@@ -61,17 +55,17 @@ export default {
       const year = new Date().getFullYear();
       if (this.period === '日' && this.than === '同比') {
         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 === '环比') {
         items = [
-          { label: `${dayBeYes}日`, color: "#12f7f1" },
+          { label: `${yesterday}日`, color: "#12f7f1" },
-          { label: `${yesterday}日`, color: "#58adfa" },
+          { label: `${month}月${today}日`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '同比') {
         items = [
-          { label: `${year-1}年本周`, color: "#12f7f1" },
+          { label: `去年本周`, color: "#12f7f1" },
           { label: `本周`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '环比') {
@@ -81,7 +75,7 @@ export default {
         ];
       } else if (this.period === '月' && this.than === '同比') {
         items = [
-          { label: `${year-1}年${month}月`, color: "#12f7f1" },
+          { label: `去年${month}月`, color: "#12f7f1" },
           { label: `${month}月`, color: "#58adfa" },
           // { label: `${month}月目标`, value: valueTuple[2] },
         ];
@@ -152,11 +146,8 @@ export default {
 function getTemplate(period, dataList,than) {
   let items = [];
   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()
   //今天的时间
   // var day2 = new Date();
   // day2.setTime(day2.getTime());
@@ -169,11 +160,11 @@ function getTemplate(period, dataList,than) {
   if (period === '日' && than === '同比') {
     items = [
       {
-        name: `${year - 1}年${yesterday}日`,
+        name: `去年${month}月${today}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
@@ -181,11 +172,11 @@ function getTemplate(period, dataList,than) {
   } else if (period === '日' && than === '环比') {
     items = [
       {
-        name: `${dayBeYes}日`,
+        name: `${yesterday}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
@@ -193,7 +184,7 @@ function getTemplate(period, dataList,than) {
   } else if (period === '周' && than === '同比') {
     items = [
       {
-        name: `${year-1}年本周`,
+        name: `去年本周`,
         data: dataList ? dataList[0] : [],
       },
       {
@@ -217,7 +208,7 @@ function getTemplate(period, dataList,than) {
   } else if (period === '月' && than === '同比') {
     items = [
       {
-        name: `${year-1}年${month}月`,
+        name: `去年${month}月`,
         data: dataList ? dataList[0] : [],
       },
       {

src/views/copilot/yield/components/FtoInvest.vue

@@ -23,10 +23,7 @@ export default {
   components: { BarChartBase },
   data() {
     // 城市数组的顺序必须是固定的
-    const cities = ["瑞昌", "邯郸",
+    const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"];
-      // "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
-
-    ];
     return {
       xAxis: cities,
     };
@@ -45,11 +42,8 @@ export default {
     legend() {
       let items = [];
       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()
       //今天的时间
       // var day2 = new Date();
       // day2.setTime(day2.getTime());
@@ -61,17 +55,17 @@ export default {
       const year = new Date().getFullYear();
       if (this.period === '日' && this.than === '同比') {
         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 === '环比') {
         items = [
-          { label: `${dayBeYes}日`, color: "#12f7f1" },
+          { label: `${yesterday}日`, color: "#12f7f1" },
-          { label: `${yesterday}日`, color: "#58adfa" },
+          { label: `${month}月${today}日`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '同比') {
         items = [
-          { label: `${year-1}年本周`, color: "#12f7f1" },
+          { label: `去年本周`, color: "#12f7f1" },
           { label: `本周`, color: "#58adfa" },
         ];
       } else if (this.period === '周' && this.than === '环比') {
@@ -81,7 +75,7 @@ export default {
         ];
       } else if (this.period === '月' && this.than === '同比') {
         items = [
-          { label: `${year-1}年${month}月`, color: "#12f7f1" },
+          { label: `去年${month}月`, color: "#12f7f1" },
           { label: `${month}月`, color: "#58adfa" },
           // { label: `${month}月目标`, value: valueTuple[2] },
         ];
@@ -153,15 +147,9 @@ export default {
 
 function getTemplate(period, dataList,than) {
   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 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()
   //今天的时间
   // var day2 = new Date();
   // day2.setTime(day2.getTime());
@@ -174,11 +162,11 @@ function getTemplate(period, dataList,than) {
   if (period === '日' && than === '同比') {
     items = [
       {
-        name: `${year - 1}年${yesterday}日`,
+        name: `去年${month}月${today}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
@@ -186,11 +174,11 @@ function getTemplate(period, dataList,than) {
   } else if (period === '日' && than === '环比') {
     items = [
       {
-        name: `${dayBeYes}日`,
+        name: `${yesterday}日`,
         data: dataList ? dataList[0] : [],
       },
       {
-        name: `${yesterday}日`,
+        name: `${month}月${today}日`,
         data: dataList ? dataList[1] : [],
         // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
       },
@@ -198,7 +186,7 @@ function getTemplate(period, dataList,than) {
   } else if (period === '周' && than === '同比') {
     items = [
       {
-        name: `${year-1}年本周`,
+        name: `去年本周`,
         data: dataList ? dataList[0] : [],
       },
       {
@@ -222,7 +210,7 @@ function getTemplate(period, dataList,than) {
   } else if (period === '月' && than === '同比') {
     items = [
       {
-        name: `${year-1}年${month}月`,
+        name: `去年${month}月`,
         data: dataList ? dataList[0] : [],
       },
       {

src/views/copilot/yield/components/sub/ring/DoubleRingChart.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-20 13:32:59
- * @LastEditTime: 2024-07-22 14:41:37
+ * @LastEditTime: 2024-05-30 13:35:00
  * @LastEditors: zhp
  * @Description:
 -->
@@ -78,13 +78,13 @@ export default {
     valueTuple() {
       // [previousValue, currentValue, sumValue?]
       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]
       return [
         getter.previous[this.factoryId],
@@ -100,11 +100,8 @@ export default {
       const vt = this.valueTuple;
       let items = [];
       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()
       //今天的时间
       // var day2 = new Date();
       // day2.setTime(day2.getTime());
@@ -116,32 +113,28 @@ export default {
       // const year = new Date().getFullYear();
       if (this.period === '日' && this.than === '同比') {
         items = [
-          { label: `${yesterday}日累计`,},
+          { label: `${month}月${today}日累计`,},
-          { label: `${year - 1}年${yesterday}累计` },
+          { label: `去年${month}月${today}日累计` },
-          { label: `${yesterday}日目标`, },
         ];
       } else if (this.period === '日' && this.than === '环比') {
         items = [
+          { label: `${month}月${today}日累计`},
           { label: `${yesterday}日累计`},
-          { label: `${dayBeYes}日累计` },
-          { label: `${yesterday}日目标`, },
         ];
       } else if (this.period === '周' && this.than === '同比') {
         items = [
           { label: `本周累计`,},
-          { label: `${year-1}年本周累计` },
+          { label: `去年本周累计`},
-          { label: `本周目标`, },
         ];
       } else if (this.period === '周' && this.than === '环比') {
         items = [
           { label: `本周累计`,},
-          { label: `上周累计`, },
+          { label: `上周累计`,},
-          { label: `本周目标`, },
         ];
       } else if (this.period === '月' && this.than === '同比') {
         items = [
           { label: `${month}月累计`,},
-          { label: `${year-1}年${month}月累计`, },
+          { label: `去年${month}月累计`, },
           { label: `${month}月目标`,},
         ];
       } else if (this.period === '月' && this.than === '环比') {
@@ -158,27 +151,21 @@ export default {
         ];
       }
       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 =
-          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],)
-      let titleSize = fontSize(0.35)
+      console.log(items)
-      let subtitleSize = fontSize(0.14)
-
-      // console.log(this.valueTuple[2]- this.valueTuple[1])
       return getOptions({
         titleValue,
         subtitle,
-        titleSize,
-        subtitleSize,
         currentName: items[0].label,
         preName: items[1].label,
         previousSum: this.valueTuple[0],
         currentSum: this.valueTuple[1],
-        targetSum: this.valueTuple[2] ? this.valueTuple[2] :0,
+        targetSum: this.valueTuple[2] ? this.valueTuple[2] :0 ,
       });
     },
 
@@ -209,37 +196,18 @@ export default {
     }
   },
   methods: {
-    formatNumber(num) {
-      // 判断是否为整数
-      if (Number.isInteger(num)) {
-        return num; // 如果是整数，直接转换为字符串
-      } else {
-        // 如果不是整数，保留两位小数并转换为字符串
-        return num.toFixed(2);
-      }
-    }
     // fullscreen mixin 需要的回调
     // fullscreenCallback(isFullscreen) {
     //   console.log("isFullscreen--->", isFullscreen);
     // },
   },
 };
-function fontSize(res){
+
-  let clientWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
+function calculateItems(period, valueTuple,than) {
-  if (!clientWidth) return;
-  let fontSize = 100 * (clientWidth / 1920);
-  return res * fontSize;
-}
-function calculateItems(period, valueTuple, than) {
-  console.log('valueTuple', valueTuple);
   let items = [];
   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()
-
   //今天的时间
   // var day2 = new Date();
   // day2.setTime(day2.getTime());
@@ -251,44 +219,40 @@ function calculateItems(period, valueTuple, than) {
   const year = new Date().getFullYear();
   if (period === '日' && than === '同比') {
     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 === '环比') {
     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 === '同比') {
     items = [
-      { label: `${year-1}年本周累计`, value: valueTuple[0] },
       { label: `本周累计`, value: valueTuple[1] },
-      { label: `本周目标`, value: valueTuple[2] },
+      { label: `去年本周累计`, value: valueTuple[0] },
     ];
   } else if (period === '周' && than === '环比') {
     items = [
-      { label: `上周累计`, value: valueTuple[0] },
       { label: `本周累计`, value: valueTuple[1] },
-      { label: `本周目标`, value: valueTuple[2] },
+      { label: `上周累计`, value: valueTuple[0] },
     ];
   } else if (period === '月' && than === '同比') {
     items = [
-      { label: `${year-1}年${month}月累计`, value: valueTuple[0] },
       { label: `${month}月累计`, value: valueTuple[1] },
+      { label: `去年${month}月累计`, value: valueTuple[0] },
       { label: `${month}月目标`, value: valueTuple[2] },
     ];
   } else if (period === '月' && than === '环比') {
     items = [
-      { label: `${lastMonth}月累计`, value: valueTuple[0] },
       { label: `${month}月累计`, value: valueTuple[1] },
+      { label: `${lastMonth}月累计`, value: valueTuple[0] },
       { label: `${month}月目标`, value: valueTuple[2] },
     ];
   } else {
     items = [
-      { label: `${year - 1}年累计`, value: valueTuple[0] },
       { label: `${year}年累计`, value: valueTuple[1] },
+      { label: `${year - 1}年累计`, value: valueTuple[0] },
       { label: `${year}年目标`, value: valueTuple[2] },
     ];
   }
@@ -306,9 +270,8 @@ function calculateItems(period, valueTuple, than) {
 </script>
 
 <style scoped>
-
 .double-ring-chart {
-  height: 98%;
+  height: 100%;
   display: flex;
   flex-direction: column;
 }
@@ -323,7 +286,7 @@ function calculateItems(period, valueTuple, than) {
 }
 
 .double-ring-chart__legend {
-  /* padding: 12px; */
+  padding: 12px;
   color: #fff;
   display: flex;
   justify-content: center;
@@ -332,7 +295,6 @@ function calculateItems(period, valueTuple, than) {
 
 .legend-item {
   display: flex;
-  /* font-size:16px; */
   flex-direction: column;
   align-items: flex-start;
 }
@@ -352,17 +314,17 @@ function calculateItems(period, valueTuple, than) {
   left: -18px;
 }
 
-.legend-item:nth-child(2) .legend-item__label::before {
+.legend-item:nth-child(1) .legend-item__label::before {
   background: #12fff5;
 }
-.legend-item:nth-child(2) .legend-item__value {
+.legend-item:nth-child(1) .legend-item__value {
   color: #12fff5;
 }
 
-.legend-item:nth-child(1) .legend-item__label::before {
+.legend-item:nth-child(2) .legend-item__label::before {
   background: #0f65ff;
 }
-.legend-item:nth-child(1) .legend-item__value {
+.legend-item:nth-child(2) .legend-item__value {
   color: #0f65ff;
 }
 

src/views/copilot/yield/components/sub/ring/DoubleRingWrapper.vue

@@ -1,10 +1,10 @@
 <!--
- * @Author: zhp
+    filename: DoubleRingWrapper.vue
- * @Date: 2024-05-30 16:00:50
+    author: liubin
- * @LastEditTime: 2024-07-09 09:09:07
+    date: 2024-04-17 09:55:12
- * @LastEditors: zhp
+    description:
- * @Description:
 -->
+
 <template>
   <div class="double-ring-wrapper">
     <template>
@@ -42,14 +42,13 @@ export default {
     return {
       factoryId: 4, // 默认成都
       cityOptions: [
-        "瑞昌",
+        "成都",
-        // "成都",
         "邯郸",
-        // "株洲",
+        "株洲",
-
+        "瑞昌",
-        // "佳木斯",
+        "佳木斯",
-        // "凯盛光伏",
+        "凯盛光伏",
-        // "蚌埠兴科",
+        "蚌埠兴科",
       ],
     };
   },
@@ -64,7 +63,7 @@ export default {
 <style scoped lang="scss">
 .double-ring-wrapper {
   height: 100%;
-  padding: 0px 24px;
+  padding: 12px 24px;
   display: flex;
   gap: 12px;
   flex-direction: column;

src/views/copilot/yield/components/sub/ring/noDoubleRingWrapper.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-24 15:15:00
- * @LastEditTime: 2024-07-09 09:27:12
+ * @LastEditTime: 2024-05-28 08:42:36
  * @LastEditors: zhp
  * @Description:
 -->
@@ -54,12 +54,12 @@ export default {
     return {
       factoryId: 4, // 默认成都
       cityOptions: [
-        // "成都",
+        "成都",
         "邯郸",
-        // "株洲",
+        "株洲",
-        // "佳木斯",
+        "佳木斯",
-        // "凯盛光伏",
+        "凯盛光伏",
-        // "蚌埠兴科",
+        "蚌埠兴科",
       ],
     };
   },
@@ -74,7 +74,7 @@ export default {
 <style scoped lang="scss">
 .double-ring-wrapper {
   height: 100%;
-  padding: 0px 24px;
+  padding: 12px 24px;
   display: flex;
   gap: 12px;
   flex-direction: column;

src/views/copilot/yield/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-10 11:10:54
- * @LastEditTime: 2024-07-09 15:09:27
+ * @LastEditTime: 2024-05-28 13:36:07
  * @LastEditors: zhp
  * @Description:
 -->
@@ -9,33 +9,29 @@
 <template>
   <div class="yield-copilot">
     <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" />
-      </right-container>
+      </db-container>
       <db-container class="chip-yield" title="芯片产出" icon="chip2">
         <chip-output v-if="show" :period="period" :than="than" />
       </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" />
-      </left-container>
+      </db-container>
     </section>
     <section class="bottom flex">
-      <bottom-right-container class="fto-involve" title="FTO投入">
+      <db-container class="fto-involve" title="FTO投入">
         <fto-invest :period="period" :than="than" />
-      </bottom-right-container>
+      </db-container>
-      <bottom-left-container class="chip-involve" title="芯片投入" icon="chip">
+      <db-container class="chip-involve" title="芯片投入" icon="chip">
         <chip-invest :period="period" :than="than" />
-        </bottom-left-container>
+      </db-container>
     </section>
   </div>
 </template>
 
 <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 bottomRightContainer from "@/views/copilot/components/bottomRightContainer.vue";
-import bottomLeftContainer from "@/views/copilot/components/bottomLeftContainer.vue";
 import StdOutput from "./components/StdOutput.vue";
 import ChipOutput from "./components/ChipOutput.vue";
 import FtoInvest from "./components/FtoInvest.vue";
@@ -45,11 +41,7 @@ import ChipInvest from "./components/ChipInvest.vue";
 export default {
   name: "YieldCopilot",
   components: {
-    DbContainer: twoContainer,
+    DbContainer: Container,
-    bottomRightContainer,
-    bottomLeftContainer,
-    leftContainer,
-    rightContainer,
     StdOutput,
     ChipOutput,
     BipvOutput,

src/views/copilot/yield/options/double-ring-chart-options.js

@@ -3,8 +3,6 @@ export default ({
   subtitle,
   previousSum,
   currentSum,
-  subtitleSize,
-  titleSize,
   targetSum,
   currentName,
   preName,
@@ -16,29 +14,22 @@ export default ({
     top: 0,
     containLabel: true,
   },
-  tooltip: {
+  tooltip: {},
-    trigger: "item",
-    // extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);',
-    // backgroundColor: '#001829',
-    // borderColor: '#001829',
-  },
   title: {
     text: titleValue,
-    left: "48.5%",
+    left: "44%",
-    top: "middle",
+    top: "37%",
-    itemGap: 12,
-    textVerticalAlign:'auto',
     textAlign: "center",
     textStyle: {
-      fontWeight: 400,
+      fontWeight: 600,
-      fontSize: titleSize,
+      fontSize: 32,
-      color: "rgba(223,241,254,1)",
+      color: "#fffd",
     },
     subtext: `\u2002${subtitle}\u2002`,
     subtextStyle: {
-      fontSize: subtitleSize,
+      fontSize: 14,
       fontWeight: 100,
-      color: "rgba(255,255,255,.7)",
+      color: "#fffd",
       align: "right",
     },
   },
@@ -47,8 +38,8 @@ export default ({
     {
       type: "pie",
       name: "当前目标",
-      radius: ["73%", "85%"],
+      radius: ["70%", "85%"],
-      center: ["50%", "48%"],
+      center: ["45%", "52%"],
       emptyCircleStyle: {
         color: "#042c5f33",
       },
@@ -56,8 +47,8 @@ export default ({
     // 数据 series
     {
       type: "pie",
-      radius: ["73%", "85%"],
+      radius: ["70%", "85%"],
-      center: ["50%", "48%"],
+      center: ["45%", "52%"],
       avoidLabelOvervlap: false,
       label: {
         show: false,
@@ -70,17 +61,6 @@ export default ({
           value: currentSum,
           name: currentName,
           selected: false,
-          tooltip: {
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-          formatter:`
-              <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
-              <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${currentName}</span>
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${currentSum}</span>
-              </div>
-              `
-          },
           itemStyle: {
             borderJoin: "round",
             borderCap: "round",
@@ -100,19 +80,16 @@ export default ({
           },
         },
         {
-          value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum),
+          value:
-          name: currentName,
+            targetSum > currentSum
-           tooltip: {
+              ? targetSum - currentSum
-              backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
+              : targetSum == 0
-            extraCssText: 'padding:0;border-width:0',
+              ? currentSum == 0
-            formatter:`
+                ? 1
-                <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
+                : 0
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
+              : 0,
-                  <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${currentName}</span>
+
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${currentSum}</span>
+          name: "未达成累计",
-                </div>
-                `
-          },
           itemStyle: { color: "transparent" },
           label: { show: false },
         },
@@ -121,8 +98,8 @@ export default ({
     // 数据 series2 - 2023累计
     {
       type: "pie",
-      radius: ["60%", "73%"],
+      radius: ["55%", "70%"],
-      center: ["50%", "48%"],
+      center: ["45%", "52%"],
       avoidLabelOvervlap: false,
       label: {
         show: false,
@@ -135,17 +112,6 @@ export default ({
           value: previousSum,
           name: preName,
           selected: false,
-          tooltip: {
-            backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-            extraCssText: 'padding:0;border-width:0',
-            formatter:`
-                <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-                  <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${preName}</span>
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${previousSum}</span>
-                </div>
-                `
-          },
           itemStyle: {
             borderJoin: "round",
             borderCap: "round",
@@ -165,20 +131,13 @@ export default ({
           },
         },
         {
-
+          value:
-          value:previousSum === 0 ? 1 : 0,
+            targetSum > previousSum
-          name: preName,
+              ? targetSum - previousSum
-          tooltip: {
+              : previousSum == 0
-            backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
+              ? 1
-            extraCssText: 'padding:0;border-width:0',
+              : 0,
-            formatter:`
+          name: "-",
-                <div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-                  <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-                  <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;'>${preName}</span>
-                   <span style='color:rgba(255,255,255,0.65);font-size:16px;'>${previousSum}</span>
-                </div>
-                `
-          },
           itemStyle: { color: "transparent" },
           label: { show: false },
         },

src/views/cost/accounting.vue

@@ -1,590 +0,0 @@
-<!--
- * @Author: zhp
- * @Date: 2024-04-15 10:49:13
- * @LastEditTime: 2024-07-26 14:28:19
- * @LastEditors: zhp
- * @Description:
--->
-<template>
-  <div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 32px)">
-    <div class="app-container" style="height: auto; flex-grow: 1;">
-      <el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip">
-        <el-form-item label="时间维度" prop="start">
-          <el-cascader clearable :options="options" v-model="listQuery.start"
-            :props="{ multiple: false, emitPath: false }" @change="handleChange" placeholder="选择开始年份和期数" />
-        </el-form-item>
-        <el-form-item label-width="0" prop="end">
-          <el-cascader clearable :options="options" v-model="listQuery.end"
-            :props="{ multiple: false, emitPath: false }" @change="handleChange" placeholder="选择结束年份和期数" />
-        </el-form-item>
-        <el-form-item label="成本中心名称" prop="center">
-          <el-input v-model="listQuery.center" placeholder="请填写成本中心名称" clearable>
-          </el-input>
-        </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="handleImport">导入</el-button> -->
-          <el-button type="primary" size="small" plain @click="handleExport">导出</el-button>
-          <!-- <el-button type="success" size="small" plain @click="addFactory">新增</el-button> -->
-        </el-form-item>
-      </el-form>
-      <!-- <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> -->
-      <base-table :row-key="(record, index) => { return record.in }" border :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>
-
-    <!-- 用户导入对话框 -->
-
-    <!-- <inputTable :date="date" :data="tableData" :time="[startTimeStamp, endTimeStamp]" :sum="all"
-      :type="listQuery.reportType" @refreshDataList="getDataList" /> -->
-    <!-- <pagination
-			:limit.sync="listQuery.pageSize"
-			:page.sync="listQuery.pageNo"
-			:total="listQuery.total"
-			@pagination="getDataList" /> -->
-  </div>
-</template>
-
-<script>
-import { parseTime } from '@/utils/ruoyi';
-import { getCostMainPage, exportExcel } from '@/api/cost';
-// import inputTable from './inputTable.vue';
-import moment from 'moment'
-
-// 设置语言
-// 引入组件
-// Vue.component(DatePicker.months, DatePicker)
-// Vue.component(Select.name, Select)
-// import ButtonNav from '@/components/ButtonNav'
-import basicPage from '@/mixins/basic-page'
-// import detailOrUpdate from './detail-or-updata';
-// import addOrUpdate from './add-or-updata';
-// import { factoryList, dhgfactoryList, tyjxfactoryList } from "@/utils/constants";
-import { getBaseHeader } from "@/utils/request";
-
-import { factoryList } from "@/utils/constants";
-// import tableHeightMixin from "@/mixins/tableHeightMixin";
-
-// import FileSaver from 'file-saver'
-// import * as XLSX from 'xlsx'
-export default {
-  // components: { ButtonNav, detailOrUpdate, addOrUpdate },
-  mixins: [basicPage],
-  data() {
-    const currentYear = new Date().getFullYear();
-    const startYear = currentYear - 10;
-    const endYear = currentYear + 10;
-    const options = [];
-    for (let year = startYear; year <= endYear; year++) {
-      const yearOptions = [];
-      for (let period = 1; period <= 12; period++) {
-        yearOptions.push({
-          value: `${year}${('0' + period + '期').slice(-3)}`,
-          label: `${year}${('0' + period + '期').slice(-3)}`
-        });
-      }
-      options.push({
-        value: year,
-        label: year,
-        children: yearOptions
-      });
-    }
-    return {
-      start: undefined,
-      end: undefined,
-      // selectedValues: [],
-      options,
-      tableH: this.tableHeight(300),
-      listQuery: {
-        pageSize: 20,
-        pageNo: 1,
-        total: 0,
-        center: undefined,
-        start: undefined,
-        end: undefined,
-        yearPhaseStart:undefined,
-        yearPhaseEnd:undefined,
-      },
-      // 用户导入参数
-      mainFormConfig: [
-        {
-          type: 'select',
-          label: '工单',
-          placeholder: '请选择工单',
-          param: 'workOrderId',
-          selectOptions: [],
-        },
-        // {
-        // 	type: 'select',
-        // 	label: '产线',
-        // 	placeholder: '请选择产线',
-        // 	param: 'lineId',
-        // 	selectOptions: [],
-        // },
-        // 选项切换
-        // {
-        // 	type: 'select',
-        // 	label: '时间类型',
-        // 	param: 'dateFilterType',
-        // 	defaultSelect: 0,
-        // 	selectOptions: [
-        // 		{ id: 0, name: '按时间段' },
-        // 		{ id: 1, name: '按日期' },
-        // 	],
-        // 	index: 2,
-        // 	extraOptions: [
-        {
-          // parent: 'dateFilterType',
-          // 时间段选择
-          type: 'datePicker',
-          label: '时间段',
-          // dateType: 'datetimerange',
-          dateType: 'datetimerange',
-          format: 'yyyy-MM-dd HH:mm:ss',
-          valueFormat: 'yyyy-MM-ddTHH:mm:ss',
-          rangeSeparator: '-',
-          rangeSeparator: '-',
-          startPlaceholder: '开始时间',
-          endPlaceholder: '结束时间',
-          param: 'recordTime',
-        },
-        // 		{
-        // 			parent: 'dateFilterType',
-        // 			// 日期选择
-        // 			type: 'datePicker',
-        // 			// label: '日期',
-        // 			dateType: 'date',
-        // 			placeholder: '选择日期',
-        // 			format: 'yyyy-MM-dd',
-        // 			valueFormat: 'yyyy-MM-dd',
-        // 			param: 'timeday',
-        // 		},
-        // 	],
-        // },
-        {
-          type: 'button',
-          btnName: '查询',
-          name: 'search',
-          color: 'primary',
-        },
-        {
-          type: 'separate'
-        },
-        // {
-        //   type: this.$auth.hasPermi(
-        //     'analysis:equipment:export'
-        //   )
-        //     ? 'separate'
-        //     : '',
-        // },
-        {
-          type: 'button',
-          btnName: '导出',
-          name: 'export',
-          color: 'warning',
-        },
-      ],
-      formConfig: [
-        {
-          type: 'title',
-          label: '成本管理',
-        },
-      ],
-      mDTypeList: [
-        {
-          value: 0,
-          label: '物料编码'
-        },
-        {
-          value: 1,
-          label: '物料名称'
-        }
-      ],
-      wDTypeList: [
-        {
-          value: 0,
-          label: '仓库名称'
-        }
-      ],
-      tableProps: [
-        {
-          prop: 'yearPhaseName',
-          label: '年期',
-          minWidth: 200,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'center',
-          label: '成本中心名称',
-          minWidth: 150,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'product',
-          label: '产品名称',
-          minWidth: 150,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'spec',
-          label: '规格型号',
-          minWidth: 150,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'workorderCode',
-          label: '工单编号',
-          minWidth: 150,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'workorderLineNum',
-          label: '工单行号',
-          minWidth: 150,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'supplierCode',
-          label: '供应商编码',
-          minWidth: 150,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'supplier',
-          label: '供应商名称',
-          minWidth: 150,
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'unit',
-          label: '基本单位',
-          minWidth: 150,
-          // filter: (val) => factoryList[val],
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'planNum',
-          label: '计划产量',
-          minWidth: 150,
-          // filter: (val) => factoryList[val],
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'project',
-          label: '成本项目名称',
-          minWidth: 150,
-          // filter: (val) => factoryList[val],
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'material',
-          label: '子项物料名称',
-          minWidth: 150,
-          // filter: (val) => factoryList[val],
-          showOverflowtooltip: true
-        },
-        {
-          prop: 'currentTime',
-          label: '本期完工',
-          minWidth: 150,
-          // filter: (val) => factoryList[val],
-          showOverflowtooltip: true,
-          children: [
-            {
-              prop: 'finishNum',
-              label: '数量',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-            {
-              prop: 'unitConsume',
-              label: '单耗',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-            {
-              prop: 'unitCost',
-              label: '单位成本',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-            {
-              prop: 'cost',
-              label: '金额',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-          ]
-        },
-        {
-          prop: 'totalTime',
-          label: '累计完工',
-          minWidth: 150,
-          // filter: (val) => factoryList[val],
-          showOverflowtooltip: true,
-          children: [
-            {
-              prop: 'totalFinishNum',
-              label: '数量',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-            {
-              prop: 'totalUnitConsume',
-              label: '单耗',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-            {
-              prop: 'totalUnitCost',
-              label: '单位成本',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-            {
-              prop: 'totalCost',
-              label: '金额',
-              minWidth: 150,
-              // filter: (val) => factoryList[val],
-              showOverflowtooltip: true
-            },
-          ]
-        },
-      ],
-      // timeSelect:'month',
-      // startTimeStamp:null, //开始时间
-      // endTimeStamp:null, //结束时间
-      // date:'凯盛玻璃控股成员企业2024生产数据',
-      // reportTime: '',
-      // startTimeStamp: '',
-      // endTimeStamp: '',
-      tableData: [],
-      // proLineList: [],
-      // all: {}
-    };
-  },
-  computed: {
-  },
-  watch: {
-  },
-  created() {
-    const currentYear = new Date().getFullYear();
-    this.listQuery.start = `${currentYear}01期`;
-    this.listQuery.end = `${currentYear}12期`;
-  },
-  methods: {
-    handleChange(value) {
-      // console.log('选择的值:', this.selectedValues);
-    },
-    async getDataList() {
-      this.tableData = []
-      this.listQuery.yearPhaseStart = this.listQuery.start ? this.listQuery.start.slice(0,6) :undefined
-      this.listQuery.yearPhaseEnd = this.listQuery.end ? this.listQuery.end.slice(0, 6) : undefined
-      if (this.listQuery.end && this.listQuery.start) {
-        if (this.listQuery.end.slice(0, 4) - this.listQuery.start.slice(0, 4) > 10) {
-          this.listQuery.end = undefined
-          this.listQuery.start = undefined
-          this.listQuery.yearPhaseStart = undefined
-          this.listQuery.yearPhaseEnd = undefined
-          return this.$message({
-            message: '起止年份不能超过十年',
-            type: 'warning'
-          });
-        }
-        await getCostMainPage(this.listQuery).then(res => {
-          if (res.code === 0) {
-            // this.tableData = res.data.list
-            res.data.list.forEach((item, index) => {
-              let obj = {
-                in: Math.random().toString().slice(2, 10),
-                id:item.id,
-                yearPhase: item.yearPhase,
-                center: item.center,
-                product: item.product,
-                spec: item.spec,
-                workorderCode: item.workorderCode,
-                workorderLineNum: item.workorderLineNum,
-                supplierCode: item.supplierCode,
-                supplier: item.supplier,
-                unit: item.unit,
-                planNum: item.planNum,
-                finishNum: item.finishNum,
-                unitConsume: item.unitConsume,
-                unitCost: item.unitCost,
-                cost: item.cost,
-                totalFinishNum: item.totalFinishNum,
-                totalUnitConsume: item.totalUnitConsume,
-                totalUnitCost: item.totalUnitCost,
-                totalCost: item.totalCost,
-                createTime: item.createTime,
-                yearPhaseName: item.yearPhaseName,
-                project: item.project,
-                material: item.material,
-                children:[]
-              }
-              this.tableData.push(obj)
-              item.children.forEach((ele, ind) => {
-                // for (let i in item.projs) {
-                let obj = {
-                  in: Math.random().toString().slice(2, 10),
-                  id: ele.id,
-                  yearPhase: ele.yearPhase,
-                  center: ele.center,
-                  product: ele.product,
-                  spec: ele.spec,
-                  workorderCode: ele.workorderCode,
-                  workorderLineNum: ele.workorderLineNum,
-                  supplierCode: ele.supplierCode,
-                  supplier: ele.supplier,
-                  unit: ele.unit,
-                  planNum: ele.planNum,
-                  finishNum: ele.finishNum,
-                  unitConsume: ele.unitConsume,
-                  unitCost: ele.unitCost,
-                  cost: ele.cost,
-                  totalFinishNum: ele.totalFinishNum,
-                  totalUnitConsume: ele.totalUnitConsume,
-                  totalUnitCost: ele.totalUnitCost,
-                  totalCost: ele.totalCost,
-                  createTime: ele.createTime,
-                  yearPhaseName: ele.yearPhaseName,
-                  project: ele.project,
-                  material: ele.material,
-                  children:[]
-                }
-                this.tableData[index].children.push(obj)
-                ele.children?.forEach((i,inde) => {
-                  // for (let i in item.projs) {
-                  let obj = {
-                    in: Math.random().toString().slice(2, 10),
-                    id: i.id,
-                    yearPhase: i.yearPhase,
-                    center: i.center,
-                    product: i.product,
-                    spec: i.spec,
-                    workorderCode: i.workorderCode,
-                    workorderLineNum: i.workorderLineNum,
-                    supplierCode: i.supplierCode,
-                    supplier: i.supplier,
-                    unit: i.unit,
-                    planNum: i.planNum,
-                    finishNum: i.finishNum,
-                    unitConsume: i.unitConsume,
-                    unitCost: i.unitCost,
-                    cost: i.cost,
-                    totalFinishNum: i.totalFinishNum,
-                    totalUnitConsume: i.totalUnitConsume,
-                    totalUnitCost: i.totalUnitCost,
-                    totalCost: i.totalCost,
-                    createTime: i.createTime,
-                    yearPhaseName: i.yearPhaseName,
-                    project: i.project,
-                    material: i.material,
-                  }
-                  this.tableData[index].children[ind].children.push(obj)
-                  // });
-                  // }
-                });
-                // });
-                // }
-              });
-
-            });
-            console.log(this.tableData);
-            this.listQuery.total = res.data.total
-          }
-        })
-      } else {
-        return this.$message({
-          message: '请选择起止年份和期数',
-          type: 'warning'
-        });
-      }
-
-    },
-    buttonClick(val) {
-      this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined;
-      switch (val.btnName) {
-        case 'search':
-          this.listQuery.pageNo = 1;
-          this.listQuery.pageSize = 10;
-          this.getDataList();
-          break;
-        case 'export':
-          this.handleExport();
-          break;
-        default:
-          console.log(val);
-      }
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      const queryParams = this.listQuery;
-      // queryParams.current = 1
-      // queryParams.size = 999
-      // if (this.facType === 0) {
-      this.$modal.confirm('是否确认导出所有数据项?').then(() => {
-        this.exportLoading = true;
-        return exportExcel(queryParams);
-      }).then(response => {
-        this.$download.excel(response, '成本核算数据.xls');
-        this.exportLoading = false;
-      }).catch(() => { });
-      // }
-    }
-  },
-};
-</script>
-
-<style>
-/* .blueTip { */
-/* padding-bottom: 10px; */
-/* } */
-.blueTip .el-date-editor .el-range__icon {
-  font-size: 16px;
-  color: #0b58ff;
-}
-
-.blueTip .el-input__prefix .el-icon-date {
-  font-size: 16px;
-  color: #0b58ff;
-}
-
-.blueTip .el-input__prefix .el-icon-time {
-  font-size: 16px;
-  color: #0b58ff;
-}
-
-.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;
-  background-color: #fff;
-  border-radius: 4px;
-  padding: 16px 16px 0;
-  height: calc(100vh - 134px);
-  overflow: auto;
-}
-</style>

src/views/cost/index.vue

@@ -0,0 +1,421 @@
+<!--
+ * @Author: zhp
+ * @Date: 2024-04-15 10:49:13
+ * @LastEditTime: 2024-05-06 14:55:56
+ * @LastEditors: zhp
+ * @Description:
+-->
+<template>
+  <div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 31px)">
+    <div class="app-container" style="padding: 16px 24px 0;height: auto; flex-grow: 1;">
+      <search-bar :formConfigs="mainFormConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
+        <el-row :gutter="24">
+          <el-col :span="12" v-for="item in  dataList" :key="item.id">
+            <line-chart :id="item.id"  class="yearChart" ref="lineChart" style="height: 40vh;width: 100%"></line-chart>
+          </el-col>
+          <!-- <el-col :span="12">
+            <line-chart :id=" 'second' " class="yearChart" ref="lineChart" style="height: 40vh;width: 100%"></line-chart>
+          </el-col> -->
+        </el-row>
+    </div>
+    <div class="app-container" style="margin-top: 18px;flex-grow: 1; height: auto; padding: 16px;">
+      <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
+      <base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize"
+        :table-data="tableData">
+      </base-table>
+    </div>
+    <!-- <inputTable :date="date" :data="tableData" :time="[startTimeStamp, endTimeStamp]" :sum="all"
+      :type="listQuery.reportType" @refreshDataList="getDataList" /> -->
+    <!-- <pagination
+			:limit.sync="listQuery.pageSize"
+			:page.sync="listQuery.pageNo"
+			:total="listQuery.total"
+			@pagination="getDataList" /> -->
+  </div>
+</template>
+
+<script>
+// import { parseTime } from '../../core/mixins/code-filter';
+import { getOrderList, getCostPage } from '@/api/cost/index';
+// import inputTable from './inputTable.vue';
+import lineChart from './lineChart';
+import moment from 'moment'
+// import FileSaver from 'file-saver'
+// import * as XLSX from 'xlsx'
+export default {
+  components: { lineChart },
+	data() {
+    return {
+      listQuery: {
+        current: 1,
+        size: 10,
+        // factoryId: null,
+        // total: 0,
+        // type: null,
+        // reportType: 2,
+        reportTime: []
+      },
+      dataList: [
+        {
+          id:'first',
+        },
+         {
+          id: 'second',
+        },
+         {
+          id: 'third',
+        },
+         {
+          id: 'fourth',
+        },
+         {
+          id: 'fifth',
+        },
+         {
+          id: 'sixth',
+        },
+      ],
+			urlOptions: {
+				// getDataListURL: getGlassPage,
+				// exportURL: exportGlasscExcel
+      },
+      mainFormConfig: [
+      	{
+          type: 'select',
+          label: '工单',
+          placeholder: '请选择工单',
+          param: 'workOrderId',
+          selectOptions: [],
+          clearable: true,
+        },
+        // {
+        // 	type: 'select',
+        // 	label: '产线',
+        // 	placeholder: '请选择产线',
+        // 	param: 'lineId',
+        // 	selectOptions: [],
+        // },
+        // 选项切换
+        // {
+        // 	type: 'select',
+        // 	label: '时间类型',
+        // 	param: 'dateFilterType',
+        // 	defaultSelect: 0,
+        // 	selectOptions: [
+        // 		{ id: 0, name: '按时间段' },
+        // 		{ id: 1, name: '按日期' },
+        // 	],
+        // 	index: 2,
+        // 	extraOptions: [
+        {
+          // parent: 'dateFilterType',
+          // 时间段选择
+          type: 'datePicker',
+          label: '时间段',
+          // dateType: 'datetimerange',
+          dateType: 'datetimerange',
+          format: 'yyyy-MM-dd HH:mm:ss',
+          valueFormat: 'yyyy-MM-ddTHH:mm:ss',
+          rangeSeparator: '-',
+          rangeSeparator: '-',
+          startPlaceholder: '开始时间',
+          endPlaceholder: '结束时间',
+          param: 'recordTime',
+          clearable:true,
+        },
+        // 		{
+        // 			parent: 'dateFilterType',
+        // 			// 日期选择
+        // 			type: 'datePicker',
+        // 			// label: '日期',
+        // 			dateType: 'date',
+        // 			placeholder: '选择日期',
+        // 			format: 'yyyy-MM-dd',
+        // 			valueFormat: 'yyyy-MM-dd',
+        // 			param: 'timeday',
+        // 		},
+        // 	],
+        // },
+        {
+          type:'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary',
+        },
+         {
+          type:'separate'
+        },
+        // {
+        //   type: this.$auth.hasPermi(
+        //     'analysis:equipment:export'
+        //   )
+        //     ? 'separate'
+        //     : '',
+        // },
+        {
+          type:'button',
+          btnName: '导出',
+          name: 'export',
+          color: 'warning',
+        },
+      ],
+      formConfig: [
+        {
+          type: 'title',
+          label: '成本管理',
+        },
+      ],
+      timeList: [
+        {
+          value: 'month',
+          label:'月'
+        },
+        {
+          value: 'year',
+          label: '年'
+        }
+      ],
+      factoryList: [
+        {
+          name: '测试',
+          id:1
+        }
+      ],
+      tableProps: [
+        // {
+        // 	prop: 'createTime',
+        // 	label: '添加时间',
+        // 	fixed: true,
+        // 	width: 180,
+        // 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
+        // },
+        {
+          prop: 'userName',
+          label: '日期',
+        },
+        {
+          prop: 'nickName',
+          label: '工厂名称',
+        }
+      ],
+      timeSelect:'month',
+      startTimeStamp:null, //开始时间
+      endTimeStamp:null, //结束时间
+      // date:'凯盛玻璃控股成员企业2024生产数据',
+			// reportTime: '',
+			startTimeStamp: '',
+			endTimeStamp: '',
+      tableData: [
+        {
+          userName: 'userName',
+          nickName: '用户名',
+          datas:'111111'
+        },
+        {
+          userName: 'userName',
+          nickName: '用户名',
+          datas: '111111'
+        },
+        {
+          userName: 'userName',
+          nickName: '用户名',
+          datas: '111111'
+          // subcomponent: row
+        }
+      ],
+			// proLineList: [],
+			// all: {}
+		};
+	},
+	mounted() {
+    this.getDict()
+    // this.getCurrentYearFirst()
+    this.getDataList()
+	},
+  methods: {
+    buttonClick() {
+
+    },
+    // handleTime() {
+    //   this.$forceUpdate()
+    //   // this.$nextTick(() => [
+
+    //   // ])
+    // },
+    // getCurrentYearFirst() {
+    //   let date = new Date();
+    //   date.setDate(1);
+    //   date.setMonth(0);
+    //   this.reportTime = date;
+    //   this.startTimeStamp = this.timeFun(new Date(new Date().getFullYear(), 0, 1, 7, 0, 1).getTime()); //开始时间
+    //   this.endTimeStamp = this.timeFun(new Date(new Date().getFullYear(), 11, 31, 7, 0, 0).getTime()); //结束时间
+    //   this.listQuery.reportTime[0] = parseTime(new Date(new Date().getFullYear(), 0, 1, 7, 0, 1).getTime()) //+ ' 00:00:00' //new Date(this.startTimeStamp + ' 00:00:00').getTime() / 1000
+    //   this.listQuery.reportTime[1] = parseTime(new Date(new Date().getFullYear(), 11, 31, 7, 0, 0).getTime()) //+ ' 23:59:59' //new Date(this.endTimeStamp + ' 23:59:59').getTime() / 100
+    // },
+    changeTime(val) {
+      if (val) {
+        // let timeStamp = val.getTime(); //标准时间转为时间戳，毫秒级别
+        // this.endTimeStamp = this.timeFun(new Date(val.getFullYear(), 11, 31, 7, 0, 0).getTime()); //开始时间
+        // this.startTimeStamp = this.timeFun(new Date(val.getFullYear(), 0, 1, 7, 0, 1).getTime()); //结束时间
+        // this.listQuery.reportTime[0] = parseTime(new Date(val.getFullYear(), 0, 1, 7, 0, 1).getTime()) //+ ' 00:00:00' //new Date(this.startTimeStamp + ' 00:00:00').getTime() / 1000
+        // this.listQuery.reportTime[1] = parseTime(new Date(val.getFullYear(), 11, 31, 7, 0, 0).getTime()) //+ ' 23:59:59' //new Date(this.endTimeStamp + ' 23:59:59').getTime() / 1000
+      } else {
+        this.listQuery.reportTime = []
+      }
+    },
+    async getDict() {
+      // this.$refs.lineChart.initChart()
+			// 产线列表
+      const res = await getOrderList({
+        current:1,
+        size:999,
+      });
+      console.log(res)
+			this.mainFormConfig[0].selectOptions = 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() {
+        const res = await getCostPage({
+        current: 1,
+        size: 999,
+      });
+    },
+    add0(m) {
+      return m < 10 ? '0' + m : m
+    },
+    format(shijianchuo) {
+      //shijianchuo是整数，否则要parseInt转换
+      var time = moment(new Date(shijianchuo)).format('YYYY-MM-DD HH:mm:ss')
+      // console.log(time)
+      // var y = time.getFullYear();
+      // var m = time.getMonth() + 1;
+      // var d = time.getDate();
+      // var h = time.getHours();
+      // var mm = time.getMinutes();
+      // var s = time.getSeconds();
+      return time
+    },
+		changeTime(val) {
+      if (val) {
+        // console.log(val)
+        // console.log(val.setHours(7, 0, 0))
+        // console.log(val.setHours(7, 0, 0) + 24 * 60 * 60 * 1000)
+        // let time = this.format(val.setHours(7, 0, 0))
+        this.endTimeStamp = this.format(val.setHours(7, 0, 0)) //+ ' 00:00:00' //new Date(this.startTimeStamp + ' 00:00:00').getTime() / 1000
+        this.startTimeStamp  = this.format(val.setHours(7, 0, 1) - 24 * 60 * 60 * 1000) //+ ' 23:59:59' //new Date(this.endTimeStamp + ' 23:59:59').getTime() / 1000
+        // console.log(this.listQuery.reportTime);
+        this.listQuery.reportTime[0] = this.format(val.setHours(7, 0, 1)) //+ ' 00:00:00' //new Date(this.startTimeStamp + ' 00:00:00').getTime() / 1000
+        this.listQuery.reportTime[1] = this.format(val.setHours(7, 0, 0) + 24 * 60 * 60 * 1000) //+ ' 23:59:59' //new Date(this.endTimeStamp + ' 23:59:59').getTime() / 1000
+        console.log(this.listQuery.reportTime);
+			} else {
+					this.listQuery.reportTime = []
+			}
+		},
+
+		//时间戳转为yy-mm-dd hh:mm:ss
+		timeFun(unixtimestamp) {
+				var unixtimestamp = new Date(unixtimestamp);
+				var year = 1900 + unixtimestamp.getYear();
+				var month = "0" + (unixtimestamp.getMonth() + 1);
+				var date = "0" + unixtimestamp.getDate();
+				return year + "-" + month.substring(month.length - 2, month.length) + "-" + date.substring(date.length - 2, date.length)
+		},
+		buttonClick(val) {
+			this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined;
+			switch (val.btnName) {
+				case 'search':
+					this.listQuery.pageNo = 1;
+					this.listQuery.pageSize = 10;
+					this.getDataList();
+					break;
+				case 'export':
+					this.handleExport();
+					break;
+				default:
+					console.log(val);
+			}
+		},
+		/** 导出按钮操作 */
+    handleExport() {
+      // 处理查询参数
+      // var xlsxParam = { raw: true };
+      // /* 从表生成工作簿对象 */
+      // import('xlsx').then(excel => {
+      //   var wb = excel.utils.table_to_book(
+      //     document.querySelector("#exportTable"),
+      //     xlsxParam
+      //   );
+      //   /* 获取二进制字符串作为输出 */
+      //   var wbout = excel.write(wb, {
+      //     bookType: "xlsx",
+      //     bookSST: true,
+      //     type: "array",
+      //   });
+      //   try {
+      //     FileSaver.saveAs(
+      //       //Blob 对象表示一个不可变、原始数据的类文件对象。
+      //       //Blob 表示的不一定是JavaScript原生格式的数据。
+      //       //File 接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。
+      //       //返回一个新创建的 Blob 对象，其内容由参数中给定的数组串联组成。
+      //       new Blob([wbout], { type: "application/octet-stream" }),
+      //       //设置导出文件名称
+      //       "许昌安彩日原片生产汇总.xlsx"
+      //     );
+      //   } catch (e) {
+      //     if (typeof console !== "undefined") console.log(e, wbout);
+      //   }
+      //   return wbout;
+      //   //do something......
+      // })
+
+    },
+	},
+};
+</script>
+
+<style scoped>
+/* .blueTip { */
+	/* padding-bottom: 10px; */
+/* } */
+/* .blueTi */
+.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 16px 0;
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 16px 16px 0;
+  height: calc(100vh - 134px);
+  overflow: auto;
+}
+</style>

src/views/cost/lineChart.vue

@@ -0,0 +1,233 @@
+<!--
+ * @Author: zwq
+ * @Date: 2022-01-21 14:43:06
+ * @LastEditors: zhp
+ * @LastEditTime: 2024-04-16 14:16:17
+ * @Description:
+-->
+<template>
+  <!-- <div> -->
+    <!-- <div :id="id" :class="className" :style="{ height: '65%', width:width}" /> -->
+    <div :id="id" class="costChart" :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: 'OverviewBar',
+  // mixins: [resize],
+  props: {
+    id: {
+      type: String,
+      default: 'OverviewLine'
+    },
+    // className: {
+    //   type: String,
+    //   default: 'epChart'
+    // },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    beilv: {
+      type: Number,
+      default: 1
+    },
+    height: {
+      type: String,
+      default: '35vh'
+    },
+    legendPosition: {
+      type: String,
+      default: 'center'
+    },
+    showLegend: {
+      type: Boolean,
+      default: false
+    },
+    legendData: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      chartData: [
+        {
+          name: '产品1',
+          num: 1112,
+          yield: 0.97,
+        },
+        {
+          name: '产品2',
+          num: 1112,
+          yield: 0.97,
+        },
+        {
+          name: '产品3',
+          num: 1112,
+          yield: 0.97,
+        },
+        {
+          name: '产品4',
+          num: 1112,
+          yield: 0.97,
+        },
+        {
+          name: '产品5',
+          num: 1112,
+          yield: 0.97,
+        }
+      ],
+      chart: null,
+      colors: ['rgba(113, 99, 254, 1)', 'rgba(39, 139, 255, 1)', 'rgba(100, 189, 255, 1)', 'rgba(143, 240, 170, 1)', 'rgba(246, 189, 22, 0.85)'],
+    }
+  },
+  mounted() {
+    this.initChart()
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return
+    }
+    this.chart.dispose()
+    this.chart = null
+  },
+  methods: {
+    getEqualNewlineString(params, length) {
+      let text = ''
+      let count = Math.ceil(params.length / length) // 向上取整数
+      // 一行展示length个
+      if (count > 1) {
+        for (let z = 1; z <= count; z++) {
+          text += params.substr((z - 1) * length, length)
+          if (z < count) {
+            text += '\n'
+          }
+        }
+      } else {
+        text += params.substr(0, length)
+      }
+      return text
+    },
+    initChart() {
+      console.log(1111)
+      let num = 0
+      this.chartData && this.chartData.length > 0 && this.chartData.map(i => {
+        num += i.num
+      })
+      if (
+        this.chart !== null &&
+        this.chart !== '' &&
+        this.chart !== undefined
+      ) {
+        this.chart.dispose()
+      }
+      this.chart = echarts.init(document.getElementById(this.id))
+      this.chart.setOption({
+        color: this.colors,
+        title: {
+          text: num,
+          subtext: '总数/片',
+          top: '32%',
+          left: '49%',
+          textAlign: 'center',
+          textStyle: {
+            fontSize: 32,
+            color: 'rgba(140, 140, 140, 1)',
+          },
+          subtextStyle: {
+            fontSize: 20,
+            color: '#fff00',
+          },
+        },
+        legend: {
+          bottom: '2%',
+          left: 'center',
+          itemWidth: 12,
+          itemHeight: 12,
+          icon: 'roundRect',
+          textStyle: {
+            color: 'rgba(140, 140, 140, 1)'
+          },
+          data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
+            name: item.name,
+            itemStyle: {
+              color: this.colors[index % 4]
+            }
+          }))
+        },
+        series: [{
+          name: 'ISRA缺陷检测',
+          type: 'pie',
+          // position:outerHeight,
+          center: ['50%', '40%'],
+          radius: ['45%', '70%'],
+          avoidLabelOverlap: true,
+          label: {
+            show: true,
+            normal: {
+              alignTo: 'labelLine',
+              margin: 10,
+              edgeDistance: 10,
+              lineHeight: 16,
+              // 各分区的提示内容
+              // params: 即下面传入的data数组,通过自定义函数，展示你想要的内容和格式
+              formatter: function (params) {
+                console.log(params);
+                return;
+              },
+              formatter: (params) => {
+                //调用自定义显示格式
+                return this.getEqualNewlineString(params.value + " | " + params.percent.toFixed(0) + "%" + "\n" + params.name, 10);
+              },
+              textStyle: {            // 提示文字的样式
+                // color: 'rgba(0, 0, 0, 0.65)',
+                fontSize: 18
+              }
+            }
+          },
+          labelLine: {
+            show: true,
+            length: 25,
+            length2: 100,
+          },
+          data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
+            name: item.name,
+            value: item.num,
+            label: {
+              color: this.colors[index % 4]
+            },
+            itemStyle: {
+              // color: {
+              //   type: 'linear',
+              //   x: 0,
+              //   y: 0,
+              //   x2: 0,
+              //   y2: 1,
+              //   global: false,
+              //   colorStops: [
+              //     { offset: 0, color: this.colors[index % 4] },
+              //     { offset: 1, color: this.colors[index % 4] + '33' }
+              //   ]
+              // }
+            }
+          }))
+        }],
+        tooltip: {
+          trigger: 'item',
+          className: "isra-chart-tooltip"
+        },
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/dashboard/charts/Bipv.vue

@@ -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>
@@ -25,10 +24,7 @@ export default {
   data() {
     const year = new Date().getFullYear();
     // 城市数组的顺序必须是固定的
-    const cities = [ "邯郸",
+    const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"];
-      // "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
-
-    ];
     return {
       legend: [
         { label: `${year}年目标值`, color: "#f3c000" },
@@ -74,15 +70,15 @@ export default {
       return [
         {
           name: `${new Date().getFullYear()}年目标值`,
-          data: bipvOutput.target.splice(0, 1),
+          data: bipvOutput.target,
         },
         {
           name: `${new Date().getFullYear() - 1}年`,
-          data: bipvOutput.previous.splice(0, 1)
+          data: bipvOutput.previous,
         },
         {
           name: `${new Date().getFullYear()}年`,
-          data: bipvOutput.current.splice(0, 1),
+          data: bipvOutput.current,
         },
       ];
     },

src/views/dashboard/charts/ChipInvest.vue

@@ -1,9 +1,8 @@
-<!--
+<!-- 
- * @Author: zhp
+    filename: chip-invest.vue
- * @Date: 2024-06-03 15:38:31
+    author: liubin
- * @LastEditTime: 2024-06-21 15:06:39
+    date: 2024-04-10 08:59:28
- * @LastEditors: zhp
+    description: 
- * @Description:
 -->
 
 <template>
@@ -24,9 +23,7 @@ export default {
   data() {
     const year = new Date().getFullYear();
     // 城市数组的顺序必须是固定的
-    const cities = ["瑞昌", "邯郸",
+    const cities = ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"];
-      // "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
-    ];
     return {
       legend: [
         { label: `${year - 1}年`, color: "#12f7f1" },
@@ -35,7 +32,6 @@ export default {
       xAxis: cities,
     };
   },
-
   computed: {
     series() {
       const chipInvest = this.$store.getters.home.chipInvest;

src/views/dashboard/charts/ChipYield.vue

@@ -1,8 +1,8 @@
-<!--
+<!-- 
     filename: ChipYield.vue
     author: liubin
     date: 2024-04-11 10:46:47
-    description:
+    description: 
 -->
 
 <template>
@@ -11,24 +11,24 @@
     <section class="right-part">
       <div class="yield-location">
         <section class="btn-group">
-          <!-- <button
+          <button
             @click="activeLoc = '1'"
             :class="activeLoc === '1' ? 'active' : ''"
           >
             成都
-          </button> -->
+          </button>
           <button
             @click="activeLoc = '2'"
             :class="activeLoc === '2' ? 'active' : ''"
           >
             邯郸
           </button>
-          <!-- <button
+          <button
             @click="activeLoc = '3'"
             :class="activeLoc === '3' ? 'active' : ''"
           >
             株洲
-          </button> -->
+          </button>
           <button
             @click="activeLoc = '4'"
             :class="activeLoc === '4' ? 'active' : ''"
@@ -37,7 +37,7 @@
           </button>
         </section>
         <section class="btn-group">
-          <!-- <button
+          <button
             @click="activeLoc = '5'"
             :class="activeLoc === '5' ? 'active' : ''"
             class="fixwidth"
@@ -55,7 +55,7 @@
             :class="activeLoc === '7' ? 'active' : ''"
           >
             蚌埠兴科
-          </button> -->
+          </button>
         </section>
       </div>
       <div class="yield-summary">
@@ -85,14 +85,13 @@ export default {
   props: {},
   data() {
     return {
-      activeLoc: "2",
+      activeLoc: "1",
     };
   },
   computed: {
     output() {
       // ["瑞昌", "邯郸", "株洲", "佳木斯", "成都", "凯盛", "蚌埠"]
       const chipOutput = this.$store.getters.home.chipOutput;
-      console.log('chipOutput', chipOutput);
       if (
         !chipOutput ||
         !chipOutput.target ||

src/views/dashboard/charts/ChipYieldChart.vue

@@ -1,9 +1,8 @@
-<!--
+<!-- 
- * @Author: zhp
+    filename: ChipYield.vue
- * @Date: 2024-04-28 13:42:51
+    author: liubin
- * @LastEditTime: 2024-07-23 16:36:18
+    date: 2024-04-11 10:46:47
- * @LastEditors: zhp
+    description: 
- * @Description:
 -->
 
 <template>
@@ -47,30 +46,20 @@ export default {
           top: 0,
           containLabel: true,
         },
-        tooltip: {
+        tooltip: {},
-          trigger: "item",
-          // axisPointer: {
-          //   // type: "cross",
-          //   crossStyle: {
-          //     color: "rgba(237,237,237,0.5)",
-          //   },
-          // },
-          backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-          extraCssText: 'padding:0;border-width:0',
-        },
         title: {
           text: "0%",
           left: "48%",
           top: "40%",
           textAlign: "center",
           textStyle: {
-            fontWeight: 400,
+            fontWeight: 600,
             fontSize: 32,
             color: "#fffd",
           },
           subtext: `\u2002${year}年累计产出\u2002`,
           subtextStyle: {
-            fontSize: 15,
+            fontSize: 12,
             fontWeight: 100,
             color: "#fffd",
             align: "right",
@@ -102,11 +91,9 @@ export default {
             },
             data: [
               {
-                value: 0,
+                value: 90,
                 name: `${year}累计产出`,
                 selected: false,
-                tooltip: {
-                },
                 itemStyle: {
                   borderJoin: "round",
                   borderCap: "round",
@@ -126,10 +113,8 @@ export default {
                 },
               },
               {
-                value: 0,
+                value: 20,
-                name: `${year}目标`,
+                name: "-",
-                tooltip: {
-                },
                 itemStyle: { color: "transparent" },
                 label: { show: false },
               },
@@ -149,22 +134,9 @@ export default {
             },
             data: [
               {
-                value: 0,
+                value: 90,
                 name: `${year - 1}累计产出`,
                 selected: false,
-                tooltip: {
-                  trigger: "item",
-                  // axisPointer: {
-                  //   // type: "cross",
-                  //   crossStyle: {
-                  //     color: "rgba(237,237,237,0.5)",
-                  //   },
-                  // },
-                  backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-                  extraCssText: 'padding:0;border-width:0',
-                  formatter: params => {
-                  },
-                },
                 itemStyle: {
                   borderJoin: "round",
                   borderCap: "round",
@@ -185,18 +157,7 @@ export default {
               },
               {
                 value: 0,
-                name: `${year - 1}累计产出`,
+                name: "-",
-                tooltip: {
-                  trigger: "item",
-                  // axisPointer: {
-                  //   // type: "cross",
-                  //   crossStyle: {
-                  //     color: "rgba(237,237,237,0.5)",
-                  //   },
-                  // },
-                  backgroundColor: 'rgba(0,0,0,0)', // tooltip默认背景为白色，手动置为透明
-                  extraCssText: 'padding:0;border-width:0',
-                },
                 itemStyle: { color: "transparent" },
                 label: { show: false },
               },
@@ -241,84 +202,32 @@ export default {
       };
     },
     actualOptions() {
-      console.log('this.output.current / this.output.target', this.output.current/this.output.target);
+      const options = JSON.parse(JSON.stringify(this.options));
-      const year = new Date().getFullYear()
-      const options = this.options
-      // console.log('options', options);
       // 标题
-      if (!this.output.target && !this.output.current) options.title.text = "0%";
+      if (!this.output.target) options.title.text = "0%";
-      else if (!this.output.target && this.output.current) options.title.text = "100%";
+      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 (
         this.output.current == this.output.target &&
         this.output.current == 0
       ) {
-        this.options.series[1].data[0].value = 0;
+        options.series[1].data[0].value = 0;
-        this.options.series[1].data[1].value = 1;
+        options.series[1].data[1].value = 100;
-        this.options.series[1].data[0].tooltip.formatter =
-          `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
-              <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year + '累计完成'}</span>
-             <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${0}</span>
-              </div>`;
-        this.options.series[1].data[1].tooltip.formatter =
-            `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
-              <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year + '累计完成'}</span>
-                <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${0 }</span>
-              </div>`;
       } else {
-        this.options.series[1].data[0].value = this.output.current;
+        options.series[1].data[0].value = this.output.current;
-        this.options.series[1].data[1].value =
+        options.series[1].data[1].value =
           this.output.target - this.output.current;
-        this.options.series[1].data[0].tooltip.formatter =
-          `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
-           <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year + '累计完成'}</span>
-           <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${this.output.current}</span>
-              </div>`;
-        this.options.series[1].data[1].tooltip.formatter =
-          `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#4CF0E8'></span>
-            <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year + '累计完成'}</span>
-            <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${this.output.current}</span>
-              </div>`;
       }
       // 内环
       if (this.output.previous == 0) {
-        this.options.series[2].data[0].value = 0;
+        options.series[2].data[0].value = 0;
-        this.options.series[2].data[1].value = 1;
+        options.series[2].data[1].value = 100;
-        this.options.series[2].data[0].tooltip.formatter =
-          `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-            <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year - 1 + '累计完成'}</span>
-            <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${0}</span>
-              </div>`;
-        this.options.series[2].data[1].tooltip.formatter =
-          `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-         <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year - 1 + '累计完成'}</span>
-          <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${0}</span>
-              </div>`;
       } else {
-        this.options.series[2].data[0].value = this.output.previous;
+        options.series[2].data[0].value = this.output.previous;
-        this.options.series[2].data[1].value = 0;
+        options.series[2].data[1].value = 0;
-        this.options.series[2].data[0].tooltip.formatter =
-          `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-      <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year - 1 + '累计完成'}</span>
-        <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${this.output.previous}</span>
-              </div>`;
-        this.options.series[2].data[1].tooltip.formatter =
-          `<div style="padding: 12px 16px;background:rgba(0,24,41,.5);box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38);backdrop-filter: blur(10px);">
-          <span style='display:inline-block;margin-right:4px;border-radius:2px;width:12px;height:12px;background-color:#1065ff'></span>
-              <span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:16px;letter-spacing: 2px;'>${year - 1 + '累计完成'}</span> +
-              <span style='color:rgba(255,255,255,0.65);font-size:16px;letter-spacing: 2px;'>${this.output.previous}</span>
-              </div>`;
       }
-      console.log('options', options);
       return options;
     },
   },
@@ -334,9 +243,6 @@ export default {
     factory(val) {
       this.initOptions(this.actualOptions);
     },
-    actualOptions() {
-      this.initOptions(this.actualOptions);
-    }
   },
   mounted() {
     console.log("mounted", this.actualOptions);