diff --git a/package.json b/package.json index 7ade74b..a468d93 100644 --- a/package.json +++ b/package.json @@ -66,7 +66,8 @@ "vuex": "3.6.0", "vxe-table": "^3.7.8", "xe-utils": "^3.5.11", - "xlsx": "^0.18.5" + "xlsx": "^0.18.5", + "zradmin": "file:" }, "devDependencies": { "@vue/cli-plugin-babel": "4.4.4", diff --git a/src/api/echarts/index.js b/src/api/echarts/index.js new file mode 100644 index 0000000..63cc35d --- /dev/null +++ b/src/api/echarts/index.js @@ -0,0 +1,12 @@ +import request from '@/utils/request' +/** +* 获取质量Echarts图表 +* @param data +*/ +export function GetFQCQualityOptions(data) { + return request({ + url: 'mes/echarts/fqc/getEchartsData', + method: 'post', + data: data, + }) +} diff --git a/src/main.js b/src/main.js index 857f82f..599adee 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1,5 @@ import Vue from 'vue' - +import VueCompositionAPI from '@vue/composition-api' import Cookies from 'js-cookie' import Element from 'element-ui' @@ -42,7 +42,7 @@ import DictData from '@/components/DictData'; import VueQr from 'vue-qr' import printJS from 'print-js' // echarts相关插件引入 -import * as echarts from 'echarts'; +import * as echarts from 'echarts' import ECharts from 'vue-echarts' // VXE-Table相关组件 import VXETable from 'vxe-table'; @@ -74,6 +74,7 @@ Vue.prototype.handleTree = handleTree Vue.prototype.handleDict = handleDict Vue.prototype.downFile = downFile Vue.prototype.$dayjs = dayjs +Vue.prototype.$echarts = echarts Vue.prototype.msgSuccess = function (msg) { this.$message({ showClose: true, message: msg, type: "success" }); @@ -99,6 +100,7 @@ Vue.component('UploadFile', UploadFile) Vue.component('VueQr', VueQr) Vue.component('v-charts', ECharts) // Vue.use(printJS); +Vue.use(VueCompositionAPI) Vue.use(permission) Vue.use(plugins) Vue.use(Element, { diff --git a/src/router/index.js b/src/router/index.js index 9adc0e4..4659abb 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -17,106 +17,111 @@ import Layout from '@/layout' * redirect: noRedirect // 当设置 noRedirect 的时候该路由在面包屑导航中不可被点击 * name:'router-name' // 设定路由的名字,一定要填写不然使用时会出现各种问题 * meta : { - noCache: true // 如果设置为true,则不会被 缓存(默认 false) - title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字 - icon: 'svg-name' // 设置该路由的图标,对应路径src/assets/icons/svg - breadcrumb: false // 如果设置为false,则不会在breadcrumb面包屑中显示 + noCache: true // 如果设置为true,则不会被 缓存(默认 false) + title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字 + icon: 'svg-name' // 设置该路由的图标,对应路径src/assets/icons/svg + breadcrumb: false // 如果设置为false,则不会在breadcrumb面包屑中显示 } */ // 公共路由 export const constantRoutes = [{ - path: '/redirect', - component: Layout, - hidden: true, - children: [{ - path: '/redirect/:path(.*)', - component: (resolve) => require(['@/views/redirect'], resolve) - }] - }, - { - path: '/login', - component: (resolve) => require(['@/views/login'], resolve), - hidden: true - }, - { - path: '/register', - component: (resolve) => require(['@/views/register'], resolve), - hidden: true - }, - { - path: '/404', - component: (resolve) => require(['@/views/error/404'], resolve), - hidden: true - }, - { - path: '/401', - component: (resolve) => require(['@/views/error/401'], resolve), - hidden: true - }, - { - path: '', - component: Layout, - redirect: 'index', - children: [{ - path: 'index', - component: (resolve) => require(['@/views/index'], resolve), - name: 'Index', - meta: { title: '首页', icon: 'dashboard', affix: true } - }], - }, - { - path: '/user', - component: Layout, - hidden: true, - redirect: 'noredirect', - children: [{ - path: 'profile', - component: (resolve) => require(['@/views/system/user/profile/index'], resolve), - name: 'Profile', - meta: { title: '个人中心', icon: 'user' } - }] - }, - { - path: '/echarts', - component: (resolve) => require(['@/views/components/Echarts'], resolve), - hidden: true - }, { - path: '/icons', - component: (resolve) => require(['@/views/components/icons/index'], resolve), - hidden: true - }, - // 质量检验中的初次检验 - { - path: '/firstFQC', - component: (resolve) => require(['@/views/qualityManagement/FQC/firstFQC.vue'], resolve), - hidden: true - }, - { - path: '/againFQC', - component: (resolve) => require(['@/views/qualityManagement/FQC/againFQC.vue'], resolve), - hidden: true - }, - { - path: '/thirtyFQC', - component: (resolve) => require(['@/views/qualityManagement/FQC/thirtyFQC.vue'], resolve), - hidden: true - }, - { - path: '/polishManagement/WmPolishWorkOrder', - component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/WmPolishWorkOrder.vue'], resolve), - hidden: true - }, - { - path: '/polishManagement/PolishReport', - component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishReport.vue'], resolve), - hidden: true - }, - { - path: '/polishManagement/PolishFQC', - component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishFQC.vue'], resolve), - hidden: true - }, + path: '/redirect', + component: Layout, + hidden: true, + children: [{ + path: '/redirect/:path(.*)', + component: (resolve) => require(['@/views/redirect'], resolve) + }] +}, +{ + path: '/login', + component: (resolve) => require(['@/views/login'], resolve), + hidden: true +}, +{ + path: '/register', + component: (resolve) => require(['@/views/register'], resolve), + hidden: true +}, +{ + path: '/404', + component: (resolve) => require(['@/views/error/404'], resolve), + hidden: true +}, +{ + path: '/401', + component: (resolve) => require(['@/views/error/401'], resolve), + hidden: true +}, +{ + path: '', + component: Layout, + redirect: 'index', + children: [{ + path: 'index', + component: (resolve) => require(['@/views/index'], resolve), + name: 'Index', + meta: { title: '首页', icon: 'dashboard', affix: true } + }], +}, +{ + path: '/user', + component: Layout, + hidden: true, + redirect: 'noredirect', + children: [{ + path: 'profile', + component: (resolve) => require(['@/views/system/user/profile/index'], resolve), + name: 'Profile', + meta: { title: '个人中心', icon: 'user' } + }] +}, +{ + path: '/echarts', + component: (resolve) => require(['@/views/components/Echarts'], resolve), + hidden: true +}, { + path: '/icons', + component: (resolve) => require(['@/views/components/icons/index'], resolve), + hidden: true +}, +// 质量检验中的初次检验 +{ + path: '/firstFQC', + component: (resolve) => require(['@/views/qualityManagement/FQC/firstFQC.vue'], resolve), + hidden: true +}, +{ + path: '/againFQC', + component: (resolve) => require(['@/views/qualityManagement/FQC/againFQC.vue'], resolve), + hidden: true +}, +{ + path: '/thirtyFQC', + component: (resolve) => require(['@/views/qualityManagement/FQC/thirtyFQC.vue'], resolve), + hidden: true +}, +{ + path: '/polishManagement/WmPolishWorkOrder', + component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/WmPolishWorkOrder.vue'], resolve), + hidden: true +}, +{ + path: '/polishManagement/PolishReport', + component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishReport.vue'], resolve), + hidden: true +}, +{ + path: '/polishManagement/PolishFQC', + component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishFQC.vue'], resolve), + hidden: true +}, +{ + path: '/kanbanManagement/FqcQualityDataBoard', + component: (resolve) => require(['@/views/kanbanManagement/FqcQualityDataBoard/index.vue'], resolve), + hidden: true +}, // { // path: '/qualityManagement/FQC/qualityStatistics', // component: (resolve) => require(['@/views/qualityManagement/FQC/qualityStatistics.vue'], resolve), diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/LineChart.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/LineChart.vue new file mode 100644 index 0000000..8c15b17 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/LineChart.vue @@ -0,0 +1,106 @@ + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/business/Top3缺陷零件.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/business/Top3缺陷零件.vue new file mode 100644 index 0000000..1001a5d --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/business/Top3缺陷零件.vue @@ -0,0 +1,64 @@ + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/BarChart.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/BarChart.vue new file mode 100644 index 0000000..d4a7cf5 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/BarChart.vue @@ -0,0 +1,89 @@ + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/LineChart.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/LineChart.vue new file mode 100644 index 0000000..a6c64f1 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/LineChart.vue @@ -0,0 +1,97 @@ + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/PieChart.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/PieChart.vue new file mode 100644 index 0000000..6efa8d2 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/echarts/PieChart.vue @@ -0,0 +1,81 @@ + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/table/vxeTable.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/table/vxeTable.vue new file mode 100644 index 0000000..f160684 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/table/vxeTable.vue @@ -0,0 +1,30 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/theme/dark.json b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/theme/dark.json new file mode 100644 index 0000000..0a4c1f7 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/charts/theme/dark.json @@ -0,0 +1,404 @@ +{ + "color": [ + "#dd6b66", + "#759aa0", + "#e69d87", + "#8dc1a9", + "#ea7e53", + "#eedd78", + "#73a373", + "#73b9bc", + "#7289ab", + "#91ca8c", + "#f49f42" + ], + "backgroundColor": "transparent", + "textStyle": {}, + "title": { + "textStyle": { + "color": "#ffffff" + }, + "subtextStyle": { + "color": "#9e9e9e" + } + }, + "line": { + "itemStyle": { + "borderWidth": 1 + }, + "lineStyle": { + "width": 2 + }, + "symbolSize": 4, + "symbol": "circle", + "smooth": false + }, + "radar": { + "itemStyle": { + "borderWidth": 1 + }, + "lineStyle": { + "width": 2 + }, + "symbolSize": 4, + "symbol": "circle", + "smooth": false + }, + "bar": { + "itemStyle": { + "barBorderWidth": 0, + "barBorderColor": "#ccc" + } + }, + "pie": { + "label": { + "show": true, + "color": "#ffffff", + "fontSize": "16", + "overflow": "break" + }, + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + } + }, + "scatter": { + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + } + }, + "boxplot": { + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + } + }, + "parallel": { + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + } + }, + "sankey": { + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + } + }, + "funnel": { + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + } + }, + "gauge": { + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + } + }, + "candlestick": { + "itemStyle": { + "color": "#fd1050", + "color0": "#0cf49b", + "borderColor": "#fd1050", + "borderColor0": "#0cf49b", + "borderWidth": 1 + } + }, + "graph": { + "itemStyle": { + "borderWidth": 0, + "borderColor": "#ccc" + }, + "lineStyle": { + "width": 1, + "color": "#aaaaaa" + }, + "symbolSize": 4, + "symbol": "circle", + "smooth": false, + "color": [ + "#dd6b66", + "#759aa0", + "#e69d87", + "#8dc1a9", + "#ea7e53", + "#eedd78", + "#73a373", + "#73b9bc", + "#7289ab", + "#91ca8c", + "#f49f42" + ], + "label": { + "color": "#eeeeee" + } + }, + "map": { + "itemStyle": { + "areaColor": "#eee", + "borderColor": "#444", + "borderWidth": 0.5 + }, + "label": { + "color": "#000" + }, + "emphasis": { + "itemStyle": { + "areaColor": "rgba(255,215,0,0.8)", + "borderColor": "#444", + "borderWidth": 1 + }, + "label": { + "color": "rgb(100,0,0)" + } + } + }, + "geo": { + "itemStyle": { + "areaColor": "#eee", + "borderColor": "#444", + "borderWidth": 0.5 + }, + "label": { + "color": "#000" + }, + "emphasis": { + "itemStyle": { + "areaColor": "rgba(255,215,0,0.8)", + "borderColor": "#444", + "borderWidth": 1 + }, + "label": { + "color": "rgb(100,0,0)" + } + } + }, + "categoryAxis": { + "axisLine": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisTick": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisLabel": { + "show": true, + "color": "#eeeeee" + }, + "splitLine": { + "show": true, + "lineStyle": { + "color": [ + "#aaaaaa" + ] + } + }, + "splitArea": { + "show": false, + "areaStyle": { + "color": [ + "#eeeeee" + ] + } + } + }, + "valueAxis": { + "axisLine": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisTick": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisLabel": { + "show": true, + "color": "#eeeeee" + }, + "splitLine": { + "show": true, + "lineStyle": { + "color": [ + "#aaaaaa" + ] + } + }, + "splitArea": { + "show": false, + "areaStyle": { + "color": [ + "#eeeeee" + ] + } + } + }, + "logAxis": { + "axisLine": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisTick": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisLabel": { + "show": true, + "color": "#eeeeee" + }, + "splitLine": { + "show": true, + "lineStyle": { + "color": [ + "#aaaaaa" + ] + } + }, + "splitArea": { + "show": false, + "areaStyle": { + "color": [ + "#eeeeee" + ] + } + } + }, + "timeAxis": { + "axisLine": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisTick": { + "show": true, + "lineStyle": { + "color": "#eeeeee" + } + }, + "axisLabel": { + "show": true, + "color": "#eeeeee" + }, + "splitLine": { + "show": true, + "lineStyle": { + "color": [ + "#aaaaaa" + ] + } + }, + "splitArea": { + "show": false, + "areaStyle": { + "color": [ + "#eeeeee" + ] + } + } + }, + "toolbox": { + "iconStyle": { + "borderColor": "#999999" + }, + "emphasis": { + "iconStyle": { + "borderColor": "#666666" + } + } + }, + "legend": { + "textStyle": { + "color": "#eeeeee" + } + }, + "tooltip": { + "axisPointer": { + "lineStyle": { + "color": "#eeeeee", + "width": "1" + }, + "crossStyle": { + "color": "#eeeeee", + "width": "1" + } + } + }, + "timeline": { + "lineStyle": { + "color": "#eeeeee", + "width": 1 + }, + "itemStyle": { + "color": "#dd6b66", + "borderWidth": 1 + }, + "controlStyle": { + "color": "#eeeeee", + "borderColor": "#eeeeee", + "borderWidth": 0.5 + }, + "checkpointStyle": { + "color": "#e43c59", + "borderColor": "#c23531" + }, + "label": { + "color": "#eeeeee" + }, + "emphasis": { + "itemStyle": { + "color": "#a9334c" + }, + "controlStyle": { + "color": "#eeeeee", + "borderColor": "#eeeeee", + "borderWidth": 0.5 + }, + "label": { + "color": "#eeeeee" + } + } + }, + "visualMap": { + "color": [ + "#bf444c", + "#d88273", + "#f6efa6" + ] + }, + "dataZoom": { + "backgroundColor": "rgba(47,69,84,0)", + "dataBackgroundColor": "rgba(255,255,255,0.3)", + "fillerColor": "rgba(167,183,204,0.4)", + "handleColor": "#a7b7cc", + "handleSize": "100%", + "textStyle": { + "color": "#eeeeee" + } + }, + "markPoint": { + "label": { + "color": "#eeeeee" + }, + "emphasis": { + "label": { + "color": "#eeeeee" + } + } + } +} \ No newline at end of file diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbHeader.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbHeader.vue new file mode 100644 index 0000000..5b1214b --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbHeader.vue @@ -0,0 +1,29 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbNumBox01.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbNumBox01.vue new file mode 100644 index 0000000..6544f0e --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbNumBox01.vue @@ -0,0 +1,73 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbNumBox02.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbNumBox02.vue new file mode 100644 index 0000000..c53e201 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbNumBox02.vue @@ -0,0 +1,73 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTime.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTime.vue new file mode 100644 index 0000000..8009244 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTime.vue @@ -0,0 +1,44 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle01.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle01.vue new file mode 100644 index 0000000..5363ebf --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle01.vue @@ -0,0 +1,37 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle02.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle02.vue new file mode 100644 index 0000000..29221f8 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle02.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle03.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle03.vue new file mode 100644 index 0000000..5b8f5d5 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/components/kbTitle03.vue @@ -0,0 +1,35 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/header.png b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/header.png new file mode 100644 index 0000000..e9c8411 Binary files /dev/null and b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/header.png differ diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title1.png b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title1.png new file mode 100644 index 0000000..2382310 Binary files /dev/null and b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title1.png differ diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title2.png b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title2.png new file mode 100644 index 0000000..0df8c52 Binary files /dev/null and b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title2.png differ diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title3.png b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title3.png new file mode 100644 index 0000000..b29b62d Binary files /dev/null and b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/images/title3.png differ diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.css b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.css new file mode 100644 index 0000000..678fc79 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.css @@ -0,0 +1,69 @@ +/* 主色板记录,复制粘贴使用 */ +.theme-color { + --primary-100: #0085ff; + --primary-200: #69b4ff; + --primary-300: #e0ffff; + --accent-100: #006fff; + --accent-200: #e1ffff; + --text-100: #FFFFFF; + --text-200: #9e9e9e; + --bg-100: #1E1E1E; + --bg-200: #2d2d2d; + --bg-300: #454545; +} + +/* =============== */ +.row { + display: flex; + flex-direction: row; + justify-content: space-between; +} + +.column { + display: flex; + flex-direction: column; +} + +.KANBAN-background { + width: 1920px; + height: 1080px; + margin: 0; + padding: 0; + background-color: #1E1E1E; +} + +.KANBAN-header { + width: 100%; + /* background-color: #0055ff; */ +} + +.KANBAN-main { + width: 100%; + /* background-color: #aaaaff; */ + display: flex; + flex-direction: column; +} + +.Kanban-description { + width: 100%; + margin-bottom: 20px; + height: 60px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; +} + +.card-1 { + padding-top: 50px; + padding-left: 10px; + padding-right: 10px; + padding-bottom: 20px; + width: 33%; + height: 400px; +} + +.card-2 { + width: 66%; + height: 400px; +} \ No newline at end of file diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.js b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.js new file mode 100644 index 0000000..da481eb --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.js @@ -0,0 +1,179 @@ +/// ===================== 大屏宽高自定义(百度搜索结果) ============================ +import { + getCurrentInstance, + onMounted, + onUnmounted, + ref, + watch +} from 'vue'; +const { + proxy +} = getCurrentInstance() +const screenWidth = ref(null) +const screenHeight = ref(null) +onMounted(() => { + proxy.$nextTick(() => { + // 监控屏幕尺寸变化 + var bodyStyle = document.createElement('style') + // 这里根据具体的设计稿尺寸来定 + bodyStyle.innerHTML = `body{width:1920px; height:1080px!important;}` + document.documentElement.firstElementChild.appendChild(bodyStyle) + screenWidth.value = document.body.clientWidth + screenHeight.value = document.body.clientHeight + window.onresize = () => { + return (() => { + screenWidth.value = document.documentElement.clientWidth + screenHeight.value = document.documentElement.clientHeight + })() + } + document.addEventListener('keydown', (e) => { + if (e.code == 'F11') { + screenWidth.value = document.documentElement.clientWidth + screenHeight.value = document.documentElement.clientHeight + } + }) + }) +}) +watch( + screenWidth, + (newValue, oldValue) => { + // console.log("val", val); + let docWidth = document.documentElement.clientWidth + let docHeight = document.documentElement.clientHeight + var designWidth = 1920, // 这里根据具体的设计稿尺寸来定 + designHeight = 1080, // 这里根据具体的设计稿尺寸来定 + widthRatio = docWidth / designWidth, + heightRatio = docHeight / designHeight + document.body.style = + `transform:scale(${widthRatio},${heightRatio});transform-origin:left top;overflow: hidden;` + // 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况 + setTimeout(function() { + var lateWidth = document.documentElement.clientWidth, + lateHeight = document.documentElement.clientHeight + if (lateWidth === docWidth) return + + widthRatio = lateWidth / designWidth + heightRatio = lateHeight / designHeight + document.body.style = 'transform:scale(' + widthRatio + ',' + heightRatio + + ');transform-origin:left top;overflow: hidden;' + }, 0) + }, { + immediate: true, + deep: true + } +) +watch( + screenHeight, + (newValue, oldValue) => { + // console.log("val", val); + let docWidth = document.documentElement.clientWidth + let docHeight = document.documentElement.clientHeight + var designWidth = 1920, // 这里根据具体的设计稿尺寸来定 + designHeight = 1080, // 这里根据具体的设计稿尺寸来定 + widthRatio = docWidth / designWidth, + heightRatio = docHeight / designHeight + document.body.style = + `transform:scale(${widthRatio},${heightRatio});transform-origin:left top;overflow: hidden;` + // 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况 + setTimeout(function() { + var lateWidth = document.documentElement.clientWidth, + lateHeight = document.documentElement.clientHeight + if (lateWidth === docWidth) return + + widthRatio = lateWidth / designWidth + heightRatio = lateHeight / designHeight + document.body.style = 'transform:scale(' + widthRatio + ',' + heightRatio + + ');transform-origin:left top;overflow: hidden;' + }, 0) + }, { + immediate: true, + deep: true + } +) +window.addEventListener('resize', () => { + window.location.reload() +}) +/// ================================================================ + + + + + + +/// ===================== AI智能优化自适应结果(1.0) =========================== +import { + getCurrentInstance, + onMounted, + onUnmounted, + ref +} from 'vue'; +const { + proxy +} = getCurrentInstance(); +const screenWidth = ref(null); +const screenHeight = ref(null); +const resizeObserver = new ResizeObserver((entries) => { + if (entries.length > 0) { + const { + width, + height + } = entries[0].contentRect; + // 更新屏幕尺寸 + screenWidth.value = width; + screenHeight.value = height; + + // 调用debounce函数 + updateStyleDebounced(); + } +}); +// debounce函数 +const resizeTimeout = ref(null); + +function debounce(func, wait) { + return function() { + clearTimeout(resizeTimeout.value); + resizeTimeout.value = setTimeout(func, wait); + }; +} +// 用于更新页面的transform样式 +function updateStyle() { + const docWidth = document.documentElement.clientWidth; + const docHeight = document.documentElement.clientHeight; + const designWidth = 1920; // 设计稿宽度 + const designHeight = 1080; // 设计稿高度 + const widthRatio = docWidth / designWidth; + const heightRatio = docHeight / designHeight; + document.body.style.transform = `scale(${widthRatio},${heightRatio})`; + document.body.style.transformOrigin = 'left top'; + document.body.style.overflow = 'hidden'; + // 处理浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况 + setTimeout(function() { + const lateWidth = document.documentElement.clientWidth; + const lateHeight = document.documentElement.clientHeight; + if (lateWidth !== docWidth) { + const lateWidthRatio = lateWidth / designWidth; + const lateHeightRatio = lateHeight / designHeight; + document.body.style.transform = `scale(${lateWidthRatio},${lateHeightRatio})`; + } + }, 10); +} +const updateStyleDebounced = debounce(updateStyle, 150); +onMounted(() => { + proxy.$nextTick(() => { + // 监控屏幕尺寸变化 + resizeObserver.observe(document.documentElement); + + // 初始化屏幕尺寸 + screenWidth.value = document.documentElement.clientWidth; + screenHeight.value = document.documentElement.clientHeight; + }); +}); +onUnmounted(() => { + // 清除监听 + resizeObserver.disconnect(); + // 清除debounce函数中设置的timeout + clearTimeout(resizeTimeout.value); + // resizeObserver.unobserve(document.documentElement); +}); + +/// =============================================================== \ No newline at end of file diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.vue b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.vue new file mode 100644 index 0000000..2aa0c84 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/KANBAN/index.vue @@ -0,0 +1,116 @@ + + + + + diff --git a/src/views/kanbanManagement/FqcQualityDataBoard/index.vue b/src/views/kanbanManagement/FqcQualityDataBoard/index.vue new file mode 100644 index 0000000..8985406 --- /dev/null +++ b/src/views/kanbanManagement/FqcQualityDataBoard/index.vue @@ -0,0 +1,32 @@ + + + + + \ No newline at end of file diff --git a/src/views/qualityManagement/FQC/againFQC.vue b/src/views/qualityManagement/FQC/againFQC.vue index 05f5700..cb0f870 100644 --- a/src/views/qualityManagement/FQC/againFQC.vue +++ b/src/views/qualityManagement/FQC/againFQC.vue @@ -363,7 +363,7 @@