新增：1、qtask-debug结果渲染为表格

2、mdict 存贮到MySQL, meta 业务预览支持字典渲染验证 3、其他交互优化
2024-04-05 00:29:43 +08:00
parent 3bbf78f51c
commit 36a30ba2b3
14 changed files with 300 additions and 98 deletions
--- a/root/metadata/dataList.html
+++ b/root/metadata/dataList.html
@@ -3,12 +3,25 @@
        <h3 class="pull-left">业务预览</h3>
        <div class="col-xs-4 pull-right">
            <div class="input-group">
-                <span class="input-group-btn">
+                <!--<span class="input-group-btn">
                    <button class="btn btn-default" type="button">添加过滤条件</button>
                </span>
                <select class="form-control" v-model="addFilter" style="width: 130px;">
                    <option v-for="f in cfg.filters" :value="f.name" v-show="!f.checked">{{f.label}}</option>
-                </select>
+                </select>-->
+                <div></div>
+                <div class="dropdown dropdown-hover pull-right" style="padding-right: 20px;max-width: 160px;">
+                    <button class="btn" type="button" data-toggle="dropdown">
+                        <i class="icon icon-filter"></i> 过滤条件 <span class="caret"></span></button>
+                    <div class="dropdown-menu dropdown-menu-table" style="padding: 0">
+                        <div class="checkbox" v-for="f in cfg.filters">
+                            <label>
+                                <input type="checkbox" v-model="f.checked" :value="f.name"> {{f.label}}
+                            </label>
+                        </div>
+                    </div>
+                </div>
+

                <span class="input-group-btn">
                <button @click="findList()" class="btn btn-primary" type="button"> 查询</button>
@@ -46,32 +59,46 @@
    <div class="col-xs-2">
        <div style="padding-left: 10px;/*background-color: #ccc;*/width: 100%"> 业务列表(Meta-Service)</div>
        <ul class="nav nav-tabs nav-stacked dlist" style="height: 100%">
-            <li :class="[{'active':service==item.alias}]" v-for="item in services" >
+            <li :class="[{'active':service==item.name}]" v-for="item in services" >
                <a @click="service=item.name" :title="`${item.name}`" v-text="`${item.comment}`" href="javascript:;"></a>
            </li>
        </ul>
    </div>

    <!-- 预览功能 -->
-    <div class="col-xs-10">
-
+    <div class="col-xs-10" style="margin-top: 15px">

        <!-- 过滤条件 -->
-        <div class="col-lg-4 col-xs-6" v-for="(filter,index) in cfg.filters" v-if="filter.checked">
-            <div class="input-group item" style="padding-top: 3px">
-                <span class="input-group-addon" style="max-width: 130px;">{{filter.label}}</span>
-                <select class="form-control" v-model="filter['type']" style="width: 95px;">
+
+        <!--<div class="input-group col-xs-4" v-for="(filter,index) in cfg.filters" v-if="filter.checked">
+            <span class="input-group-addon">{{filter.label}}</span>
+            <select class="form-control input-group-addon">
+                <option>xxx</option>
+                <option>yyy</option>
+            </select>
+            <span class="input-group-addon fix-border fix-padding"></span>
+
+            <input type="text" class="form-control" placeholder="输入电话号码">
+
+            <span class="input-group-addon fix-border fix-padding"></span>
+            <span class="input-group-addon"><i class="icon icon-trash"></i></span>
+        </div>-->
+
+        <div class="col-xs-4" v-for="(filter,index) in cfg.filters" v-if="filter.checked">
+            <div class="input-group " style="padding-top: 3px">
+                <span class="input-group-addon" style="max-width: 100px;">{{filter.label}}</span>
+                <select class="form-control" v-model="filter['type']">
                    <option v-for="(t, i) in filter.filterType" :value="t.name" v-text="t.remark"></option>
                </select>
                <span class="input-group-addon fix-border fix-padding"></span>
                <input v-if="!filter.inType || filter.inType == 'INPUT'" type="text" class="form-control" v-model="filter['value']">
-                <select v-if="filter.inType == 'DICT'" class="form-control" v-model="filter['value']" style="width: 100px">
+                <select v-if="filter.inType == 'DICT'" class="form-control" v-model="filter['value']">
                    <!-- option v-for="(t, index) in filter.filterType" :value="t.name" v-text="t.remark"></option -->
                    <option value=""> 字典值一</option>
                    <option value=""> 字典值二</option>
                </select>

-                <span class="input-group-addon fix-border fix-padding" style="padding: 5px" title="删除过滤条件">
+                <span class="input-group-addon" title="删除过滤条件">
                <a href="javascript:;" @click="filter.checked = false;"><i class="icon icon-trash"></i></a>
            </span>
            </div>
@@ -238,7 +265,7 @@
        return {1:"男",2:"女"}[v] || "未知性别"
    }

-    let {getServiceList, getCfg, getDataList, exportData, dataDel, dataSave} = meta
+    let {getServiceList, getDataList, exportData, dataDel, dataSave} = meta
    let {showOk} = red
    let vm = new Vue({
        el:".data-list",
@@ -259,12 +286,13 @@
            limit: {pn: 1, ps: 20, total: 0},
            order: {col: "", desc: 1},
            pk: "",
-            detailData: {}
+            detailData: {},
+            dictData: {}, // 存放字典数据
        },
        watch: {
            addFilter(v) {
                this.cfg.filters.forEach(function (f) {
-                    if (f.name == v) {
+                    if (f.name === v) {
                        f["checked"] = true;
                        vm.addFilter = "";
                    }
@@ -272,8 +300,7 @@
            },
            service() {
                this.loadCfg(function () {
-                    this.limit = {pn: 1, ps: 20, total: 0};
-                    this.order = {col:"", desc:1};
+                    vm.limit = {pn: 1, ps: 20, total: 0};
                    vm.findList();
                });
            },
@@ -305,7 +332,7 @@
                });
            },
            loadCfg(back) {
-                getCfg({name: this.service}).then(res => {
+                meta.getCfg({name: this.service}).then(res => {
                    // res['type'] = res.filters[0]['name']

                    for (i in res["filters"]) {
@@ -328,6 +355,11 @@
                            })
                        }
                    }
+                    if (fbean['orders'] && fbean['orders'].length > 0) {
+                        this.order = fbean['orders'][0]
+                    } else {
+                        this.order = {col: "", desc: 0};
+                    }

                    if (back) {
                        back();
@@ -337,8 +369,25 @@
            dealFieldFmt(bean, colFmt) { //处理字典数据 及 自定义函数处理数据

                let v = bean[colFmt["col"]]
-                if (colFmt.inType == "DICT") {
+                if (colFmt.inType === "DICT") {
                    // 取字典值返回
+                    let dicttype = colFmt['inExt']
+                    let dictArr = this.dictData[dicttype]
+                    if (!dictArr) {
+                        /*dict.list({type: dicttype}).then(res => {
+                            dictArr = res
+                            this.dictData[dicttype] = res
+                            console.log(res)
+                        })*/
+                        return v
+                    }
+
+                    for (let i in dictArr) {
+                        if (dictArr[i].value + "" === v + "") {
+                            return dictArr[i].label
+                        }
+                    }
+                    return v
                } else if (colFmt.inType == "INPUT_DAY") {
                    return red.timeFmt(new Date(v), 'yyyy-MM-dd')
                } else if (colFmt.inType == "INPUT_TIME") {
@@ -395,8 +444,12 @@
                return str;
            },
            sortEvent(col) {
-                if (vm.order.col == col) {
+                if (vm.order.col === col) {
                    vm.order.desc = -vm.order.desc
+                    // 第一次 1、第二次 -1、第三次点击的时候回到1（这个时候取消排序）
+                    if (vm.order.desc === 1) {
+                        vm.order.col = ''
+                    }
                } else {
                    vm.order.col = col;
                    vm.order.desc = 1;
@@ -487,6 +540,9 @@
        },
        mounted() {
            this.serviceList();
+            dict.list({}).then(res => {
+                this.dictData = res
+            })
        }
    });
 </script>
--- a/root/metadata/metaService.html
+++ b/root/metadata/metaService.html
@@ -10,10 +10,10 @@
    .dropdown-menu-table .table td {
        padding: 0;
    }
-    .dropdown-menu-table .table a {
+    /*.dropdown-menu-table .table a {
        padding: 8px;
        display: block;
-    }
+    }*/
    /*.dropdown-menu-table .table a:hover,
    .dropdown-menu-table .table a:active,
    .dropdown-menu-table .table a:focus {
@@ -160,15 +160,14 @@

    <div class="col-xs-3">
        <div class="base-info"> 业务列表</div>
-        <table class="table">
+        <table class="table table-bordered tlist">
            <tr>
                <th>业务KEY</th>
                <th>业务名称</th>
                <th>操作</th>
            </tr>
-            <tr v-for="item in services" @click="service=item.name;serviceLabel=item.comment;">
+            <tr v-for="item in services" @click="service=item.name;serviceLabel=item.comment;" :class="[{'active': item.name==service}]">
                <td>
-                    <i class="icon icon-ok" v-if="item.name==service" style="color: #7f74c4"></i>
                    {{item.name}}
                </td>
                <td>{{item.comment}}</td>
@@ -227,7 +226,7 @@
                    <td v-show="status=='detail'"><input type="checkbox" v-model="detailArr" :value="sheet + '$' + item.name"></td>
                    <td v-show="status=='edit'"><input type="checkbox" v-model="editArr" :value="sheet + '$' + item.name"></td>

-                    <td v-text="item.name" style="background-color: rgb(235, 235, 228);"></td>
+                    <td v-text="item.name"></td>
                    <td v-text="item.label"></td>
                    <!--<td v-text="item.type"></td>
                    <td v-text="item.inType"></td>
--- a/root/metadata/metatable/metaTable.html
+++ b/root/metadata/metatable/metaTable.html
@@ -94,7 +94,7 @@

            <div class="base-info"> 字段信息</div>
            <table :class="[{'table':status!=2},'table-bordered']">
-                <tr style="background-color: #f1f1f1">
+                <tr>
                    <td v-show="status==3 || status==4 || status==5 || status==6"><input type="checkbox"></td>
                    <th v-show="status==1"></th>
                    <th>列名</th>
@@ -109,7 +109,7 @@
                </tr>
                <tr v-for="(item, index) in meta.items" class="item">
                    <td v-show="status==1" class="icon icon-move"></td>
-                    <td v-show="status!=2" v-text="item.name" style="background-color: rgb(235, 235, 228);"></td>
+                    <td v-show="status!=2" v-text="item.name"></td>
                    <td v-show="status!=2" v-text="item.label"></td>
                    <td v-show="status!=2" v-text="item.type"></td>
                    <!--