改造日志管理及鉴权行为统计页面

src/components/search-bar/index.vue

@@ -34,10 +34,11 @@
             range-separator="至"
             start-placeholder="开始日期"
             end-placeholder="结束日期"
-            clearable
+            :clearable="item.clearable === false ? false : true"
             :value-format="item.valueFormat || 'yyyy-MM-dd HH:mm:ss'"
             :unlink-panels="true"
             :default-time="['00:00:00', '23:59:59']"
+            v-bind="item.attr"
           >
           </dg-date-picker>
         </template>

src/pages/common/new-table/index.vue

@@ -13,7 +13,7 @@
       :data="data"
       border
       :row-key="rowKey"
-      :lazy="lazy"
+      :lazyLoad="lazyLoad"
       :load="load"
       :before-quest="handleBeforeQuest"
       :before-search="handleBeforeSearch"
@@ -65,7 +65,7 @@ export default {
       type: Object,
       default: () => {}
     },
-    lazy: {
+    lazyLoad: {
       type: Boolean,
       default: false
     },
@@ -128,6 +128,7 @@ export default {
         }
       }
       conditions.searchCondition = JSON.stringify(result);
+      conditions.sort = JSON.stringify(this.sortProps);
       return conditions;
     },
 

src/pages/log-manage/DataConfig.js

@@ -14,13 +14,13 @@ const earlyWarningPlanTable = [{
     label: "创建时间",
     prop: "createTime",
     timestamp: true,
-    format: "YYYY-MM-DD HH:mm:ss"
+    dateFormat: "YYYY-MM-DD HH:mm:ss"
   },
   {
     label: "修改时间",
     prop: "updateTime",
     timestamp: true,
-    format: "YYYY-MM-DD HH:mm:ss"
+    dateFormat: "YYYY-MM-DD HH:mm:ss"
   },
   {
     label: "预警数量",
@@ -81,13 +81,13 @@ const RiskDetectionPlan = [{
     label: "创建时间",
     prop: "createTime",
     timestamp: true,
-    format: "YYYY-MM-DD HH:mm:ss"
+    dateFormat: "YYYY-MM-DD HH:mm:ss"
   },
   {
     label: "修改时间",
     prop: "updateTime",
     timestamp: true,
-    format: "YYYY-MM-DD HH:mm:ss"
+    dateFormat: "YYYY-MM-DD HH:mm:ss"
   },
   {
     label: "风险数量",
@@ -118,7 +118,7 @@ const EarlyWarningInfo = [{
     label: "预警时间",
     prop: "createTime",
     timestamp: true,
-    format: "YYYY-MM-DD HH:mm:ss"
+    dateFormat: "YYYY-MM-DD HH:mm:ss"
   },
   {
     label: "预警信息",

src/pages/log-manage/auth-behavior-statistic/index.vue

@@ -4,83 +4,63 @@
 @Date: 2021-05-28 08:51
 -->
 <template>
-    <div>
-        <!-- 搜索项 -->
-        <el-form ref="ruleForm" inline :model="form">
-            <el-form-item label="鉴权时间">
-                <dg-date-picker
-                    v-model="form.createTime.value"
-                    type="daterange"
-                    range-separator="至"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"
-                    clearable
-                    value-format="yyyyMMddHHmmss"
-                    :unlink-panels="true"
-                    :default-time="['00:00:00', '23:59:59']"
-                >
-                </dg-date-picker>
-            </el-form-item>
-            <el-form-item>
-                <dg-button type="primary" @click="handleSearch" icon="el-icon-search">查询</dg-button>
-                <!-- <dg-button type="primary" @click="handleReset" icon="el-icon-refresh-right">重置</dg-button> -->
-            </el-form-item>
-        </el-form>
-        <!-- 表格 -->
-        <Table ref="myTable" :url="authServiceLogStatisticsTableUrl" :headerData="authBehaviorStatisticTableHeader" :condition="form">
-        </Table>
-    </div>
+  <div>
+    <!-- 搜索项 -->
+    <search-bar ref="searchbar" :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
+    <!-- 表格 -->
+    <new-table
+      ref="table"
+      :tableUrl="authServiceLogStatisticsTableUrl"
+      :tableHeader="authBehaviorStatisticTableHeader"
+      :condition="condition"
+      :lazyLoad="true"
+    >
+    </new-table>
+  </div>
 </template>
 
 <script>
-import Table from "@/pages/common/table";
-import { authBehaviorStatisticTableHeader } from "../permiss-log-manage/DataConfig";
-import { authServiceLogStatisticsTableUrl } from "@/api/permiss-log-manage";
+import newTable from '@/pages/common/new-table';
+import { authBehaviorStatisticTableHeader } from '../permiss-log-manage/DataConfig';
+import { authServiceLogStatisticsTableUrl } from '@/api/permiss-log-manage';
+import searchBar from '@/components/search-bar';
+import { searchOpt } from '@/mixins/page-opt';
 export default {
-    components: {
-        Table
-    },
-    data() {
-        return {
-            authServiceLogStatisticsTableUrl,
-            authBehaviorStatisticTableHeader,
-            form: {
-                createTime: {
-                    value: "",
-                    op: "between",
-                    type: "DATE",
-                    format: "yyyyMMddHHmmss"
-                }
-            }
-        };
-    },
-    computed: {},
-    methods: {
-        /**
-         * 查询
-         */
-        handleSearch() {
-            if(!this.form.createTime.value) {
-               this.$message.warning("鉴权时间不能为空");
-               return;
-            }
-            this.$refs.myTable.handleSearchClick();
-        },
-        /**
-         * 重置
-         */
-        handleReset() {
-            for (const key in this.form) {
-                this.form[key].value = "";
-            }
+  components: {
+    newTable,
+    searchBar
+  },
+  mixins: [searchOpt],
+  data() {
+    return {
+      authServiceLogStatisticsTableUrl,
+      authBehaviorStatisticTableHeader,
+      conditionForm: [
+        {
+          label: '鉴权时间',
+          name: 'createTime',
+          op: 'between',
+          type: 'DATE',
+          value: '',
+          valueFormat: 'yyyyMMddHHmmss',
+          component: 'DgDatePicker',
+          clearable: false
         }
-    },
-    created() {
-         const startTime = this.$moment().subtract("1", "year").format("YYYYMMDDHHmmss");
-        const endTime = this.$moment().format("YYYYMMDDHHmmss");
-        this.form.createTime.value = [startTime, endTime];
-    },
-    mounted() {}
+      ]
+    };
+  },
+  computed: {},
+  methods: {},
+  created() {
+    const startTime = this.$moment().subtract('1', 'year').format('YYYYMMDDHHmmss');
+    const endTime = this.$moment().format('YYYYMMDDHHmmss');
+    this.conditionForm[0].value = [startTime, endTime];
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.$refs.searchbar.handleSearch();
+    });
+  }
 };
 </script>
 

src/pages/log-manage/permiss-log-manage/DataConfig.js

@@ -33,7 +33,7 @@ export const authManageLogTableHeader = [
         label: "处理时间",
         prop: "createTime",
         timestamp: true,
-        format: "YYYY-MM-DD HH:mm:ss"
+        dateFormat: "YYYY-MM-DD HH:mm:ss"
     },
     {
         label: "状态",
@@ -64,7 +64,7 @@ export const authServiceLogTableHeader = [
         label: "鉴权时间",
         prop: "createTime",
         timestamp: true,
-        format: "YYYY-MM-DD HH:mm:ss"
+        dateFormat: "YYYY-MM-DD HH:mm:ss"
     },
     {
         label: "终端标识",
@@ -100,7 +100,7 @@ export const authRiskLogTableHeader = [
         label: "风险发生时间",
         prop: "createTime",
         timestamp: true,
-        format: "YYYY-MM-DD HH:mm:ss"
+        dateFormat: "YYYY-MM-DD HH:mm:ss"
     },
     {
         label: "风险类型",

src/pages/log-manage/permiss-log-manage/auth-manage-log.vue

@@ -4,126 +4,111 @@
 @Date: 2021-05-27 11:29
 -->
 <template>
-    <div>
-        <!-- 搜索项 -->
-        <el-form ref="ruleForm" inline :model="form">
-            <el-form-item label="授权管理类型">
-                <dg-select v-model="form.authorizeType.value" placeholder="请选择授权管理类型" enum="AuthorizeTypeEnum" clearable>
-                </dg-select>
-            </el-form-item>
-            <el-form-item label="处理时间">
-                <dg-date-picker
-                    v-model="form.createTime.value"
-                    type="daterange"
-                    range-separator="至"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"
-                    clearable
-                    value-format="yyyyMMddHHmmss"
-                    :unlink-panels="true"
-                    :default-time="['00:00:00', '23:59:59']"
-                >
-                </dg-date-picker>
-            </el-form-item>
-            <el-form-item label="权限处理者">
-                <el-input v-model="form.authorizeHandlerNames.value" placeholder="请输入权限处理者" clearable></el-input>
-            </el-form-item>
-            <el-form-item>
-                <dg-button type="primary" @click="handleSearch" icon="el-icon-search">查询</dg-button>
-                <dg-button type="primary" @click="handleReset" icon="el-icon-refresh-right">重置</dg-button>
-            </el-form-item>
-        </el-form>
-        <!-- 表格 -->
-        <Table ref="myTable" :url="authManageLogTableUrl" :headerData="authManageLogTableHeader" :condition="form" :sort="sort">
-            <dg-table-column label="操作" align="center">
-                <template slot-scope="scope">
-                    <div class="u-table__operation">
-                        <el-tooltip content="详情" effect="dark" placement="top-end">
-                            <i class="el-icon-document" @click="handleViewDetail(scope.row)"></i>
-                        </el-tooltip>
-                    </div>
-                </template>
-            </dg-table-column>
-        </Table>
-    </div>
+  <div>
+    <!-- 搜索项 -->
+    <search-bar ref="searchbar" :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
+    <!-- 表格 -->
+    <new-table
+      ref="table"
+      :tableUrl="authManageLogTableUrl"
+      :tableHeader="authManageLogTableHeader"
+      :condition="condition"
+      :sortProps="sort"
+      :lazyLoad="true"
+    >
+      <dg-table-column label="操作" align="center">
+        <template slot-scope="scope">
+          <div class="u-table__operation">
+            <el-tooltip content="详情" effect="dark" placement="top-end">
+              <i class="el-icon-document" @click="handleViewDetail(scope.row)"></i>
+            </el-tooltip>
+          </div>
+        </template>
+      </dg-table-column>
+    </new-table>
+  </div>
 </template>
 
 <script>
-import Table from "@/pages/common/table";
-import detail from "./log-detail/auth-manage";
-import { authManageLogTableHeader } from "./DataConfig";
-import { authManageLogTableUrl } from "@/api/permiss-log-manage";
+import newTable from '@/pages/common/new-table';
+import detail from './log-detail/auth-manage';
+import { authManageLogTableHeader } from './DataConfig';
+import { authManageLogTableUrl } from '@/api/permiss-log-manage';
+import searchBar from '@/components/search-bar';
+import { searchOpt } from '@/mixins/page-opt';
 export default {
-    components: {
-        Table
-    },
-    data() {
-        return {
-            authManageLogTableUrl,
-            authManageLogTableHeader,
-            form: {
-                authorizeType: {
-                    value: "",
-                    op: "="
-                },
-                authorizeHandlerNames: {
-                    value: "",
-                    op: "like"
-                },
-                createTime: {
-                    value: "",
-                    op: "between",
-                    type: "DATE",
-                    format: "yyyyMMddHHmmss"
-                }
-            },
-            sort: {
-                createTime: "DESC" 
-            }
-        };
-    },
-    computed: {},
-    methods: {
-        /**
-         *  详情
-         */
-        handleViewDetail(row) {
-            const layer = this.$dgLayer({
-                title: `详情`,
-                shade: [0.4, "#FFF"],
-                content: detail,
-                props: {
-                    id: row.id
-                },
-                on: {
-                    success() {
-                        layer.close(layer.dialogIndex);
-                    }
-                },
-                area: ["900px", "800px"]
-            });
+  components: {
+    newTable,
+    searchBar
+  },
+  mixins: [searchOpt],
+  data() {
+    return {
+      authManageLogTableUrl,
+      authManageLogTableHeader,
+      conditionForm: [
+        {
+          label: '授权管理类型',
+          name: 'authorizeType',
+          op: '=',
+          component: 'DgSelect',
+          attr: {
+            enum: 'AuthorizeTypeEnum'
+          }
         },
-        /**
-         * 查询
-         */
-        handleSearch() {
-            this.$refs.myTable.handleSearchClick();
+        {
+          label: '处理时间',
+          name: 'createTime',
+          op: 'between',
+          type: 'DATE',
+          value: '',
+          valueFormat: 'yyyyMMddHHmmss',
+          component: 'DgDatePicker',
         },
-        /**
-         * 重置
-         */
-        handleReset() {
-            for (const key in this.form) {
-                this.form[key].value = "";
-            }
+        {
+          label: '权限处理者',
+          name: 'authorizeHandlerNames',
+          op: 'like',
+          component: 'ElInput'
         }
-    },
-    created() {
-        const startTime = this.$moment().subtract("1", "year").format("YYYYMMDD")+"000000";
-        const endTime = this.$moment().format("YYYYMMDD")+"235959";
-        this.form.createTime.value = [startTime, endTime];
-    },
-    mounted() {}
+      ],
+      sort: {
+        createTime: 'DESC'
+      }
+    };
+  },
+  computed: {},
+  methods: {
+    /**
+     *  详情
+     */
+    handleViewDetail(row) {
+      const layer = this.$dgLayer({
+        title: `详情`,
+        shade: [0.4, '#FFF'],
+        content: detail,
+        props: {
+          id: row.id
+        },
+        on: {
+          success() {
+            layer.close(layer.dialogIndex);
+          }
+        },
+        area: ['900px', '800px']
+      });
+    }
+  },
+  created() {
+    const startTime = this.$moment().subtract('1', 'year').format('YYYYMMDD') + '000000';
+    const endTime = this.$moment().format('YYYYMMDD') + '235959';
+    this.conditionForm.find((item) => item.name == 'createTime').value = [startTime, endTime];
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.$refs.searchbar.handleSearch();
+    });
+  }
 };
 </script>
 

src/pages/log-manage/permiss-log-manage/auth-risk-log.vue

@@ -4,126 +4,100 @@
 @Date: 2021-05-27 11:33
 -->
 <template>
-    <div>
-        <!-- 搜索项 -->
-        <el-form ref="ruleForm" inline :model="form">
-            <el-form-item label="风险产生方">
-                <el-input v-model="form.creater.value" placeholder="请输入风险产生方" clearable></el-input>
-            </el-form-item>
-            <el-form-item label="风险发生时间">
-                <dg-date-picker
-                    v-model="form.createTime.value"
-                    type="daterange"
-                    range-separator="至"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"
-                    clearable
-                    value-format="yyyyMMddHHmmss"
-                    :unlink-panels="true"
-                    :default-time="['00:00:00', '23:59:59']"
-                >
-                </dg-date-picker>
-            </el-form-item>
-            <el-form-item label="风险类型">
-                <dg-select v-model="form.riskType.value" placeholder="请选择风险类型" enum="RiskProgrammeTypeEnum" clearable>
-                </dg-select>
-            </el-form-item>
-            <el-form-item>
-                <dg-button type="primary" @click="handleSearch" icon="el-icon-search">查询</dg-button>
-                <dg-button type="primary" @click="handleReset" icon="el-icon-refresh-right">重置</dg-button>
-            </el-form-item>
-        </el-form>
-        <!-- 表格 -->
-        <Table ref="myTable" :url="authRiskLogTableUrl" :headerData="authRiskLogTableHeader" :condition="form" :sort="sort">
-            <dg-table-column label="操作" align="center">
-                <template slot-scope="scope">
-                    <div class="u-table__operation">
-                        <el-tooltip content="详情" effect="dark" placement="top-end">
-                            <i class="el-icon-document" @click="handleViewDetail(scope.row)"></i>
-                        </el-tooltip>
-                    </div>
-                </template>
-            </dg-table-column>
-        </Table>
-    </div>
+  <div>
+    <!-- 搜索项 -->
+    <search-bar ref="searchbar" :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
+    <!-- 表格 -->
+    <new-table
+      ref="table"
+      :tableUrl="authRiskLogTableUrl"
+      :tableHeader="authRiskLogTableHeader"
+      :condition="condition"
+      :sortProps="sort"
+      :lazyLoad="true"
+      :tableOptList="tableOptList"
+      @submitTableOpt="receviceOpt"
+    >
+    </new-table>
+  </div>
 </template>
 
 <script>
-import Table from "@/pages/common/table";
-import detail from "./log-detail/auth-risk";
-import { authRiskLogTableHeader } from "./DataConfig";
-import { authRiskLogTableUrl } from "@/api/permiss-log-manage";
+import newTable from '@/pages/common/new-table';
+import { authRiskLogTableHeader, authRiskLogDetail } from './DataConfig';
+import { authRiskLogTableUrl, getAuthRiskLogDetail } from '@/api/permiss-log-manage';
+import searchBar from '@/components/search-bar';
+import { searchOpt, detailOpt } from '@/mixins/page-opt';
 export default {
-    components: {
-        Table
-    },
-    data() {
-        return {
-            authRiskLogTableUrl,
-            authRiskLogTableHeader,
-            form: {
-                riskType: {
-                    value: "",
-                    op: "="
-                },
-                creater: {
-                    value: "",
-                    op: "like"
-                },
-                createTime: {
-                    value: "",
-                    op: "between",
-                    type: "DATE",
-                    format: "yyyyMMddHHmmss"
-                }
-            },
-               sort: {
-                createTime: "DESC" 
-            }
-        };
-    },
-    computed: {},
-    methods: {
-        /**
-         *  详情
-         */
-        handleViewDetail(row) {
-            const layer = this.$dgLayer({
-                title: `详情`,
-                shade: [0.4, "#FFF"],
-                content: detail,
-                props: {
-                    id: row.id
-                },
-                on: {
-                    success() {
-                        layer.close(layer.dialogIndex);
-                    }
-                },
-                area: ["800px", "500px"]
-            });
+  components: {
+    newTable,
+    searchBar
+  },
+  mixins: [searchOpt, detailOpt],
+  data() {
+    return {
+      authRiskLogTableUrl,
+      authRiskLogTableHeader,
+      conditionForm: [
+        {
+          label: '风险产生方',
+          name: 'creater',
+          op: 'like',
+          component: 'ElInput'
         },
-        /**
-         * 查询
-         */
-        handleSearch() {
-            this.$refs.myTable.handleSearchClick();
+        {
+          label: '风险发生时间',
+          name: 'createTime',
+          op: 'between',
+          type: 'DATE',
+          value: '',
+          valueFormat: 'yyyyMMddHHmmss',
+          component: 'DgDatePicker'
         },
-        /**
-         * 重置
-         */
-        handleReset() {
-            for (const key in this.form) {
-                this.form[key].value = "";
-            }
+        {
+          label: '风险类型',
+          name: 'riskType',
+          op: '=',
+          component: 'DgSelect',
+          attr: {
+            enum: 'RiskProgrammeTypeEnum'
+          }
         }
+      ],
+      sort: {
+        createTime: 'DESC'
+      },
+      tableOptList: ["详情"]
+    };
+  },
+  computed: {},
+  methods: {
+    receviceOpt(opt, row) {
+      const otherParams = {
+        config: authRiskLogDetail,
+        labelWidth: '140px',
+        area: ['800px', '500px']
+      };
+      this.handleViewDetail(row.id, otherParams);
     },
-    created() {
-        const startTime = this.$moment().subtract("1", "year").format("YYYYMMDD")+"000000";
-        const endTime = this.$moment().format("YYYYMMDD")+"235959";
-        this.form.createTime.value = [startTime, endTime];
-    },
-    mounted() {}
+    getDetail(id) {
+      return new Promise((resolve) => {
+        getAuthRiskLogDetail(id).then((res) => {
+          resolve(res.data.content);
+        });
+      });
+    }
+  },
+  created() {
+    const startTime = this.$moment().subtract('1', 'year').format('YYYYMMDD') + '000000';
+    const endTime = this.$moment().format('YYYYMMDD') + '235959';
+    this.conditionForm.find((item) => item.name == 'createTime').value = [startTime, endTime];
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.$refs.searchbar.handleSearch();
+    });
+  }
 };
 </script>
 

src/pages/log-manage/permiss-log-manage/auth-service-log.vue

@@ -5,148 +5,121 @@
 -->
 
 <template>
-    <div>
-        <!-- 搜索项 -->
-        <el-form ref="ruleForm" inline :model="form">
-            <el-form-item label="用户姓名">
-                <el-input v-model="form.userName.value" placeholder="请输入用户姓名" clearable></el-input>
-            </el-form-item>
-            <el-form-item label="用户身份证号码">
-                <el-input v-model="form.userIdcard.value" placeholder="请输入用户身份证号码" clearable></el-input>
-            </el-form-item>
-            <el-form-item label="鉴权类型">
-                <dg-select
-                    v-model="form.authenticationType.value"
-                    placeholder="请选择鉴权类型"
-                    enum="AuthenticationTypeEnum"
-                    clearable
-                    style="width: 9rem"
-                >
-                </dg-select>
-            </el-form-item>
-            <el-form-item label="鉴权时间">
-                <dg-date-picker
-                    v-model="form.createTime.value"
-                    type="daterange"
-                    range-separator="至"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"
-                    clearable
-                    value-format="yyyyMMddHHmmss"
-                    style="width: 16rem"
-                    :unlink-panels="true"
-                    :default-time="['00:00:00', '23:59:59']"
-                >
-                </dg-date-picker>
-            </el-form-item>
-            <el-form-item label="鉴权结果">
-                <dg-select v-model="form.state.value" placeholder="请选择鉴权结果" enum="AuthResultEnum" clearable  style="width: 9rem">
-                </dg-select>
-            </el-form-item>
-            <el-form-item>
-                <dg-button type="primary" @click="handleSearch" icon="el-icon-search">查询</dg-button>
-                <dg-button type="primary" @click="handleReset" icon="el-icon-refresh-right">重置</dg-button>
-            </el-form-item>
-        </el-form>
-        <!-- 表格 -->
-        <Table ref="myTable" :url="authServiceLogTableUrl" :headerData="authServiceLogTableHeader" :condition="form" :sort="sort">
-            <dg-table-column label="操作" align="center">
-                <template slot-scope="scope">
-                    <div class="u-table__operation">
-                        <el-tooltip content="详情" effect="dark" placement="top-end">
-                            <i class="el-icon-document" @click="handleViewDetail(scope.row)"></i>
-                        </el-tooltip>
-                    </div>
-                </template>
-            </dg-table-column>
-        </Table>
-    </div>
+  <div>
+    <!-- 搜索项 -->
+    <search-bar ref="searchbar" :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
+    <!-- 表格 -->
+    <new-table
+      ref="table"
+      :tableUrl="authServiceLogTableUrl"
+      :tableHeader="authServiceLogTableHeader"
+      :condition="condition"
+      :sortProps="sort"
+      :lazyLoad="true"
+      :tableOptList="tableOptList"
+      @submitTableOpt="receviceOpt"
+    >
+    </new-table>
+  </div>
 </template>
 
 <script>
-import Table from "@/pages/common/table";
-import detail from "./log-detail/auth-service";
-import { authServiceLogTableHeader } from "./DataConfig";
-import { authServiceLogTableUrl } from "@/api/permiss-log-manage";
+import searchBar from '@/components/search-bar';
+import newTable from '@/pages/common/new-table';
+import { authServiceLogTableHeader, authServiceLogDetail } from './DataConfig';
+import { authServiceLogTableUrl, getAuthServiceLogDetail } from '@/api/permiss-log-manage';
+import { searchOpt, detailOpt } from '@/mixins/page-opt';
 export default {
-    components: {
-        Table
-    },
-    data() {
-        return {
-            authServiceLogTableHeader,
-            authServiceLogTableUrl,
-            form: {
-                userName: {
-                    value: "",
-                    op: "like"
-                },
-                userIdcard: {
-                    value: "",
-                    op: "like"
-                },
-                authenticationType: {
-                    value: "",
-                    op: "="
-                },
-                createTime: {
-                    value: [],
-                    op: "between",
-                    type: "DATE",
-                    format: "yyyyMMddHHmmss"
-                },
-                state: {
-                    value: "",
-                    op: "="
-                }
-            },
-               sort: {
-                createTime: "DESC" 
-            }
-        };
-    },
-    computed: {},
-    methods: {
-        /**
-         *  详情
-         */
-        handleViewDetail(row) {
-            const layer = this.$dgLayer({
-                title: `详情`,
-                shade: [0.4, "#FFF"],
-                content: detail,
-                props: {
-                    id: row.id
-                },
-                on: {
-                    success() {
-                        layer.close(layer.dialogIndex);
-                    }
-                },
-                area: ["800px", "500px"]
-            });
+  components: {
+    newTable,
+    searchBar
+  },
+  mixins: [searchOpt, detailOpt],
+  data() {
+    return {
+      authServiceLogTableHeader,
+      authServiceLogTableUrl,
+      conditionForm: [
+        {
+          label: '用户姓名',
+          name: 'userName',
+          op: 'like',
+          component: 'ElInput'
+        },
+        {
+          label: '用户身份证号码',
+          name: 'userIdcard',
+          op: 'like',
+          component: 'ElInput'
         },
-        /**
-         * 查询
-         */
-        handleSearch() {
-            this.$refs.myTable.handleSearchClick();
+        {
+          label: '鉴权类型',
+          name: 'authenticationType',
+          op: '=',
+          component: 'DgSelect',
+          attr: {
+            enum: 'AuthenticationTypeEnum',
+            style: 'width: 9rem'
+          }
         },
-        /**
-         * 重置
-         */
-        handleReset() {
-            for (const key in this.form) {
-                this.form[key].value = "";
-            }
+
+        {
+          label: '鉴权时间',
+          name: 'createTime',
+          op: 'between',
+          type: 'DATE',
+          value: '',
+          valueFormat: 'yyyyMMddHHmmss',
+          component: 'DgDatePicker',
+          attr: {
+            style: 'width: 16rem'
+          }
+        },
+        {
+          label: '鉴权结果',
+          name: 'state',
+          op: '=',
+          component: 'DgSelect',
+          attr: {
+            enum: 'AuthResultEnum',
+            style: 'width: 9rem'
+          }
         }
+      ],
+      sort: {
+        createTime: 'DESC'
+      },
+      tableOptList: ['详情']
+    };
+  },
+  computed: {},
+  methods: {
+    receviceOpt(opt, row) {
+      const otherParams = {
+        config: authServiceLogDetail,
+        labelWidth: '140px',
+        area: ['800px', '500px']
+      };
+      this.handleViewDetail(row.id, otherParams);
     },
-    created() {
-        const startTime = this.$moment().subtract("1", "year").format("YYYYMMDD")+"000000";
-        const endTime = this.$moment().format("YYYYMMDD")+"235959";
-        this.form.createTime.value = [startTime, endTime];
-    },
-    mounted() {}
+    getDetail(id) {
+      return new Promise((resolve) => {
+        getAuthServiceLogDetail(id).then((res) => {
+          resolve(res.data.content);
+        });
+      });
+    }
+  },
+  created() {
+    const startTime = this.$moment().subtract('1', 'year').format('YYYYMMDD') + '000000';
+    const endTime = this.$moment().format('YYYYMMDD') + '235959';
+    this.conditionForm.find((item) => item.name == 'createTime').value = [startTime, endTime];
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.$refs.searchbar.handleSearch();
+    });
+  }
 };
 </script>
 

src/pages/permission-selfhelp-manage/index.vue

@@ -6,7 +6,7 @@
 <template>
   <div>
     <!-- 搜索项 -->
-    <search-bar :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
+    <search-bar ref="searchbar" :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
     <!-- 操作栏 -->
     <operate-bar :pageOptList="pageOptList" @submitPageOpt="receviceOpt"></operate-bar>
     <!-- 表格 -->
@@ -15,16 +15,16 @@
         <template slot-scope="{ row }">
           <div class="u-table__operation">
             <el-tooltip content="详情" effect="dark" placement="top-end">
-              <i class="el-icon-document" @click="handleViewDetail(row)"></i>
+              <i :class="'详情' | optIcon" @click="handleViewDetail(row)"></i>
             </el-tooltip>
-            <el-tooltip content="编辑" effect="dark" placement="top-end" v-if="!row.showEdit">
-              <i class="el-icon-edit" @click="handleApplyPermission(row.applyOrdNo)"></i>
+            <el-tooltip content="编辑" effect="dark" placement="top-end" v-if="row.showEdit">
+              <i :class="'编辑' | optIcon" @click="handleApplyPermission(row.applyOrdNo)"></i>
             </el-tooltip>
             <el-tooltip content="撤回" effect="dark" placement="top-end" v-if="row.showRecall">
-              <i class="el-icon-back" @click="handleRecall(row)"></i>
+              <i :class="'撤回' | optIcon" @click="handleRecall(row)"></i>
             </el-tooltip>
             <el-tooltip content="删除" effect="dark" placement="top-end">
-              <i class="el-icon-delete" @click="handleDelete(row)"></i>
+              <i :class="'删除' | optIcon" @click="handleDelete(row)"></i>
             </el-tooltip>
           </div>
         </template>