From fc188397419e76da8e97c0782599f757fb34bd30 Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期四, 14 十二月 2023 16:13:26 +0800
Subject: [PATCH] 增加编码规范功能及新建供应商和采购页面增加编码

---
 src/components/makepager/TableCommonView.vue |  274 ++++++++++++++++++++++++++++++++++++++----------------
 1 files changed, 190 insertions(+), 84 deletions(-)

diff --git a/src/components/makepager/TableCommonView.vue b/src/components/makepager/TableCommonView.vue
index be81c3c..42f2469 100644
--- a/src/components/makepager/TableCommonView.vue
+++ b/src/components/makepager/TableCommonView.vue
@@ -9,8 +9,9 @@
       :height="'calc(100% - 0px)'"
       :max-height="tableList.maxHeight"
       :lazy="tableList.lazy"
+      size="mini"
       @selection-change="handleSelectionChange"
-      :header-cell-style="{ background: '#f1f3f8', color: '#000009' }"
+      :header-cell-style="{ background: '#f1f3f8', color: '#000009', 'font-size': '14px' }"
       :highlight-current-row="tableList.highlight"
       :row-class-name="tableRowClassName"
       @row-click="tableRowClick"
@@ -18,84 +19,98 @@
       :default-expand-all="tableList.isDefaultExpandAll"
       :tree-props="{ children: 'child', hasChildren: 'hasChildren' }"
     >
-      <el-table-column v-if="tableList.selectBox" type="selection" width="40"> </el-table-column>
-      <el-table-column v-if="tableList.selectIndex" type="index" label="搴忓彿" width="50"> </el-table-column>
-      <el-table-column
-        v-for="(item, i) in tableList.tableColumn"
-        :key="i"
-        :prop="item.prop"
-        :label="item.label"
-        :width="item.width"
-        :min-width="item.min"
-        show-overflow-tooltip
-        :sortable="item.sortable"
-      >
-        <template slot-scope="scope">
-          <span v-if="item.price">{{ "锟�" + number_format(scope.row[item.prop], 2, ".", ",") }}</span>
-          <div v-else-if="item.status" :class="scope.row.status">{{ scope.row[item.prop] }}</div>
-          <span v-else-if="item.isTime">{{
-            dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop]) === "1900-01-01 00:06:26"
-              ? "--"
-              : dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop])
-          }}</span>
-          <span v-else-if="item.isClick && scope.row[item.prop]" class="sel-name" @click="selCommonClick(scope.row)">{{
-            scope.row[item.prop]
-          }}</span>
-          <span v-else-if="item.isFirst">{{ scope.row[item.prop] ? "鏄�" : "鍚�" }}</span>
-          <span
-            v-else-if="item.isCommonClick && scope.row[item.prop]"
-            class="sel-name"
-            @click="selCommonClick(scope.row)"
-            >{{ scope.row[item.prop] }}</span
-          >
-          <div v-else-if="item.isProductName" class="product-view">
-            <ul v-if="scope.row.products && scope.row.products.length > 0">
-              <li v-for="(item, index) in scope.row.products" :key="index">
-                <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
-                  {{ item.name }}
-                </div>
-              </li>
-            </ul>
-            <div v-else class="no-product">{{ "--" }}</div>
-          </div>
-          <div v-else-if="item.isProductAmount" class="product-view">
-            <ul v-if="scope.row.products && scope.row.products.length > 0">
-              <li v-for="(item, index) in scope.row.products" :key="index">
-                <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
-                  {{ item.amount }}
-                </div>
-              </li>
-            </ul>
-            <div v-else class="no-product">{{ "--" }}</div>
-          </div>
-          <div v-else-if="item.isProductPrice" class="product-view">
-            <ul v-if="scope.row.products && scope.row.products.length > 0">
-              <li v-for="(item, index) in scope.row.products" :key="index">
-                <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
-                  {{ item.price }}
-                </div>
-              </li>
-            </ul>
-            <div v-else class="no-product">{{ "--" }}</div>
-          </div>
-          <div v-else-if="item.isProductTotal" class="product-view">
-            <ul v-if="scope.row.products && scope.row.products.length > 0">
-              <li v-for="(item, index) in scope.row.products" :key="index">
-                <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
-                  {{ item.total }}
-                </div>
-              </li>
-            </ul>
-            <div v-else class="no-product">{{ "--" }}</div>
-          </div>
-          <span v-else>{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span>
-        </template>
+      <el-table-column align="center" v-if="tableList.selectBox" type="selection" width="40"> </el-table-column>
+      <el-table-column align="center" v-if="tableList.selectIndex" type="index" label="搴忓彿" width="50">
       </el-table-column>
+      <template v-for="(item, i) in tableList.tableColumn">
+        <el-table-column
+          align="center"
+          :key="i"
+          :prop="item.prop"
+          :label="item.label"
+          :width="item.width"
+          :min-width="item.min"
+          show-overflow-tooltip
+          :sortable="item.sortable"
+          v-if="item.isShowColumn"
+        >
+          <template slot-scope="scope">
+            <span v-if="item.price">{{ "锟�" + number_format(scope.row[item.prop], 2, ".", ",") }}</span>
+            <div v-else-if="item.status" :class="scope.row.status">{{ scope.row[item.prop] }}</div>
+            <span v-else-if="item.isTime">{{
+              dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop]) === "1900-01-01 00:06:26"
+                ? "--"
+                : dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop])
+            }}</span>
+            <span
+              v-else-if="item.isClick && scope.row[item.prop]"
+              class="sel-name"
+              @click="selCommonClick(scope.row)"
+              >{{ scope.row[item.prop] }}</span
+            >
+            <span v-else-if="item.isFirst">{{ scope.row[item.prop] ? "鏄�" : "鍚�" }}</span>
+            <span
+              v-else-if="item.isCommonClick && scope.row[item.prop]"
+              class="sel-name"
+              @click="selCommonClick(scope.row)"
+              >{{ scope.row[item.prop] }}</span
+            >
+            <div v-else-if="item.isProductName" class="product-view">
+              <ul v-if="scope.row.products && scope.row.products.length > 0">
+                <li v-for="(item, index) in scope.row.products" :key="index">
+                  <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
+                    {{ item.name }}
+                  </div>
+                </li>
+              </ul>
+              <div v-else class="no-product">{{ "--" }}</div>
+            </div>
+            <div v-else-if="item.isProductAmount" class="product-view">
+              <ul v-if="scope.row.products && scope.row.products.length > 0">
+                <li v-for="(item, index) in scope.row.products" :key="index">
+                  <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
+                    {{ item.amount }}
+                  </div>
+                </li>
+              </ul>
+              <div v-else class="no-product">{{ "--" }}</div>
+            </div>
+            <div v-else-if="item.isProductPrice" class="product-view">
+              <ul v-if="scope.row.products && scope.row.products.length > 0">
+                <li v-for="(item, index) in scope.row.products" :key="index">
+                  <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
+                    {{ item.price }}
+                  </div>
+                </li>
+              </ul>
+              <div v-else class="no-product">{{ "--" }}</div>
+            </div>
+            <div v-else-if="item.isProductTotal" class="product-view">
+              <ul v-if="scope.row.products && scope.row.products.length > 0">
+                <li v-for="(item, index) in scope.row.products" :key="index">
+                  <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
+                    {{ item.total }}
+                  </div>
+                </li>
+              </ul>
+              <div v-else class="no-product">{{ "--" }}</div>
+            </div>
+            <span v-else>{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span>
+          </template>
+        </el-table-column>
+      </template>
       <slot name="tableButton" />
       <div slot="empty">
         <el-empty description="鏆傛棤鏁版嵁"></el-empty>
       </div>
     </el-table>
+    <div class="overSpread1" v-show="iscolopen" @click="onMaskClick"></div>
+    <div class="styleBtn">
+      <i @click="checkCol()" class="label">...</i>
+      <el-checkbox-group v-model="showcol" v-show="iscolopen" class="checkbox-group" @change="selectCheckBoxList">
+        <el-checkbox v-for="item in tableList.allcol" :label="item" :key="item">{{ item }} </el-checkbox>
+      </el-checkbox-group>
+    </div>
   </div>
 </template>
 
@@ -110,6 +125,9 @@
           selectBox: false,
           selectIndex: false,
           tableInfomation: [], // 鎺ュ彛杩斿洖鏁版嵁
+          showcol: [],
+          allcol: [],
+          highlight: false,
           tableColumn: [
             // table琛ㄥ崟
             { label: "", prop: "", min: 200, tooltip: true }
@@ -137,11 +155,30 @@
     }
   },
   data() {
-    return {}
+    return {
+      iscolopen: false,
+      showcol: []
+    }
+  },
+  watch: {
+    "tableList.showcol": {
+      handler(newVal) {
+        this.showcol = newVal
+      },
+      immediate: true
+    }
   },
   computed: {},
-  mounted() {},
   methods: {
+    onMaskClick() {
+      this.iscolopen = false
+    },
+    checkCol() {
+      this.iscolopen = !this.iscolopen
+    },
+    selectCheckBoxList(val) {
+      this.$emit("selTableCol", val)
+    },
     handleReserve(row) {
       return row._id ? row._id : row.id
     },
@@ -276,6 +313,10 @@
     selCommonClick(row) {
       this.$emit("selCommonClick", row)
     },
+    // 琛岀偣鍑�
+    tableRowClick(row, column, event) {
+      this.$emit("tableRowClick", row, column, event)
+    },
     // 鍗曢�夎鐩稿叧
     tableRowClassName({ row }) {
       if (Object.keys(this.selectClassRow).length > 0) {
@@ -284,9 +325,6 @@
         }
       }
       this.$emit("tableRowClassName", row)
-    },
-    tableRowClick(row) {
-      this.$emit("tableRowClick", row)
     }
   }
 }
@@ -296,8 +334,9 @@
 <style lang="scss" scoped>
 .table-view {
   // margin-top: 20px;
-  margin-right: 10px;
+  // margin-right: 10px;
   // margin-bottom: 40px;
+  position: relative;
   height: 100%;
   .blue {
     width: 70px;
@@ -337,11 +376,78 @@
       background-color: #fff;
       font-weight: bold;
     }
-    // .cell{
-    //     &:nth-last-child(3){
-    //       text-align:right;
-    //     }
-    //   }
+  }
+}
+
+::v-deep .el-table .cell {
+  font-size: 12px;
+  line-height: 17px;
+  font-family: PingFangSC;
+  color: rgba(0, 0, 0, 0.9);
+  .el-button--text {
+    width: auto;
+    height: auto;
+    font-family: PingFangSC-Medium, sans-serif;
+  }
+}
+::v-deep .el-table .el-table__cell {
+  padding: 6px 0 !important;
+  height: 35px;
+  text-align: center;
+}
+
+::v-deep {
+  .el-table .cell .el-button--text.el-button--small {
+    padding: 4px 0;
+  }
+  .el-table .onSelect {
+    background: #ebf2ff;
+  }
+}
+
+.overSpread1 {
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  background: rgba(0, 0, 0, 0);
+  z-index: 10;
+}
+
+.styleBtn {
+  position: absolute;
+  width: 30px;
+  height: 36px;
+  // line-height: 26px;
+  // background: #06c062;
+  top: 0;
+  right: 2px;
+  z-index: 9999;
+  .label {
+    position: absolute;
+    top: 6px;
+    font-size: 20px;
+    // line-height: 5px;
+    cursor: pointer;
+    color: #000;
+    transform: rotate(-90deg);
+  }
+  .checkbox-group {
+    width: 160px;
+    height: 330px;
+    overflow: auto;
+    display: flex;
+    flex-direction: column;
+    line-height: 25px;
+    background: #ffffff;
+    border-radius: 16px;
+    padding: 12px;
+    position: absolute;
+    right: 0;
+    top: 30px;
+    z-index: 99;
+    box-shadow: 0 0 2px 2px #f8f8f8;
   }
 }
 </style>

--
Gitblit v1.8.0