hd-idevvue3 3.0.0 → 3.0.1

package/src/hdcom/FacePicUpload.vue

@@ -0,0 +1,71 @@
+<template>
+  <el-dialog title="文件上传" :visible.sync="visible" append-to-body width="450px">
+    <el-upload
+      style="min-height:300px;width:400px"
+      ref="upload"
+      :action="upUrl"
+      :on-preview="handlePreview"
+      :on-remove="handleRemove"
+      :on-success="onUpSuccess"
+      :before-remove="beforeRemove"
+      :file-list="fileList"
+      multiple
+      :auto-upload="false">
+      <el-button slot="trigger" type="primary" v-if="canEdit">{{$t('选取文件')}}</el-button>
+      <el-button style="margin-left: 10px;" type="success" @click="submitUpload" v-if="canEdit">{{$t('上传到服务器')}}</el-button>
+
+      <div slot="tip" class="el-upload__tip"></div>
+    </el-upload>
+  </el-dialog>
+</template>
+
+<script>
+  /**
+   * 文件上传 包括上传和下载后台idev8入口为comfileupload
+   * @module HdFileUpload
+   */
+
+  export default {
+    components: {},
+    name: 'FacePicUpload',
+    data() {
+      return {
+        upUrl: '/webresources/login/com/ComFaceRec/upload',
+        visible: false,
+        fileDownVisible: false,
+        fileList: [],
+        entityId: '',
+        entityName: '',
+        canEdit: true
+      }
+    },
+    mounted() {
+    },
+    methods: {
+      /**
+       * @method open
+       * @param entityName 区分名
+       * @param entityId 区分id
+       * @param canEdit 是否可编辑
+       */
+      show() {
+        this.visible = true
+      },
+      submitUpload() {
+        this.$refs.upload.submit()
+      },
+      onUpSuccess(response, file, fileList) {
+        file.uploadId = response.message
+      },
+      beforeRemove(file, fileList) {
+
+      },
+      handleRemove(file, fileList) {
+
+      },
+      handlePreview(file) {
+        return false
+      }
+    }
+  }
+</script>

package/src/hdcom/FaceRecTest.vue

@@ -0,0 +1,104 @@
+<template>
+  <el-dialog title="识别测试" :visible.sync="visible" append-to-body width="90%" top="5vh">
+    <el-container style="height:500px">
+      <el-aside width="50%">
+        <video ref="video" width="400" height="400" autoplay></video>
+      </el-aside>
+      <el-main>
+        <canvas ref='canvas' width="400" height="300"></canvas>
+        <div>{{$t('识别结果') + '(' + $t('耗时') + timeSpend + ')'}}</div>
+        <table v-for="tab in recRs" style="border:1px solid #0094ff; ">
+          <td>{{$t('name')}}</td>
+          <td>{{$t('工号')}}</td>
+          <td>{{$t('差值')}}</td>
+          <tr v-for="intab in tab">
+            <td>{{intab.name}}</td>
+            <td>{{intab.workNo}}</td>
+            <td>{{intab.compareRs}}</td>
+          </tr>
+        </table>
+      </el-main>
+    </el-container>
+  </el-dialog>
+</template>
+<script>
+  export default {
+    components: {},
+    data() {
+      return {
+        video: null,
+        visible: false,
+        timeHandle: null,
+        recRs: [],
+        timeSpend: 0
+      }
+    },
+
+    mounted() {
+
+    },
+    methods: {
+      show() {
+        this.visible = true
+      },
+      init() {
+        navigator.webkitGetUserMedia({
+          video: true
+        }, this.success, this.error);
+        this.$nextTick(() => {
+          this.video = this.$refs.video
+          this.capAndReg()
+        })
+      },
+      success(stream) {
+        this.video.src = window.URL.createObjectURL(stream);
+        this.video.play();
+      },
+      error(err) {
+        alert('video error: ' + err)
+      },
+      capAndReg() {
+        let nowStart = new Date().getTime()
+        console.info('shot...')
+        this.$refs.canvas.getContext('2d').drawImage(this.video, 0, 0, 400, 300);
+        let pic = this.$refs.canvas.toDataURL("image/jpg");
+//对其进行base64编 之后的字符串
+        pic = pic.replace(/^data:image\/(png|jpg);base64,/, "")
+        this.$http.post('/webresources/login/com/ComFaceRec/faceRec', {"imageData": pic}).then(response => {
+          if (!response.data || !response.data.data) {
+            this.recRs = []
+            this.capAndReg()
+            return false
+          }
+          console.info(response.data.data)
+          this.recRs = response.data.data
+//          for (let i = 0; i < data.length; i++) {
+//            let onePerReg = []
+//            for (let j = 0; j < data[i].length; j++) {
+//              let onePer = data[i][j]
+//              let one = {name: onePer.name, score: onePer.compareRs, workNo: onePer.workNo}
+//              onePerReg.push(one)
+//            }
+//            this.recRs.push(onePerReg)
+//          }
+          if (this.visible)
+            this.capAndReg()
+          this.timeSpend = (new Date().getTime() - nowStart) / 1000+ this.$t("秒")
+        }).catch(() => {
+          this.recRs = []
+          if (this.visible)
+            this.capAndReg()
+        })
+
+      }
+    },
+    watch: {
+      visible(nowVal) {
+        if (nowVal) {
+          this.init()
+        } else {
+        }
+      }
+    }
+  }
+</script>

package/src/hdcom/GridChart.vue

@@ -0,0 +1,194 @@
+<template>
+  <el-dialog title="统计展示" :visible.sync="visible" width='80%' append-to-body top="2vh">
+    {{$t('展示标签列')}}
+    <hd-drop style="width: 200px" ref="labelDrop" v-model="hdQuery.query._chartLabel"></hd-drop>
+    <span>{{$t('对应的值列')}}
+       <hd-drop style="width: 200px" ref="valDrop" v-model="hdQuery.query._chartValue"></hd-drop>
+    </span>
+    <el-button @click="doQuery">{{$t('统计')}}</el-button>
+    <el-row>
+      <el-col :span="12">
+        <div ref="mychart" style="height:60vh"></div>
+      </el-col>
+      <el-col :span="12">
+        <div ref="mychart2" style="height:60vh"></div>
+      </el-col>
+      <el-col :span="12">
+        <div ref="mychart3" style="height:60vh"></div>
+      </el-col>
+      <el-col :span="12">
+        <div ref="mychart4" style="height:60vh"></div>
+      </el-col>
+    </el-row>
+  </el-dialog>
+</template>
+
+<script>
+  import HdDrop from "./HdDrop.vue";
+
+  export default {
+    components: {
+      HdDrop
+    },
+    name: "GridChart",
+    props: ['allColumn', 'url', 'hdQuery'],
+    data() {
+      return {
+        visible: false
+      }
+    },
+    mounted() {
+
+    },
+    methods: {
+      show() {
+        this.visible = true
+        this.genDrop()
+
+      },
+      genDrop() {
+        let labelDrop = []
+        let numDrop = [{name: this.$t('只统计数量'), code: '_chartNumOnly'}]
+        for (let i = 0; i < this.allColumn.length; i++) {
+          let oneCol = this.allColumn[i]
+          let one = {name: oneCol.$attrs.label, code: oneCol.$attrs.prop}
+          labelDrop.push(one)
+          if (oneCol.$attrs.chartNum != undefined) {
+            numDrop.push(one)
+          }
+        }
+        this.$nextTick(function () {//hddrop 为了查询和展示不同,增加了backUpArr
+          this.$refs.labelDrop.options = labelDrop
+          this.$refs.labelDrop.backUpArr = labelDrop
+          this.$refs.valDrop.options = numDrop
+          this.$refs.valDrop.backUpArr = numDrop
+        })
+      },
+      doQuery() {
+        if (!this.hdQuery.query._chartLabel || !this.hdQuery.query._chartValue) {
+          this.$message({
+            type: 'error',
+            showClose: true,
+            duration: 1500,
+            message: '请选择统计的标签和值'
+          })
+          return false
+        }
+        const copyQuery = new HdQuery(this)
+        Object.assign(copyQuery, this.hdQuery)
+        copyQuery.rows = null //去掉分页
+        copyQuery.sort = null//去掉排序
+        this.$http.post(this.url, copyQuery).then(response => {
+          let allLabel = []
+          let allVal = []
+          let hdResult = response.data
+          for (let i = 0; i < hdResult.length; i++) {
+            allLabel.push(hdResult[i].name)
+            allVal.push(hdResult[i].value)
+          }
+          this.initChart(allLabel, allVal)
+          this.initPip(allLabel, hdResult)
+          this.initBar(allLabel, allVal)
+          this.initCircle(allLabel, hdResult)
+        })
+      },
+      initChart(allLabel, allVal) {
+        let chart = echarts.init(this.$refs.mychart)
+        let option = {
+          xAxis: {
+            type: 'category',
+            data: allLabel
+          },
+          yAxis: {
+            type: 'value'
+          },
+          series: [{
+            data: allVal,
+            type: 'line'
+          }]
+        };
+        chart.setOption(option)
+      },
+      initPip(allLabel, hdResult) {
+        let pip = echarts.init(this.$refs.mychart2)
+        let option = {
+          legend: {
+            bottom: 0,
+            data: allLabel
+          },
+          series: [
+            {
+              type: 'pie',
+              selectedMode: 'single',
+              data: hdResult
+            }
+          ]
+        };
+        pip.setOption(option)
+      },
+      initBar(allLabel, allVal) {
+        let chart = echarts.init(this.$refs.mychart3)
+        let option = {
+          xAxis: {
+            type: 'category',
+            data: allLabel
+          },
+          yAxis: {
+            type: 'value'
+          },
+          series: [{
+            data: allVal,
+            type: 'bar'
+          }]
+        };
+        chart.setOption(option)
+      },
+      initCircle(allLabel, allVal) {
+        let chart = echarts.init(this.$refs.mychart4)
+        let option = {
+          tooltip: {
+            trigger: 'item',
+            formatter: "{a} <br/>{b}: {c} ({d}%)"
+          },
+          legend: {
+            orient: 'vertical',
+            x: 'left',
+            data: allLabel
+          },
+          series: [
+            {
+              type: 'pie',
+              radius: ['50%', '70%'],
+              avoidLabelOverlap: false,
+              label: {
+                normal: {
+                  show: false,
+                  position: 'center'
+                },
+                emphasis: {
+                  show: true,
+                  textStyle: {
+                    fontSize: '30',
+                    fontWeight: 'bold'
+                  }
+                }
+              },
+              labelLine: {
+                normal: {
+                  show: false
+                }
+              },
+              data: allVal
+            }
+          ]
+        };
+
+        chart.setOption(option)
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

package/src/hdcom/GridExField.vue

@@ -0,0 +1,281 @@
+<template>
+  <el-dialog title="扩展字段设置" :visible.sync="visible" width='65%' append-to-body top="2vh">
+    <el-container style="height: 80vh; border: 1px solid #eee">
+      <el-main class="gridShow">
+        <hd-com-grid ref="grid" :hdQuery="hdQuery" url="/webresources/login/tech/ComExFieldCustom" not-init no-sets
+                     ck-hide no-sort index-hide :hd-btn-tool="false"
+                     rec-hide page-hide :default-sort="{prop: 'sortNo', order: 'ascending'}">
+
+          <!--  <div class="filter-container" slot="query">
+              &lt;!&ndash;     <el-input @keyup.enter.native="$refs.grid.doQuery()" style="width: 200px;" class="filter-item"
+                             placeholder="名称"
+                             v-model="hdQuery.query.anyQuery">
+                   </el-input>
+                   <el-button class="filter-item" @click="$refs.grid.doQuery()" icon="search" type="primary" ref="q"
+                              keyType="query">搜索
+                   </el-button>&ndash;&gt;
+              <el-button class="filter-item" type="primary" @click="doAdd()" icon="edit" ref="a"
+                         keyType="add">新增
+              </el-button>
+            </div>-->
+
+          <!-- <el-table-column width="60px" align="center" label="操作" fixed="right">
+             <template slot-scope="scope">
+               <hd-btn icon="el-icon-edit" hint="编辑" @click.stop="$refs.grid.doEdit(scope.row)"
+                       v-if="!scope.row.isEdit">
+               </hd-btn>
+               <hd-btn hint="撤销" @click.stop="$refs.grid.doCancel(scope.row)" v-if="scope.row.isEdit">
+                 <svg-icon icon-class="undo"/>
+               </hd-btn>
+               <hd-btn icon="el-icon-check" hint="保存" @click.stop="$refs.grid.doSave(scope.row)" v-if="scope.row.isEdit">
+               </hd-btn>
+             </template>
+           </el-table-column>
+ -->
+          <el-table-column width="100px" align="center" label="是否使用" prop="useFlg" sortable :rules="$r(0,0,50)"
+                           input="el-switch" :inputProp='{activeValue:"1", inactiveValue:"0"}' :inputFormat='$ckFt'>
+          </el-table-column>
+
+          <!-- <el-table-column width="100px" align="center" label="表名" prop="tableName" sortable
+                            :rules="$r(1,0,50)" no-edit>
+           </el-table-column>
+           <el-table-column width="100px" align="center" label="字段名" prop="columnName" sortable
+                            :rules="$r(1,0,50)" no-edit>
+           </el-table-column>-->
+          <el-table-column width="100px" align="center" label="字段注解" prop="columnComment"
+                           :rules="$r(1,0,50)">
+          </el-table-column>
+          <el-table-column width="100px" align="center" label="字段类型" prop="columnType"
+                           :rules="$r(1)" input="HdDrop" :inputProp="{ field:'IDV_COLUMN_TYPE'}"
+                           @change="columnTypeChange">
+          </el-table-column>
+          <el-table-column width="110px" align="center" label="格式/代码" prop="formatter"
+                           :rules="$r(1)">
+            <template slot-scope="scope">
+                <!--noEdit不允许编辑-->
+                <template v-if="scope.row.isEdit">
+                  <template v-if="scope.row.columnType == 'DROP'">
+                    <sel-grid-fieldcode :gridRow="scope.row" :txtVal.sync="scope.row['formatter']"
+                                        :idVal.sync="scope.row['formatter']" @blur="checkErr(scope.row)"
+                                        style="width: 100%;" v-model="scope.row['formatter']"></sel-grid-fieldcode>
+                  </template>
+                  <template v-else-if="scope.row.columnType == 'NUMBER'">
+                    <HdDrop :gridRow="scope.row" :txtVal.sync="scope.row['formatterStr']"
+                            :idVal.sync="scope.row['formatter']" @blur="checkErr(scope.row)"
+                            style="width: 100%;" field="IDV_NUMBER_FORMATTER"
+                            v-model="scope.row['formatter']"></HdDrop>
+                  </template>
+                  <template v-else-if="scope.row.columnType == 'DATE'">
+                    <HdDrop :gridRow="scope.row" :txtVal.sync="scope.row['formatterStr']"
+                            :idVal.sync="scope.row['formatter']" @blur="checkErr(scope.row)"
+                            style="width: 100%;" field="IDV_DATE_FORMATTER"
+                            v-model="scope.row['formatter']"></HdDrop>
+                  </template>
+                  <template v-else>
+                  </template>
+                </template>
+            </template>
+          </el-table-column>
+          <el-table-column width="100px" align="center" label="是否必填" prop="columnRequire"
+                           input="el-switch" :inputProp="{'active-value':1, 'inactive-value':0}" :inputFormat='$ckFt'>
+          </el-table-column>
+          <el-table-column width="100px" align="center" label="最大长度" prop="columnLen"
+                           :rules="$r(1, 0, 255, 'number')" input="HdNum">
+          </el-table-column>
+          <!--     <el-table-column width="100px" align="center" label="比例" prop="columnScale" sortable
+                                :rules="$r(0, 'number', 0, 255)" input="HdNum">
+               </el-table-column>
+               <el-table-column width="100px" align="center" label="默认值" prop="columnDefaultValue" sortable
+                                :rules="$r(0,0,50)">
+               </el-table-column>
+
+               <el-table-column width="100px" align="center" label="编码" prop="gridCode" sortable :rules="$r(1,0,50)" no-edit>
+               </el-table-column>-->
+          <el-table-column width="100px" align="center" label="表格宽度" prop="formSpan"
+                           :rules="$r(1)" input="HdDrop" :inputProp="{field:'IDV_FORM_SPAN'}"
+          >
+          </el-table-column>
+          <!--          <el-table-column width="100px" align="center" label="表单高度" prop="formXs" sortable
+                                     :rules="$r(1, 'number', 0, 1024)" input="HdNum">
+                    </el-table-column>-->
+   <!--       <el-table-column width="100px" align="center" label="列表宽度" prop="gridWidth"
+                           :rules="$r(0, 0, 9999, 'number')" input="HdNum">
+          </el-table-column>-->
+          <!-- <el-table-column width="100px" align="center" label="默认值" prop="defaultValue" sortable :rules="$r(0,0,50)">
+           </el-table-column>
+           <el-table-column width="100px" align="center" label="描述" prop="placeHolder" sortable :rules="$r(0,0,50)">
+           </el-table-column>
+           <el-table-column width="100px" align="center" label="规则" prop="rules" sortable :rules="$r(1,0,50)">
+           </el-table-column>-->
+          <el-table-column align="center" label="排序" width="80px" noQuery>
+            <template slot-scope="scope">
+              <svg-icon class='drag-handler' icon-class="drag"></svg-icon>
+            </template>
+          </el-table-column>
+        </hd-com-grid>
+      </el-main>
+    </el-container>
+    <div slot="footer" class="dialog-footer">
+      <!--    <el-button class="filter-item" type="primary" @click="doAdd()" icon="edit" ref="a"
+                     keyType="add">新增
+          </el-button>-->
+      <el-button @click="visible = false">{{$t('取 消')}}</el-button>
+      <el-button type="primary" @click="submit" :loading="loading"> {{$t('确 定')}}</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+    import Sortable from 'sortablejs'
+    import SelGridFieldcode from "./HdSel/SelGridFieldcod";
+
+    export default {
+        name: 'gridexfield',
+        components: {SelGridFieldcode},
+        props: {
+            table: String,
+            columnList: Array,
+            gridCode: String
+        },
+        data() {
+            return {
+                hdQuery: new HdQuery(this),
+                visible: false,
+                loading: false,
+                list: [],
+            }
+        },
+        mounted() {
+            this.init();
+        },
+        methods: {
+            init(exField) {
+                this.hdQuery.query.tableName = this.table;
+                this.hdQuery.query.columnList = this.columnList;
+                this.hdQuery.query.gridCode = this.gridCode;
+                this.hdQuery.sort = 'sortNo';
+                this.hdQuery.order = 'asc';
+
+                this.$http.post('/webresources/login/tech/ComExFieldCustom/find', this.hdQuery).then(response => {
+                    this.list = response.data.rows;
+
+                    if(this.columnList) {
+                        this.columnList.forEach(column => {
+                            if (!response.data.rows.some(row => {
+                                return row.columnName == column
+                            })) {
+                                this.list.unshift({
+                                    columnName: column,
+                                    tableName: this.table,
+                                    formXs: '20',
+                                    formSpan: '12',
+                                    isEdit: true
+                                })
+                            }
+                        })
+                    }
+
+                    let i = 0;
+                    this.list.forEach(row => {
+                        row.isEdit = true;
+                        row.sortNo = i++
+                        row.formSpan = row.formSpan + "";
+                    });
+                    this.$refs.grid.doQuery({rows: this.list})
+
+                    this.$nextTick(() => {
+                        this.setSort()
+                    })
+                })
+
+            },
+            show() {
+                this.visible = true
+
+                this.list.forEach(row => {
+                    row.isEdit = true;
+                });
+            },
+            setSort() {
+                const elAll = document.querySelectorAll('.gridShow .el-table__body-wrapper > table > tbody')
+                for (let i = 0; i < elAll.length; i++) {
+                    const el = elAll[i]
+                    this.sortable = Sortable.create(el, {
+                        ghostClass: 'sortable-ghost', // Class name for the drop placeholder,
+                        onEnd: evt => {
+                            // this.list.forEach(row => console.log(row.columnComment, row.sortNo))
+                            // console.log('----------------------------------')
+                            // console.log(evt)
+                            // console.log('----------------------------------')
+
+                            this.list.forEach(row => {
+                                if (row.sortNo == evt.oldIndex) {
+                                    row.sortNo = evt.newIndex
+                                } else if (evt.newIndex > evt.oldIndex && row.sortNo <= evt.newIndex && row.sortNo > evt.oldIndex) {
+                                    row.sortNo = row.sortNo - 1
+                                } else if (evt.newIndex < evt.oldIndex && row.sortNo >= evt.newIndex && row.sortNo < evt.oldIndex) {
+                                    row.sortNo = row.sortNo + 1
+                                }
+                            })
+
+                            // this.list.forEach(row => console.log(row.columnComment, row.sortNo))
+                        }
+                    })
+                }
+            },
+            doAdd() {
+                let emptyColumn = this.getEmptyColumn();
+                if (emptyColumn == null) {
+                    this.$message({
+                        message: "没有剩余的扩展字段"
+                    })
+                    return;
+                }
+                let exField = {
+                    gridCode: this.gridCode,
+                    tableName: this.table,
+                    columnName: emptyColumn,
+                    formXs: 12,
+                    formSpan: '20',
+                    isEdit: true
+                }
+                this.$refs.grid.doEdit('', exField)
+            },
+            submit() {
+                this.list.forEach(row => {
+                    if (!row.columnComment || !row.columnType) {
+                        row.isEdit = false;
+                    }
+                    row.gridCode = this.gridCode;
+                });
+
+                this.$refs.grid.doSaveAll().then(v => {
+                    this.visible = false;
+                    this.$emit('save-ok')
+                }).catch(e => {
+                    this.$message({
+                        message: "填写有误"
+                    })
+                });
+            },
+            getEmptyColumn() {
+                let emptyColumns = this.columnList.filter(column => {
+                    return !this.list.some(row => {
+                        return row.columnName == column;
+                    })
+                })
+                return emptyColumns.length > 0 ? emptyColumns[0] : null;
+            },
+            columnTypeChange(v, row) {
+                if (row.exColumnId) {
+                    this.$message({type: 'warning', message: this.$t('修改类型可能回造成数据混乱或丢失， 请慎重！')});
+                }
+                if(row.columnType == 'VARCHAR' || row.columnType == 'BOOLEAN') {
+                    row.formatter = 'x';
+                }
+            },
+        }
+    }
+</script>
+
+<style scoped>
+</style>