a

src/views/mis/codingManagement/chargeChannel-index.vue

@@ -99,9 +99,14 @@ export default {
                     label: '外部单位',
                     prop: 'isextunit',
                     align: 'center',
-                    formatter: function (row, column, cellValue, index) {
-                        return cellValue == 1 ? "是" : "否";
+                    renderer: function (h, row, column, value, index) {
+                        return <el-switch v-model={value} active-text="是" inactive-text="否" active-value="1" inactive-value="0"
+                            inactive-color="lightgray">
+                        </el-switch>
                     }
+                    // formatter: function (row, column, cellValue, index) {
+                    //     return cellValue == 1 ? "是" : "否";
+                    // }
                 },
                 {
                     label: '操作人员',

src/views/mis/common/misTable/RenderColumn.vue

@@ -1,7 +1,7 @@
 <script>
 export default {
   props: {
-    render: {
+    renderer: {
       type: Function,
       default: () => () => { }
     },
@@ -12,7 +12,7 @@ export default {
   },
   render(h) {
     const { row, column, value, colIndex } = this.scope;
-    return this.render(h, row, column, value, colIndex);
+    return this.renderer(h, row, column, value, colIndex);
   }
 }
 </script>

src/views/mis/common/misTable/index.vue

@@ -2,35 +2,13 @@
   <div style="height: 100%">
     <!-- 表格组件 :max-height="tableheight"  :height=" tableheight + 'px'" -->
     <div class="datatable" :class="pagination ? 'inpage' : 'nopage'">
-      <el-table
-        ref="multipleTable"
-        v-loading="loadingValue"
-        :data="tableData"
-        tooltip-effect="dark"
-        :style="{ width: '100%' }"
-        height="100%"
-        :border="border"
-        :show-summary="summary"
-        :cell-style="cellStyleF"
-        :header-cell-style="headerStyle"
-        :stripe="stripe"
-        :summary-method="getSummaries"
-        :span-method="objectSpanMethod"
-        :header-row-style="headerRowStyle"
-        :row-class-name="tableRowClassName"
-        :cell-class-name="cellClassName"
-        :row-style="rowStyle"
-        :show-overflow-tooltip="true"
-        @selection-change="handleSelectionChange"
-        @row-dblclick="rowDblclick"
-        @row-click="rowClick"
-        @cell-dblclick="cellDblclick"
-        @select="select"
-        @cell-click="cellClick"
-        @select-all="selectAll"
-        @sort-change="sortChange"
-        :highlight-current-row="isHighlight"
-      >
+      <el-table ref="multipleTable" v-loading="loadingValue" :data="tableData" tooltip-effect="dark"
+        :style="{ width: '100%' }" height="100%" :border="border" :show-summary="summary" :cell-style="cellStyleF"
+        :header-cell-style="headerStyle" :stripe="stripe" :summary-method="getSummaries" :span-method="objectSpanMethod"
+        :header-row-style="headerRowStyle" :row-class-name="tableRowClassName" :cell-class-name="cellClassName"
+        :row-style="rowStyle" :show-overflow-tooltip="true" @selection-change="handleSelectionChange"
+        @row-dblclick="rowDblclick" @row-click="rowClick" @cell-dblclick="cellDblclick" @select="select"
+        @cell-click="cellClick" @select-all="selectAll" @sort-change="sortChange" :highlight-current-row="isHighlight">
         <!-- highlight-current-row -->
         <!-- @current-change="TablehandleCurrentChange" -->
         <template slot="empty">
@@ -38,38 +16,21 @@
           <p class="empty-p">暂无数据</p>
         </template>
         <el-table-column v-if="multiple" type="selection" width="40" />
-        <el-table-column
-          v-if="forId"
-          label="序号"
-          type="index"
-          width="50"
-          align="center"
-          fixed="left"
-        />
-        <el-table-column
-          v-for="(item, colIndex) of column.filter(
-            (ele) =>
-              ele.prop &&
-              ele.prop !== 'image' &&
-              ele.prop !== 'lqSl' &&
-              ele.slotScoped !== 'tags' &&
-              ele.slotScoped !== 'operation' &&
-              ele.slotScoped !== 'operationIcon' &&
-              ele.slotScoped !== 'father'
-          )"
-          :key="colIndex"
-          :prop="item.prop"
-          :label="item.label"
-          :width="item.width"
-          :align="item.hasOwnProperty('align') ? item.align : 'center'"
-          :sortable="item.sortable"
-          :show-overflow-tooltip="
-            item.hasOwnProperty('showoverflowtooltip')
-              ? item.showoverflowtooltip
-              : true
-          "
-          :fixed="item.hasOwnProperty('fixed') ? item.fixed : false"
-        >
+        <el-table-column v-if="forId" label="序号" type="index" width="50" align="center" fixed="left" />
+        <el-table-column v-for="(item, colIndex) of column.filter(
+          (ele) =>
+            ele.prop &&
+            ele.prop !== 'image' &&
+            ele.prop !== 'lqSl' &&
+            ele.slotScoped !== 'tags' &&
+            ele.slotScoped !== 'operation' &&
+            ele.slotScoped !== 'operationIcon' &&
+            ele.slotScoped !== 'father'
+        )" :key="colIndex" :prop="item.prop" :label="item.label" :width="item.width"
+          :align="item.hasOwnProperty('align') ? item.align : 'center'" :sortable="item.sortable" :show-overflow-tooltip="item.hasOwnProperty('showoverflowtooltip')
+            ? item.showoverflowtooltip
+            : true
+            " :fixed="item.hasOwnProperty('fixed') ? item.fixed : false">
           <template slot-scope="{ row }">
             <!-- <template v-if="row[item.prop]||String(row[item.prop])==='0'||String(row[item.prop])==='00'">
             <span v-if="item.formatter" v-html="(item.formatter)(row,item.prop,row[item.prop],colIndex)" />
@@ -79,11 +40,11 @@
             <span>--</span>
           </template> -->
             <template v-if="item.formatter">
-              <span
-                v-html="
-                  item.formatter(row, item.prop, row[item.prop], colIndex)
-                "
-              />
+              <span v-html="item.formatter(row, item.prop, row[item.prop], colIndex)" />
+            </template>
+            <template v-else-if="item.renderer">
+              <render-column :renderer="item.renderer"
+                :scope="{ row, column: item.prop, value: row[item.prop], colIndex }" />
             </template>
             <template v-else>
               <!-- 添加百分比格式 -->
@@ -91,176 +52,94 @@
               <span v-else-if="item.prop2 && row[item.prop2][item.prop]">{{
                 row[item.prop2][item.prop]
               }}</span>
-              <span
-                v-else-if="
-                  row[item.prop] ||
+              <span v-else-if="row[item.prop] ||
                   String(row[item.prop]) === '0' ||
                   String(row[item.prop]) === '00'
-                "
-                >{{ row[item.prop] }}</span
-              >
+                  ">{{ row[item.prop] }}</span>
               <span v-else>--</span>
             </template>
           </template>
         </el-table-column>
 
         <!-- 附件下载 -->
-        <el-table-column
-          v-for="item of column.filter((ele) => ele.slotScoped === 'dwonfile')"
-          :key="item.prop"
-          :label="item.label"
-          :width="item.width"
-        >
+        <el-table-column v-for="item of column.filter((ele) => ele.slotScoped === 'dwonfile')" :key="item.prop"
+          :label="item.label" :width="item.width">
           <template v-if="data.row.isdownfile" slot-scope="data">
-            <span
-              v-for="act in item.acts"
-              :key="act.emitWay"
-              :style="{
-                color: act.color,
-                cursor: 'pointer',
-                marginRight: '10px',
-              }"
-              @click.stop="operation(act.emitWay, data)"
-            >
+            <span v-for="act in item.acts" :key="act.emitWay" :style="{
+              color: act.color,
+              cursor: 'pointer',
+              marginRight: '10px',
+            }" @click.stop="operation(act.emitWay, data)">
               {{ act.operation }}
             </span>
           </template>
         </el-table-column>
         <!-- 操作 -->
-        <el-table-column
-          v-for="item of column.filter((ele) => ele.slotScoped === 'action')"
-          :key="item.prop"
-          :label="item.label"
-          :width="item.width"
-          :align="item.hasOwnProperty('align') ? item.align : 'center'"
-        >
+        <el-table-column v-for="item of column.filter((ele) => ele.slotScoped === 'action')" :key="item.prop"
+          :label="item.label" :width="item.width" :align="item.hasOwnProperty('align') ? item.align : 'center'">
           <template slot-scope="data">
-            <span
-              v-for="act in item.acts"
-              :key="act.emitWay"
-              :style="{
-                color: act.color,
-                cursor: 'pointer',
-                marginRight: '10px',
-              }"
-              @click.stop="operation(act.emitWay, data)"
-            >
+            <span v-for="act in item.acts" :key="act.emitWay" :style="{
+              color: act.color,
+              cursor: 'pointer',
+              marginRight: '10px',
+            }" @click.stop="operation(act.emitWay, data)">
               {{ act.operation }}
             </span>
           </template>
         </el-table-column>
         <!-- 多级 -->
-        <el-table-column
-          v-for="item of column.filter((ele) => ele.slotScoped === 'father')"
-          :key="item.label"
-          :label="item.label"
-          :width="item.width"
-        >
-          <el-table-column
-            v-for="data of item.children"
-            :key="data.prop"
-            :prop="data.prop"
-            :label="data.label"
-            :width="data.width"
-          />
+        <el-table-column v-for="item of column.filter((ele) => ele.slotScoped === 'father')" :key="item.label"
+          :label="item.label" :width="item.width">
+          <el-table-column v-for="data of item.children" :key="data.prop" :prop="data.prop" :label="data.label"
+            :width="data.width" />
         </el-table-column>
         <!-- 操作 -->
-        <el-table-column
-          v-for="item of column.filter((ele) => ele.slotScoped === 'operation')"
-          :key="item.label"
-          :label="item.label"
-          :width="item.width"
-        >
+        <el-table-column v-for="item of column.filter((ele) => ele.slotScoped === 'operation')" :key="item.label"
+          :label="item.label" :width="item.width">
           <template slot-scope="scope">
-            <span
-              :style="{
-                color: '#409EFF',
-                cursor: 'pointer',
-                marginRight: '10px',
-              }"
-              @click.stop="operationClick(scope.row)"
-              >{{ item.prop }}</span
-            >
+            <span :style="{
+              color: '#409EFF',
+              cursor: 'pointer',
+              marginRight: '10px',
+            }" @click.stop="operationClick(scope.row)">{{ item.prop }}</span>
           </template>
         </el-table-column>
         <!-- 图标操作 -->
-        <el-table-column
-          v-for="item of column.filter(
-            (ele) => ele.slotScoped === 'operationIcon'
-          )"
-          :key="item.label"
-          :label="item.label"
-          :width="item.width"
-        >
+        <el-table-column v-for="item of column.filter(
+          (ele) => ele.slotScoped === 'operationIcon'
+        )" :key="item.label" :label="item.label" :width="item.width">
           <template slot-scope="scope">
             <el-tooltip :content="item.content" placement="bottom">
-              <i
-                :class="item.prop"
-                style="cursor: pointer"
-                @click.stop="operationClickIcon(scope.row)"
-              />
+              <i :class="item.prop" style="cursor: pointer" @click.stop="operationClickIcon(scope.row)" />
             </el-tooltip>
           </template>
         </el-table-column>
         <!-- //筛选 -->
-        <el-table-column
-          v-for="item of column.filter((ele) => ele.slotScoped === 'tags')"
-          :key="item.prop"
-          :label="item.label"
-          :prop="item.prop"
-          :width="item.width"
-          :filter-method="filterTag"
-          :filters="filters"
-          filter-placement="bottom-end"
-        >
+        <el-table-column v-for="item of column.filter((ele) => ele.slotScoped === 'tags')" :key="item.prop"
+          :label="item.label" :prop="item.prop" :width="item.width" :filter-method="filterTag" :filters="filters"
+          filter-placement="bottom-end">
           <template slot-scope="scope">
-            <el-tag
-              :type="scope.row[item.prop] === '0' ? 'primary' : 'danger'"
-              disable-transitions
-              >{{ tagNamelist[scope.row[item.prop]] }}</el-tag
-            >
+            <el-tag :type="scope.row[item.prop] === '0' ? 'primary' : 'danger'" disable-transitions>{{
+              tagNamelist[scope.row[item.prop]] }}</el-tag>
           </template>
         </el-table-column>
         <!-- sortable排序 show-overflow-tooltip影藏 -->
         <!-- 图片 -->
-        <el-table-column
-          v-for="item in column.filter((ele) => ele.prop === 'image')"
-          :key="item.prop"
-          :prop="item.prop"
-          :label="item.label"
-          :width="item.width"
-        >
+        <el-table-column v-for="item in column.filter((ele) => ele.prop === 'image')" :key="item.prop" :prop="item.prop"
+          :label="item.label" :width="item.width">
           <template slot-scope="scope">
             <el-popover placement="top-start" title trigger="click">
-              <img
-                :src="scope.row.image"
-                alt
-                style="width: 100%; height: 100%"
-              />
-              <img
-                slot="reference"
-                :src="scope.row.image"
-                style="width: 50px; height: 50px"
-              />
+              <img :src="scope.row.image" alt style="width: 100%; height: 100%" />
+              <img slot="reference" :src="scope.row.image" style="width: 50px; height: 50px" />
             </el-popover>
           </template>
         </el-table-column>
         <!-- //加入计数器 -->
-        <el-table-column
-          v-for="item in column.filter((ele) => ele.prop === 'lqSl')"
-          :key="item.prop"
-          :prop="item.prop"
-          :label="item.label"
-          :width="item.width"
-        >
+        <el-table-column v-for="item in column.filter((ele) => ele.prop === 'lqSl')" :key="item.prop" :prop="item.prop"
+          :label="item.label" :width="item.width">
           <template slot-scope="scope">
             <div @click.stop>
-              <el-input-number
-                v-model="scope.row.lqSl"
-                :min="0"
-                :max="scope.row.kcNum"
-                size="mini"
-              />
+              <el-input-number v-model="scope.row.lqSl" :min="0" :max="scope.row.kcNum" size="mini" />
             </div>
 
             <!-- @change="handleCareOrderItemNumChange(scope.row)" -->
@@ -269,23 +148,18 @@
       </el-table>
     </div>
     <div v-if="pagination" class="pagination-area">
-      <el-pagination
-        :current-page="currentpage"
-        :page-sizes="[1, 10, 20, 30, 50, 100, 500, 1000]"
-        :page-size="pagesize"
-        :total="total"
-        background
-        layout="total, sizes, prev, pager, next, jumper"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
+      <el-pagination :current-page="currentpage" :page-sizes="[1, 10, 20, 30, 50, 100, 500, 1000]" :page-size="pagesize"
+        :total="total" background layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
+        @current-change="handleCurrentChange" />
     </div>
   </div>
 </template>
 
 <script>
+import RenderColumn from "./RenderColumn.vue";
 export default {
   name: "Table",
+  components: { RenderColumn },
   props: {
     tableData: {
       type: Array,
@@ -300,7 +174,7 @@ export default {
     // eslint-disable-next-line vue/require-default-prop
     tagNamelist: {
       type: Object,
-      default: () => {},
+      default: () => { },
       required: false,
     },
     column: {
@@ -385,21 +259,21 @@ export default {
       // default: () => {
       //   return Function
       // }
-      default: () => () => {},
+      default: () => () => { },
     },
     objectSpanMethod: {
       type: Function,
       // default: () => {
       //   return Function
       // }
-      default: () => () => {},
+      default: () => () => { },
     },
     getSummaries: {
       type: Function,
       // default: () => {
       //   return Function
       // }
-      default: () => () => {},
+      default: () => () => { },
     },
     // filterTag: {
     //   type: Function,
@@ -623,21 +497,18 @@ export default {
 </script>
 <style lang='scss'>
 /* 斑马线颜色 */
-.el-table--striped
-  .el-table__body
-  tr.el-table__row--striped.el-table__row--striped.el-table__row--striped
-  td {
+.el-table--striped .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped td {
   background-color: #f7f7f7;
 }
 
 /* 行高亮样式点击当前行样式背景高亮 */
-.el-table__body /deep/ tr.current-row > td {
+.el-table__body /deep/ tr.current-row>td {
   background: #fdf3ea !important;
   color: #f19944;
 }
 
 /* 实现hover前行样式背景高亮 */
-.el-table--enable-row-hover .el-table__body tr:hover > td {
+.el-table--enable-row-hover .el-table__body tr:hover>td {
   background-color: #fdf3ea !important;
   color: #f19944;
 }
@@ -652,7 +523,7 @@ export default {
   padding: 2px 0 !important;
 }
 
-.el-table th > .cell {
+.el-table th>.cell {
   white-space: nowrap;
 }
 
@@ -665,7 +536,7 @@ export default {
   }
 }
 
-.el-table__body tr.current-row > td {
+.el-table__body tr.current-row>td {
   background-color: #69a8ea !important;
   /* background-color:red !important; */
   color: #fff;
@@ -698,7 +569,7 @@ export default {
   align-self: flex-end; */
 }
 
-.pagination-area > .el-pagination {
+.pagination-area>.el-pagination {
   position: relative;
   top: 50%;
   transform: translate(0, -50%);

src/views/mis/customerManagement/customer-index.vue

@@ -6,43 +6,15 @@
         <el-row>
           <el-col :span="18">
             <div style="display: flex; align-items: center">
-              所属公司：<cpsCompany
-                v-model="queryParams.ssgs"
-                size="small"
-                style="width: 150px"
-                @change="changeGs"
-              >
-              </cpsCompany
-              >&nbsp; 所属片区：<cpsSelect
-                v-model="queryParams.sscbpq"
-                size="small"
-                skey="cbpq"
-                :params="{ ssgs: queryParams.ssgs }"
-                isDisabled="all"
-                :refresh="cbpqRefresh"
-                @change="changeCbpq"
-                style="width: 150px"
-              >
-              </cpsSelect
-              >&nbsp; 所属表册：<cpsSelect
-                v-model="queryParams.sscbb"
-                size="small"
-                skey="cbb"
-                :params="{ ssgs: queryParams.ssgs, sscbpq: queryParams.sscbpq }"
-                isDisabled="all"
-                :refresh="cbbRefresh"
-                :labelGroup="true"
-                :filterable="true"
-                style="width: 150px"
-              ></cpsSelect>
-              &nbsp; 关 键 字：<el-input
-                v-model="queryParams.searchText"
-                size="small"
-                style="width: 150px"
-                placeholder="输入关键字"
-                clearable
-                @keyup.enter.native="clickQuery()"
-              />&nbsp;
+              所属公司：<cpsCompany v-model="queryParams.ssgs" size="small" style="width: 150px" @change="changeGs">
+              </cpsCompany>&nbsp; 所属片区：<cpsSelect v-model="queryParams.sscbpq" size="small" skey="cbpq"
+                :params="{ ssgs: queryParams.ssgs }" isDisabled="all" :refresh="cbpqRefresh" @change="changeCbpq"
+                style="width: 150px">
+              </cpsSelect>&nbsp; 所属表册：<cpsSelect v-model="queryParams.sscbb" size="small" skey="cbb"
+                :params="{ ssgs: queryParams.ssgs, sscbpq: queryParams.sscbpq }" isDisabled="all" :refresh="cbbRefresh"
+                :labelGroup="true" :filterable="true" style="width: 150px"></cpsSelect>
+              &nbsp; 关 键 字：<el-input v-model="queryParams.searchText" size="small" style="width: 150px"
+                placeholder="输入关键字" clearable @keyup.enter.native="clickQuery()" />&nbsp;
               <!-- <el-button-group>
                             <el-button type="primary" size="small" icon="el-icon-search"
                                 @click="clickQuery()">查询</el-button>
@@ -51,126 +23,52 @@
                                     style="padding-left: 6px;padding-right:6px;" @click="advancedQuery"></el-button>
                             </el-tooltip>
                         </el-button-group> -->
-              <el-dropdown
-                split-button
-                type="primary"
-                size="small"
-                placement="top"
-                @click="clickQuery()"
-                @command="advancedQuery"
-              >
+              <el-dropdown split-button type="primary" size="small" placement="top" @click="clickQuery()"
+                @command="advancedQuery">
                 <i class="el-icon-search"></i> 查询
                 <el-dropdown-menu slot="dropdown">
-                  <el-dropdown-item command="advancedQuery"
-                    >高级搜索</el-dropdown-item
-                  >
+                  <el-dropdown-item command="advancedQuery">高级搜索</el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
             </div>
           </el-col>
           <el-col :span="6" class="list-opCol">
-            <el-button
-              type="primary"
-              size="small"
-              icon="el-icon-plus"
-              @click="clickAdd()"
-              >添加</el-button
-            >
-            <el-button
-              type="primary"
-              size="small"
-              icon="el-icon-edit"
-              @click="clickModify()"
-              :disabled="disabledModify"
-              >修改</el-button
-            >
-            <el-button
-              type="danger"
-              size="small"
-              icon="el-icon-delete"
-              @click="clickDelete()"
-              :disabled="disabledDelete"
-              >作废</el-button
-            >
-            <el-popover
-              placement="top-start"
-              title="提示"
-              width="200"
-              trigger="hover"
-              content="数据量大时等待时间可能较长，请您耐心等待！"
-            >
-              <el-button
-                slot="reference"
-                type="primary"
-                size="small"
-                icon="el-icon-document"
-                @click="clickExport()"
-                >导出</el-button
-              >
+            <el-button type="primary" size="small" icon="el-icon-plus" @click="clickAdd()">添加</el-button>
+            <el-button type="primary" size="small" icon="el-icon-edit" @click="clickModify()"
+              :disabled="disabledModify">修改</el-button>
+            <el-button type="danger" size="small" icon="el-icon-delete" @click="clickDelete()"
+              :disabled="disabledDelete">作废</el-button>
+            <el-popover placement="top-start" title="提示" width="200" trigger="hover" content="数据量大时等待时间可能较长，请您耐心等待！">
+              <el-button slot="reference" type="primary" size="small" icon="el-icon-document"
+                @click="clickExport()">导出</el-button>
             </el-popover>
             <!-- <el-button type="info" size="small" icon="el-icon-document" @click="clickExport()">导出</el-button> -->
           </el-col>
         </el-row>
       </el-header>
       <el-main>
-        <tfTable
-          :table-data="dataList"
-          :column="columns"
-          :for-id="true"
-          :pagination="true"
-          :currentpage="pageInfo.current"
-          :pagesize="pageInfo.size"
-          :total="pageInfo.tableTotal"
-          :border="true"
-          :multiple="false"
-          :fixed="true"
-          :isdelete="false"
-          :is-select="false"
-          :stripe="true"
-
-          @handleCurrentChange="handleCurrentChange"
-          @handleSizeChange="handleSizeChange"
-          @handleSelectionChange="handleSelectionChange"
-          @rowDblclick="showDetail"
-          @detail="showDetail"
-          @sortChange="onCustomerSortChange"
-          @rowClick="handleRowClick"
-        />
+        <tfTable :table-data="dataList" :column="columns" :for-id="true" :pagination="true"
+          :currentpage="pageInfo.current" :pagesize="pageInfo.size" :total="pageInfo.tableTotal" :border="true"
+          :multiple="false" :fixed="true" :isdelete="false" :is-select="false" :stripe="true"
+          @handleCurrentChange="handleCurrentChange" @handleSizeChange="handleSizeChange"
+          @handleSelectionChange="handleSelectionChange" @rowDblclick="showDetail" @detail="showDetail"
+          @sortChange="onCustomerSortChange" @rowClick="handleRowClick" />
       </el-main>
     </el-container>
     <!-- 详情页 -->
-    <el-dialog
-      v-if="dialogVisible"
-      v-dialogDrag
-      :title="dialogTitle"
-      top="0vh"
-      :visible.sync="dialogVisible"
-      width="70%"
-      height="100%"
-    >
+    <el-dialog v-if="dialogVisible" v-dialogDrag :title="dialogTitle" top="0vh" :visible.sync="dialogVisible" width="70%"
+      height="100%">
       <!-- <div style="height:calc(100vh - 121px); overflow:auto;"> -->
       <tfDetail :detailData="detailData" :editState="editState" ref="dForm" />
       <!-- </div> -->
       <template slot="footer">
-        <el-button
-          type="warning"
-          icon="el-icon-check"
-          @click="clickSave()"
-          v-if="!editState"
-          >确 定</el-button
-        >
-        <el-button   type="warning" icon="el-icon-close" @click="clickCancel()">关 闭</el-button>
+        <el-button type="warning" icon="el-icon-check" @click="clickSave()" v-if="!editState">确 定</el-button>
+        <el-button type="warning" icon="el-icon-close" @click="clickCancel()">关 闭</el-button>
       </template>
     </el-dialog>
 
     <!-- 高级搜索 -->
-    <el-drawer
-      title="高级搜索"
-      :visible.sync="drawerDialog"
-      direction="ttb"
-      size="350px"
-      ref="drawer"
-    >
+    <el-drawer title="高级搜索" :visible.sync="drawerDialog" direction="ttb" size="350px" ref="drawer">
       <el-container>
         <el-main>
           <el-row type="flex" style="padding: 8px 12px">
@@ -179,100 +77,42 @@
               <el-tag>筛选条件</el-tag>
               <div class="filterDiv">
                 <div style="margin: 5px">
-                  所属公司：<cpsCompany
-                    v-model="queryParams.ssgs"
-                    size="small"
-                    style="width: 180px"
-                    @change="changeGs"
-                  >
-                  </cpsCompany
-                  >&nbsp; 所属片区：<cpsSelect
-                    v-model="queryParams.sscbpq"
-                    size="small"
-                    skey="cbpq"
-                    :params="{ ssgs: queryParams.ssgs }"
-                    isDisabled="all"
-                    :refresh="cbpqRefresh"
-                    @change="changeCbpq"
-                    style="width: 180px"
-                  >
-                  </cpsSelect
-                  >&nbsp; 所属表册：<cpsSelect
-                    v-model="queryParams.sscbb"
-                    size="small"
-                    skey="cbb"
-                    :params="{
-                      ssgs: queryParams.ssgs,
-                      sscbpq: queryParams.sscbpq,
-                    }"
-                    isDisabled="all"
-                    :refresh="cbbRefresh"
-                    :labelGroup="true"
-                    :filterable="true"
-                    style="width: 180px"
-                  >
-                  </cpsSelect
-                  >&nbsp;
+                  所属公司：<cpsCompany v-model="queryParams.ssgs" size="small" style="width: 180px" @change="changeGs">
+                  </cpsCompany>&nbsp; 所属片区：<cpsSelect v-model="queryParams.sscbpq" size="small" skey="cbpq"
+                    :params="{ ssgs: queryParams.ssgs }" isDisabled="all" :refresh="cbpqRefresh" @change="changeCbpq"
+                    style="width: 180px">
+                  </cpsSelect>&nbsp; 所属表册：<cpsSelect v-model="queryParams.sscbb" size="small" skey="cbb" :params="{
+                    ssgs: queryParams.ssgs,
+                    sscbpq: queryParams.sscbpq,
+                  }" isDisabled="all" :refresh="cbbRefresh" :labelGroup="true" :filterable="true" style="width: 180px">
+                  </cpsSelect>&nbsp;
                 </div>
                 <div style="margin: 5px">
-                  用户状态：<cpsSelect
-                    v-model="queryParams.yhzt"
-                    size="small"
-                    skey="yhzt"
-                    style="width: 180px"
-                    isDisabled="all"
-                  >
-                  </cpsSelect
-                  >&nbsp; 用水性质：<cpsSelect
-                    v-model="queryParams.sjbm"
-                    size="small"
-                    skey="sj"
-                    style="width: 180px"
-                  >
-                  </cpsSelect
-                  >&nbsp; 表具类型：<cpsSelect
-                    v-model="queryParams.sblb"
-                    size="small"
-                    skey="sblb"
-                    style="width: 180px"
-                  >
-                  </cpsSelect
-                  >&nbsp;
+                  用户状态：<cpsSelect v-model="queryParams.yhzt" size="small" skey="yhzt" style="width: 180px"
+                    isDisabled="all">
+                  </cpsSelect>&nbsp; 用水性质：<cpsSelect v-model="queryParams.sjbm" size="small" skey="sj"
+                    style="width: 180px">
+                  </cpsSelect>&nbsp; 表具类型：<cpsSelect v-model="queryParams.sblb" size="small" skey="sblb"
+                    style="width: 180px">
+                  </cpsSelect>&nbsp;
                 </div>
                 <div style="margin: 5px">
-                  关&nbsp;键&nbsp;字&nbsp;：<el-input
-                    v-model="queryParams.searchText"
-                    size="small"
-                    style="width: 440px"
-                    placeholder="输入编号、姓名、地址、电话"
-                    clearable
-                  />&nbsp;
+                  关&nbsp;键&nbsp;字&nbsp;：<el-input v-model="queryParams.searchText" size="small" style="width: 440px"
+                    placeholder="输入编号、姓名、地址、电话" clearable />&nbsp;
                 </div>
                 <div style="margin: 5px">
-                  建档日期：<el-date-picker
-                    v-model="dprJdrq"
-                    type="daterange"
-                    align="right"
-                    unlink-panels
-                    range-separator="至"
-                    start-placeholder="建档开始日期"
-                    end-placeholder="建档结束日期"
-                    value-format="yyyy-MM-dd"
-                    :picker-options="pickerOptions"
-                    size="small"
-                    style="width: 438px"
-                    @change="
-                      () => {
-                        if (this.dprJdrq && this.dprJdrq.length > 0) {
-                          this.queryParams.jdrqStart = this.dprJdrq[0];
-                          this.queryParams.jdrqEnd = this.dprJdrq[1];
-                        } else {
-                          this.queryParams.jdrqStart = undefined;
-                          this.queryParams.jdrqEnd = undefined;
-                        }
+                  建档日期：<el-date-picker v-model="dprJdrq" type="daterange" align="right" unlink-panels range-separator="至"
+                    start-placeholder="建档开始日期" end-placeholder="建档结束日期" value-format="yyyy-MM-dd"
+                    :picker-options="pickerOptions" size="small" style="width: 438px" @change="() => {
+                      if (this.dprJdrq && this.dprJdrq.length > 0) {
+                        this.queryParams.jdrqStart = this.dprJdrq[0];
+                        this.queryParams.jdrqEnd = this.dprJdrq[1];
+                      } else {
+                        this.queryParams.jdrqStart = undefined;
+                        this.queryParams.jdrqEnd = undefined;
                       }
-                    "
-                  >
+                    }
+                      ">
                   </el-date-picker>
                 </div>
               </div>
@@ -282,56 +122,32 @@
               <el-tag>分类匹配</el-tag>
               <div class="filterDiv">
                 <div style="margin: 5px">
-                  用户编号：<el-input
-                    v-model="queryParams.yhbh"
-                    placeholder="请输入"
-                    size="small"
-                    style="width: 200px"
-                  ></el-input>
+                  用户编号：<el-input v-model="queryParams.yhbh" placeholder="请输入" size="small"
+                    style="width: 200px"></el-input>
                 </div>
                 <div style="margin: 5px">
-                  用户姓名：<el-input
-                    v-model="queryParams.yhxm"
-                    placeholder="请输入"
-                    size="small"
-                    style="width: 200px"
-                  ></el-input>
+                  用户姓名：<el-input v-model="queryParams.yhxm" placeholder="请输入" size="small"
+                    style="width: 200px"></el-input>
                 </div>
                 <div style="margin: 5px">
-                  用户地址：<el-input
-                    v-model="queryParams.yhdz"
-                    placeholder="请输入"
-                    size="small"
-                    style="width: 200px"
-                  ></el-input>
+                  用户地址：<el-input v-model="queryParams.yhdz" placeholder="请输入" size="small"
+                    style="width: 200px"></el-input>
                 </div>
                 <div style="margin: 5px">
-                  联系电话：<el-input
-                    v-model="queryParams.lxdh"
-                    placeholder="请输入"
-                    size="small"
-                    style="width: 200px"
-                  ></el-input>
+                  联系电话：<el-input v-model="queryParams.lxdh" placeholder="请输入" size="small"
+                    style="width: 200px"></el-input>
                 </div>
               </div>
             </el-col>
           </el-row>
         </el-main>
         <el-footer style="text-align: right; padding-top: 8px">
-          <el-button
-            type="warning"
-            icon="el-icon-check"
-            @click="
-              () => {
-                this.pageInfo.current = 1;
-                this.bindList(true);
-              }
-            "
-            >确 定</el-button
-          >
-          <el-button  type="warning" icon="el-icon-close" @click="$refs.drawer.closeDrawer()"
-            >关 闭</el-button
-          >
+          <el-button type="warning" icon="el-icon-check" @click="() => {
+            this.pageInfo.current = 1;
+            this.bindList(true);
+          }
+            ">确 定</el-button>
+          <el-button type="warning" icon="el-icon-close" @click="$refs.drawer.closeDrawer()">关 闭</el-button>
         </el-footer>
       </el-container>
     </el-drawer>
@@ -444,17 +260,34 @@ export default {
           label: "用户状态",
           prop: "yhzt",
           align: "center",
-          formatter: function (row, column, value, index) {
+          renderer: function (h, row, column, value, index) {
             if (value == "作废用户") {
-              // return Object.assign({}, { 'background-color': '#CDCDCD', 'text-decoration': 'line-through' }, definedParams)
-              return (
-                '<div><span class="el-tag el-tag--danger el-tag--light">' +
-                value +
-                "</span></div>"
-              );
+              // return h('elTag', {
+              //   attrs: { type: "danger" },
+              //   on: {
+              //     click: function () {
+              //       $this.doTest();
+              //     }
+              //   }
+              // }, value);
+              return <el-tag type="danger">{value}</el-tag>;
             }
-            return value;
+            else {
+              return <span>{value}</span>;
+            }
+
           },
+          // formatter: function (row, column, value, index) {
+          //   if (value == "作废用户") {
+          //     // return Object.assign({}, { 'background-color': '#CDCDCD', 'text-decoration': 'line-through' }, definedParams)
+          //     return (
+          //       '<div><span class="el-tag el-tag--danger el-tag--light">' +
+          //       value +
+          //       "</span></div>"
+          //     );
+          //   }
+          //   return value;
+          // },
         },
       ],
       dataList: [], // 表格数据
@@ -574,7 +407,7 @@ export default {
       }
     },
   },
-  created() {},
+  created() { },
   mounted() {
     this.bindList();
   },
@@ -614,7 +447,7 @@ export default {
         .catch((ex) => {
           this.$message.error("查询失败！");
         })
-        .finally(() => {});
+        .finally(() => { });
     },
     resetDetailData() {
       // 表单数据
@@ -679,7 +512,7 @@ export default {
         .catch((ex) => {
           this.$message.error("导出失败！");
         })
-        .finally(() => {});
+        .finally(() => { });
     },
     /**
      * @description 显示详情