添加页面

Signed-off-by: Yangwl <1726150332@qq.com>

package.json

@@ -65,6 +65,7 @@
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
     "vue-meta": "2.4.0",
+    "vue-print-nb": "^1.7.5",
     "vue-router": "3.4.9",
     "vue-seamless-scroll": "^1.1.23",
     "vuedraggable": "2.24.3",

src/views/cs/index7.vue

@@ -0,0 +1,169 @@
+<template>
+  <div id="data-view">
+    <dv-full-screen-container>
+      <div class="main-header">
+        <top-header />
+      </div>
+
+      <dv-border-box-1 class="main-container">
+        <dv-border-box-3 class="left-chart-container">
+
+          <Left-Chart-1 />
+          <Left-Chart-2 />
+          <Left-Chart-3 />
+
+        </dv-border-box-3>
+
+        <div class="right-main-container">
+          <div class="rmc-top-container">
+            <dv-border-box-3 class="rmctc-left-container">
+
+              <Center-Cmp />
+
+            </dv-border-box-3>
+
+            <div class="rmctc-right-container">
+              <dv-border-box-3 class="rmctc-chart-1">
+
+                <Right-Chart-1 />
+
+              </dv-border-box-3>
+
+              <dv-border-box-4 class="rmctc-chart-2" :reverse="true">
+
+                <Right-Chart-2 />
+
+              </dv-border-box-4>
+            </div>
+          </div>
+
+          <dv-border-box-4 class="rmc-bottom-container">
+
+            <Bottom-Charts />
+
+          </dv-border-box-4>
+        </div>
+      </dv-border-box-1>
+
+    </dv-full-screen-container>
+  </div>
+</template>
+
+<script>
+import LeftChart1 from './index7/LeftChart1'
+import LeftChart2 from './index7/LeftChart2'
+import LeftChart3 from './index7/LeftChart3'
+
+import CenterCmp from './index7/CenterCmp'
+
+import RightChart1 from './index7/RightChart1'
+import RightChart2 from './index7/RightChart2'
+
+import BottomCharts from './index7/BottomCharts'
+
+import topHeader from './index7/topHeader'
+export default {
+  name: 'DataView',
+  components: {
+    topHeader,
+    LeftChart1,
+    LeftChart2,
+    LeftChart3,
+    CenterCmp,
+    RightChart1,
+    RightChart2,
+    BottomCharts
+  },
+  data () {
+    return {}
+  }
+}
+</script>
+
+<style lang="less">
+#data-view {
+  width: 100%;
+  height: 100%;
+  background-color: #030409;
+  color: #fff;
+
+  #dv-full-screen-container {
+    background-image: url("~@/assets/board/cs7/bg.png");
+    background-size: 100% 100%;
+    box-shadow: 0 0 3px blue;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .main-header {
+    height: 80px;
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-end;
+
+    .mh-left {
+      font-size: 20px;
+      color: rgb(1,134,187);
+
+      a:visited {
+        color: rgb(1,134,187);
+      }
+    }
+
+    .mh-middle {
+      font-size: 30px;
+    }
+
+    .mh-left, .mh-right {
+      width: 450px;
+    }
+  }
+
+  .main-container {
+    height: calc(~"100% - 80px");
+    margin-left: 0px;
+    .border-box-content {
+      //padding: 20px;
+      box-sizing: border-box;
+      display: flex;
+    }
+  }
+
+  .left-chart-container {
+    width: 22%;
+    padding: 10px;
+    box-sizing: border-box;
+
+    .border-box-content {
+      flex-direction: column;
+    }
+  }
+
+  .right-main-container {
+    width: 78%;
+    padding-left: 5px;
+    box-sizing: border-box;
+  }
+
+  .rmc-top-container {
+    height: 65%;
+    display: flex;
+  }
+
+  .rmctc-left-container {
+    width: 65%;
+  }
+
+  .rmctc-right-container {
+    width: 35%;
+  }
+
+  .rmc-bottom-container {
+    height: 35%;
+  }
+
+  .rmctc-chart-1, .rmctc-chart-2 {
+    height: 50%;
+  }
+}
+</style>

src/views/mes/prepare/index.vue

@@ -246,7 +246,7 @@
 				</el-row>
 
           <!-- 主数据 -->
-		  <div v-for="(item,index) in printData.workTable" :key="index">
+		  <div v-for="(item,index) in printData.workTable" :key="index" >
 		        <!-- 表头-工单信息 -->
 				<el-row>
 					<div class="my-print-head">
@@ -431,14 +431,15 @@ export default {
       printJS({
         printable: params.printable, // 'printFrom', // 标签元素id
         type: params.type || 'html',
-		dpi: 360, // 清晰度
+		    dpi: 300, // 清晰度
         //font_size: "",// 设置字体大小
         header: params.header, // '表单',
         targetStyles: ['*'],
-        //没用//style:'body {margin: 2mm;padding: 0;}.fy{page-break-after: always;} table { width:100%;height:800px;border-collapse: collapse;} table, th, td { border: 2px solid black; white-space: pre-wrap; word-break: break-all;} .el-table .cell{padding-left:1px;padding-right:1px;border: 2px solid black;}',
+        style: '@page {size: A5}; body {font-family:  "宋体"; font-size: 12px;}',
         ignoreElements: params.ignore || [], // ['no-print']
         properties: params.properties || null
       })
+
     },
     // 打印预览(生产物料)
     showPrint() {
@@ -667,6 +668,7 @@ export default {
 };
 </script>
 <style>
+
 .my-print-table .el-table {
   border-collapse: collapse;
   border-spacing: 0;