hd-idevvue3 3.0.3 → 3.0.4

package/src/hdcom/HdBtn.vue

@@ -1,37 +1,42 @@
 <template>
   <el-tooltip
+    :auto-close="2"
+    :show-after="500"
     v-if="btnRight"
     ref="hdbtn"
-    :content="$t(hint+addTextProp)"
-    :hide-after="2"
+    :content="$t(hint + addTextProp)"
     :enterable="true"
-    :open-delay="500"
     placement="bottom"
     effect="light"
-    transition="">
-    <i :class="'hdBtn '+icon" @click="handleClick">
-      <slot v-if="!icon"/>
-      <hd-hot-key v-if="nowKeyMap" :hot-key-range="hotKeyRange" :key-map="nowKeyMap" @do="click('hotkey')"/>
+    transition=""
+  >
+    <i :class="'hdBtn ' + icon" @click="handleClick">
+      <slot v-if="!icon" />
+      <hd-hot-key
+        v-if="nowKeyMap"
+        :hot-key-range="hotKeyRange"
+        :key-map="nowKeyMap"
+        @do="click('hotkey')"
+      />
     </i>
-
   </el-tooltip>
 </template>
 
 <script>
 import BtnRight from './BtnRight'
 /**
-   * 通常为列表内用的按钮图标
-   * @module HdBtn
-   */
+ * 通常为列表内用的按钮图标
+ * @module HdBtn
+ */
 export default {
   name: 'HdBtn',
   mixins: [BtnRight],
   /**
-     * Props slot或者icon方式传入图标
-     * @prop {String} icon svgicon的名称,或者以slot形式传入
-     * @prop {String} hint 图标提示文字
-     * @prop {String} vid 按钮授权时,必须指定按钮id
-     */
+   * Props slot或者icon方式传入图标
+   * @prop {String} icon svgicon的名称,或者以slot形式传入
+   * @prop {String} hint 图标提示文字
+   * @prop {String} vid 按钮授权时,必须指定按钮id
+   */
   /* props: ['icon', 'hint', 'vid'],*/
   props: {
     noRoleManage: Boolean, // 设置不受角色控制
@@ -40,7 +45,7 @@ export default {
     hotKeyRange: { type: String, default: 'hd-com-grid' },
     icon: String, // svgicon的名称,或者以slot形式传入
     hint: String, // hint 图标提示文字
-    vid: String // 按钮指定id时,授权用不指定默认生成
+    vid: String, // 按钮指定id时,授权用不指定默认生成
   },
   data() {
     return {}
@@ -60,21 +65,26 @@ export default {
     nowKeyMap() {
       if (this.keyMap) {
         return this.keyMap
-      } else if (this.keyType && this.$keyMap) { // $keyMap是在keymap.js配置的对象
+      } else if (this.keyType && this.$keyMap) {
+        // $keyMap是在keymap.js配置的对象
         return this.$keyMap[this.keyType]
       }
-    }
+    },
   },
-  created() { // 列表内循环,数量无法控制,需要手工加入
+  created() {
+    // 列表内循环,数量无法控制,需要手工加入
     if (!this.noRoleManage) {
-      if (this.$route && this.$route.meta.btnRoleCheck) { // 角色管理下激活
+      if (this.$route && this.$route.meta.btnRoleCheck) {
+        // 角色管理下激活
         this.addBtnMetaToParent()
       }
     }
   },
   mounted() {
     this.$nextTick(() => {
-      if (this.$refs.hdbtn && this.$refs.hdbtn.referenceElm) { this.$refs.hdbtn.referenceElm.setAttribute('tabindex', -1) }
+      if (this.$refs.hdbtn && this.$refs.hdbtn.referenceElm) {
+        this.$refs.hdbtn.referenceElm.setAttribute('tabindex', -1)
+      }
     })
     this.checkRight()
   },
@@ -95,19 +105,21 @@ export default {
     handleClick(evt) {
       this.$emit('click', evt)
     },
-    handleTooltipClick() {
-    },
+    handleTooltipClick() {},
     click(evt) {
-      if (this.$attrs.disabled === undefined || this.$attrs.disabled === false) {
+      if (
+        this.$attrs.disabled === undefined ||
+        this.$attrs.disabled === false
+      ) {
         this.handleClick(evt)
       }
-    }
-  }
+    },
+  },
 }
-
 </script>
-<style rel="stylesheet/scss" lang="scss">
-  .hdBtn {
-    cursor: pointer;
-  }
+
+<style lang="scss" rel="stylesheet/scss">
+.hdBtn {
+  cursor: pointer;
+}
 </style>

package/src/hdcom/HdButton.vue

@@ -1,137 +1,161 @@
 <template>
-  <ExButton ref="elbtn"
-            v-bind="$attrs" v-if="btnRight" v-on="$listeners" :class="buttonClass">
-    {{nowText()}}
-    <hd-hot-key :hotKeyRange="hotKeyRange" :keyMap="nowKeyMap" @do="click('hotkey')" v-if="nowKeyMap"></hd-hot-key>
+  <ExButton
+    ref="elbtn"
+    v-bind="$attrs"
+    v-if="btnRight"
+    v-on="$listeners"
+    :class="buttonClass"
+  >
+    {{ nowText() }}
+    <hd-hot-key
+      :hotKeyRange="hotKeyRange"
+      :keyMap="nowKeyMap"
+      @do="click('hotkey')"
+      v-if="nowKeyMap"
+    ></hd-hot-key>
   </ExButton>
 </template>
 
 <script>
-  import BtnRight from './BtnRight'
+import BtnRight from './BtnRight'
 
+/**
+ * 继承之 ElButton 直接用ElButton
+ * HdButton和HdBtn覆写是为了进行按钮权限,校验形式:(name_按钮文字),没有name也行,但是如果一个菜单下多个同名按钮要分别控制就需要加name
+ * @module HdButton
+ */
+export default {
+  name: 'HdButton',
+  mixins: [BtnRight],
+  data() {
+    return {
+      classmap: [
+        { name: '增加', value: 'hd-bn bn-add' },
+        { name: '新增', value: 'hd-bn bn-add' },
+        { name: '删除', value: 'hd-bn bn-del' },
+        { name: '保存', value: 'hd-bn bn-save' },
+        { name: '搜索', value: 'hd-bn bn-search' },
+        { name: '查询', value: 'hd-bn bn-search' },
+        { name: '复制', value: 'hd-bn bn-copy' },
+        { name: '粘贴', value: 'hd-bn bn-paste' },
+        { name: '作废', value: 'hd-bn bn-docdel' },
+        { name: '新建文件夹', value: 'hd-bn bn-folde' },
+        { name: '上传', value: 'hd-bn bn-upload' },
+        { name: '下载', value: 'hd-bn bn-download' },
+        { name: '切换查看模式', value: 'hd-bn bn-sort' },
+        { name: '发起', value: 'hd-bn bn-start' },
+        { name: '刷新', value: 'hd-bn bn-refresh' },
+        { name: '导入', value: 'hd-bn bn-import' },
+        { name: '设置', value: 'hd-bn bn-setting' },
+        { name: '更新', value: 'hd-bn bn-renew' },
+        { name: '选择', value: 'hd-bn bn-selected' },
+        { name: '读取', value: 'hd-bn bn-finished' },
+        { name: '预览', value: 'hd-bn bn-view' },
+        { name: '生成', value: 'hd-bn bn-create' },
+        { name: '确定', value: 'hd-bn bn-fix' },
+        { name: '取消', value: 'hd-bn bn-cancel' },
+      ],
+    }
+  },
+  inheritAttrs: false,
   /**
-   * 继承之 ElButton 直接用ElButton
-   * HdButton和HdBtn覆写是为了进行按钮权限,校验形式:(name_按钮文字),没有name也行,但是如果一个菜单下多个同名按钮要分别控制就需要加name
-   * @module HdButton
+   * Props 继承ElButton的属性和事件
+   * @prop {Boolean} noRoleManage 设置是否按钮授权时,该按钮被扫描到
+   * @prop {Array} keyMap 绑定快捷键
+   * @prop {String} keyType 绑定快捷键类型,keyType='del'可在keymap.js中修改匹配,keyMap有值时,此无效
+   * @prop {String} hotKeyRange 快捷键的鼠标有效区域
+   * @prop {String} vid 按钮授权时,按钮id,此处可以不指定会根据页面名_title生成
    */
-  export default {
-    name: 'HdButton',
-    mixins: [BtnRight],
-    data() {
-      return {
-        classmap: [
-          {name: "增加", value: "hd-bn bn-add"},
-          {name: "新增", value: "hd-bn bn-add"},
-          {name: "删除", value: "hd-bn bn-del"},
-          {name: "保存", value: "hd-bn bn-save"},
-          {name: "搜索", value: "hd-bn bn-search"},
-          {name: "查询", value: "hd-bn bn-search"},
-          {name: "复制", value: "hd-bn bn-copy"},
-          {name: "粘贴", value: "hd-bn bn-paste"},
-          {name: "作废", value: "hd-bn bn-docdel"},
-          {name: "新建文件夹", value: "hd-bn bn-folde"},
-          {name: "上传", value: "hd-bn bn-upload"},
-          {name: "下载", value: "hd-bn bn-download"},
-          {name: "切换查看模式", value: "hd-bn bn-sort"},
-          {name: "发起", value: "hd-bn bn-start"},
-          {name: "刷新", value: "hd-bn bn-refresh"},
-          {name: "导入", value: "hd-bn bn-import"},
-          {name: "设置", value: "hd-bn bn-setting"},
-          {name: "更新", value: "hd-bn bn-renew"},
-          {name: "选择", value: "hd-bn bn-selected"},
-          {name: "读取", value: "hd-bn bn-finished"},
-          {name: "预览", value: "hd-bn bn-view"},
-          {name: "生成", value: "hd-bn bn-create"},
-          {name: "确定", value: "hd-bn bn-fix"},
-          {name: "取消", value: "hd-bn bn-cancel"}]
+  props: {
+    noRoleManage: Boolean, // 设置不受角色控制
+    keyMap: Array,
+    keyType: String,
+    hotKeyRange: { type: String, default: 'hd-com-grid' },
+    vid: String, // 按钮指定id时,授权用不指定默认生成
+    customClass: {
+      type: String,
+    },
+  },
+
+  components: {},
+  created() {
+    if (!this.noRoleManage) {
+      if (this.$route && this.$route.meta.btnRoleCheck) {
+        // 角色管理下激活
+        this.addBtnMetaToParent()
+      }
+    }
+  },
+  mounted() {
+    this.checkRight()
+  },
+
+  computed: {
+    addTextProp() {
+      if (this.nowKeyMap && this.nowKeyMap.length == 2) {
+        return '(' + this.nowKeyMap[1].toUpperCase() + ')'
       }
+      return ''
     },
-    inheritAttrs: false,
-    /**
-     * Props 继承ElButton的属性和事件
-     * @prop {Boolean} noRoleManage 设置是否按钮授权时,该按钮被扫描到
-     * @prop {Array} keyMap 绑定快捷键
-     * @prop {String} keyType 绑定快捷键类型,keyType='del'可在keymap.js中修改匹配,keyMap有值时,此无效
-     * @prop {String} hotKeyRange 快捷键的鼠标有效区域
-     * @prop {String} vid 按钮授权时,按钮id,此处可以不指定会根据页面名_title生成
-     */
-    props: {
-      noRoleManage: Boolean, // 设置不受角色控制
-      keyMap: Array,
-      keyType: String,
-      hotKeyRange: {type: String, default: 'hd-com-grid'},
-      vid: String, // 按钮指定id时,授权用不指定默认生成
-      customClass : {
-        type: String
+    nowKeyMap() {
+      if (this.keyMap) {
+        return this.keyMap
+      } else if (this.keyType && this.$keyMap) {
+        //$keyMap是在keymap.js配置的对象
+        return this.$keyMap[this.keyType]
       }
     },
-
-    components: {},
-    created() {
-      if (!this.noRoleManage) {
-        if (this.$route && this.$route.meta.btnRoleCheck) { // 角色管理下激活
-          this.addBtnMetaToParent()
-        }
+    buttonClass() {
+      let classObj = this.classmap.find(
+        (v) => v.name == this.$slots.default[0].text.replace(/\s/g, '')
+      )
+      // console.log(this.$slots.default[0].text.replace(/\s/g,""), classObj, 'buttonClass')
+      // console.log(this.customClass)
+      return classObj
+        ? `${classObj.value} ${this.customClass}`
+        : `hd-bn bn-finished ${this.customClass}`
+    },
+  },
+  methods: {
+    nowText() {
+      if (!this.$slots.default || this.$slots.default.length == 0) {
+        return ''
+      }
+      if (this.$i18n) {
+        // 国际化
+        //去掉2边空格
+        return (
+          this.$t(this.$slots.default[0].text.replace(/(^\s*)|(\s*$)/g, '')) +
+          this.addTextProp
+        )
+      } else {
+        return this.$slots.default[0].text + this.addTextProp
       }
     },
-    mounted() {
-      this.checkRight()
+    addText(text) {
+      // 快捷键自动增加(a)等
+      this.addTextProp = text
     },
-
-    computed: {
-      addTextProp() {
-        if (this.nowKeyMap && this.nowKeyMap.length == 2) {
-          return '(' + this.nowKeyMap[1].toUpperCase() + ')'
-        }
+    getName() {
+      if (!this.$slots.default || this.$slots.default.length == 0) {
         return ''
-      },
-      nowKeyMap() {
-        if (this.keyMap) {
-          return this.keyMap
-        } else if (this.keyType && this.$keyMap) {//$keyMap是在keymap.js配置的对象
-          return this.$keyMap[this.keyType]
-        }
-      },
-      buttonClass() {
-        let classObj = this.classmap.find(v => v.name == this.$slots.default[0].text.replace(/\s/g, ""));
-        // console.log(this.$slots.default[0].text.replace(/\s/g,""), classObj, 'buttonClass')
-        // console.log(this.customClass)
-        return classObj ? `${classObj.value} ${this.customClass}` : `hd-bn bn-finished ${this.customClass}`;
       }
+      return this.$slots.default[0].text.trim()
+    },
+    getClass() {
+      return this.buttonClass
     },
-    methods: {
-      nowText() {
-        if (!this.$slots.default || this.$slots.default.length == 0) {
-          return ''
-        }
-        if (this.$i18n) { // 国际化
-          //去掉2边空格
-          return this.$t(this.$slots.default[0].text.replace(/(^\s*)|(\s*$)/g, "")) + this.addTextProp
-        } else {
-          return this.$slots.default[0].text + this.addTextProp
-        }
-      },
-      addText(text) { // 快捷键自动增加(a)等
-        this.addTextProp = text
-      },
-      getName() {
-        if (!this.$slots.default || this.$slots.default.length == 0) {
-          return ''
-        }
-        return this.$slots.default[0].text.trim()
-      },
-      getClass(){
-        return this.buttonClass
-      },
-      getType(){
-        return 'hdButton'
-      },
-      click(evt) {
-        if (this.$attrs.disabled === undefined || this.$attrs.disabled === false) {
-          this.$refs.elbtn.handleClick(evt)
-        }
+    getType() {
+      return 'hdButton'
+    },
+    click(evt) {
+      if (
+        this.$attrs.disabled === undefined ||
+        this.$attrs.disabled === false
+      ) {
+        this.$refs.elbtn.handleClick(evt)
       }
-    }
-  }
-
+    },
+  },
+}
 </script>

package/src/hdcom/HdComFaceRec.vue

@@ -1,31 +1,78 @@
 <template>
   <el-container>
     <el-main>
-
-      <hd-com-grid ref="grid" :hdQuery="hdQuery" url="/webresources/login/com/ComFaceRec">
+      <hd-com-grid
+        ref="grid"
+        :hdQuery="hdQuery"
+        url="/webresources/login/com/ComFaceRec"
+      >
         <div class="filter-container" slot="query">
-          <el-input @keyup.enter.native="doQuery" style="width: 200px;" class="filter-item" :placeholder="$t('姓名、工号')"
-                    v-model="hdQuery.query.anyQuery">
+          <el-input
+            @keyup.enter.native="doQuery"
+            style="width: 200px"
+            class="filter-item"
+            :placeholder="$t('姓名、工号')"
+            v-model="hdQuery.query.anyQuery"
+          >
           </el-input>
-          <el-button class="filter-item" type="primary" icon="search" @click="$refs.grid.doQuery()"
-                     :keyMap="['alt','q']">{{$t('搜索')}}
+          <el-button
+            class="filter-item"
+            type="primary"
+            :icon="ElIconSearch"
+            @click="$refs.grid.doQuery()"
+            :keyMap="['alt', 'q']"
+            >{{ $t('搜索') }}
           </el-button>
-          <el-button class="filter-item" @click="doUpload" type="primary" icon="edit">{{$t('上传照片')}}
+          <el-button
+            class="filter-item"
+            @click="doUpload"
+            type="primary"
+            :icon="ElIconEdit"
+            >{{ $t('上传照片') }}
           </el-button>
-          <el-button class="filter-item" @click="$refs.faceTest.show()" type="primary">{{$t('识别测试')}}
+          <el-button
+            class="filter-item"
+            @click="$refs.faceTest.show()"
+            type="primary"
+            >{{ $t('识别测试') }}
           </el-button>
-          <el-button class="filter-item" @click="$refs.grid.doRemoveAll()" type="danger" :keyMap="['alt','d']">{{$t('删除')}}
+          <el-button
+            class="filter-item"
+            @click="$refs.grid.doRemoveAll()"
+            type="danger"
+            :keyMap="['alt', 'd']"
+            >{{ $t('删除') }}
           </el-button>
-
         </div>
-        <el-table-column width="100px" align="center" label="操作" fixed="right">
+        <el-table-column
+          width="100px"
+          align="center"
+          label="操作"
+          fixed="right"
+        >
           <template slot-scope="scope">
-            <hd-btn icon="el-icon-delete" hint="删除" @click.stop="$refs.grid.doRemove(scope.row.recId)"></hd-btn>
+            <hd-btn
+              icon="el-icon-delete"
+              hint="删除"
+              @click.stop="$refs.grid.doRemove(scope.row.recId)"
+            ></hd-btn>
           </template>
         </el-table-column>
-        <el-table-column width="100px" align="center" label="姓名" prop="name" sortable>
+        <el-table-column
+          width="100px"
+          align="center"
+          label="姓名"
+          prop="name"
+          sortable
+        >
         </el-table-column>
-        <el-table-column width="100px" align="center" label="工号" prop="workNo" sortable>
+        <el-table-column
+          width="100px"
+          align="center"
+          label="工号"
+          prop="workNo"
+          sortable
+        >
         </el-table-column>
       </hd-com-grid>
     </el-main>
@@ -33,26 +80,27 @@
     <FaceRecTest ref="faceTest"></FaceRecTest>
   </el-container>
 </template>
-<script>
-
-  import FacePicUpload from "./FacePicUpload.vue";
-  import FaceRecTest from "./FaceRecTest.vue";
 
-  export default {
-    components: {FacePicUpload, FaceRecTest},
-    data() {
-      return {
-        hdQuery: new HdQuery(this),
-      }
-    },
+<script>
+import { Search as ElIconSearch, Edit as ElIconEdit } from '@element-plus/icons'
 
-    mounted() {
+import FacePicUpload from './FacePicUpload.vue'
+import FaceRecTest from './FaceRecTest.vue'
 
-    },
-    methods: {
-      doUpload() {
-        this.$refs.upload.show()
-      }
+export default {
+  data() {
+    return {
+      hdQuery: new HdQuery(this),
+      ElIconSearch,
+      ElIconEdit,
     }
-  }
+  },
+  components: { FacePicUpload, FaceRecTest },
+  mounted() {},
+  methods: {
+    doUpload() {
+      this.$refs.upload.show()
+    },
+  },
+}
 </script>