Merge branch 'master' of https://gitee.com/dmc_qq/etc-project

package-lock.json

@@ -1,5 +1,5 @@
 {
-  "name": "etc-project",
+  "name": "etcProject",
   "version": "0.0.0",
   "lockfileVersion": 2,
   "requires": true,
@@ -10,6 +10,7 @@
       "dependencies": {
         "@element-plus/icons-vue": "^1.1.4",
         "axios": "^0.27.2",
+        "babel-polyfill": "^6.26.0",
         "element-plus": "^2.1.7",
         "file-saver": "^2.0.5",
         "fuse.js": "^6.5.3",
@@ -804,6 +805,30 @@
         "form-data": "^4.0.0"
       }
     },
+    "node_modules/babel-polyfill": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmmirror.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz",
+      "integrity": "sha512-F2rZGQnAdaHWQ8YAoeRbukc7HS9QgdgeyJ0rQDd485v9opwuPvjpPFcOOT/WmkKTdgy9ESgSPXDcTNpzrGr6iQ==",
+      "dependencies": {
+        "babel-runtime": "^6.26.0",
+        "core-js": "^2.5.0",
+        "regenerator-runtime": "^0.10.5"
+      }
+    },
+    "node_modules/babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==",
+      "dependencies": {
+        "core-js": "^2.4.0",
+        "regenerator-runtime": "^0.11.0"
+      }
+    },
+    "node_modules/babel-runtime/node_modules/regenerator-runtime": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+      "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npm.taobao.org/balanced-match/download/balanced-match-1.0.2.tgz?cache=0&sync_timestamp=1617714233441&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fbalanced-match%2Fdownload%2Fbalanced-match-1.0.2.tgz",
@@ -1039,6 +1064,13 @@
         "is-what": "^3.14.1"
       }
     },
+    "node_modules/core-js": {
+      "version": "2.6.12",
+      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz",
+      "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
+      "deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
+      "hasInstallScript": true
+    },
     "node_modules/core-util-is": {
       "version": "1.0.3",
       "resolved": "https://registry.nlark.com/core-util-is/download/core-util-is-1.0.3.tgz",
@@ -2806,6 +2838,11 @@
         "node": ">=8.10.0"
       }
     },
+    "node_modules/regenerator-runtime": {
+      "version": "0.10.5",
+      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
+      "integrity": "sha512-02YopEIhAgiBHWeoTiA8aitHDt8z6w+rQqNuIftlM+ZtvSl/brTouaU7DW6GO/cHtvxJvS4Hwv2ibKdxIRi24w=="
+    },
     "node_modules/regexpp": {
       "version": "3.2.0",
       "resolved": "https://registry.nlark.com/regexpp/download/regexpp-3.2.0.tgz?cache=0&sync_timestamp=1623668872577&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fregexpp%2Fdownload%2Fregexpp-3.2.0.tgz",
@@ -4315,6 +4352,32 @@
         "form-data": "^4.0.0"
       }
     },
+    "babel-polyfill": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmmirror.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz",
+      "integrity": "sha512-F2rZGQnAdaHWQ8YAoeRbukc7HS9QgdgeyJ0rQDd485v9opwuPvjpPFcOOT/WmkKTdgy9ESgSPXDcTNpzrGr6iQ==",
+      "requires": {
+        "babel-runtime": "^6.26.0",
+        "core-js": "^2.5.0",
+        "regenerator-runtime": "^0.10.5"
+      }
+    },
+    "babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==",
+      "requires": {
+        "core-js": "^2.4.0",
+        "regenerator-runtime": "^0.11.0"
+      },
+      "dependencies": {
+        "regenerator-runtime": {
+          "version": "0.11.1",
+          "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+          "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
+        }
+      }
+    },
     "balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npm.taobao.org/balanced-match/download/balanced-match-1.0.2.tgz?cache=0&sync_timestamp=1617714233441&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fbalanced-match%2Fdownload%2Fbalanced-match-1.0.2.tgz",
@@ -4497,6 +4560,11 @@
         "is-what": "^3.14.1"
       }
     },
+    "core-js": {
+      "version": "2.6.12",
+      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz",
+      "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
+    },
     "core-util-is": {
       "version": "1.0.3",
       "resolved": "https://registry.nlark.com/core-util-is/download/core-util-is-1.0.3.tgz",
@@ -5820,6 +5888,11 @@
         "picomatch": "^2.2.1"
       }
     },
+    "regenerator-runtime": {
+      "version": "0.10.5",
+      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
+      "integrity": "sha512-02YopEIhAgiBHWeoTiA8aitHDt8z6w+rQqNuIftlM+ZtvSl/brTouaU7DW6GO/cHtvxJvS4Hwv2ibKdxIRi24w=="
+    },
     "regexpp": {
       "version": "3.2.0",
       "resolved": "https://registry.nlark.com/regexpp/download/regexpp-3.2.0.tgz?cache=0&sync_timestamp=1623668872577&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fregexpp%2Fdownload%2Fregexpp-3.2.0.tgz",

package.json

@@ -11,6 +11,7 @@
   "dependencies": {
     "@element-plus/icons-vue": "^1.1.4",
     "axios": "^0.27.2",
+    "babel-polyfill": "^6.26.0",
     "element-plus": "^2.1.7",
     "file-saver": "^2.0.5",
     "fuse.js": "^6.5.3",

src/crud/index.vue

@@ -22,28 +22,30 @@
                 :width="item.width" :show-overflow-tooltip="!item.overflow" />
 
             <el-table-column :fixed="tableFrom.operateFixed ? 'right' : 'false'" :label="tableFrom.operateTitle"
-                :width="tableFrom.operateWidth ? tableFrom.operateWidth : '150px'">
+                :width="tableFrom.operateWidth ? tableFrom.operateWidth : ''">
                 <!-- 默认插槽值 -->
                 <template #default="scope">
                     <ud-operation :scope="scope" :data="testData" :isEdit="tableFrom.operate.edit"
                         :isDelete="tableFrom.operate.delete" @handleEdit="handleEdit" @handleDelete="handleDelete">
                     </ud-operation>
+                    <!-- 具名插槽(自定义操作按钮) -->
+                    <slot name="operation" :scope="scope" :tableFrom="dialogFormVisible" />
                 </template>
             </el-table-column>
         </el-table>
         <!-- 分页组件 -->
         <el-pagination v-if="false" :page-size="20" :pager-count="11" layout="prev, pager, next" :total="1000" />
         <!-- 对话框 -->
-        <el-dialog v-model="dialogFormVisible" :title="`${title}`">
+        <el-dialog v-model="dialogFormVisible" :title="tableFrom.titleDialog ? tableFrom.titleDialog : `${title}`">
             <!-- 是否自定义Dialog -->
             <div v-if="tableFrom.customDialog">
-                <slot name="search" :searchCondition="searchCondition" />
+                <slot name="dialog" :form="form" />
             </div>
             <div v-else>
                 <!-- 系统内容 -->
                 <el-form ref="ruleFormRef" :rules="rules" :model="form">
                     <el-form-item v-for="(item,index) in tableFrom.field" :label="item.label" :prop="item.prop"
-                        :label-width="formLabelWidth" >
+                        :label-width="formLabelWidth">
                         <!-- 输入框 -->
                         <div style="width: 100%;" v-if="item.form.type === 'input'">
                             <el-input v-model="form[item.prop]" :type="item.itemType"
@@ -66,14 +68,14 @@
                     </el-form-item>
 
                 </el-form>
-
             </div>
 
-            <template v-if="!tableFrom.customDialog" #footer>
-                <span class="dialog-footer">
+            <template #footer>
+                <span v-if="!tableFrom.customDialog">
                     <el-button @click="cancel">取消</el-button>
                     <el-button type="primary" @click="affirm(ruleFormRef)">提交</el-button>
                 </span>
+                <slot name="footer" />
             </template>
         </el-dialog>
 
@@ -109,9 +111,9 @@
                     four: '52011328220201499572',
                     five: '正常',
                     six: '储值卡',
-                    seven:'52011328220201499572',
-                    eight:'正常',
-                    data:'2020-12-24'
+                    seven: '52011328220201499572',
+                    eight: '正常',
+                    data: '2020-12-24'
                 }, {
                     one: '李丽霞',
                     two: '贵ANS989',
@@ -119,19 +121,19 @@
                     four: '52011328220201499572',
                     five: '正常',
                     six: '储值卡',
-                    seven:'52011328220200034040',
-                    eight:'正常',
-                    data:'2021-08-24'
-                },{
+                    seven: '52011328220200034040',
+                    eight: '正常',
+                    data: '2021-08-24'
+                }, {
                     one: '沈波',
                     two: '贵ABB123',
                     three: '蓝色',
                     four: '52011328220201499572',
                     five: '正常',
                     six: '储值卡',
-                    seven:'52011328220201499572',
-                    eight:'正常',
-                    data:'2022-01-22'
+                    seven: '52011328220201499572',
+                    eight: '正常',
+                    data: '2022-01-22'
                 }]
             }
         }
@@ -282,6 +284,12 @@
         row.visible = false
         emit('handleDelete', idx, row)
     }
+
+    //将需要暴露出去的数据与方法都可以暴露出去
+    defineExpose({
+        dialogFormVisible,
+        title
+    })
 </script>
 <style lang="scss">
 </style>

src/data/cardAfter/cardFillDo.ts

@@ -6,8 +6,7 @@ export const Data = {
     },
     table: {
         style: '',
-        customDialog: false, //自定义Dialog (默认false)
-        titleDialog: '补卡信息', //自定义Dialog标题
+        customDialog: true, //自定义Dialog (默认false)
         extend: [{
             type: 'index',
             label: '序号',
@@ -45,7 +44,7 @@ export const Data = {
             }, {
                 prop: 'four',
                 label: '卡号',
-                width: '180',
+                width: '200',
                 form: {
                     required: true,
                     type: 'input',
@@ -73,7 +72,7 @@ export const Data = {
             {
                 prop: 'seven',
                 label: 'OBU编号',
-                width: '180',
+                width: '200',
                 form: {
                     required: true,
                     type: 'input',
@@ -94,9 +93,9 @@ export const Data = {
         operateTitle: '操作',
         operateFixed: true,
         isOperate: true,
-        operateWidth: '80px',
+        operateWidth: '',
         operate: {
-            edit: true,
+            edit: false,
             delete: false
         }
     }

src/data/cardAfter/cardRenewal.ts

@@ -41,7 +41,7 @@ export const Data = {
             }, {
                 prop: 'four',
                 label: '车牌号码',
-                width: '120',
+                width: '200',
                 form: {
                     required: true,
                     type: 'input',
@@ -69,7 +69,7 @@ export const Data = {
             {
                 prop: 'seven',
                 label: '到期时间',
-                width: '180',
+                width: '',
                 form: {
                     required: true,
                     type: 'input',

src/data/cardAfter/initiativeHangUp.ts

@@ -80,7 +80,7 @@ export const Data = {
             }, {
                 prop: 'eight',
                 label: 'OBU状态',
-                width: '120',
+                width: '',
                 form: {
                     required: true,
                     type: 'input',

src/data/menuData.ts

@@ -24,32 +24,39 @@ export const list = [
         children: [{
             title: '用户信息查询及变更服务',
             path: 'userQueryChange',
+            icon:'User',
             children: []
         }, {
             title: '车辆信息查询及变更服务',
             path: 'vehicleEnquirChange',
+            icon:'Van',
             children: []
         }, {
             title: '签约信息查询服务',
             path: 'signingQuery',
+            icon:'Tickets',
             children: []
         }, {
             title: '卡片信息查询服务',
             path: 'cardQueries',
+            icon:'Postcard',
             children: []
         }, {
             title: 'OBU信息查询服务',
             path: 'OBUQuery',
+            icon:'Link',
             children: []
         }]
     },
     {
         title: '通行流水查询服务',
         path: 'trafficFlow',
+        icon: 'Promotion',
         children: []
     }, {
         title: '黑名单查询服务',
         path: 'blacklistQuery',
+        icon: 'Opportunity',
         children: []
     }, {
         title: '卡签售后服务',

src/data/tableConfig.ts

@@ -6,7 +6,6 @@ export const cfg = {
         style: '', //默认表格样式
         border: false, //是否添加边框(默认false)
         customDialog: false, //自定义Dialog (默认false)
-        titleDialog: '', //自定义Dialog标题
         extend: [{ //表头拓展
             type: '', //类型:selection,index,expand
             width: '', //表头宽度

src/excel/Blob.js

@@ -0,0 +1,456 @@
+/* Blob.js
+ * A Blob, File, FileReader & URL implementation.
+ * 2018-08-09
+ *
+ * By Eli Grey, http://eligrey.com
+ * By Jimmy Wärting, https://github.com/jimmywarting
+ * License: MIT
+ *   See https://github.com/eligrey/Blob.js/blob/master/LICENSE.md
+ */
+
+;(function(){
+
+  var global = typeof window === 'object'
+    ? window : typeof self === 'object'
+      ? self : this
+
+  var BlobBuilder = global.BlobBuilder
+    || global.WebKitBlobBuilder
+    || global.MSBlobBuilder
+    || global.MozBlobBuilder;
+
+  global.URL = global.URL || global.webkitURL || function(href, a) {
+    a = document.createElement('a')
+    a.href = href
+    return a
+  }
+
+  var origBlob = global.Blob
+  var createObjectURL = URL.createObjectURL
+  var revokeObjectURL = URL.revokeObjectURL
+  var strTag = global.Symbol && global.Symbol.toStringTag
+  var blobSupported = false
+  var blobSupportsArrayBufferView = false
+  var arrayBufferSupported = !!global.ArrayBuffer
+  var blobBuilderSupported = BlobBuilder
+    && BlobBuilder.prototype.append
+    && BlobBuilder.prototype.getBlob;
+
+  try {
+    // Check if Blob constructor is supported
+    blobSupported = new Blob(['ä']).size === 2
+
+    // Check if Blob constructor supports ArrayBufferViews
+    // Fails in Safari 6, so we need to map to ArrayBuffers there.
+    blobSupportsArrayBufferView = new Blob([new Uint8Array([1,2])]).size === 2
+  } catch(e) {}
+
+  /**
+   * Helper function that maps ArrayBufferViews to ArrayBuffers
+   * Used by BlobBuilder constructor and old browsers that didn't
+   * support it in the Blob constructor.
+   */
+  function mapArrayBufferViews(ary) {
+    return ary.map(function(chunk) {
+      if (chunk.buffer instanceof ArrayBuffer) {
+        var buf = chunk.buffer;
+
+        // if this is a subarray, make a copy so we only
+        // include the subarray region from the underlying buffer
+        if (chunk.byteLength !== buf.byteLength) {
+          var copy = new Uint8Array(chunk.byteLength);
+          copy.set(new Uint8Array(buf, chunk.byteOffset, chunk.byteLength));
+          buf = copy.buffer;
+        }
+
+        return buf;
+      }
+
+      return chunk;
+    });
+  }
+
+  function BlobBuilderConstructor(ary, options) {
+    options = options || {};
+
+    var bb = new BlobBuilder();
+    mapArrayBufferViews(ary).forEach(function(part) {
+      bb.append(part);
+    });
+
+    return options.type ? bb.getBlob(options.type) : bb.getBlob();
+  };
+
+  function BlobConstructor(ary, options) {
+    return new origBlob(mapArrayBufferViews(ary), options || {});
+  };
+
+  if (global.Blob) {
+    BlobBuilderConstructor.prototype = Blob.prototype;
+    BlobConstructor.prototype = Blob.prototype;
+  }
+
+  function FakeBlobBuilder() {
+    function toUTF8Array(str) {
+      var utf8 = [];
+      for (var i=0; i < str.length; i++) {
+        var charcode = str.charCodeAt(i);
+        if (charcode < 0x80) utf8.push(charcode);
+        else if (charcode < 0x800) {
+          utf8.push(0xc0 | (charcode >> 6),
+            0x80 | (charcode & 0x3f));
+        }
+        else if (charcode < 0xd800 || charcode >= 0xe000) {
+          utf8.push(0xe0 | (charcode >> 12),
+            0x80 | ((charcode>>6) & 0x3f),
+            0x80 | (charcode & 0x3f));
+        }
+        // surrogate pair
+        else {
+          i++;
+          // UTF-16 encodes 0x10000-0x10FFFF by
+          // subtracting 0x10000 and splitting the
+          // 20 bits of 0x0-0xFFFFF into two halves
+          charcode = 0x10000 + (((charcode & 0x3ff)<<10)
+            | (str.charCodeAt(i) & 0x3ff));
+          utf8.push(0xf0 | (charcode >>18),
+            0x80 | ((charcode>>12) & 0x3f),
+            0x80 | ((charcode>>6) & 0x3f),
+            0x80 | (charcode & 0x3f));
+        }
+      }
+      return utf8;
+    }
+    function fromUtf8Array(array) {
+      var out, i, len, c;
+      var char2, char3;
+
+      out = "";
+      len = array.length;
+      i = 0;
+      while (i < len) {
+        c = array[i++];
+        switch (c >> 4)
+        {
+          case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
+          // 0xxxxxxx
+          out += String.fromCharCode(c);
+          break;
+          case 12: case 13:
+          // 110x xxxx   10xx xxxx
+          char2 = array[i++];
+          out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
+          break;
+          case 14:
+            // 1110 xxxx  10xx xxxx  10xx xxxx
+            char2 = array[i++];
+            char3 = array[i++];
+            out += String.fromCharCode(((c & 0x0F) << 12) |
+              ((char2 & 0x3F) << 6) |
+              ((char3 & 0x3F) << 0));
+            break;
+        }
+      }
+      return out;
+    }
+    function isDataView(obj) {
+      return obj && DataView.prototype.isPrototypeOf(obj)
+    }
+    function bufferClone(buf) {
+      var view = new Array(buf.byteLength)
+      var array = new Uint8Array(buf)
+      var i = view.length
+      while(i--) {
+        view[i] = array[i]
+      }
+      return view
+    }
+    function encodeByteArray(input) {
+      var byteToCharMap = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
+
+      var output = [];
+
+      for (var i = 0; i < input.length; i += 3) {
+        var byte1 = input[i];
+        var haveByte2 = i + 1 < input.length;
+        var byte2 = haveByte2 ? input[i + 1] : 0;
+        var haveByte3 = i + 2 < input.length;
+        var byte3 = haveByte3 ? input[i + 2] : 0;
+
+        var outByte1 = byte1 >> 2;
+        var outByte2 = ((byte1 & 0x03) << 4) | (byte2 >> 4);
+        var outByte3 = ((byte2 & 0x0F) << 2) | (byte3 >> 6);
+        var outByte4 = byte3 & 0x3F;
+
+        if (!haveByte3) {
+          outByte4 = 64;
+
+          if (!haveByte2) {
+            outByte3 = 64;
+          }
+        }
+
+        output.push(
+          byteToCharMap[outByte1], byteToCharMap[outByte2],
+          byteToCharMap[outByte3], byteToCharMap[outByte4])
+      }
+
+      return output.join('')
+    }
+
+    var create = Object.create || function (a) {
+      function c() {}
+      c.prototype = a;
+      return new c
+    }
+
+    if (arrayBufferSupported) {
+      var viewClasses = [
+        '[object Int8Array]',
+        '[object Uint8Array]',
+        '[object Uint8ClampedArray]',
+        '[object Int16Array]',
+        '[object Uint16Array]',
+        '[object Int32Array]',
+        '[object Uint32Array]',
+        '[object Float32Array]',
+        '[object Float64Array]'
+      ]
+
+      var isArrayBufferView = ArrayBuffer.isView || function(obj) {
+        return obj && viewClasses.indexOf(Object.prototype.toString.call(obj)) > -1
+      }
+    }
+
+
+
+    /********************************************************/
+    /*                   Blob constructor                   */
+    /********************************************************/
+    function Blob(chunks, opts) {
+      chunks = chunks || []
+      for (var i = 0, len = chunks.length; i < len; i++) {
+        var chunk = chunks[i]
+        if (chunk instanceof Blob) {
+          chunks[i] = chunk._buffer
+        } else if (typeof chunk === 'string') {
+          chunks[i] = toUTF8Array(chunk)
+        } else if (arrayBufferSupported && (ArrayBuffer.prototype.isPrototypeOf(chunk) || isArrayBufferView(chunk))) {
+          chunks[i] = bufferClone(chunk)
+        } else if (arrayBufferSupported && isDataView(chunk)) {
+          chunks[i] = bufferClone(chunk.buffer)
+        } else {
+          chunks[i] = toUTF8Array(String(chunk))
+        }
+      }
+
+      this._buffer = [].concat.apply([], chunks)
+      this.size = this._buffer.length
+      this.type = opts ? opts.type || '' : ''
+    }
+
+    Blob.prototype.slice = function(start, end, type) {
+      var slice = this._buffer.slice(start || 0, end || this._buffer.length)
+      return new Blob([slice], {type: type})
+    }
+
+    Blob.prototype.toString = function() {
+      return '[object Blob]'
+    }
+
+
+
+    /********************************************************/
+    /*                   File constructor                   */
+    /********************************************************/
+    function File(chunks, name, opts) {
+      opts = opts || {}
+      var a = Blob.call(this, chunks, opts) || this
+      a.name = name
+      a.lastModifiedDate = opts.lastModified ? new Date(opts.lastModified) : new Date
+      a.lastModified = +a.lastModifiedDate
+
+      return a
+    }
+
+    File.prototype = create(Blob.prototype);
+    File.prototype.constructor = File;
+
+    if (Object.setPrototypeOf)
+      Object.setPrototypeOf(File, Blob);
+    else {
+      try {File.__proto__ = Blob} catch (e) {}
+    }
+
+    File.prototype.toString = function() {
+      return '[object File]'
+    }
+
+
+    /********************************************************/
+    /*                FileReader constructor                */
+    /********************************************************/
+    function FileReader() {
+      if (!(this instanceof FileReader))
+        throw new TypeError("Failed to construct 'FileReader': Please use the 'new' operator, this DOM object constructor cannot be called as a function.")
+
+      var delegate = document.createDocumentFragment()
+      this.addEventListener = delegate.addEventListener
+      this.dispatchEvent = function(evt) {
+        var local = this['on' + evt.type]
+        if (typeof local === 'function') local(evt)
+        delegate.dispatchEvent(evt)
+      }
+      this.removeEventListener = delegate.removeEventListener
+    }
+
+    function _read(fr, blob, kind) {
+      if (!(blob instanceof Blob))
+        throw new TypeError("Failed to execute '" + kind + "' on 'FileReader': parameter 1 is not of type 'Blob'.")
+
+      fr.result = ''
+
+      setTimeout(function(){
+        this.readyState = FileReader.LOADING
+        fr.dispatchEvent(new Event('load'))
+        fr.dispatchEvent(new Event('loadend'))
+      })
+    }
+
+    FileReader.EMPTY = 0
+    FileReader.LOADING = 1
+    FileReader.DONE = 2
+    FileReader.prototype.error = null
+    FileReader.prototype.onabort = null
+    FileReader.prototype.onerror = null
+    FileReader.prototype.onload = null
+    FileReader.prototype.onloadend = null
+    FileReader.prototype.onloadstart = null
+    FileReader.prototype.onprogress = null
+
+    FileReader.prototype.readAsDataURL = function(blob) {
+      _read(this, blob, 'readAsDataURL')
+      this.result = 'data:' + blob.type + ';base64,' + encodeByteArray(blob._buffer)
+    }
+
+    FileReader.prototype.readAsText = function(blob) {
+      _read(this, blob, 'readAsText')
+      this.result = fromUtf8Array(blob._buffer)
+    }
+
+    FileReader.prototype.readAsArrayBuffer = function(blob) {
+      _read(this, blob, 'readAsText')
+      this.result = blob._buffer.slice()
+    }
+
+    FileReader.prototype.abort = function() {}
+
+
+    /********************************************************/
+    /*                         URL                          */
+    /********************************************************/
+    URL.createObjectURL = function(blob) {
+      return blob instanceof Blob
+        ? 'data:' + blob.type + ';base64,' + encodeByteArray(blob._buffer)
+        : createObjectURL.call(URL, blob)
+    }
+
+    URL.revokeObjectURL = function(url) {
+      revokeObjectURL && revokeObjectURL.call(URL, url)
+    }
+
+    /********************************************************/
+    /*                         XHR                          */
+    /********************************************************/
+    var _send = global.XMLHttpRequest && global.XMLHttpRequest.prototype.send
+    if (_send) {
+      XMLHttpRequest.prototype.send = function(data) {
+        if (data instanceof Blob) {
+          this.setRequestHeader('Content-Type', data.type)
+          _send.call(this, fromUtf8Array(data._buffer))
+        } else {
+          _send.call(this, data)
+        }
+      }
+    }
+
+    global.FileReader = FileReader
+    global.File = File
+    global.Blob = Blob
+  }
+
+  if (strTag) {
+    File.prototype[strTag] = 'File'
+    Blob.prototype[strTag] = 'Blob'
+    FileReader.prototype[strTag] = 'FileReader'
+  }
+
+  function fixFileAndXHR() {
+    var isIE = !!global.ActiveXObject || (
+      '-ms-scroll-limit' in document.documentElement.style &&
+      '-ms-ime-align' in document.documentElement.style
+    )
+
+    // Monkey patched
+    // IE don't set Content-Type header on XHR whose body is a typed Blob
+    // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/6047383
+    var _send = global.XMLHttpRequest && global.XMLHttpRequest.prototype.send
+    if (isIE && _send) {
+      XMLHttpRequest.prototype.send = function(data) {
+        if (data instanceof Blob) {
+          this.setRequestHeader('Content-Type', data.type)
+          _send.call(this, data)
+        } else {
+          _send.call(this, data)
+        }
+      }
+    }
+
+    try {
+      new File([], '')
+    } catch(e) {
+      try {
+        var klass = new Function('class File extends Blob {' +
+          'constructor(chunks, name, opts) {' +
+          'opts = opts || {};' +
+          'super(chunks, opts || {});' +
+          'this.name = name;' +
+          'this.lastModifiedDate = opts.lastModified ? new Date(opts.lastModified) : new Date;' +
+          'this.lastModified = +this.lastModifiedDate;' +
+          '}};' +
+          'return new File([], ""), File'
+        )()
+        global.File = klass
+      } catch(e) {
+        var klass = function(b, d, c) {
+          var blob = new Blob(b, c)
+          var t = c && void 0 !== c.lastModified ? new Date(c.lastModified) : new Date
+
+          blob.name = d
+          blob.lastModifiedDate = t
+          blob.lastModified = +t
+          blob.toString = function() {
+            return '[object File]'
+          }
+
+          if (strTag)
+            blob[strTag] = 'File'
+
+          return blob
+        }
+        global.File = klass
+      }
+    }
+  }
+
+  if (blobSupported) {
+    fixFileAndXHR()
+    global.Blob = blobSupportsArrayBufferView ? global.Blob : BlobConstructor
+  } else if (blobBuilderSupported) {
+    fixFileAndXHR()
+    global.Blob = BlobBuilderConstructor;
+  } else {
+    FakeBlobBuilder()
+  }
+
+})();

src/excel/export2Excel.js

@@ -0,0 +1,141 @@
+/* eslint-disable */
+require('script-loader!file-saver');
+require('script-loader!@/excel/Blob');
+require('script-loader!xlsx/dist/xlsx.core.min');
+function generateArray(table) {
+  var out = [];
+  var rows = table.querySelectorAll('tr');
+  var ranges = [];
+  for (var R = 0; R < rows.length; ++R) {
+    var outRow = [];
+    var row = rows[R];
+    var columns = row.querySelectorAll('td');
+    for (var C = 0; C < columns.length; ++C) {
+      var cell = columns[C];
+      var colspan = cell.getAttribute('colspan');
+      var rowspan = cell.getAttribute('rowspan');
+      var cellValue = cell.innerText;
+      if (cellValue !== "" && cellValue == +cellValue) cellValue = +cellValue;
+
+      //Skip ranges
+      ranges.forEach(function (range) {
+        if (R >= range.s.r && R <= range.e.r && outRow.length >= range.s.c && outRow.length <= range.e.c) {
+          for (var i = 0; i <= range.e.c - range.s.c; ++i) outRow.push(null);
+        }
+      });
+
+      //Handle Row Span
+      if (rowspan || colspan) {
+        rowspan = rowspan || 1;
+        colspan = colspan || 1;
+        ranges.push({s: {r: R, c: outRow.length}, e: {r: R + rowspan - 1, c: outRow.length + colspan - 1}});
+      }
+      ;
+
+      //Handle Value
+      outRow.push(cellValue !== "" ? cellValue : null);
+
+      //Handle Colspan
+      if (colspan) for (var k = 0; k < colspan - 1; ++k) outRow.push(null);
+    }
+    out.push(outRow);
+  }
+  return [out, ranges];
+};
+
+function datenum(v, date1904) {
+  if (date1904) v += 1462;
+  var epoch = Date.parse(v);
+  return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000);
+}
+
+function sheet_from_array_of_arrays(data, opts) {
+  var ws = {};
+  var range = {s: {c: 10000000, r: 10000000}, e: {c: 0, r: 0}};
+  for (var R = 0; R != data.length; ++R) {
+    for (var C = 0; C != data[R].length; ++C) {
+      if (range.s.r > R) range.s.r = R;
+      if (range.s.c > C) range.s.c = C;
+      if (range.e.r < R) range.e.r = R;
+      if (range.e.c < C) range.e.c = C;
+      var cell = {v: data[R][C]};
+      if (cell.v == null) continue;
+      var cell_ref = XLSX.utils.encode_cell({c: C, r: R});
+
+      if (typeof cell.v === 'number') cell.t = 'n';
+      else if (typeof cell.v === 'boolean') cell.t = 'b';
+      else if (cell.v instanceof Date) {
+        cell.t = 'n';
+        cell.z = XLSX.SSF._table[14];
+        cell.v = datenum(cell.v);
+      }
+      else cell.t = 's';
+
+      ws[cell_ref] = cell;
+    }
+  }
+  if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range);
+  return ws;
+}
+
+function Workbook() {
+  if (!(this instanceof Workbook)) return new Workbook();
+  this.SheetNames = [];
+  this.Sheets = {};
+}
+
+function s2ab(s) {
+  var buf = new ArrayBuffer(s.length);
+  var view = new Uint8Array(buf);
+  for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
+  return buf;
+}
+
+export function export_table_to_excel(id) {
+  var theTable = document.getElementById(id);
+  console.log('a')
+  var oo = generateArray(theTable);
+  var ranges = oo[1];
+
+  /* original data */
+  var data = oo[0];
+  var ws_name = "SheetJS";
+  console.log(data);
+
+  var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
+
+  /* add ranges to worksheet */
+  // ws['!cols'] = ['apple', 'banan'];
+  ws['!merges'] = ranges;
+
+  /* add worksheet to workbook */
+  wb.SheetNames.push(ws_name);
+  wb.Sheets[ws_name] = ws;
+
+  var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'});
+
+  saveAs(new Blob([s2ab(wbout)], {type: "application/octet-stream"}), "test.xlsx")
+}
+
+function formatJson(jsonData) {
+  console.log(jsonData)
+}
+export function export_json_to_excel(th, jsonData, defaultTitle) {
+
+  /* original data */
+
+  var data = jsonData;
+  data.unshift(th);
+  var ws_name = "SheetJS";
+
+  var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
+
+
+  /* add worksheet to workbook */
+  wb.SheetNames.push(ws_name);
+  wb.Sheets[ws_name] = ws;
+
+  var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'});
+  var title = defaultTitle || '列表'
+  saveAs(new Blob([s2ab(wbout)], {type: "application/octet-stream"}), title + ".xlsx")
+}

src/layout/components/Item.vue

@@ -1,6 +1,6 @@
 <template>
   <el-icon>
-    <Icon style="width: 16px;height: 16px;" :icon="icon" ></Icon>
+    <Icon v-if="icon" style="width: 16px;height: 16px;" :icon="icon" ></Icon>
   </el-icon>
 </template>
 <script>
@@ -10,7 +10,7 @@
     props: {
       icon: {
         type: String,
-        default: 'Apple'
+        default: ''
       }
     }
   }

src/layout/components/SidebarItem.vue

@@ -14,7 +14,7 @@
     <!-- 子项也负责跳转 -->
     <router-link style="text-decoration: none;" v-else :to="{name:`${item.path}`}">
       <el-menu-item class="el-menu-item" :index="item.title + ',' + item.path">
-        <!-- <Item /> -->
+        <Item v-if="item.icon" :icon="item.icon"/>
         <template #title>
           <span style="font-size:14px">{{ item.title }}</span>
         </template>

src/layout/components/TabControl.vue

@@ -25,6 +25,8 @@
     import {
         useRouter
     } from 'vue-router'
+    import $store from "@/store/index" // 引入vuex
+
     const router = useRouter() //router 对象
     let editableTabs = ref($storeTab.state.tabArray)
     let editableTabsValue = reactive($storeTab.state.editableTabsValue)
@@ -89,6 +91,7 @@
     //关闭其他
     //右键单击事件
     const openMenu = (event) => {
+        console.log($store.state.data.menuIsExpansion);
         event.preventDefault(); //防止默认菜单弹出
         let obj = event.srcElement ? event.srcElement : event.target;
         data.indexes = -1
@@ -99,7 +102,7 @@
                     data.indexes = index
                 }
             })
-            data.left = event.clientX - 200
+            data.left = event.clientX - ($store.state.data.menuIsExpansion ? 200 : 50)
             data.top = event.clientY - 65
             data.visible = true
         }

src/layout/index.vue

@@ -114,8 +114,9 @@
 
 <style lang="scss" scoped>
   .el-menu-vertical-demo:not(.el-menu--collapse) {
-    width: 200px;
+    width: 248px;
     min-height: 400px;
+    padding-bottom: 40px;
   }
 
   .bg-theme {

src/main.ts

@@ -1,3 +1,4 @@
+import 'babel-polyfill';
 //#pragma warning(disable:18)
 import { createApp, createVNode } from 'vue'
 import App from './App.vue'

src/views/dengmingcong/cardFillDo/cardFillDo.vue

@@ -1,24 +1,64 @@
 <template>
     <!-- 卡签补办 -->
-    <CRUD :homeData="Data" text="123">
+    <CRUD ref="crudRef" :homeData="datas">
+        <!-- 自定义搜索 -->
         <template #search="{ searchCondition }">
             <!-- 搜索 监听回车 @keyup.enter.native="search"-->
             <el-input v-model="searchCondition.fileOne" clearable placeholder="卡号" style="width: 200px;" />
-            <el-input v-model="searchCondition.fileTwo" clearable placeholder="车牌号码" style="width: 200px;margin: 0 10px 0 10px;" />
+            <el-input v-model="searchCondition.fileTwo" clearable placeholder="车牌号码"
+                style="width: 200px;margin: 0 10px 0 10px;" />
             <el-select v-model="searchCondition.fileThree" placeholder="--请输入车牌颜色--" style="margin-right: 10px;">
                 <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
             </el-select>
         </template>
+        <!-- 自定义编辑提交按钮 -->
+        <template #operation="{ scope , tableFrom}">
+            <el-button size="small" @click="reissue(scope,tableFrom)">补卡</el-button>
+        </template>
+        <!-- 自定义弹框内容 -->
+        <template #dialog>
+            <el-form :model="fromData">
+                <el-form-item>
+                    <div class="as-layout-horizontal">
+                        <el-input v-model="fromData.crud" type="input" placeholder="读新卡信息" />
+                        <el-button type="primary" icon="CreditCard" style="margin-left: 10px;">读卡</el-button>
+                    </div>
+                </el-form-item>
+                <el-form-item>
+                    <el-input v-model="fromData.crud" disabled type="input" placeholder="52011328220200034040" />
+                </el-form-item>
+            </el-form>
+            
+        </template>
+        <!-- 弹窗页脚 -->
+        <template #footer>
+            <span>
+                <el-button @click="crudRef.dialogFormVisible = false">取消</el-button>
+                <el-button type="primary">提交</el-button>
+            </span>
+        </template>
     </CRUD>
 </template>
 <script setup lang="ts">
-    import CRUD from "@/crud/index.vue";
+    import CRUD from "@/crud/index.vue"
     import {
         Data
     } from '@/data/cardAfter/cardFillDo' //表单配置
     import {
         tableData
     } from "@/data/tableData" //表单数据
+    import {
+        ref,
+        reactive
+    } from 'vue'
+
+    const datas = reactive(Data);
+    const crudRef = ref()
+    const fromData = reactive({})
+    const reissue = (scope, tableFrom) => {
+        crudRef.value.dialogFormVisible = true
+        crudRef.value.title = '补卡信息'
+    }
 
     const options = [{
             value: 'Option1',

src/views/shengbo/blacklistQuery/blacklistQuery.vue

@@ -7,7 +7,7 @@
     <!-- 输入框 -->
     <div class="topstyle">
       <span style="margin-right: 10px; width: 40px">卡号</span>
-      <el-input v-model="input4" placeholder="请输入卡号"> </el-input>
+      <el-input v-model="input4" placeholder="请输入卡号" style="width: 220px;"> </el-input>
     </div>
     <!-- 日期框 -->
     <div class="topstyle">
@@ -40,8 +40,13 @@
       <el-button v-model="input4" type="success" :icon="Search" @click="search">搜索</el-button>
       <el-button type="warning" :icon="Refresh" @click="reset">重置</el-button>
       <el-button type="primary" :icon="Plus" @click="dialogFormVisible = true">添加</el-button>
-      <el-dialog v-model="dialogFormVisible" title="卡黑名单-操作(下黑反白)" class="as-gravity-center">
-        <el-form :model="form">
+    </div>
+  </div>
+  <!-- 弹窗 -->
+  <div>
+    <el-dialog v-model="dialogFormVisible" class="as-gravity-center">
+        <span class="as-gravity-center" style="font-size: 25px;">卡黑名单-操作(下黑反白)</span>
+        <el-form :model="form" style="padding-top:22px;">
           <el-form-item label="卡号：" :label-width="100">
             <el-input v-model="form.name" style="width: 215px" />
           </el-form-item>
@@ -73,7 +78,6 @@
           </span>
         </template>
       </el-dialog>
-    </div>
   </div>
   <div style="padding-top: 12px">
     <el-table :data="tableData" border style="width: 100%">
@@ -97,18 +101,12 @@
               <el-form-item label="卡号：" :label-width="100">
                 <el-input v-model="form1.data" style="width: 215px" disabled />
               </el-form-item>
-            </el-form>
-            <el-form :model="form1">
               <el-form-item label="车辆号：" :label-width="100">
                 <el-input v-model="form1.data1" style="width: 215px" disabled />
               </el-form-item>
-            </el-form>
-            <el-form :model="form1">
               <el-form-item label="机构名称：" :label-width="100">
                 <el-input v-model="form1.data2" style="width: 215px" disabled />
               </el-form-item>
-            </el-form>
-            <el-form :model="form1">
               <el-form-item label="黑名单类型：" :label-width="100">
                 <el-input v-model="form1.data3" style="width: 215px" disabled />
               </el-form-item>
@@ -124,8 +122,6 @@
               <el-form-item label="查询结果：" :label-width="100" style="color: rgb(209, 65, 65)">
                 <el-input v-model="form1.data5" style="width: 215px" disabled />
               </el-form-item>
-            </el-form>
-            <el-form :model="form1">
               <el-form-item label="下黑原因：" :label-width="100" style="color: rgb(209, 65, 65)">
                 <el-input v-model="form1.data6" type="textarea" disabled />
               </el-form-item>
@@ -254,5 +250,6 @@ const tableData: User[] = [
   margin-right: 10px;
   align-items: center;
   justify-content: flex-start;
+
 }
 </style>

src/views/shengbo/trafficFlow/trafficFlow.vue

@@ -2,37 +2,35 @@
   <div class="top">
     <!-- 输入框 -->
     <div class="topstyle">
-      <el-input v-model="input4" placeholder="请输入ETC卡号"> </el-input>
+      <el-input v-model="formData.input1" placeholder="请输入ETC卡号" style="width: 220px"> </el-input>
     </div>
     <div class="topstyle">
-      <el-input v-model="input4" placeholder="请输入车牌号"> </el-input>
+      <el-input v-model="formData.input2" placeholder="请输入车牌号" style="width: 220px"> </el-input>
     </div>
     <!-- 日期框 -->
-    <div class="topstyle" >
+    <div class="topstyle">
       <el-date-picker
-        v-model="value1"
+        v-model="formData.input3"
         type="datetime"
         placeholder="开始日期"
         format="YYYY/MM/DD hh:mm:ss"
-       
       />
       <!-- <span>-</span> -->
-       <!-- <el-button>至</el-button> -->
+      <!-- <el-button>至</el-button> -->
       <el-date-picker
-        v-model="value1"
+        v-model="formData.input4"
         type="datetime"
-        
         placeholder="结束日期"
         format="YYYY/MM/DD hh:mm:ss"
-         style="margin-left: 5px;"
+        style="margin-left: 5px"
       />
     </div>
     <!-- 按钮 -->
     <div class="topstyle">
-      <el-button v-model="input4" type="success" :icon="Search" @click="search">搜索</el-button>
-      <el-button type="warning" :icon="Refresh" @click="reset">重置</el-button>
-      <el-button type="primary" plain  @click="excelExport()">导出当前页</el-button>
-      <el-button type="primary" plain   @click="excelExport()">导出所有</el-button>
+      <el-button type="success" :icon="Search" @click="submitForm">搜索</el-button>
+      <el-button type="warning" :icon="Refresh" @click="submitReset">重置</el-button>
+      <el-button type="primary" plain @click="downloadExcel">导出当前页</el-button>
+      <el-button type="primary" plain @click="dddd">导出所有</el-button>
     </div>
   </div>
   <div style="padding-top: 12px">
@@ -51,11 +49,7 @@
     </el-table>
   </div>
   <div style="padding-top: 12px" class="as-gravity-center-end">
-    <el-pagination
-      :page-sizes="[10, 20, 30, 40]"
-      layout="sizes, prev, pager, next"
-      :total="1000"
-    />
+    <el-pagination :page-sizes="[10, 20, 30, 40]" layout="sizes, prev, pager, next" :total="1000" />
   </div>
 </template>
 
@@ -64,16 +58,80 @@ import { reactive, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { Calendar, Search, Refresh } from '@element-plus/icons-vue'
 import type { ElTable } from 'element-plus'
+import { getCurrentInstance } from 'vue'
+const instance = getCurrentInstance()
+const _this= instance.appContext.config.globalProperties
 
-const input3 = ref('')
-const input4 = ref('')
-const value1 = ref('')
 
-function reset() {}
-function search() {}
-function exportCurrentPage() {}
-function exportAll() {}
+const formData = reactive({
+    input1:'',
+    input2:'',
+    input3:'',
+    input4:'',
+    date1: '1',
+    date2: '52011328220200481698',
+    date3: '贵A710AE',
+    date4: '省内流水',
+    date5: '2019-12-27 20:14:02',
+    date6: '贵阳西主线站',
+    date7: '2019-12-27 20:18:20',
+    date8: '贵阳西主线站',
+    date9: '38.25',
+    date10: '0.00',
+    date11: '38.25',
+})
+// 搜索
+const submitForm = () => {
+  const { date1, date2, date3,date4,date5,date6,date7,date8,date9,date10,date11 } = formData
+  console.log(date1, date2, date3,date4,date5,date6,date7,date8,date9,date10,date11)
+}
+// 重置
+const submitReset = () => {
+  myform.value?.resetFields()
+}
 
+
+function exportAll() {}
+function downloadExcel() {
+  _this.$confirm('将导出为excel文件，确认导出?', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+    .then(() => {
+      _this.excelData = _this.tableData
+      _this.export2Excel()
+    })
+    .catch(() => {})
+}
+// 数据写入excel
+function export2Excel() {
+  var that = _this
+  require.ensure([], () => {
+    const { export_json_to_excel } = require('../../../excel/export2Excel') // 这里必须使用绝对路径，使用@/+存放export2Excel的路径
+    const tHeader = ['序号', 'ETC卡号', '车牌号', '消费类型', '入口时间', '入口站名', '出口时间', '出口站名', '交易前余额（元）', '交易金额（元）', '交易后金额（元）'] // 导出的excel的表头字段
+    const filterVal = [
+      'date1',
+      'date2',
+      'date3',
+      'date4',
+      'date5',
+      'date6',
+      'date7',
+      'date8',
+      'date9',
+      'date10',
+      'date11',
+    ] // 对象属性，对应于tHeader
+    const list = that.excelData //json数组对象，接口返回的数据
+    const data = that.formatJson(filterVal, list)
+    export_json_to_excel(tHeader, data, '通行流水查询表') // 导出的表格名称
+  })
+}
+// 格式转换，直接复制即可
+function formatJson(filterVal, jsonData) {
+  return jsonData.map((v) => filterVal.map((j) => v[j]))
+}
 interface User {
   date1: string
   date2: string
@@ -97,33 +155,7 @@ const setCurrent = (row?: User) => {
 const handleCurrentChange = (val: User | undefined) => {
   currentRow.value = val
 }
-//点击导出
-function excelExport(){
-  import('@/vendor/Export2Excel').then(excel => {
-    const tHeader = ['用户名称', '账号', '手机号', '所属公司','用户角色','创建者','部门名称','创建时间','最近登录时间']
-    const filterVal = ['userName', 'email', 'phonenumber', 'orgName','roleName','createBy','deptName','createTime','loginTime']
-    const list = this.list
-    const data = this.formatJson(filterVal, list)
-    excel.export_json_to_excel({
-      header: tHeader,
-      data,
-      filename: "账号列表",
-      // filename: this.filename,
-      autoWidth: this.autoWidth,
-      bookType: this.bookType
-    })
-    this.downloadLoading = false
-  })
-}
-function formatJson(filterVal, jsonData) {
-  return this.dataList.map(v => filterVal.map(j => {
-    if (j === 'timestamp') {
-      return parseTime(v[j])
-    } else {
-      return v[j]
-    }
-  }))
-}
+
 const tableData: User[] = [
   {
     date1: '1',

src/views/weixingrong/OBUQuery/OBUQuery.vue

@@ -1,10 +1,20 @@
 <script lang='ts' setup>
-    import { reactive } from 'vue';
-    const OBUList = reactive({
+
+import { reactive,ref } from 'vue';
+const dialogFormVisible = ref(false)
+const labelWith = '68px'
+const formLabelWidth = '140px'
+const form =reactive({
+    name: '',
+    region: ''
+})
+const OBUList = reactive({
         cno: '',
         carNo: '',
         carColors: '',
         OBUno: '',
+        pages: 10,
+        status:''
     })
 const options = [
   {
@@ -28,50 +38,64 @@ const options = [
     label: 'Option5',
   },
 ]
+const pages =[
+    {
+        value: '10',
+        label: '10',
+    },
+    {
+        value: '20',
+        label: '20',
+    },
+    {
+        value: '30',
+        label: '30',
+    }
+]
 const colors = [{
-            value: 'Option1',
+            value: '蓝色',
             label: '蓝色',
         },
         {
-            value: 'Option2',
+            value: '黄色',
             label: '黄色',
         },
         {
-            value: 'Option3',
+            value: '黑色',
             label: '黑色',
         },
         {
-            value: 'Option4',
+            value: '白色',
             label: '白色',
         },
         {
-            value: 'Option5',
+            value: '渐变绿色',
             label: '渐变绿色',
         },
         {
-            value: 'Option6',
+            value: '黄绿双拼色',
             label: '黄绿双拼色',
         },
         {
-            value: 'Option7',
+            value: '蓝白渐变色',
             label: '蓝白渐变色',
-        },
-        {
-            value: 'Option8',
-            label: '未确定',
-        },
+        },        
         {
-            value: 'Option9',
+            value: '绿色',
             label: '绿色',
         },
         {
-            value: 'Option10',
+            value: '红色',
             label: '红色',
         },
+        {
+            value: '未确定',
+            label: '未确定',
+        },
     ]
 const tableData = [
   {
-    customerName: '周金波',
+    customerName: '郭达',
     carNo: '贵CEP186',
     carColor: '白色',
     carStyle: '一型客车',
@@ -89,7 +113,7 @@ const tableData = [
     OBUStatus: '正常',
   },
   {
-    customerName: '周金波',
+    customerName: '王媛媛',
     carNo: '贵CEP186',
     carColor: '白色',
     carStyle: '一型客车',
@@ -98,7 +122,7 @@ const tableData = [
     OBUStatus: '正常',
   },
   {
-    customerName: '周金波',
+    customerName: '李丽',
     carNo: '贵CEP186',
     carColor: '白色',
     carStyle: '一型客车',
@@ -113,6 +137,7 @@ const handleView = (item:any,v:any) => {
 }
 const handleEdit = (item:any,v:any) => {
   console.log('edit',item,v.OBUNo)
+  dialogFormVisible.value = true
 }
 </script>
 <template>
@@ -125,7 +150,7 @@ const handleEdit = (item:any,v:any) => {
                 <el-input v-model="OBUList.carNo" placeholder="车牌号码" />
             </el-form-item>
             <el-form-item label="车牌颜色">
-                <el-select v-model="OBUList.carColors" class="m-2" placeholder="Select">
+                <el-select v-model="OBUList.carColors" placeholder="请选择">
                     <el-option
                     v-for="item in colors"
                     :key="item.value"
@@ -137,9 +162,9 @@ const handleEdit = (item:any,v:any) => {
             <el-form-item label="OBU编号">
                 <el-input v-model="OBUList.OBUno" placeholder="OBU编号" />
             </el-form-item>
-            <el-form-item><el-button type="primary">读OBU</el-button></el-form-item>
-            <el-form-item label="状态">
-                <el-select v-model="OBUList.carColors" class="m-2" placeholder="Select">
+            <el-form-item><el-button type="primary" icon="Tools">读OBU</el-button></el-form-item>
+            <el-form-item label="状态" :label-width="labelWith">
+                <el-select v-model="OBUList.status" placeholder="请选择">
                     <el-option
                     v-for="item in options"
                     :key="item.value"
@@ -149,9 +174,9 @@ const handleEdit = (item:any,v:any) => {
                 </el-select>
             </el-form-item>
             <el-form-item label="每条页数">
-                <el-select v-model="OBUList.carColors" class="m-2" placeholder="Select">
+                <el-select v-model="OBUList.pages" placeholder="请选择" class="pageSelect">
                     <el-option
-                    v-for="item in options"
+                    v-for="item in pages"
                     :key="item.value"
                     :label="item.label"
                     :value="item.value"
@@ -159,7 +184,7 @@ const handleEdit = (item:any,v:any) => {
                 </el-select>
             </el-form-item>
             <el-form-item><el-button type="primary" icon="Search">查询</el-button></el-form-item>
-            <el-form-item><el-button type="warning" plain icon="Refresh">重置</el-button></el-form-item>
+            <el-form-item><el-button type="warning" icon="Refresh">重置</el-button></el-form-item>
         </el-form>
         <el-table :data="tableData" style="width: 100%">
             <el-table-column type="index" label="序号" width="64" fixed align="center" />
@@ -177,10 +202,44 @@ const handleEdit = (item:any,v:any) => {
             </template>
             </el-table-column>
         </el-table>
+        <el-dialog v-model="dialogFormVisible" title="Shipping address" custom-class="custom-dialog666666666">
+            <el-form :model="form">
+            <el-form-item label="Promotion name" :label-width="formLabelWidth">
+                <el-input v-model="form.name" autocomplete="off" />
+            </el-form-item>
+            <el-form-item label="Zones" :label-width="formLabelWidth">
+                <el-select v-model="form.region" placeholder="Please select a zone">
+                <el-option label="Zone No.1" value="shanghai" />
+                <el-option label="Zone No.2" value="beijing" />
+                </el-select>
+            </el-form-item>
+            </el-form>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="dialogFormVisible = false">取消</el-button>
+                    <el-button type="primary" @click="dialogFormVisible = false"
+                    >保存</el-button
+                    >
+                </span>
+            </template>
+        </el-dialog>
     </div>
 </template>
 <style scoped>
 .el-form--inline .el-form-item{
     margin-right: 16px;
 }
+
+.el-select{
+    width: 168px;    
+}
+.el-select-dropdown__item{
+    font-family: "Microsoft Yahei";
+}
+.pageSelect{
+    width: 80px;
+}
+.custom-dialog{
+    transform: translate(-50%,-50%);
+}
 </style>

src/views/weixingrong/vehicleEnquirChange/vehicleEnquirChange.vue

@@ -1,11 +1,46 @@
 <script lang='ts' setup>
-    import { reactive } from 'vue';
+    import { reactive,ref } from 'vue';
     const OBUList = reactive({
         cno: '',
         carNo: '',
         carColors: '',
         OBUno: '',
+        pages: '10',
     })
+
+//弹窗
+const isShowDialog = ref(false)
+const formLabelWidth = "78px"
+const searchLabelWidth = "110px"
+const formData = reactive({
+    ownerName: '',//车主姓名
+    ownerIdType: '',//车主证件类型
+    ownerIdNum: '',//车主证件号码
+    ownerPositiveImageStr: '',//车主证件正面图片的BASE64编码
+    ownerNegativeImageStr: '',//车主证件反面图片的BASE64编码
+    scenePayType: '',//代扣协议支撑服务场景（签约渠道（银行、微信支付宝等）和用户签定的协议）
+})
+const handleView = (item:any,v:any) => {
+  console.log('view',item,v)
+}
+const handleEdit = (item:any,v:any) => {
+  console.log('edit',item,v.OBUNo)
+  isShowDialog.value = true
+}
+const pages =[
+    {
+        value: '10',
+        label: '10',
+    },
+    {
+        value: '20',
+        label: '20',
+    },
+    {
+        value: '30',
+        label: '30',
+    }
+]
 const colors = [{
             value: 'Option1',
             label: '蓝色',
@@ -104,18 +139,15 @@ const tableData = [
     updateTime: '2018/03/17 21:15:13',
   },
 ]
-const handleClick = () => {
-  console.log('click')
-}
 </script>
 <template>
     <div class="OBU-query content-warpper">
         <el-form :inline="true" :model="OBUList" class="demo-form-inline">
             
-            <el-form-item label="车牌号码">
+            <el-form-item label="车牌号码" :label-width="searchLabelWidth">
                 <el-input v-model="OBUList.carNo" placeholder="车牌号码" />
             </el-form-item>
-            <el-form-item label="车牌颜色">
+            <el-form-item label="车牌颜色" :label-width="searchLabelWidth">
                 <el-select v-model="OBUList.carColors" class="m-2" placeholder="Select">
                     <el-option
                     v-for="item in colors"
@@ -125,7 +157,7 @@ const handleClick = () => {
                     />
                 </el-select>
             </el-form-item>
-            <el-form-item label="所有人证件类型">
+            <el-form-item label="所有人证件类型" :label-width="searchLabelWidth">
                 <el-select v-model="OBUList.carColors" class="m-2" placeholder="请选择">
                     <el-option
                     v-for="item in options"
@@ -135,19 +167,19 @@ const handleClick = () => {
                     />
                 </el-select>
             </el-form-item>
-            <el-form-item label="所有人证件号">
+            <el-form-item label="所有人证件号" :label-width="searchLabelWidth">
                 <el-input v-model="OBUList.OBUno" placeholder="所有人证件号" />
             </el-form-item>
-            <el-form-item label="所有人名称">
+            <el-form-item label="所有人名称" :label-width="searchLabelWidth">
                 <el-input v-model="OBUList.OBUno" placeholder="所有人名称" />
             </el-form-item>
-            <el-form-item label="客户编号">
+            <el-form-item label="客户编号" :label-width="searchLabelWidth">
                 <el-input v-model="OBUList.OBUno" placeholder="客户编号" />
             </el-form-item>
-            <el-form-item label="每条页数">
-                <el-select v-model="OBUList.carColors" class="m-2" placeholder="请选择">
+            <el-form-item label="每条页数" :label-width="searchLabelWidth">
+                <el-select v-model="OBUList.pages" placeholder="请选择"   class="pageSelect">
                     <el-option
-                    v-for="item in options"
+                    v-for="item in pages"
                     :key="item.value"
                     :label="item.label"
                     :value="item.value"
@@ -155,7 +187,7 @@ const handleClick = () => {
                 </el-select>
             </el-form-item>
             <el-form-item><el-button type="primary" icon="Search">查询</el-button></el-form-item>
-            <el-form-item><el-button type="warning" plain icon="Refresh">重置</el-button></el-form-item>
+            <el-form-item><el-button type="warning" icon="Refresh">重置</el-button></el-form-item>
         </el-form>
         <el-table :data="tableData" style="width: 100%">
             <el-table-column type="index" label="序号" width="64" fixed align="center" />
@@ -169,16 +201,52 @@ const handleClick = () => {
             <el-table-column prop="carStyle" label="车型" width="100" align="center" />
             <el-table-column prop="updateTime" label="更新时间" width="180" align="center" />
             <el-table-column fixed="right" label="操作" width="160" align="center" >
-            <template #default>
-                <el-button type="success" size="small" @click="handleClick">修改</el-button>
-                <el-button type="primary" size="small">详情</el-button>
+            <template #default="scope">
+                <el-button type="primary" size="small" @click="handleView(scope.$index, scope.row)">详情</el-button>
+                <el-button type="success" size="small" @click="handleEdit(scope.$index, scope.row)">修改</el-button>
             </template>
             </el-table-column>
         </el-table>
+        <el-dialog v-model="isShowDialog" title="车辆信息变更" custom-class="custom-dialog" :width="576">
+            <el-form :model="formData" :inline="true">
+            <el-form-item label="车主姓名" :label-width="formLabelWidth">
+                <el-input v-model="formData.ownerName" autocomplete="off" />
+            </el-form-item>
+            <el-form-item label="证件类型" :label-width="formLabelWidth">
+                <el-select v-model="formData.ownerIdType" placeholder="请选择">
+                <el-option label="Zone No.1" value="shanghai" />
+                <el-option label="Zone No.2" value="beijing" />
+                </el-select>
+            </el-form-item>
+            <el-form-item label="证件号码" :label-width="formLabelWidth">
+                <el-input v-model="formData.ownerIdNum" autocomplete="off" />
+            </el-form-item>
+            </el-form>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button type="danger" @click="isShowDialog = false" plain>取消</el-button>
+                    <el-button type="primary" @click="isShowDialog = false"
+                     >保存</el-button
+                    >
+                </span>
+            </template>
+        </el-dialog>
     </div>
 </template>
 <style scoped>
   .el-form--inline .el-form-item{
     margin-right: 16px;
-}  
+} 
+.el-select-dropdown__item{
+    font-family: "Microsoft Yahei";
+}
+.el-select{
+    width: 168px;    
+}
+.pageSelect{
+    width: 80px;
+}
+.custom-dialog .el-button{
+    padding: 0 32px;
+}
 </style>

vite.config.ts

@@ -38,6 +38,9 @@ export default defineConfig(({ command, mode }) => {
         },
       },
     },
+    entry: {
+      index: ["babel-polyfill", "./src/main.ts"],
+    },
     //启动服务配置
     server: {
       host: '0.0.0.0',

yarn.lock

@@ -475,6 +475,23 @@
     "follow-redirects" "^1.14.9"
     "form-data" "^4.0.0"
 
+"babel-polyfill@^6.26.0":
+  "integrity" "sha512-F2rZGQnAdaHWQ8YAoeRbukc7HS9QgdgeyJ0rQDd485v9opwuPvjpPFcOOT/WmkKTdgy9ESgSPXDcTNpzrGr6iQ=="
+  "resolved" "https://registry.npmmirror.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz"
+  "version" "6.26.0"
+  dependencies:
+    "babel-runtime" "^6.26.0"
+    "core-js" "^2.5.0"
+    "regenerator-runtime" "^0.10.5"
+
+"babel-runtime@^6.26.0":
+  "integrity" "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g=="
+  "resolved" "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz"
+  "version" "6.26.0"
+  dependencies:
+    "core-js" "^2.4.0"
+    "regenerator-runtime" "^0.11.0"
+
 "balanced-match@^1.0.0":
   "integrity" "sha1-6D46fj8wCzTLnYf2FfoMvzV2kO4="
   "resolved" "https://registry.npm.taobao.org/balanced-match/download/balanced-match-1.0.2.tgz?cache=0&sync_timestamp=1617714233441&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fbalanced-match%2Fdownload%2Fbalanced-match-1.0.2.tgz"
@@ -649,6 +666,11 @@
   dependencies:
     "is-what" "^3.14.1"
 
+"core-js@^2.4.0", "core-js@^2.5.0":
+  "integrity" "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
+  "resolved" "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz"
+  "version" "2.6.12"
+
 "core-util-is@~1.0.0":
   "integrity" "sha1-pgQtNjTCsn6TKPg3uWX6yDgI24U="
   "resolved" "https://registry.nlark.com/core-util-is/download/core-util-is-1.0.3.tgz"
@@ -1757,6 +1779,16 @@
   dependencies:
     "picomatch" "^2.2.1"
 
+"regenerator-runtime@^0.10.5":
+  "integrity" "sha512-02YopEIhAgiBHWeoTiA8aitHDt8z6w+rQqNuIftlM+ZtvSl/brTouaU7DW6GO/cHtvxJvS4Hwv2ibKdxIRi24w=="
+  "resolved" "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz"
+  "version" "0.10.5"
+
+"regenerator-runtime@^0.11.0":
+  "integrity" "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
+  "resolved" "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz"
+  "version" "0.11.1"
+
 "regexpp@^3.1.0", "regexpp@^3.2.0":
   "integrity" "sha1-BCWido2PI7rXDKS5BGH6LxIT4bI="
   "resolved" "https://registry.nlark.com/regexpp/download/regexpp-3.2.0.tgz?cache=0&sync_timestamp=1623668872577&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fregexpp%2Fdownload%2Fregexpp-3.2.0.tgz"