feat: 文件下发—— 仓储费规则设置

src/api/basic_data/dealer.js

@@ -1,5 +1,46 @@
-import request, { handleImport, postBlob } from '@/utils/request'
+import request, { postBlob, handleImport, getBlob } from '@/utils/request'
+export function getDealerListV2(params) {
+  return request({
+    url: `/customer/list/v2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+export function exportDealerListV2(data, name) {
+  return postBlob({
+    url: '/customer/user/export/v2',
+    data,
+    name
+  })
+}
+export function getDealerStockListV2(params) {
+  return request({
+    url: `/customer/pt/list/v2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+export function exportDealerStockListV2(data, name) {
+  return postBlob({
+    url: '/customer/pt/user/export/v2',
+    data,
+    name
+  })
+}
 
+export function importCustomerV2(data) {
+  return handleImport('customer/import', data.formdata, data.id || '')
+}
+export function importCustomerPtV2(data) {
+  return handleImport('customer/pt/importData', data.formdata, data.id || '')
+}
+export function downloadCustomerPtV2(data, name) {
+  return getBlob({
+    url: 'customer/pt/download',
+    data,
+    name
+  })
+}
 //获取经销商列表
 export function getDealerList(params) {
   return request({

src/api/basic_data/material.js

@@ -1,4 +1,58 @@
-import request from '@/utils/request'
+import request, { postBlob, handleImport, getBlob } from '@/utils/request'
+export function getMaterialListV2(params) {
+  return request({
+    url: `/k3/material/list/v2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+
+export function getMachineLlistV2(params) {
+  return request({
+    url: `/v2/machine-record/list?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+export function exportMachineLlistV2(data, name) {
+  return postBlob({
+    url: '/v2/machine-record/list/export',
+    data,
+    name
+  })
+}
+
+
+export function getCategoryListV2(params) {
+  return request({
+    url: `/v2/k3/category/list?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+export function exportCategoryListV2(data, name) {
+  return postBlob({
+    url: '/v2/k3/category/list/export',
+    data,
+    name
+  })
+}
+
+export function getProductListV2(params) {
+  return request({
+    url: `/v2/product-compose/list?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+export function exportProductListV2(data, name) {
+  return postBlob({
+    url: '/v2/product-compose/list/export',
+    data,
+    name
+  })
+}
+
 
 export function getList(params) {
   return request({
@@ -32,6 +86,7 @@ export function getMaterialList(params) {
 }
 
 export function getMaterialDetail(params) {
+  console.log(params,999);
   return request({
     url: '/k3/material/detail',
     method: 'get',

src/api/basic_data/supplier.js

@@ -1,4 +1,19 @@
-import request from '@/utils/request'
+import request, { postBlob, handleImport, getBlob } from '@/utils/request'
+export function getListV2(params) {
+  return request({
+    url: `/supplier/listV2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+export function exportListV2(data, name) {
+  return postBlob({
+    url: '/supplier/listV2/export',
+    data,
+    name
+  })
+}
+
 
 export function getList(params) {
   return request({

src/api/basic_data/warehouse.js

@@ -1,4 +1,55 @@
-import request from '@/utils/request'
+import request, { postBlob, handleImport, getBlob } from '@/utils/request'
+
+export function getListV2(params) {
+  return request({
+    url: `/stock/listV2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+
+export function exportListV2(data, name) {
+  return postBlob({
+    url: '/stock/listV2/export',
+    data,
+    name
+  })
+}
+export function importStockV2(data) {
+  return handleImport('stock/importToll', data.formdata, data.id || '')
+}
+
+export function getListStockV2(params) {
+  return request({
+    url: `/stock/listStockV2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+
+export function exportListStockV2(data, name) {
+  return postBlob({
+    url: '/stock/listStockV2/export',
+    data,
+    name
+  })
+}
+
+export function getListTollV2(params) {
+  return request({
+    url: `/stock/listTollV2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
+
+export function exportListTollV2(data, name) {
+  return postBlob({
+    url: '/stock/listTollV2/export',
+    data,
+    name
+  })
+}
 
 export function getList(params) {
   return request({
@@ -16,6 +67,14 @@ export function getStockDetail(params) {
   })
 }
 
+export function getStockDetailStock(params) {
+  return request({
+    url: '/stock/detailStock',
+    method: 'get',
+    params
+  })
+}
+
 export function getListReserve(params) {
   return request({
     url: '/stock/listReserve',
@@ -24,6 +83,8 @@ export function getListReserve(params) {
   })
 }
 
+
+
 export function getListStock(params) {
   return request({
     url: '/stock/listStock',

src/api/issue.js

@@ -1,4 +1,12 @@
-import request from '@/utils/request'
+import request, { postBlob,  getBlob } from '@/utils/request'
+
+export function getListV2(params) {
+  return request({
+    url: `/com/list/list/v2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
 
 // 获取列表
 export function getList(params) {

src/api/notice.js

@@ -1,5 +1,12 @@
-import request from '@/utils/request'
+import request, { postBlob, handleImport, getBlob } from '@/utils/request'
 
+export function getListV2(params) {
+  return request({
+    url: `/notice/list/v2?moduleId=${params.moduleId}`,
+    method: 'post',
+    data: params
+  })
+}
 // 获取列表
 export function getList(params) {
   return request({

src/views/basic_data/dealer/components/dealer_list-detail.vue

@@ -370,7 +370,7 @@ export default {
   },
   methods: {
     goBack() {
-      this.$parent.isShow = true
+      this.$emit('close')
     },
     //金蝶存货类别列表
     async getDataList() {
@@ -404,7 +404,7 @@ export default {
         frontCategory:this.isFront? this.frontCategory.join(','):''
       }).then(res => {
         this.$successMsg('保存成功')
-        this.$parent.isShow = true
+        this.$emit('close')
       })
     }
   }

src/views/basic_data/dealer/dealer_list.vue

@@ -1,209 +1,95 @@
 <template>
-  <div class="app-container">
-    <div v-if="isShow">
-      <!-- 筛选条件 -->
-      <div>
-        <Collapse :screen-form="searchForm">
-          <template #right_btn>
-            <el-button size="mini" @click="clearFn">清空</el-button>
-            <el-button size="mini" type="primary" @click="searchFn">搜索</el-button>
-          </template>
-          <template #search>
-            <el-form ref="searchForm" :model="searchForm" label-width="70px" size="mini" label-position="left">
-              <el-row :gutter="20">
-                <el-col :xs="24" :sm="12" :lg="6">
-                  <el-form-item label="名称" prop="keyword">
-                    <el-input v-model="searchForm.keyword" placeholder="请输入名称"></el-input>
-                  </el-form-item>
-                </el-col>
-              </el-row>
-            </el-form>
-          </template>
-        </Collapse>
-      </div>
-      <!-- 按钮 -->
-      <div class="btn-group clearfix">
-        <div class="fr">
-          <ExportButton :exUrl="'customer/export'" :exParams="exParams" />
-        </div>
-        <div class="fl">
-          <ImportButton :imUrl="'customer/import'" @importSuccess="getList" />
-        </div>
-
-      </div>
-
-      <div class="mymain-container">
-        <div class="table">
-          <el-table
-            v-loading="listLoading"
-            :data="dataList"
-            element-loading-text="Loading"
-            border
-            fit
-            highlight-current-row
-            stripe
-          >
-            <el-table-column align="left" label="客户编码" prop="number" min-width="110">
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.number" />
-                <span>{{ scope.row.number }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="客户名称" prop="name" min-width="260" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.name" />
-                <span>{{ scope.row.name }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="left"
-              label="简称"
-              prop="shortName"
-              min-width="200"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column prop="forbidStatus" align="left" label="禁用状态" min-width="100" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <el-tag size="mini" type="success" v-if="scope.row.forbidStatus === 'A'">正常</el-tag>
-                <el-tag size="mini" type="danger" v-else-if="scope.row.flag === 'B'">禁用</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="left"
-              label="使用组织"
-              prop="useOrgName"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="更新人"
-              prop="updateBy"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="更新时间"
-              prop="updateTime"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-
-            <el-table-column
-              align="center"
-              label="操作"
-              prop="caozuo"
-              min-width="160"
-              show-overflow-tooltip
-              fixed="right"
-            >
-              <template slot-scope="scope">
-                <el-button type="text" class="textColor" @click="editFn(scope.row.id)">详情</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
-        <!-- 分页 -->
-        <div class="fr">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="pageSize"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-          >
-          </el-pagination>
-        </div>
-      </div>
-    </div>
-    <DealerListDetail :infoList="inforList" :detailsId="detailsId" v-else />
-  </div>
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :exportList="exportList"
+    :operation="operation()"
+    :optionsEvensGroup="optionsEvensGroup"
+    :columnParsing="columnParsing"
+  >
+    <Popu v-if="visible">
+      <DealerListDetail :detailsId="detailsId" @close="handleClose" />
+    </Popu>
+  </template-page>
 </template>
 
 <script>
-import { getDealerList, getDealerInfo } from '@/api/basic_data/dealer'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
+import { getDealerListV2, exportDealerListV2,importCustomerV2 } from '@/api/basic_data/dealer'
 import DealerListDetail from './components/dealer_list-detail.vue'
-
 export default {
+  components: { TemplatePage, Popu, DealerListDetail },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
-      isShow: true,
-      dataList: [], // 列表数据
-      detailsId: '',
-      listLoading: false, // 列表加载loading
-      screenForm: {},
-      currentPage: 1, // 当前页码
-      pageSize: 10, // 每页数量
-      listTotal: 0, // 列表总数
-      searchForm: {
-        keyword: ''
+      visible: false,
+      // 事件组合
+      optionsEvensGroup: [
+       [
+          [
+            {
+              name: '导入',
+              render: this.importButton(importCustomerV2)
+            }
+          ]
+        ],
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
       },
-      inforList: {},
-      isCollapse: true
-    }
-  },
-  components: {
-    DealerListDetail
-  },
-  created() {
-    this.getList()
-  },
-  computed: {
-    exParams() {
-      return {
-        keyword: this.searchForm.keyword
-      }
+      recordSelected: [],
+
+      detailsId: ''
     }
   },
   methods: {
-    // 提交筛选表单
-    submitScreenForm() {
-      this.currentPage = 1
-      this.getList()
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getDealerListV2(...p)
     },
-    // 重置筛选表单
-    resetScreenForm() {
-        this.$refs.screenForm.resetFields()
-      this.currentPage = 1
-      this.getList()
+    // 列表导出函数
+    exportList: exportDealerListV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
     },
-    // 更改每页数量
-    handleSizeChange(val) {
-      this.pageSize = val
-      this.currentPage = 1
-      this.getList()
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
     },
-    // 更改当前页
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.getList()
-    },
-    //搜索功能
-    async searchFn() {
-      this.currentPage = 1
-      this.getList()
-    },
-    //重置
-    clearFn() {
-      this.$refs.searchForm.resetFields()
-    },
-    //获取列表数据
-    async getList() {
-      let params = {
-        ...this.searchForm,
-        pageNum: this.currentPage,
-        pageSize: this.pageSize
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            <el-button
+              size="mini"
+              type="text"
+              onClick={ () => {
+                this.visible = true
+                this.detailsId = row.id
+              }}
+            >
+              查看
+            </el-button>
+          </div>
+        )
       }
-      const res = await getDealerList(params)
-      this.dataList = res.data.records
-      this.listTotal = res.data.total
     },
-    editFn(id) {
-      this.isShow = false
-      this.detailsId = id
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
     }
   }
 }

src/views/basic_data/dealer/dealer_stock.vue

@@ -1,189 +1,14 @@
 <template>
-  <div class="app-container">
-    <!-- 筛选条件 -->
-    <div>
-      <Collapse :screen-form="searchForm">
-        <template #right_btn>
-          <el-button size="mini" @click="clearFn">清空</el-button>
-          <el-button size="mini" type="primary" @click="searchFn">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="searchForm" :model="searchForm" label-width="100px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="经销商名称" prop="customerName">
-                  <el-input v-model="searchForm.customerName" placeholder="请输入经销商名称"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-    </div>
-
-    <div class="btn-group clearfix">
-      <div class="fl">
-        <el-button
-          v-if="$checkBtnRole('add', $route.meta.roles)"
-          type="primary"
-          size="mini"
-          @click="addFn"
-          class="add-right"
-          icon="el-icon-plus"
-          >新增</el-button
-        >
-        <el-popconfirm
-          v-if="$checkBtnRole('del', $route.meta.roles)"
-          @onConfirm="deleFn"
-          title="这是一段内容确定删除吗？"
-        >
-          <el-button
-            :disabled="ids.length < 1"
-            type="danger"
-            size="mini"
-            class="textColor"
-            icon="el-icon-minus"
-            slot="reference"
-            >批量删除</el-button
-          >
-        </el-popconfirm>
-      </div>
-      <div class="fr">
-        <el-button type="primary" size="mini" @click="downLoadFns">导出</el-button>
-        <el-button type="primary" size="mini" @click="downLoadFn">下载模板</el-button>
-        <el-upload
-          class="import-btn"
-          action=""
-          :http-request="handleImport"
-          :file-list="importFileList"
-          :show-file-list="false"
-        >
-          <el-button type="primary" size="mini">导入</el-button>
-        </el-upload>
-      </div>
-    </div>
-
-    <div class="mymain-container">
-      <!-- 列表 -->
-      <div class="table">
-        <el-table
-          v-loading="listLoading"
-          :data="dataList"
-          @select="hanleSelect"
-          @select-all="hanleSelect"
-          element-loading-text="Loading"
-          border
-          fit
-          highlight-current-row
-          stripe
-        >
-          <el-table-column type="selection" align="center" min-width="51"></el-table-column>
-          <el-table-column align="left" label="经销商编码" prop="customerNumber" min-width="110" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <CopyButton :copyText="scope.row.customerNumber" />
-              <span>{{ scope.row.customerNumber }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="left" label="经销商名称" prop="customerName" min-width="260" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <CopyButton :copyText="scope.row.customerName" />
-              <span>{{ scope.row.customerName }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="left" label="金蝶部门编号" prop="k3OrgNumber" min-width="200" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <CopyButton :copyText="scope.row.k3OrgNumber" />
-              <span>{{ scope.row.k3OrgNumber }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="left" label="金蝶部门名称" prop="k3OrgName" min-width="200" show-overflow-tooltip>
-          </el-table-column>
-
-          <el-table-column
-            align="left"
-            label="钱包名称"
-            prop="customerWalletName"
-            min-width="200"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="业务员"
-            prop="serviceName"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="创建人"
-            prop="createBy"
-            min-width="180"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="创建时间"
-            prop="createTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="更新人"
-            prop="updateBy"
-            min-width="180"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="更新时间"
-            prop="updateTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="操作"
-            prop="caozuo"
-            min-width="160"
-            show-overflow-tooltip
-            fixed="right"
-          >
-            <template slot-scope="scope">
-              <el-button
-                type="text"
-                class="textColor"
-                v-if="$checkBtnRole('edit', $route.meta.roles)"
-                @click="editFn(scope.row.id)"
-                >编辑</el-button
-              >
-              <el-popconfirm
-                @onConfirm="deleFn(scope.row.id)"
-                v-if="$checkBtnRole('del', $route.meta.roles)"
-                title="这是一段内容确定删除吗？"
-              >
-                <el-button type="text" class="textColor" slot="reference">删除</el-button>
-              </el-popconfirm>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-      <!-- 分页 -->
-      <div class="fr">
-        <el-pagination
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          :page-sizes="[10, 20, 30, 50]"
-          :page-size="pageSize"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="listTotal"
-        >
-        </el-pagination>
-      </div>
-    </div>
-
-    <!-- 弹窗 -->
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :optionsEvensGroup="optionsEvensGroup"
+    :exportList="exportList"
+    :operation="operation()"
+    :tableEvents="tableEvents"
+    :tableAttributes="tableAttributes"
+    :columnParsing="columnParsing"
+  >
     <el-dialog :title="title" :visible.sync="dialogForm" width="30%" :show-close="false" :close-on-click-modal="false">
       <el-form ref="addForm" :model="addForm" :rules="rules" label-width="100px" label-position="right">
         <el-form-item label="经销商名称" prop="customerId">
@@ -199,12 +24,8 @@
         </el-form-item>
         <el-form-item label="经销商编码" prop="customerNumber">
           <el-input disabled v-model="addForm.customerNumber"></el-input>
-          <!-- <template slot-scope="scope">
-            {{ scope.row }}
-          </template> -->
         </el-form-item>
         <el-form-item label="金蝶部门编号" prop="k3OrgNumber">
-          <!--          <el-input v-model="addForm.k3OrgNumber"></el-input>-->
           <el-select class="selectStyle" v-model="addForm.k3OrgNumber" placeholder="请选择" filterable>
             <el-option
               v-for="item in k3DepartmentList"
@@ -236,57 +57,6 @@
             clearable
           ></el-cascader>
         </el-form-item>
-        <!-- <el-form-item label="一级区域" prop="oneParentId">
-          <el-select
-            class="selectStyle"
-            v-model="addForm.oneParentId"
-            placeholder="请选择"
-            filterable
-            @change="changeOneFn"
-          >
-            <el-option
-              v-for="item in oneList"
-              :key="item.adminWebsitId"
-              :label="item.name"
-              :value="item.adminWebsitId"
-            >
-            </el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item label="二级区域" prop="">
-          <el-select
-            filterable
-            class="selectStyle"
-            v-model="addForm.twoParentId"
-            placeholder="请选择"
-            @change="changeTwoFn"
-          >
-            <el-option
-              v-for="item in twoList"
-              :key="item.adminWebsitId"
-              :label="item.name"
-              :value="item.adminWebsitId"
-            >
-            </el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item label="三级区域" prop=""
-          ><el-select
-            class="selectStyle"
-            v-model="addForm.threeParentId"
-            placeholder="请选择"
-            filterable
-            @change="changeThreeFn"
-          >
-            <el-option
-              v-for="item in threeList"
-              :key="item.adminWebsitId"
-              :label="item.name"
-              :value="item.adminWebsitId"
-            >
-            </el-option>
-          </el-select>
-        </el-form-item> -->
         <el-form-item label="对应业务员" prop="serviceId">
           <el-select class="selectStyle" v-model="addForm.serviceId" placeholder="请选择" filterable>
             <el-option v-for="(item, i) in userList" :key="i" :label="item.nickName" :value="item.adminUserId">
@@ -299,12 +69,17 @@
         <el-button type="primary" @click="addDataListFn">确 定</el-button>
       </div>
     </el-dialog>
-  </div>
+  </template-page>
 </template>
 
 <script>
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
 import {
-  getDealerStockList,
+  getDealerStockListV2,
+  exportDealerStockListV2,
   getDealerStockAdd,
   deleDealerStockList,
   getDictionaries,
@@ -314,36 +89,94 @@ import {
   getCustomerPtDetail,
   getCustomerPtUpdate,
   getWalletCustomerList,
-  getK3DepartmentList
+  getK3DepartmentList,
+  downloadCustomerPtV2,
+  importCustomerPtV2
 } from '@/api/basic_data/dealer'
 import { getDealerList } from '@/api/basic_data/dealer'
 import { getDepartmentList } from '@/api/setting'
-import { downloadFiles, handleImport } from '@/utils/util'
-
 export default {
+  components: { TemplatePage, Popu },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
+      visible: false,
+      // 事件组合
+      optionsEvensGroup: [
+        [
+          [
+            {
+              name: '新增',
+              click: this.addOn(() => {
+                this.addFn()
+              }),
+              isRole: this.$checkBtnRole('add', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '批量删除',
+              click: async () => {
+                if (this.recordSelected.length === 0) {
+                  this.$message.error('请选择需要删除的数据')
+                  return
+                }
+                let dis = this.recordSelected.map(v => {
+                  return v.id
+                })
+                let params = {ids:dis.toString()}
+                await deleDealerStockList(params)
+                this.$refs.pageRef.refreshList()
+                this.$message.success('批量删除成功')
+              },
+              isRole: this.$checkBtnRole('del', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '导入',
+              render: this.importButton(importCustomerPtV2)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '导入模版',
+              click: () => {
+                downloadCustomerPtV2({}, `${this.$route.meta.title}`)
+                  .then(res => {
+                    this.$message({
+                      message: '下载成功',
+                      type: 'success'
+                    })
+                  })
+                  .catch(err => {
+                    this.$message.error('下载失败')
+                  })
+              }
+            }
+          ]
+        ]
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
+      recordSelected: [],
       props: {
         checkStrictly: true,
         value: 'adminWebsitId',
         label: 'name'
-
-        // expandTrigger: "hover",
-        // lazy: true,
-        // lazyLoad(node, resolve) {
-        //   console.log(node);
-        //   const { value } = node;
-        //   setTimeout(async () => {
-        //     let res = await getAdminWebsitByparent({
-        //       parentId: value,
-        //     });
-        //     let aaa = res.data.map((v) => {
-        //       return { value: v.adminWebsitId, label: v.name };
-        //     });
-
-        //     resolve(aaa);
-        //   }, 0);
-        // },
       },
       options: [],
       importFileList: [],
@@ -356,9 +189,6 @@ export default {
         customerNumber: '',
         k3OrgNumber: '',
         region: [],
-        // oneParentId: "",
-        // twoParentId: "",
-        // threeParentId: "",
         serviceId: '',
         customerWalletId: ''
       },
@@ -367,15 +197,6 @@ export default {
         customerId: [{ required: true, message: '请选择经销商名称', trigger: 'change' }],
         customerWalletId: [{ required: true, message: '请选择经销商钱包', trigger: 'change' }],
         region: [{ required: true, message: '请选择区域', trigger: 'change' }],
-        // oneParentId: [
-        //   { required: true, message: "请选择一级区域", trigger: "blur" },
-        // ],
-        // twoParentId: [
-        //   { required: true, message: "请选择二级区域", trigger: "blur" },
-        // ],
-        // threeParentId: [
-        //   { required: true, message: "请选择三级区域", trigger: "blur" },
-        // ],
         serviceId: [{ required: true, message: '请选择业务员', trigger: 'change' }]
       },
 
@@ -390,27 +211,13 @@ export default {
       dataList: [], // 列表数据
       listLoading: false, // 列表加载loading
       dealerList: [],
-      // selectList: [],
       walletList: [], //产品大类列表
-      // oneList: [], //一级区域数据
-      // twoList: [], //二级区域数据
-      // threeList: [], //三级区域数据
       userList: [], //业务员
       ids: [],
       rowID: null, //编辑ID
       k3DepartmentList: []
     }
   },
-  async created() {
-    this.getTree()
-    // this.getAdminWebsit(1);
-    this.getList()
-    this.getK3DepartmentList()
-    this.getDealerDataList({ pageNum: 1, pageSize: -1 })
-    this.getUserList(1)
-    // this.getSelectList({ sysDictEnum: "PRODUCT_TYPE" });
-  },
-  computed: {},
   watch: {
     'addForm.region': function (newValue) {
       // console.log(newValue, 888);
@@ -431,32 +238,60 @@ export default {
         this.walletList = res2.data
       }
     }
-    // "addForm.oneParentId": async function (newValue) {
-    //   if (newValue) {
-    //     let res = await getAdminWebsitByparent({
-    //       parentId: newValue,
-    //       // mainId: this.mainId,
-    //     });
-    //     this.twoList = res.data;
-    //   }
-    // },
-    // "addForm.twoParentId": async function (newValue) {
-    //   if (newValue) {
-    //     let res = await getAdminWebsitByparent({
-    //       parentId: newValue,
-    //       // mainId: this.mainId,
-    //     });
-    //     this.getUserList(newValue);
-    //     this.threeList = res.data;
-    //   }
-    // },
-    // "addForm.threeParentId": async function (newValue) {
-    //   if (newValue) {
-    //     this.getUserList(newValue);
-    //   }
-    // },
+  },
+  async created() {
+    this.getTree()
+    this.getK3DepartmentList()
+    this.getDealerDataList({ pageNum: 1, pageSize: -1 })
+    this.getUserList(1)
   },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getDealerStockListV2(...p)
+    },
+    // 列表导出函数
+    exportList: exportDealerStockListV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.$checkBtnRole('edit', this.$route.meta.roles) ? (
+              <el-button
+                size="mini"
+                type="text"
+                onClick={() => {
+                  this.editFn(row.id)
+                }}
+              >
+                编辑
+              </el-button>
+            ) : null}
+            {this.$checkBtnRole('del', this.$route.meta.roles) ? (
+              <el-popconfirm onONConfirm={() => this.deleFn(row.id)} title="这是一段内容确定删除吗？">
+                <el-button style="font-size:12px" type="text" class="textColor" slot="reference">
+                  删除
+                </el-button>
+              </el-popconfirm>
+            ) : null}
+          </div>
+        )
+      }
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
+    },
     // 导入
     async handleImport(param) {
       const file = param.file
@@ -466,7 +301,7 @@ export default {
       this.importFileList = []
       if (result.code == 200) {
         this.$message.success('导入成功')
-        await this.getList()
+        await this.$refs.pageRef.refreshList()
       } else {
         this.$message.error(result.message)
       }
@@ -484,39 +319,16 @@ export default {
     downLoadFns() {
       downloadFiles('customer/pt/export')
     },
-    // //改变产品大类
-    // changeSelectFn(value) {
-    //   // const res = this.categoryList.filter((v) => v.productCategoryId == value);
-    //   // console.log(res);
-    //   // this.mainId = res[0].productCategoryNumber;
-    // },
     //编辑
     async changeFn(v) {
       this.addForm.customerWalletId = ''
     },
-    // async changeOneFn(v) {
-    //   this.addForm.twoParentId = "";
-    //   this.addForm.threeParentId = "";
-    //   this.addForm.serviceId = "";
-    // },
-    // async changeTwoFn(v) {
-    //   this.addForm.threeParentId = "";
-    //   this.addForm.serviceId = "";
-    // },
-    // async changeThreeFn(v) {
-    //   this.addForm.serviceId = "";
-    // },
     async editFn(id) {
       this.title = '经销商业务关系管理 '
       this.rowID = id
       let res = await getCustomerPtDetail({ id })
-      // console.log(res);
-
       this.addForm.customerId = res.data.customerId
       this.addForm.customerWalletId = res.data.customerWalletId
-      // this.addForm.oneParentId = res.data.adminWebsitId1;
-      // this.addForm.twoParentId = res.data.adminWebsitId2;
-      // this.addForm.threeParentId = res.data.adminWebsitId3;
       this.addForm.region = [res.data.adminWebsitId1, res.data.adminWebsitId2, res.data.adminWebsitId3]
       this.addForm.serviceId = res.data.serviceId
       this.addForm.k3OrgNumber = res.data.k3OrgNumber
@@ -543,29 +355,7 @@ export default {
         this.options = res.data[0].children
       })
     },
-    // //根据父级查询部门
-    // async getAdminWebsit(data) {
-    //   let res = await getAdminWebsitByparent({
-    //     parentId: data,
-    //     // mainId: this.mainId,
-    //   });
-    //   let arr = res.data.map((v) => {
-    //     return {
-    //       value: v.adminWebsitId,
-    //       label: v.name,
-    //     };
-    //   });
 
-    //   // this.options = arr;
-
-    //   this.oneList = res.data;
-    // },
-    // //获取产品类别数据
-    // async getCategoryList() {
-    //   let res = await getProductCategoryList();
-    //   console.log(res);
-    //   this.categoryList = res.data;
-    // },
     // 筛选部分数据或者单个
     hanleSelect(selection) {
       // this.ids = selection.map((k) => {
@@ -593,7 +383,7 @@ export default {
         await deleDealerStockList({ ids: res })
       }
 
-      this.getList()
+      this.$refs.pageRef.refreshList()
 
       this.$message.success('删除成功')
       this.ids = []
@@ -612,8 +402,6 @@ export default {
       let data3 = this.userList.filter(v => {
         return v.adminUserId == this.addForm.serviceId
       })
-      // console.log(data3);
-      // console.log(data2, 22222);
 
       let value = {
         customerId: this.addForm.customerId,
@@ -644,19 +432,12 @@ export default {
       this.addForm.customerWalletId = ''
       this.addForm.region = []
       this.addForm.k3OrgNumber = ''
-
-      // this.addForm.oneParentId = "";
-      // this.addForm.twoParentId = "";
-      // this.addForm.threeParentId = "";
       this.addForm.serviceId = ''
-      // this.userList = [];
-      // this.twoList = [];
-      // this.threeList = [];
       this.walletList = []
       this.$nextTick(() => {
         this.$refs['addForm'].clearValidate()
       })
-      this.getList()
+      this.$refs.pageRef.refreshList()
       this.dialogForm = false
     },
     //取消
@@ -689,37 +470,6 @@ export default {
     async getDealerDataList(data) {
       const res = await getDealerList(data)
       this.dealerList = res.data.records
-    },
-    // 更改每页数量
-    handleSizeChange(val) {
-      this.pageSize = val
-      this.currentPage = 1
-      this.getList()
-    },
-    // 更改当前页
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.getList()
-    },
-    //搜索功能
-    searchFn() {
-      this.currentPage = 1
-      this.getList()
-    },
-    //重置
-    clearFn() {
-      this.$refs.searchForm.resetFields()
-    },
-    //获取列表数据
-    async getList() {
-      let params = {
-        customerName: this.searchForm.customerName,
-        pageNum: this.currentPage,
-        pageSize: this.pageSize
-      }
-      const res = await getDealerStockList(params)
-      this.dataList = res.data.records
-      this.listTotal = res.data.total
     }
   }
 }

src/views/basic_data/material/category_list.vue

@@ -1,253 +1,88 @@
 <template>
-  <div class="app-container">
-    <div>
-      <!-- 筛选条件 -->
-      <div>
-        <Collapse :screen-form="screenForm">
-          <template #right_btn>
-            <el-button size="mini" @click="resetScreenForm">清空</el-button>
-            <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-          </template>
-          <template #search>
-            <el-form ref="screenForm" :model="screenForm" label-width="70px" size="mini" label-position="left">
-              <el-row :gutter="20">
-                <el-col :xs="24" :sm="12" :lg="6">
-                  <el-form-item label="名称" prop="keyword">
-                    <el-input placeholder="请输入名称" v-model="screenForm.keyword"></el-input>
-                  </el-form-item>
-                </el-col>
-              </el-row>
-            </el-form>
-          </template>
-        </Collapse>
-      </div>
-      <div class="mymain-container">
-        <div class="table">
-          <el-table
-            v-loading="listLoading"
-            :data="dataList"
-            element-loading-text="Loading"
-            border
-            fit
-            highlight-current-row
-            stripe
-          >
-            <el-table-column
-              align="left"
-              label="编码"
-              prop="number"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="创建组织"
-              prop="dictType"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="名称"
-              prop="name"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="使用组织"
-              prop="useOrgId"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column align="left" label="数据状态" prop="dataState" min-width="100"></el-table-column>
-            <el-table-column align="left" label="禁用状态" prop="disableState" min-width="100">
-              <template slot-scope="scope">
-                <el-tag type="success" size="mini" v-if="scope.row.forbidStatus == 'A'">正常</el-tag>
-                <el-tag type="danger" size="mini" v-else>禁用</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="left"
-              label="创建人"
-              prop="createBy"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="创建日期"
-              prop="createTime"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="修改人"
-              prop="updateBy"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="修改日期"
-              prop="updateTime"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <!-- <el-table-column
-              align="left"
-              label="审核人"
-              prop="examine"
-              min-width="100"
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="审核日期"
-              prop="examineDate"
-              min-width="100"
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="禁用人"
-              prop="disable"
-              min-width="100"
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="禁用日期"
-              prop="disableDate"
-              min-width="100"
-            ></el-table-column> -->
-          </el-table>
-        </div>
-        <!-- 分页 -->
-        <div class="fr">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-          >
-          </el-pagination>
-        </div>
-      </div>
-    </div>
-    <!-- <CategoryListDetail v-else /> -->
-  </div>
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :exportList="exportList"
+    :operation="operation()"
+    :columnParsing="columnParsing"
+  >
+
+  </template-page>
 </template>
 
 <script>
-import CategoryListDetail from './components/category_list-detail.vue'
-import { getCategoryList } from '@/api/basic_data/material'
-import Mixin from '@/mixin/index'
-
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
+import { getCategoryListV2, exportCategoryListV2 } from '@/api/basic_data/material'
 export default {
-  mixins: [Mixin],
+  components: { TemplatePage, Popu,  },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
-      isShow: true,
-      currentPage: 1, // 当前页码
-      pageSize: 10, // 每页数量
-      listTotal: 0, // 列表总数
-      dataList: [
-        {
-          code: 'ASDVDS_ASD',
-          createOrganize: '广州格匠机电工程',
-          name: '原材料',
-          useOrganize: '广州格匠机电工程',
-          dataState: '已审核',
-          disableState: '否',
-          create: 'Administrator',
-          createDate: '1993/8/8',
-          modify: 'Administrator',
-          modifyDate: '1993/8/8',
-          examine: 'Administrator',
-          examineDate: '1993/8/8',
-          disable: '',
-          disableDate: ''
-        },
-        {
-          code: 'ASDVDS_ASD',
-          createOrganize: '广州格匠机电工程',
-          name: '原材料',
-          useOrganize: '广州格匠机电工程',
-          dataState: '已审核',
-          disableState: '否',
-          create: 'Administrator',
-          createDate: '1993/8/8',
-          modify: 'Administrator',
-          modifyDate: '1993/8/8',
-          examine: 'Administrator',
-          examineDate: '1993/8/8',
-          disable: '',
-          disableDate: ''
-        },
-        {
-          code: 'ASDVDS_ASD',
-          createOrganize: '广州格匠机电工程',
-          name: '原材料',
-          useOrganize: '广州格匠机电工程',
-          dataState: '已审核',
-          disableState: '否',
-          create: 'Administrator',
-          createDate: '1993/8/8',
-          modify: 'Administrator',
-          modifyDate: '1993/8/8',
-          examine: 'Administrator',
-          examineDate: '1993/8/8',
-          disable: '',
-          disableDate: ''
-        },
-        {
-          code: 'ASDVDS_ASD',
-          createOrganize: '广州格匠机电工程',
-          name: '原材料',
-          useOrganize: '广州格匠机电工程',
-          dataState: '已审核',
-          disableState: '否',
-          create: 'Administrator',
-          createDate: '1993/8/8',
-          modify: 'Administrator',
-          modifyDate: '1993/8/8',
-          examine: 'Administrator',
-          examineDate: '1993/8/8',
-          disable: '',
-          disableDate: ''
-        }
+      visible: false,
+      // 事件组合
+      // 事件组合
+      optionsEvensGroup: [
+   
       ],
-      screenForm: {
-        keyword: ''
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
       },
-      isCollapse: true
+      recordSelected: [],
+
+      detailsId: ''
     }
   },
-  components: {
-    CategoryListDetail
-  },
   methods: {
-    editFn() {
-      this.isShow = false
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getCategoryListV2(...p)
+    },
+    // 列表导出函数
+    exportList: exportCategoryListV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
     },
-    // 初始化数据
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        keyword: this.screenForm.keyword
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {/* <el-button
+              size="mini"
+              type="text"
+              onClick={ () => {
+                this.visible = true
+                this.detailsId = row.id
+              }}
+            >
+              查看
+            </el-button> */}
+          </div>
+        )
       }
-      getCategoryList(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-      })
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
     }
   }
 }
 </script>
 
-<style></style>
+<style lang="scss" scoped></style>

src/views/basic_data/material/components/material_list-detail.vue

@@ -684,6 +684,7 @@ export default {
   data() {
     return {
       value1: '是',
+      value:'',
       dinghuo: true,
       isDisplace: ''
     }
@@ -694,8 +695,8 @@ export default {
   },
   methods: {
     goBack() {
-      console.log(this.$parent)
-      this.$parent.isShow = true
+      
+       this.$emit('close')
     },
     handleSave() {
       editCategory({
@@ -703,7 +704,7 @@ export default {
         isDisplace: this.isDisplace
       }).then(res => {
         this.$successMsg('编辑成功')
-        this.$parent.isShow = true
+         this.$emit('close')
       })
     }
   }

src/views/basic_data/material/machine_list.vue

@@ -1,207 +1,14 @@
 <template>
-  <div class="app-container">
-    <!-- 筛选条件 -->
-    <div>
-      <Collapse :screen-form="screenForm" :is-show="false">
-        <template #right_btn>
-          <el-button size="mini" @click="resetScreenForm">清空</el-button>
-          <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="screenForm" :model="screenForm" label-width="70px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="名称" prop="name">
-                  <el-input placeholder="请输入名称" v-model="screenForm.name"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="型号" prop="model">
-                  <el-input placeholder="请输入型号" v-model="screenForm.model"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="编码" prop="number">
-                  <el-input placeholder="请输入编码" v-model="screenForm.number"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="体积" prop="volume">
-                  <el-input
-                    type="number"
-                    @mousewheel.native.prevent
-                    placeholder="请输入体积"
-                    v-model.number="screenForm.volume"
-                  ></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-    </div>
-    <!-- 按钮 -->
-    <div class="btn-group clearfix">
-      <div class="fl">
-        <el-button
-          v-if="$checkBtnRole('add', $route.meta.roles)"
-          type="primary"
-          size="mini"
-          icon="el-icon-plus"
-          @click=";(showDialogForm = true), (type = 1)"
-          >新增</el-button
-        >
-        <el-popconfirm
-          v-if="$checkBtnRole('del', $route.meta.roles)"
-          confirm-button-text="好的"
-          cancel-button-text="不用了"
-          icon="el-icon-info"
-          icon-color="red"
-          :show-file-list="false"
-          title="内容确定删除吗？"
-          @onConfirm="hanleDeleteAll"
-        >
-          <el-button slot="reference" type="primary" icon="el-icon-delete" size="mini" class="textColor el-popover-left"
-            >删除</el-button
-          >
-        </el-popconfirm>
-      </div>
-      <div class="fr">
-        <!-- <el-upload
-          class="import-btn upload-demo"
-          :action="baseURL + 'student/import'"
-          :http-request="handleImport"
-          :file-list="importFileList"
-          :show-file-list="false"
-        >
-          <el-button type="primary" size="mini">导入</el-button>
-        </el-upload> -->
-        <el-button type="primary" size="mini" @click="handleExport">导出</el-button>
-        <!-- <el-button
-          type="primary"
-          size="mini"
-          icon="el-icon-printer"
-          v-print="printObj"
-          >打 印</el-button
-        > -->
-      </div>
-    </div>
-    <div class="mymain-container" id="printMe">
-      <!-- 列表 -->
-      <div class="table">
-        <el-table
-          v-loading="listLoading"
-          :data="dataList"
-          element-loading-text="Loading"
-          border
-          fit
-          highlight-current-row
-          @select-all="hanleSelectAll"
-          @select="hanleSelectAll"
-          stripe
-        >
-          <el-table-column type="selection" align="left"></el-table-column>
-          <el-table-column align="left" label="类型" prop="type" min-width="160" show-overflow-tooltip>
-            <template slot-scope="scope">
-              {{ findMachineType(scope.row.type) }}
-            </template>
-          </el-table-column>
-          <el-table-column
-            align="left"
-            label="名称"
-            prop="name"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="型号"
-            prop="model"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="编码"
-            prop="number"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="right"
-            label="体积"
-            prop="volume"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-
-          <el-table-column
-            align="left"
-            label="创建人"
-            prop="createBy"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="创建时间"
-            prop="createTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="更新人"
-            prop="updateBy"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="更新时间"
-            prop="updateTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-
-          <el-table-column align="center" fixed="right" label="操作" min-width="160" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <el-button
-                v-if="$checkBtnRole('edit', $route.meta.roles)"
-                type="text"
-                class="textColor"
-                @click="editFn(scope.row.id, scope.row)"
-                >编辑</el-button
-              >
-              <el-popconfirm
-                v-if="$checkBtnRole('del', $route.meta.roles)"
-                confirm-button-text="好的"
-                cancel-button-text="不用了"
-                icon="el-icon-info"
-                icon-color="red"
-                title="内容确定删除吗？"
-                @onConfirm="hanleDeleteAll(scope.row.id)"
-              >
-                <el-button slot="reference" type="text" class="textColor el-popover-left">删除</el-button>
-              </el-popconfirm>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-      <!-- 分页 -->
-      <div class="fr">
-        <el-pagination
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          :page-sizes="[10, 20, 30, 50]"
-          :page-size="10"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="listTotal"
-        >
-        </el-pagination>
-      </div>
-    </div>
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :exportList="exportList"
+    :optionsEvensGroup="optionsEvensGroup"
+    :operation="operation()"
+    :tableEvents="tableEvents"
+    :tableAttributes="tableAttributes"
+    :columnParsing="columnParsing"
+  >
     <!-- 弹窗 -->
     <el-dialog
       title="产品信息"
@@ -227,7 +34,12 @@
           <el-input v-model="diaLogForm.number" size="normal"></el-input>
         </el-form-item>
         <el-form-item label="体积" prop="volume">
-          <el-input v-model="diaLogForm.volume" type="number" @mousewheel.native.prevent size="normal"></el-input>
+          <el-input
+            v-model.number="diaLogForm.volume"
+            type="number"
+            @mousewheel.native.prevent
+            size="normal"
+          ></el-input>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -235,24 +47,113 @@
         <el-button type="primary" @click="hanleInfo">确 定</el-button>
       </div>
     </el-dialog>
-  </div>
+  </template-page>
 </template>
 
 <script>
-import Mixin from '@/mixin/index'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
 import { downloadFiles, handleImport } from '@/utils/util'
-import { getDistList, getMachineAdd, getMachineDel, getMachineEdit, getMachineLlist } from '@/api/basic_data/material'
-import print from 'vue-print-nb'
-
+import {
+  getDistList,
+  getMachineAdd,
+  getMachineDel,
+  getMachineEdit,
+  getMachineLlistV2,
+  exportMachineLlistV2
+} from '@/api/basic_data/material'
 export default {
-  mixins: [Mixin],
-  directives: {
-    print
-  },
+  components: { TemplatePage, Popu },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
-      printObj: {
-        id: 'printMe'
+      visible: false,
+      // 事件组合
+      // 事件组合
+      optionsEvensGroup: [
+        [
+          [
+            {
+              name: '新增',
+              click: this.addOn(() => {
+                this.showDialogForm = true
+                this.type = 1
+              }),
+              isRole: this.$checkBtnRole('add', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '批量删除',
+              click: async () => {
+                if (this.recordSelected.length === 0) {
+                  this.$message.error('请选择需要删除的数据')
+                  return
+                }
+                let ids = this.recordSelected.map(v => {
+                  return v.id
+                })
+                let params = ids
+                await getMachineDel(params)
+                this.$refs.pageRef.refreshList()
+                this.$message.success('批量删除成功')
+              },
+              isRole: this.$checkBtnRole('del', this.$route.meta.roles)
+            }
+          ]
+        ]
+        // [
+        //   [
+        //     {
+        //       name: '导入模版',
+        //       click: () => {
+        //         materialCategoryTemplateExcel({}, `${this.$route.meta.title}`)
+        //           .then(res => {
+        //             this.$message({
+        //               message: '下载成功',
+        //               type: 'success'
+        //             })
+        //           })
+        //           .catch(err => {
+        //             this.$message.error('下载失败')
+        //           })
+        //       }
+        //     }
+        //   ]
+        // ],
+        // [
+        //   [
+        //     {
+        //       name: '导出',
+        //       click: () => {
+        //         materialCategoryTemplateExcel({}, `${this.$route.meta.title}`)
+        //           .then(res => {
+        //             this.$message({
+        //               message: '下载成功',
+        //               type: 'success'
+        //             })
+        //           })
+        //           .catch(err => {
+        //             this.$message.error('下载失败')
+        //           })
+        //       }
+        //     }
+        //   ]
+        // ]
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
       },
       currentPage: 1, // 当前页码
       pageSize: 10, // 每页数量
@@ -311,8 +212,7 @@ export default {
             trigger: 'blur'
           }
         ]
-      },
-      isCollapse: true
+      }
     }
   },
   created() {
@@ -322,6 +222,53 @@ export default {
     })
   },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getMachineLlistV2(...p)
+    },
+    // 列表导出函数
+    exportList: exportMachineLlistV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.$checkBtnRole('edit', this.$route.meta.roles) ? (
+              <el-button type="text" class="textColor" onClick={() => this.editFn(row.id, row)}>
+                编辑
+              </el-button>
+            ) : null}
+            {this.$checkBtnRole('del', this.$route.meta.roles) ? (
+              <el-popconfirm
+                confirm-button-text="好的"
+                cancel-button-text="不用了"
+                icon="el-icon-info"
+                icon-color="red"
+                title="内容确定删除吗？"
+                onOnConfirm={() => this.hanleDeleteAll(row.id)}
+              >
+                <el-button slot="reference" type="text" class="textColor el-popover-left">
+                  删除
+                </el-button>
+              </el-popconfirm>
+            ) : null}
+          </div>
+        )
+      }
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
+    },
     editFn(id, row) {
       this.type = 2
       this.diaLogForm = {
@@ -338,6 +285,7 @@ export default {
       this.$refs.diaLogForm.resetFields()
     },
     hanleInfo() {
+      console.log(this.diaLogForm)
       this.$refs.diaLogForm.validate(valid => {
         if (valid) {
           if (this.type === 1) {
@@ -345,7 +293,7 @@ export default {
               this.$successMsg('保存成功')
               this.showDialogForm = false
               this.resetInfo()
-              this.getList()
+              this.$refs.pageRef.refreshList()
             })
           } else if (this.type === 2) {
             const params = {
@@ -355,7 +303,7 @@ export default {
               this.$successMsg('编辑成功')
               this.showDialogForm = false
               this.resetInfo()
-              this.getList()
+              this.$refs.pageRef.refreshList()
             })
             this.diaLogForm.id = null
           }
@@ -365,24 +313,7 @@ export default {
         }
       })
     },
-    // 初始化数据
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        name: this.screenForm.name,
-        number: this.screenForm.number,
-        model: this.screenForm.model,
-        volume: this.screenForm.volume
-      }
-      getMachineLlist(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-        console.log(this.dataList, 1233)
-      })
-    },
+
     // 导入
     async handleImport(param) {
       this.importLoading = true
@@ -397,7 +328,7 @@ export default {
         this.$alert(result.message, '导入成功', {
           confirmButtonText: '确定'
         })
-        this.getList()
+        this.$refs.pageRef.refreshList()
       } else {
         this.$alert(result.message, '导入失败', {
           confirmButtonText: '确定'
@@ -413,11 +344,9 @@ export default {
       downloadFiles('machine-record/export', screenData)
     },
     hanleDeleteAll(id) {
-      console.log(id)
-      this.hanleDeleteAllPromise(id).then(ids => {
-        getMachineDel(ids).then(res => {
-          this.getList()
-        })
+      const ids = [id]
+      getMachineDel(ids).then(res => {
+        this.$refs.pageRef.refreshList()
       })
     },
     resetInfo() {
@@ -441,7 +370,6 @@ export default {
   }
 }
 </script>
-
 <style lang="scss" scoped>
 ::v-deep .el-select {
   width: 100%;

src/views/basic_data/material/material_list.vue

@@ -1,194 +1,101 @@
 <template>
-  <div class="app-container">
-    <div v-if="isShow">
-      <!-- 筛选条件 -->
-      <div>
-        <Collapse :screen-form="screenForm">
-          <template #right_btn>
-            <el-button size="mini" @click="resetScreenForm">清空</el-button>
-            <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-          </template>
-          <template #search>
-            <el-form ref="screenForm" :model="screenForm" label-width="70px" size="mini" label-position="left">
-              <el-row :gutter="20">
-                <el-col :xs="24" :sm="12" :lg="6">
-                  <el-form-item label="名称" prop="keyword">
-                    <el-input v-model="screenForm.keyword" placeholder="请输入名称" />
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :lg="6">
-                  <el-form-item label="物料编码" prop="number">
-                    <el-input v-model="screenForm.number" placeholder="请输入物料编码" />
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :lg="6">
-                  <el-form-item label="金蝶编码" prop="oldNumber">
-                    <el-input v-model="screenForm.oldNumber" placeholder="请输入金蝶编码" />
-                  </el-form-item>
-                </el-col>
-              </el-row>
-            </el-form>
-          </template>
-        </Collapse>
-      </div>
-      <div class="mymain-container">
-        <div class="table">
-          <el-table
-            v-loading="listLoading"
-            :data="dataList"
-            element-loading-text="Loading"
-            border
-            fit
-            highlight-current-row
-            stripe
-          >
-            <!-- <el-table-column
-              type="selection"
-              align="left"
-              min-width="100"
-            ></el-table-column> -->
-            <el-table-column align="left" label="使用组织" prop="useOrgName" min-width="200" show-overflow-tooltip />
-            <el-table-column
-              align="left"
-              label="物料编码"
-              prop="number"
-              min-width="200"
-              label-class-name="bianma"
-              class-name="fontstyle"
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.number" />
-                <span>{{ scope.row.number }}</span>
-              </template>
-            </el-table-column>
-
-            <el-table-column align="left" label="产品名称" prop="name" min-width="200" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.name" />
-                <span>{{ scope.row.name }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="规格型号" prop="specification" min-width="200" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.specification" />
-                <span>{{ scope.row.specification }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="数据状态" prop="forbidStatus" min-width="100" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <el-tag size="mini" v-if="scope.row.forbidStatus == 'A'" type="success">正常</el-tag>
-                <el-tag size="mini" v-else type="danger">禁用</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="金蝶编码" prop="oldNumber" min-width="160" show-overflow-tooltip />
-            <el-table-column
-              align="left"
-              label="是否维护商城资料"
-              prop="maintainData"
-              min-width="150"
-              show-overflow-tooltip
-            />
-            <!--            <el-table-column-->
-            <!--              align="left"-->
-            <!--              label="是否维护内外机档案"-->
-            <!--              prop="maintainFiles"-->
-            <!--              min-width="100"-->
-            <!--            >-->
-            <!--              <template slot-scope="scope">-->
-            <!--                <el-tag v-if="scope.row.isSheath == true" type="success"-->
-            <!--                  >是</el-tag-->
-            <!--                >-->
-            <!--                <el-tag v-else type="danger">否</el-tag>-->
-            <!--              </template>-->
-            <!--            </el-table-column>-->
-            <el-table-column align="left" label="基本单位" prop="baseUnitId" min-width="100" show-overflow-tooltip />
-            <el-table-column align="left" label="已使用" prop="used" min-width="100" show-overflow-tooltip />
-            <el-table-column
-              align="center"
-              fixed="right"
-              label="操作"
-              prop="caozuo"
-              min-width="160"
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <el-button type="text" class="textColor" @click="hanleDetail(scope.row.id)">详情</el-button>
-                <!-- <el-button type="text" class="textColor">删除</el-button> -->
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
-        <!-- 分页 -->
-        <div class="fr">
-          <el-pagination
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-          />
-        </div>
-      </div>
-    </div>
-    <MaterialListDetail v-else :detail="detail" />
-  </div>
+  <template-page 
+    ref="pageRef"
+    :getList="getList"
+    :optionsEvensGroup="optionsEvensGroup"
+    :exportList="exportList"
+    :operation="operation()"
+    :columnParsing="columnParsing"
+  >
+    <Popu v-if="visible">
+      <MaterialListDetail  :detail="detail" @close="handleClose"/>
+    </Popu>
+  </template-page>
 </template>
 
 <script>
-import Mixin from '@/mixin/index'
-import { getMaterialDetail, getMaterialList } from '@/api/basic_data/material'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
+import { getMaterialDetail, getMaterialListV2 } from '@/api/basic_data/material'
 import MaterialListDetail from './components/material_list-detail.vue'
 
 export default {
-  components: { MaterialListDetail },
-  mixins: [Mixin],
+  components: { TemplatePage, Popu, MaterialListDetail },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
-      isShow: true,
-      screenForm: {
+      visible: false,
+      // 事件组合
+      // 事件组合
+      optionsEvensGroup: [
+       
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
+      recordSelected: [],
+      searchForm: {
         // 筛选表单数据
-        keyword: '', // 名称
-        number: '',
-        oldNumber: ''
+        name: ''
       },
-      isCollapse: true
+      detail: {}
     }
   },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getMaterialListV2(...p)
+    },
+    // 列表导出函数
+    exportList: () => {},
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            <el-button
+              size="mini"
+              type="text"
+              onClick={ () => {
+                this.visible = true
+               this.hanleDetail(row.id)
+              }}
+            >
+              查看
+            </el-button>
+          </div>
+        )
+      }
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
+    },
     hanleDetail(id) {
       getMaterialDetail({ id }).then(res => {
-        console.log(res)
         this.detail = res.data
-        this.isShow = false
       })
     },
-    getList() {
-      this.listLoading = true
-      const params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        keyword: this.screenForm.keyword,
-        number: this.screenForm.number,
-        oldNumber: this.screenForm.oldNumber
-      }
-      getMaterialList(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-      })
-    }
   }
 }
 </script>
 
-<style lang="scss" scoped>
-// ::v-deep .fontstyle {
-//   color: #0909ff;
-// }
-// ::v-deep .bianma {
-//   color: #409eff;
-// }
-</style>
+<style lang="scss" scoped></style>

src/views/basic_data/material/relation_list.vue

@@ -1,251 +1,14 @@
 <template>
-  <div class="app-container">
-    <!-- 筛选条件 -->
-    <div>
-      <Collapse :screen-form="screenForm">
-        <template #right_btn>
-          <el-button size="mini" @click="resetScreenForm">清空</el-button>
-          <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="screenForm" :model="screenForm" label-width="70px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="产品名称" prop="name">
-                  <el-input placeholder="请输入产品名称" v-model="screenForm.name"></el-input>
-                  <!--
-                  <el-select placeholder="请选择产品类别" v-model="screenForm.name">
-                  <el-option label="默认" value=""></el-option>
-                    <el-option
-                      v-for="item in materialLis"
-                      :label="item.name"
-                      :value="item.name"
-                      :key="item.id"
-                    ></el-option>
-                  </el-select> -->
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="产品型号" prop="type">
-                  <el-input placeholder="请输入产品型号" v-model="screenForm.type"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="套机编码" prop="number">
-                  <el-input placeholder="请输入套机编码" v-model="screenForm.number"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="产品体积" prop="volume">
-                  <el-input placeholder="请输入产品体积" v-model="screenForm.volume"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="外机名称" prop="outsideName">
-                  <el-input placeholder="请输入外机名称" v-model="screenForm.outsideName"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="外机型号" prop="nickname">
-                  <el-input placeholder="请输入外机型号" v-model="screenForm.outsideType"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="外机编码" prop="outsideNumber">
-                  <el-input placeholder="请输入内机编码" v-model="screenForm.outsideNumber"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="内机名称" prop="innerName">
-                  <el-input placeholder="请输入内机名称" v-model="screenForm.innerName"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="内机型号" prop="innerType">
-                  <el-input placeholder="请输入内机型号" v-model="screenForm.innerType"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="内机编码" prop="innerNumber">
-                  <el-input placeholder="请输入内机编码" v-model="screenForm.innerNumber"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-    </div>
-    <!-- 按钮 -->
-    <div class="btn-group clearfix">
-      <div class="fl">
-        <el-button
-          v-if="$checkBtnRole('add', $route.meta.roles)"
-          type="primary"
-          icon="el-icon-plus"
-          size="mini"
-          @click=";(showDialogForm = true), (type = 1), hanleMachine()"
-          >新增</el-button
-        >
-
-        <el-popconfirm
-          v-if="$checkBtnRole('del', $route.meta.roles)"
-          confirm-button-text="好的"
-          cancel-button-text="不用了"
-          icon="el-icon-info"
-          icon-color="red"
-          title="内容确定删除吗？"
-          @onConfirm="hanleDelete"
-        >
-          <el-button type="primary" size="mini" icon="el-icon-delete" slot="reference" class="el-popover-left"
-            >删除</el-button
-          >
-        </el-popconfirm>
-      </div>
-      <div class="fr">
-        <el-button type="primary" size="mini">导入</el-button>
-        <el-button type="primary" size="mini" @click="handleExport">导出</el-button>
-        <!-- <el-button type="primary" @click="hanlePrint" size="mini"
-          >打印</el-button
-        > -->
-      </div>
-    </div>
-    <div class="mymain-container">
-      <!-- 列表 -->
-      <div class="table">
-        <el-table
-          v-loading="listLoading"
-          :data="dataList"
-          element-loading-text="Loading"
-          border
-          fit
-          highlight-current-row
-          @select-all="hanleSelectAll"
-          @select="hanleSelectAll"
-          stripe
-        >
-          <el-table-column type="selection" align="left"></el-table-column>
-          <el-table-column align="left" label="产品名称" prop="materialName" min-width="160" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <CopyButton :copyText="scope.row.materialName" />
-              <span>{{ scope.row.materialName }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="left" label="产品型号" prop="productModel" min-width="160" show-overflow-tooltip>
-            <!--            <template slot-scope="scope">-->
-            <!--              <CopyButton :copyText="scope.row.productModel" />-->
-            <!--              <span>{{scope.row.productModel}}</span>-->
-            <!--            </template>-->
-          </el-table-column>
-          <el-table-column
-            align="left"
-            label="套机编码"
-            prop="composeNumber"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="right"
-            label="体积"
-            prop="productVolume"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="内机编码"
-            prop="innerMachineNumber"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="外机编码"
-            prop="outsideMachineNumber"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="配件1"
-            prop="parts1"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="配件2"
-            prop="parts2"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="创建人"
-            prop="createBy"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="创建时间"
-            prop="createTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-
-          <el-table-column
-            align="left"
-            label="更新人"
-            prop="updateBy"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="更新时间"
-            prop="updateTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-
-          <el-table-column align="center" label="操作" min-width="160" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <el-button
-                v-if="$checkBtnRole('edit', $route.meta.roles)"
-                type="text"
-                class="textColor"
-                @click="editFn(scope.row.id, scope.row, scope.$index)"
-                >编辑</el-button
-              >
-              <el-popconfirm
-                v-if="$checkBtnRole('del', $route.meta.roles)"
-                confirm-button-text="好的"
-                cancel-button-text="不用了"
-                icon="el-icon-info"
-                icon-color="red"
-                title="内容确定删除吗？"
-                @onConfirm="hanleDelete(scope.row.id)"
-              >
-                <el-button slot="reference" type="text" class="textColor el-popover-left">删除</el-button>
-              </el-popconfirm>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-      <!-- 分页 -->
-      <div class="fr">
-        <el-pagination
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          :page-sizes="[10, 20, 30, 50]"
-          :page-size="10"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="listTotal"
-        >
-        </el-pagination>
-      </div>
-    </div>
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :exportList="exportList"
+    :operation="operation()"
+    :tableAttributes="tableAttributes"
+    :tableEvents="tableEvents"
+    :optionsEvensGroup="optionsEvensGroup"
+    :columnParsing="columnParsing"
+  >
     <!-- 弹窗 -->
     <el-dialog
       title="产品信息"
@@ -316,15 +79,18 @@
         </el-row>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button @click=";(showDialogForm = false), resetInfo()">取 消</el-button>
+        <el-button @click="handleClose">取 消</el-button>
         <el-button type="primary" @click="hanleInfo">确 定</el-button>
       </div>
     </el-dialog>
-  </div>
+  </template-page>
 </template>
 
 <script>
-import Mixin from '@/mixin/index'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
 import { downloadFiles } from '@/utils/util'
 import {
   getDistList,
@@ -334,13 +100,72 @@ import {
   getProductDel,
   getProductDetail,
   getProductEdit,
-  getProductList
+  getProductListV2,
+  exportProductListV2
 } from '@/api/basic_data/material'
-
 export default {
-  mixins: [Mixin],
+  components: { TemplatePage, Popu },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
+      visible: false,
+      // 事件组合
+      // 事件组合
+      optionsEvensGroup: [
+        [
+          [
+            {
+              name: '新增',
+              click: this.addOn(() => {
+                this.showDialogForm = true
+                this.type = 1
+
+                this.hanleMachine()
+              }),
+              isRole: this.$checkBtnRole('add', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '批量删除',
+              click: async () => {
+                if (this.recordSelected.length === 0) {
+                  this.$message.error('请选择需要删除的数据')
+                  return
+                }
+                let ids = this.recordSelected.map(v => {
+                  return v.id
+                })
+                let params = { ids: ids.join() }
+                await getProductDel(params)
+                this.$refs.pageRef.refreshList()
+                this.$message.success('批量删除成功')
+              },
+              isRole: this.$checkBtnRole('del', this.$route.meta.roles)
+            }
+          ]
+        ]
+        // [
+        //   [
+        //     {
+        //       name: '导入',
+        //       render: this.importButton(importCustomerPtV2)
+        //     }
+        //   ]
+        // ],
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
       currentPage: 1, // 当前页码
       pageSize: 10, // 每页数量
       listTotal: 0, // 列表总数
@@ -389,64 +214,7 @@ export default {
         type: ''
       },
       showDialogForm: false,
-      dataList: [
-        {
-          name: '新风机',
-          number: 'DSAFSAF232312321',
-          code: 'DSAFSAF232312321',
-          volume: '23M^3',
-          inCode: 'DSAFSAF232312321',
-          outCode: 'DSAFSAF232312321',
-          partsOne: '',
-          partsTwo: '',
-          create: 'admin',
-          createDate: '2022-09-12',
-          update: 'admin',
-          updateDate: '2022-09-12'
-        },
-        {
-          name: '新风机',
-          number: 'DSAFSAF232312321',
-          code: 'DSAFSAF232312321',
-          volume: '23M^3',
-          inCode: 'DSAFSAF232312321',
-          outCode: 'DSAFSAF232312321',
-          partsOne: '',
-          partsTwo: '',
-          create: 'admin',
-          createDate: '2022-09-12',
-          update: 'admin',
-          updateDate: '2022-09-12'
-        },
-        {
-          name: '新风机',
-          number: 'DSAFSAF232312321',
-          code: 'DSAFSAF232312321',
-          volume: '23M^3',
-          inCode: 'DSAFSAF232312321',
-          outCode: 'DSAFSAF232312321',
-          partsOne: '',
-          partsTwo: '',
-          create: 'admin',
-          createDate: '2022-09-12',
-          update: 'admin',
-          updateDate: '2022-09-12'
-        },
-        {
-          name: '新风机',
-          number: 'DSAFSAF232312321',
-          code: 'DSAFSAF232312321',
-          volume: '23M^3',
-          inCode: 'DSAFSAF232312321',
-          outCode: 'DSAFSAF232312321',
-          partsOne: '',
-          partsTwo: '',
-          create: 'admin',
-          createDate: '2022-09-12',
-          update: 'admin',
-          updateDate: '2022-09-12'
-        }
-      ],
+      dataList: [],
       screenForm: {
         innerName: '',
         innerNumber: '',
@@ -476,10 +244,64 @@ export default {
       machineConfigureId: ''
     }
   },
-  mounted() {
+  created() {
     this.getMaterMacList()
   },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getProductListV2(...p)
+    },
+    // 列表导出函数
+    exportList: exportProductListV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.$checkBtnRole('edit', this.$route.meta.roles) ? (
+              <el-button
+                type="text"
+                class="textColor"
+                onClick={() => {
+                  this.editFn(row.id, row, index)
+                }}
+              >
+                编辑
+              </el-button>
+            ) : null}
+            {this.$checkBtnRole('del', this.$route.meta.roles) ? (
+              <el-popconfirm
+                confirm-button-text="好的"
+                cancel-button-text="不用了"
+                icon="el-icon-info"
+                icon-color="red"
+                title="内容确定删除吗？"
+                onOnConfirm={() => this.hanleDelete(row.id)}
+              >
+                <el-button slot="reference" type="text" class="textColor el-popover-left">
+                  删除
+                </el-button>
+              </el-popconfirm>
+            ) : null}
+          </div>
+        )
+      }
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.showDialogForm = false
+        this.resetInfo()
+      })()
+    },
     hanleAddData() {
       this.diaLogForm.items.push({
         id: '',
@@ -558,28 +380,7 @@ export default {
         }
       })
     },
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        innerName: this.screenForm.innerName,
-        innerNumber: this.screenForm.innerNumber,
-        innerType: this.screenForm.innerType,
-        name: this.screenForm.name,
-        number: this.screenForm.number,
-        outsideName: this.screenForm.outsideName,
-        outsideNumber: this.screenForm.outsideNumber,
-        outsideType: this.screenForm.outsideType,
-        type: this.screenForm.type,
-        volume: this.screenForm.volume
-      }
-      getProductList(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-      })
-    },
+
     editFn(id, row, index) {
       console.log(row, '45465')
       let dateils = null
@@ -603,46 +404,19 @@ export default {
         dateils = res.data
         console.log(dateils)
         this.diaLogForm.materialId = dateils.materialId
-        this.materialLis.find(k => {
-          if (k.id == dateils.materialId) {
-            console.log(k, '5555')
-            this.diaLogForm.productModel = k.specification
-            this.diaLogForm.productNumber = k.number
-            this.diaLogForm.productVolume = k.volume
-          }
-        })
+        this.materialLis.length &&
+          this.materialLis.find(k => {
+            if (k.id == dateils.materialId) {
+              console.log(k, '5555')
+              this.diaLogForm.productModel = k.specification
+              this.diaLogForm.productNumber = k.number
+              this.diaLogForm.productVolume = k.volume
+            }
+          })
 
         getDistList({ sysDictEnum: 'MACHINE_CONFIGURE' }).then(disType => {
-          // disType.data.find((q) => {
-          //   if (q.dictCode == dateils.items[0].type) {
-          //     this.diaLogForm.type = q.dictCode;
-          //     this.getMachineLlist(q.dictCode);
-          //     this.machineList.map((l) => {
-          //     console.log(l.id == dateils.items[0].machineConfigureId);
-          //       if (l.id == dateils.items[0].machineConfigureId) {
-          //         this.$set(this.diaLogForm.items, 0, {
-          //           id: "",
-          //           machineConfigureId: l.id,
-          //           parentId: "",
-          //           innerOutsideMachineId: l.id,
-          //           model: l.model,
-          //           name: l.name,
-          //           number: l.number || "",
-          //           type: l.type,
-          //           volume: l.volume,
-          //         });
-          //         return;
-          //       }
-          //     });
-          //   }
-          // });
-
           this.DistType = disType.data
         })
-
-        //  const machineObj =   this.getMachineLlist(dateils.items[0].type)
-        console.log(this.diaLogForm, 'lll')
-
         this.showDialogForm = true
       })
     },
@@ -653,26 +427,26 @@ export default {
         getProductAdd({ ...this.diaLogForm }).then(res => {
           this.$successMsg('保存成功')
           this.resetInfo()
-          this.getList()
+          this.$refs.pageRef.refreshList()
         })
       } else if (this.type === 2) {
         const params = { ...this.diaLogForm }
         getProductEdit(params).then(res => {
           this.$successMsg('编辑成功')
           this.resetInfo()
-          this.getList()
+          this.$refs.pageRef.refreshList()
         })
       }
 
       this.showDialogForm = false
     },
     hanleDelete(id) {
-      this.hanleDeleteAllPromise(id).then(ids => {
-        getProductDel({ ids: ids.join(',') }).then(res => {
+    
+        getProductDel({ ids: id }).then(res => {
           this.$successMsg('删除成功')
-          this.getList()
+          this.$refs.pageRef.refreshList()
         })
-      })
+     
     },
     handleExport() {
       let screenData = {

src/views/basic_data/supplier/components/supplier_list-detail.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <div class="sty">
-      <el-page-header @back="goBack" content="详情页面"> </el-page-header>
+      <el-page-header @back="onClose" content="详情页面"> </el-page-header>
     </div>
     <el-form :model="infoList" label-width="130px" size="small" label-position="right">
       <el-card class="">
@@ -370,8 +370,8 @@ export default {
   },
   created() {},
   methods: {
-    goBack() {
-      this.$parent.isShow = true
+    onClose() {
+      this.$emit('close')
     }
   }
 }

src/views/basic_data/supplier/supplier_list.vue

@@ -1,170 +1,93 @@
 <template>
-  <div class="app-container">
-    <div v-if="isShow">
-      <!-- 筛选条件 -->
-      <Collapse :screen-form="searchForm" screenFnName="searchFn">
-        <template #right_btn>
-          <el-button size="mini" @click="clearFn">清空</el-button>
-          <el-button size="mini" type="primary" @click="searchFn">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="searchForm" :model="searchForm" label-width="70px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="名称" prop="name">
-                  <el-input v-model="searchForm.name" placeholder="请输入名称"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-      <div></div>
-
-      <!-- 表格 -->
-      <div class="mymain-container">
-        <div class="table">
-          <el-table
-            v-loading="listLoading"
-            :data="dataList"
-            element-loading-text="Loading"
-            border
-            fit
-            highlight-current-row
-            stripe
-          >
-            <el-table-column
-              align="left"
-              label="编码"
-              prop="number"
-              min-width="60"
-              label-class-name="bianma"
-              class-name="fontstyle"
-            >
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.number" />
-                <span>{{ scope.row.number }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="使用组织" prop="useOrgName" min-width="160"></el-table-column>
-            <el-table-column align="left" label="名称" prop="name" min-width="200">
-              <template slot-scope="scope">
-                <CopyButton :copyText="scope.row.name" />
-                <span>{{ scope.row.name }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="简称" prop="shortName" min-width="160"> </el-table-column>
-            <el-table-column align="left" label="供应商分组" prop="groupName" min-width="160"></el-table-column>
-            <el-table-column
-              align="center"
-              label="操作"
-              prop="caozuo"
-              min-width="160"
-              show-overflow-tooltip
-              fixed="right"
-            >
-              <template slot-scope="scope">
-                <el-button type="text" class="textColor" @click="editFn(scope.row.id)">详情</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
-
-        <div class="fr">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-          >
-          </el-pagination>
-        </div>
-      </div>
-    </div>
-    <SupplierListDetail :infoList="infoList" v-else />
-  </div>
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :optionsEvensGroup="optionsEvensGroup"
+    :exportList="exportList"
+    :operation="operation()"
+    :columnParsing="columnParsing"
+  >
+    <Popu v-if="visible">
+      <supplier-list-detail :infoList="infoList"  @close="handleClose"/>
+    </Popu>
+  </template-page>
 </template>
 
 <script>
-import { getList, getInfoApi } from '@/api/basic_data/supplier'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
+import { getListV2,exportListV2,getInfoApi } from '@/api/basic_data/supplier'
 import SupplierListDetail from './components/supplier_list-detail.vue'
-
 export default {
+  components: { TemplatePage, Popu, SupplierListDetail },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
-      currentPage: 1, // 当前页码
-      pageSize: 10, // 每页数量
-      listTotal: 0, // 列表总数
+      visible: false,
+      // 事件组合
+      optionsEvensGroup: [],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
 
-      listLoading: false, // 加载
-      screenForm: {}, // 筛选表单数据
-      dataList: [], // 表格数据
-
-      isShow: true,
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
+      recordSelected: [],
       searchForm: {
         // 筛选表单数据
         name: ''
       },
-      dataList: [],
       infoList: {},
-      isCollapse: true
     }
   },
-
-  components: {
-    SupplierListDetail
-  },
-
-  async created() {
-    await this.getList()
-  },
   methods: {
-    //搜索功能
-    async searchFn() {
-      await this.getList()
-    },
-    //重置
-    clearFn() {
-      this.$refs.searchForm.resetFields()
-    },
-
-    // 更改每页数量
-    handleSizeChange(val) {
-      this.pageSize = val
-      this.getList()
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getListV2(...p)
     },
-    // 更改当前页
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.getList()
+    // 列表导出函数
+    exportList: exportListV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
     },
-    async editFn(id) {
-      this.isShow = false
-      const res = await getInfoApi({ id })
-      this.infoList = res.data
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
     },
-    async getList() {
-      let params = {
-        name: this.searchForm.name,
-        pageNum: this.currentPage,
-        pageSize: this.pageSize
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            <el-button
+              size="mini"
+              type="text"
+              onClick={async () => {
+                this.visible = true
+                const res = await getInfoApi({ id:row.id })
+                this.infoList = res.data
+              }}
+            >
+              查看
+            </el-button>
+          </div>
+        )
       }
-      let res = await getList(params)
-      this.dataList = res.data.records
-      this.listTotal = res.data.total
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
     }
   }
 }
 </script>
 
-<style lang="scss" scoped>
-.base {
-  padding: 20px;
-}
-.fr {
-  margin-top: 20px;
-}
-</style>
+<style lang="scss" scoped></style>

src/views/basic_data/warehouse/components/warehouse_list-detail.vue

@@ -2,7 +2,7 @@
   <div>
     <el-form label-width="120px" :inline="false" size="small" label-position="left">
       <div class="sty">
-        <el-page-header @back="goBack" content="详情页面"> </el-page-header>
+        <el-page-header @back="onClose" content="详情页面"> </el-page-header>
       </div>
       <el-card class="box-card">
         <div slot="header" class="clearfix">
@@ -264,13 +264,20 @@ export default {
     detail: {
       type: Object,
       default: {},
-      isReadonly: true
+    }
+  },
+  data() {
+    return {
+      isReadonly: false
     }
   },
   computed: {
     stockStatusType() {
       let typeStr = ''
-      const typeArr = this.detail.stockStatusType.split(',')
+      let typeArr =[]
+      if (this.detail&& typeof this.detail.stockStatusType ==  'string' ) {
+         typeArr = this.detail.stockStatusType &&  this.detail.stockStatusType.split(',')
+      }
       for (let i = 0; i < typeArr.length; i++) {
         switch (typeArr[i]) {
           case '1':
@@ -302,14 +309,12 @@ export default {
             break
         }
       }
-      console.log(typeStr)
       return typeStr
     }
   },
   methods: {
-    goBack() {
-      console.log(this.$parent)
-      this.$parent.isShow = true
+    onClose() {
+      this.$emit('close')
     },
     setStock() {
       setStock({
@@ -318,7 +323,7 @@ export default {
         id: this.detail.id
       }).then(res => {
         this.$successMsg('保存成功')
-        this.$parent.isShow = true
+        this.onClose()
       })
     }
   }

src/views/basic_data/warehouse/warehouse_cost.vue

@@ -1,142 +1,14 @@
 <template>
-  <div class="app-container">
-    <!-- 筛选条件 -->
-    <div>
-      <Collapse :screen-form="screenForm">
-        <template #right_btn>
-          <el-button size="mini" @click="resetScreenForm">清空</el-button>
-          <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="screenForm" :model="screenForm" label-width="120px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="经销商名称" prop="customerName">
-                  <el-input placeholder="请输入经销商名称" v-model="screenForm.customerName"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-    </div>
-    <!-- 按钮 -->
-    <div class="btn-group clearfix">
-      <div class="fl">
-        <el-button
-          type="primary"
-          size="mini"
-          v-if="$checkBtnRole('add', $route.meta.roles)"
-          icon="el-icon-plus"
-          @click=";(showDialog = true), (type = 1)"
-          >新增</el-button
-        >
-
-        <el-popconfirm
-          v-if="$checkBtnRole('del', $route.meta.roles)"
-          confirm-button-text="好的"
-          cancel-button-text="不用了"
-          icon="el-icon-info"
-          icon-color="red"
-          title="内容确定删除吗？"
-          @onConfirm="hanleDelete"
-        >
-          <el-button type="primary" size="mini" icon="el-icon-delete" slot="reference" class="el-popover-left"
-            >批量删除</el-button
-          >
-        </el-popconfirm>
-      </div>
-      <div class="fr">
-        <el-upload
-          class="import-btn"
-          :action="baseURL + 'student/import'"
-          :http-request="handleImport"
-          :file-list="importFileList"
-        >
-          <el-button type="primary" size="mini">导入</el-button>
-        </el-upload>
-        <el-button type="primary" size="mini" @click="handleExport">导出</el-button>
-        <!-- <el-button type="primary" size="mini" @click="hanlePrint"
-          >打印</el-button
-        > -->
-      </div>
-    </div>
-
-    <div class="mymain-container">
-      <!-- 列表 -->
-      <div class="table">
-        <!-- startprint -->
-        <el-table
-          v-loading="listLoading"
-          :data="dataList"
-          element-loading-text="Loading"
-          border
-          fit
-          highlight-current-row
-          stripe
-          @select-all="hanleSelectAll"
-          @select="hanleSelectAll"
-        >
-          <el-table-column type="selection" align="left" min-width="100" />
-
-          <el-table-column align="left" label="经销商编码" prop="customerNumber" min-width="200" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <CopyButton :copyText="scope.row.customerNumber" />
-              <span>{{ scope.row.customerNumber }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="left" label="经销商名称" prop="customerName" min-width="200" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <CopyButton :copyText="scope.row.customerName" />
-              <span>{{ scope.row.customerName }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="right" label="存放免费天数" prop="freeDay" min-width="160" show-overflow-tooltip />
-          <el-table-column align="right" label="收费规则(每立方米)" prop="toll" min-width="160" show-overflow-tooltip />
-          <el-table-column align="left" label="创建人" prop="createBy" min-width="200" show-overflow-tooltip />
-          <el-table-column align="left" label="创建时间" prop="createTime" min-width="200" show-overflow-tooltip />
-          <el-table-column align="left" label="更新人" prop="updateBy" min-width="200" show-overflow-tooltip />
-          <el-table-column align="left" label="更新时间" prop="updateTime" min-width="200" show-overflow-tooltip />
-          <el-table-column align="center" label="操作" fixed="right" min-width="160" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <el-button
-                type="text"
-                v-if="$checkBtnRole('edit', $route.meta.roles)"
-                class="textColor"
-                @click="editFn(scope.row.id, scope.row)"
-                >编辑</el-button
-              >
-              <el-popconfirm
-                v-if="$checkBtnRole('del', $route.meta.roles)"
-                confirm-button-text="好的"
-                cancel-button-text="不用了"
-                icon="el-icon-info"
-                icon-color="red"
-                title="内容确定删除吗？"
-                @onConfirm="hanleDelete(scope.row.id)"
-              >
-                <el-button slot="reference" type="text" class="textColor el-popover-left">删除</el-button>
-              </el-popconfirm>
-            </template>
-          </el-table-column>
-        </el-table>
-        <!-- endprint -->
-      </div>
-      <!-- 分页 -->
-      <div class="fr">
-        <el-pagination
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          :page-sizes="[10, 20, 30, 50]"
-          :page-size="10"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="listTotal"
-        >
-        </el-pagination>
-      </div>
-    </div>
-
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :exportList="exportList"
+    :operation="operation()"
+    :optionsEvensGroup="optionsEvensGroup"
+    :tableAttributes="tableAttributes"
+    :tableEvents="tableEvents"
+    :columnParsing="columnParsing"
+  >
     <!-- 弹窗 -->
     <el-dialog
       title="仓库费规则配置"
@@ -187,22 +59,91 @@
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button @click=";(showDialog = false), kong()">取 消</el-button>
+        <el-button @click="handleClose">取 消</el-button>
         <el-button type="primary" @click="hanleInfo(dialogForm)">确 定</el-button>
       </div>
     </el-dialog>
-  </div>
+  </template-page>
 </template>
 
 <script>
-import Mixin from '@/mixin/index'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
 import { downloadFiles, handleImport } from '@/utils/util'
-import { addToll, deleteToll, getCustomerList, getListToll, updateToll } from '@/api/basic_data/warehouse'
+import {
+  addToll,
+  deleteToll,
+  getCustomerList,
+  getListTollV2,
+  updateToll,
+  exportListTollV2,
+  importStockV2
+} from '@/api/basic_data/warehouse'
 
 export default {
-  mixins: [Mixin],
+  components: { TemplatePage, Popu },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
+      visible: false,
+      // 事件组合
+      // 事件组合
+      optionsEvensGroup: [
+        [
+          [
+            {
+              name: '新增',
+              click: this.addOn(() => {
+                this.getCustomerList()
+                this.showDialog = true
+                this.type = 1
+              }),
+              isRole: this.$checkBtnRole('add', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '批量删除',
+              click: async () => {
+                if (this.recordSelected.length === 0) {
+                  this.$message.error('请选择需要删除的数据')
+                  return
+                }
+                let ids = this.recordSelected.map(v => {
+                  return v.id
+                })
+                let params = { id: ids.join() }
+                await deleteToll(params)
+                this.$refs.pageRef.refreshList()
+                this.$message.success('批量删除成功')
+              },
+              isRole: this.$checkBtnRole('del', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '导入',
+              render: this.importButton(importStockV2)
+            }
+          ]
+        ]
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
       dialogForm: {
         id: null,
         customerName: '',
@@ -230,14 +171,9 @@ export default {
         freeDay: '',
         toll: ''
       },
-      type: null, // 1 新增  2 修改  null 详情
-      isCollapse: true
+      type: null // 1 新增  2 修改  null 详情
     }
   },
-  created() {
-    this.getList()
-    this.getCustomerList()
-  },
   directives: {
     'el-select-loadmore': {
       bind(el, binding) {
@@ -260,7 +196,69 @@ export default {
     }
   },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.$refs.pageRef.showTable = false
+      this.recordSelected = []
+      return getListTollV2(...p)
+    },
+    // 列表导出函数
+    exportList: exportListTollV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.$checkBtnRole('edit', this.$route.meta.roles) ? (
+              <el-button
+                type="text"
+                class="textColor"
+                onClick={() => {
+                  this.getCustomerList()
+                  this.editFn(row.id, row)
+                }}
+              >
+                编辑
+              </el-button>
+            ) : null}
+            {this.$checkBtnRole('del', this.$route.meta.roles) ? (
+              <el-popconfirm
+                confirm-button-text="好的"
+                cancel-button-text="不用了"
+                icon="el-icon-info"
+                icon-color="red"
+                title="内容确定删除吗？"
+                onOnConfirm={() => this.hanleDelete(row.id)}
+              >
+                <el-button slot="reference" type="text" class="textColor el-popover-left">
+                  删除
+                </el-button>
+              </el-popconfirm>
+            ) : null}
+          </div>
+        )
+      }
+    },
+    handleClose() {
+      this.dialogForm = {
+        customerName: '',
+        customerNumber: '',
+        freeDay: 0,
+        toll: 0
+      }
+      this.addOff(() => {
+        this.showDialog = false
+      })()
+    },
     editFn(id, row) {
+      console.log(row)
       ;(this.dialogForm = {
         id: id,
         customerName: row.customerName,
@@ -278,9 +276,9 @@ export default {
         }
         console.log(params, 78798)
         addToll(params).then(res => {
-          this.getList()
+          this.$refs.pageRef.refreshList()
           this.$successMsg('保存成功')
-          this.kong()
+          this.handleClose()
         })
       } else if (this.type === 2) {
         const paramss = {
@@ -288,28 +286,14 @@ export default {
         }
         updateToll(paramss).then(res => {
           this.$successMsg('编辑成功')
-          this.getList()
-          this.kong()
+          this.$refs.pageRef.refreshList()
+          this.handleClose()
           this.diaLogForm.id = null
         })
       }
       this.showDialog = false
     },
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        customerName: this.screenForm.customerName,
-        freeDay: this.screenForm.freeDay,
-        toll: this.screenForm.toll
-      }
-      getListToll(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-      })
-    },
+
     loadmore() {
       this.sleectBox.currentPage++
       this.getCustomerList()
@@ -345,7 +329,7 @@ export default {
     hanleDelete(id) {
       deleteToll({ id }).then(res => {
         this.$successMsg('删除成功')
-        this.getList()
+        this.$refs.pageRef.refreshList()
       })
     },
     // 导入
@@ -362,20 +346,12 @@ export default {
         this.$alert(result.message, '导入成功', {
           confirmButtonText: '确定'
         })
-        this.getList()
+        this.$refs.pageRef.refreshList()
       } else {
         this.$alert(result.message, '导入失败', {
           confirmButtonText: '确定'
         })
       }
-    },
-    kong() {
-      this.dialogForm = {
-        customerName: '',
-        customerNumber: '',
-        freeDay: 0,
-        toll: 0
-      }
     }
   }
 }
@@ -438,4 +414,3 @@ export default {
   padding: 12px;
 }
 </style>
->

src/views/basic_data/warehouse/warehouse_list.vue

@@ -1,235 +1,91 @@
 <template>
-  <div class="app-container">
-    <div v-if="isShow">
-      <!-- 筛选条件 -->
-      <div>
-        <Collapse :screen-form="screenForm">
-          <template #right_btn>
-            <el-button size="mini" @click="resetScreenForm">清空</el-button>
-            <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-          </template>
-          <template #search>
-            <el-form ref="screenForm" :model="screenForm" label-width="70px" size="mini" label-position="left">
-              <el-row :gutter="20">
-                <el-col :xs="24" :sm="12" :lg="6">
-                  <el-form-item label="名称" prop="name">
-                    <el-input placeholder="请输入名称" v-model="screenForm.name"></el-input>
-                  </el-form-item>
-                </el-col>
-              </el-row>
-            </el-form>
-          </template>
-        </Collapse>
-      </div>
-      <div class="mymain-container">
-        <div class="table">
-          <el-table
-            v-loading="listLoading"
-            :data="dataList"
-            element-loading-text="Loading"
-            border
-            fit
-            highlight-current-row
-            stripe
-          >
-            <!-- <el-table-column
-              type="selection"
-              align="left"
-              min-width="100"
-            ></el-table-column> -->
-            <el-table-column
-              align="left"
-              label="编码"
-              prop="number"
-              min-width="160"
-              show-overflow-tooltip
-              label-class-name="bianma"
-              class-name="fontstyle"
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="名称"
-              prop="name"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="仓库地址"
-              prop="address"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="仓库负责人"
-              prop="principalName"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="仓库属性"
-              prop="stockProperty"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="第三方仓储类型"
-              prop="gysStockNumber"
-              min-width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="数据状态"
-              prop="documentStatus"
-              min-width="100"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              align="left"
-              label="允许即时库存负库存"
-              prop="allowMinusQty"
-              min-width="150"
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <el-tag size="mini" type="success" v-if="scope.row.allowMinusQty !== 'false'">是</el-tag>
-                <el-tag size="mini" type="danger" v-else>否</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="left"
-              label="启用仓位管理"
-              prop="openLocation"
-              min-width="100"
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <el-tag size="mini" type="success" v-if="scope.row.openLocation !== 'false'">是</el-tag>
-                <el-tag size="mini" type="danger" v-else>否</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="left"
-              label="不参与可发量统计"
-              prop="notExpQty"
-              min-width="150"
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <el-tag size="mini" type="success" v-if="scope.row.notExpQty !== 'false'">是</el-tag>
-                <el-tag size="mini" type="danger" v-else>否</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column align="left" label="参与预警" prop="availableAlert" min-width="100" show-overflow-tooltip>
-              <template slot-scope="scope">
-                <el-tag size="mini" type="success" v-if="scope.row.availableAlert !== 'false'">是</el-tag>
-                <el-tag size="mini" type="danger" v-else>否</el-tag>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="center"
-              label="操作"
-              fixed="right"
-              prop="caozuo"
-              min-width="160"
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <el-button type="text" class="textColor" @click="hanleDetail(scope.row.id)">详情</el-button>
-                <!-- <el-button
-                  type="text"
-                  class="textColor"
-                  @click="editFn(scope.row.id, scope.row)"
-                  >编辑</el-button
-                >
-                <el-popconfirm
-                  confirm-button-text="好的"
-                  cancel-button-text="不用了"
-                  icon="el-icon-info"
-                  icon-color="red"
-                  title="内容确定删除吗？"
-                  @onConfirm="hanleDelete(scope.row.id)"
-                >
-                  <el-button
-                    slot="reference"
-                    type="text"
-                    class="textColor el-popover-left"
-                    >删除</el-button
-                  >
-                </el-popconfirm> -->
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
-        <!-- 分页 -->
-        <div class="fr">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-          >
-          </el-pagination>
-        </div>
-      </div>
-    </div>
-    <WarehouseListDetail v-else :detail="detail" />
-  </div>
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :optionsEvensGroup="optionsEvensGroup"
+    :exportList="exportList"
+    :operation="operation()"
+    :columnParsing="columnParsing"
+  >
+    <Popu v-if="visible && detail">
+      <WarehouseListDetail  :detail="detail"  @close="handleClose"/>
+    </Popu>
+  </template-page>
 </template>
 
 <script>
-import { getList, getStockDetail } from '@/api/basic_data/warehouse'
-import Mixin from '@/mixin/index'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
+import { getListV2, exportListV2,getStockDetail } from '@/api/basic_data/warehouse'
 import WarehouseListDetail from './components/warehouse_list-detail.vue'
-
 export default {
-  mixins: [Mixin],
+  components: { TemplatePage, Popu, WarehouseListDetail },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
-      isShow: true,
-      screenForm: {
-        // 筛选表单数据
-        name: '' // 名称
+      visible: false,
+      // 事件组合
+      optionsEvensGroup: [],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
       },
+      recordSelected: [],
       detail: {},
-      isCollapse: true
     }
   },
-  components: {
-    WarehouseListDetail
-  },
-
   methods: {
-    editFn() {
-      this.isShow = false
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getListV2(...p)
     },
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        name: this.screenForm.name
+    // 列表导出函数
+    exportList: exportListV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            <el-button
+              size="mini"
+              type="text"
+              onClick={async () => {
+                this.visible = true
+                getStockDetail({ id:row.id }).then(res => {
+              this.detail = res.data
+            })
+              }}
+            >
+              查看
+            </el-button>
+          </div>
+        )
       }
-      getList(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-      })
     },
-    //查看详情
-    hanleDetail(id) {
-      getStockDetail({ id }).then(res => {
-        this.detail = res.data
-      })
-      this.isShow = false
-    }
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
+    },
+
   }
 }
 </script>
+
+<style lang="scss" scoped></style>

src/views/basic_data/warehouse/warehouse_site.vue

@@ -1,177 +1,14 @@
 <template>
-  <div class="app-container">
-    <!-- 筛选条件 -->
-    <div>
-      <Collapse :screen-form="screenForm">
-        <template #right_btn>
-          <el-button size="mini" @click="resetScreenForm">清空</el-button>
-          <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="screenForm" :model="screenForm" label-width="70px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="仓库名称" prop="name">
-                  <el-input placeholder="请输入仓库名称" v-model="screenForm.name"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="仓位名称" prop="stockName">
-                  <el-input placeholder="请输入仓位名称" v-model="screenForm.stockName"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-    </div>
-    <!-- 按钮 -->
-    <div class="btn-group clearfix">
-      <div class="fl">
-        <el-button
-          type="primary"
-          icon="el-icon-plus"
-          size="mini"
-          @click="newData(), (type = 1)"
-          v-if="$checkBtnRole('add', $route.meta.roles)"
-          >新增</el-button
-        >
-        <el-popconfirm
-          confirm-button-text="好的"
-          cancel-button-text="不用了"
-          icon="el-icon-info"
-          icon-color="red"
-          title="内容确定删除吗？"
-          @onConfirm="handleDeleteAll"
-          v-if="$checkBtnRole('del', $route.meta.roles)"
-        >
-          <el-button slot="reference" type="primary" icon="el-icon-delete" size="mini" class="textColor el-popover-left"
-            >批量删除</el-button
-          >
-        </el-popconfirm>
-      </div>
-    </div>
-    <div class="mymain-container">
-      <!-- 列表 -->
-      <div class="table">
-        <el-table
-          v-loading="listLoading"
-          :data="dataList"
-          element-loading-text="Loading"
-          @select-all="hanleSelectAll"
-          @select="hanleSelectAll"
-          border
-          fit
-          highlight-current-row
-          stripe
-        >
-          <el-table-column align="left" type="selection" width="55"> </el-table-column>
-          <el-table-column
-            align="left"
-            label="仓库名称"
-            prop="name"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column align="left" label="仓位名称" prop="kingDeeStocks" min-width="400" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <template v-if="scope.row.kingDeeStocks.length > 0">
-                <template v-for="item in scope.row.kingDeeStocks">
-                  <el-tag size="mini" type="danger" style="margin-right: 10px" :key="item" v-if="item">
-                    {{ item?item.name :''}}
-                  </el-tag>
-                </template>
-              </template>
-            </template>
-          </el-table-column>
-          <el-table-column
-            align="left"
-            label="库存警戒线"
-            prop="stockCordon"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <!-- <el-table-column
-            align="left"
-            label="库存充足"
-            prop="status"
-            min-width="160"
-            show-overflow-tooltip
-          >
-            <template slot-scope="scope">
-              <el-tag type="success" v-if="scope.row.status === 1">充足</el-tag>
-              <el-tag type="danger" v-else>不充足</el-tag>
-            </template>
-          </el-table-column> -->
-          <el-table-column
-            align="left"
-            label="创建人"
-            prop="createBy"
-            min-width="200"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="创建时间"
-            prop="createTime"
-            min-width="200"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="left"
-            label="更新人"
-            prop="updateBy"
-            min-width="200"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column align="left" label="更新时间" prop="updateTime" min-width="200" show-overflow-tooltip>
-          </el-table-column>
-
-          <el-table-column align="center" fixed="right" label="操作" min-width="160" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <!-- <el-button
-                type="text"
-                class="textColor"
-                @click="hanleDetail(scope.row)"
-                >详情</el-button
-              > -->
-              <el-button
-                v-if="$checkBtnRole('edit', $route.meta.roles)"
-                type="text"
-                class="textColor"
-                @click="editFn(scope.row.id, scope.row), (type = 2)"
-                >编辑</el-button
-              >
-              <el-popconfirm
-                v-if="$checkBtnRole('del', $route.meta.roles)"
-                confirm-button-text="好的"
-                cancel-button-text="不用了"
-                icon="el-icon-info"
-                icon-color="red"
-                title="内容确定删除吗？"
-                @onConfirm="hanleDelete(scope.row.id)"
-              >
-                <el-button slot="reference" type="text" class="textColor el-popover-left">删除</el-button>
-              </el-popconfirm>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-      <!-- 分页 -->
-      <div class="fr">
-        <el-pagination
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          :page-sizes="[10, 20, 30, 50]"
-          :page-size="10"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="listTotal"
-        >
-        </el-pagination>
-      </div>
-    </div>
-
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :optionsEvensGroup="optionsEvensGroup"
+    :exportList="exportList"
+    :operation="operation()"
+    :tableAttributes="tableAttributes"
+    :tableEvents="tableEvents"
+    :columnParsing="columnParsing"
+  >
     <!-- 弹窗 -->
     <el-dialog
       title="仓库仓位对应关系"
@@ -181,45 +18,104 @@
       :close-on-click-modal="false"
     >
       <el-form ref="diaLogForm" :model="diaLogForm" label-width="70px" size="small" label-position="left">
-        <el-form-item label="仓库名称">
+        <el-form-item label="仓库名称" prop="name">
           <el-input v-model="diaLogForm.name"></el-input>
         </el-form-item>
-        <el-form-item label="仓位名称">
+        <el-form-item label="仓位名称" prop="stockIds">
           <el-select v-model="diaLogForm.stockIds" multiple filterable placeholder="请选择">
             <el-option v-for="item in cList" :key="item.id" :label="item.name" :value="item.id"> </el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="库存警戒线">
+        <el-form-item label="库存警戒线" prop="stockCordon">
           <el-input v-model="diaLogForm.stockCordon"></el-input>
         </el-form-item>
         <!-- <el-form-item label="库存状态">
           <el-radio v-model="diaLogForm.status" label="1">充足</el-radio>
           <el-radio v-model="diaLogForm.status" label="2">补充足</el-radio>
         </el-form-item> -->
-        <el-form-item label="备注">
+        <el-form-item label="备注" prop="remark">
           <el-input type="textarea" v-model="diaLogForm.remark"></el-input>
         </el-form-item>
-        <el-form-item label="虚拟仓">
+        <el-form-item label="虚拟仓" prop="type">
           <el-radio v-model="diaLogForm.type" label="2">是</el-radio>
           <el-radio v-model="diaLogForm.type" label="1">否</el-radio>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button @click="showDialogForm = false">取 消</el-button>
+        <el-button @click="onClose">取 消</el-button>
         <el-button type="primary" @click="hanleInfo">确 定</el-button>
       </div>
     </el-dialog>
-  </div>
+  </template-page>
 </template>
 
 <script>
-import Mixin from '@/mixin/index'
-import { addStock, deleteStock, getList, getListStock, updateStock } from '@/api/basic_data/warehouse'
-
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
+import {
+  addStock,
+  deleteStock,
+  getList,
+  getListStockV2,
+  updateStock,
+  exportListStockV2,
+  getStockDetailStock
+} from '@/api/basic_data/warehouse'
+import { nextTick } from 'process'
 export default {
-  mixins: [Mixin],
+  components: { TemplatePage, Popu },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
+      visible: false,
+      // 事件组合
+      optionsEvensGroup: [
+        [
+          [
+            {
+              name: '新增',
+              click: this.addOn(() => {
+                this.newData()
+              }),
+              isRole: this.$checkBtnRole('add', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '批量删除',
+              click: async () => {
+                if (this.recordSelected.length === 0) {
+                  this.$message.error('请选择需要删除的数据')
+                  return
+                }
+                let ids = this.recordSelected.map(v => {
+                  return v.id
+                })
+                let params = ids
+                await deleteStock({ id: params.join(',') })
+                this.$refs.pageRef.refreshList()
+                this.$message.success('批量删除成功')
+              },
+              isRole: this.$checkBtnRole('del', this.$route.meta.roles)
+            }
+          ]
+        ]
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
+      recordSelected: [],
       currentPage: 1, // 当前页码
       pageSize: 10, // 每页数量
       listTotal: 0, // 列表总数
@@ -266,11 +162,77 @@ export default {
         name: '' // 名称
       },
       type: null,
-      cList: {},
-      isCollapse: true
+      cList: {}
     }
   },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getListStockV2(...p)
+    },
+    // 列表导出函数
+    exportList: exportListStockV2,
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.$checkBtnRole('edit', this.$route.meta.roles) ? (
+              <el-button
+                size="mini"
+                type="text"
+                onClick={() => {
+                  this.editFn(row.id)
+                }}
+              >
+                编辑
+              </el-button>
+            ) : null}
+            {this.$checkBtnRole('del', this.$route.meta.roles) ? (
+              <el-popconfirm
+                confirm-button-text="好的"
+                cancel-button-text="不用了"
+                icon="el-icon-info"
+                icon-color="red"
+                title="内容确定删除吗？"
+                onOnConfirm={() => {
+                  this.hanleDelete(row.id)
+                }}
+              >
+                <el-button style="font-size: 12px;" slot="reference" type="text" class="textColor el-popover-left">
+                  删除
+                </el-button>
+              </el-popconfirm>
+            ) : null}
+          </div>
+        )
+      }
+    },
+
+    onClose() {
+      this.diaLogForm = {
+        id: null,
+        type: '1',
+        name: '',
+        remark: '',
+        status: 1,
+        stockCordon: 0,
+        stockIds: [],
+        updateBy: '',
+        updateTime: ''
+      }
+      this.addOff(() => {
+        this.showDialogForm = false
+      })()
+    },
     newData() {
       this.showDialogForm = true
       this.type = 1
@@ -285,26 +247,29 @@ export default {
       })
     },
     //显示编辑，编辑数据初始化
-    editFn(id, row) {
-      this.type = 2
-      const arr = []
-      if (row.kingDeeStocks.length > 0) {
-        row.kingDeeStocks.forEach(el => {
-          arr.push(el.id)
-        })
-      }
-      this.newData()
-      console.log(row.type, '444')
-      this.diaLogForm = {
-        id,
-        name: row.name,
-        remark: row.remark,
-        status: row.status,
-        stockCordon: row.stockCordon,
-        type: row.type + '',
-        stockIds: row.stockIds === undefined ? arr : row.stockIds
-      }
-      this.showDialogForm = true
+    editFn(id) {
+      let row
+      getStockDetailStock({ id }).then(res => {
+        row = res.data
+        this.type = 2
+        const arr = []
+        if (row.kingDeeStocks && row.kingDeeStocks.length > 0) {
+          row.kingDeeStocks.forEach(el => {
+            arr.push(el.id)
+          })
+        }
+        this.newData()
+        this.diaLogForm = {
+          id,
+          name: row.name,
+          remark: row.remark,
+          status: row.status,
+          stockCordon: row.stockCordon,
+          type: row.type + '',
+          stockIds: row.stockIds === undefined ? arr : row.stockIds
+        }
+        this.showDialogForm = true
+      })
     },
 
     hanleInfo() {
@@ -313,7 +278,7 @@ export default {
         addStock(this.diaLogForm).then(res => {
           this.$successMsg('保存成功')
           this.showDialogForm = false
-          this.getList()
+          this.$refs.pageRef.refreshList()
         })
       } else if (this.type == 2) {
         const params = {
@@ -322,7 +287,7 @@ export default {
         updateStock(params).then(res => {
           this.$successMsg('编辑成功')
           this.showDialogForm = false
-          this.getList()
+          this.$refs.pageRef.refreshList()
         })
       }
       this.diaLogForm = {
@@ -336,33 +301,11 @@ export default {
         updateTime: ''
       }
     },
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        name: this.screenForm.name,
-        stockName: this.screenForm.stockName
-      }
-      getListStock(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-        console.log(this.dataList, 1233)
-      })
-    },
     // 删除数据
     hanleDelete(id) {
       deleteStock({ id: [id].join('') }).then(res => {
         this.$successMsg('删除成功')
-        this.getList()
-      })
-    },
-    handleDeleteAll() {
-      console.log()
-      deleteStock({ id: this.ids.join(',') }).then(res => {
-        this.$successMsg('删除成功')
-        this.getList()
+        this.$refs.pageRef.refreshList()
       })
     }
   }

src/views/iframeView.vue

@@ -1,7 +1,5 @@
 <template>
-  <popu>
   <iframe :src="url" height="99.5%" width="100%" frameBorder="0" />
-  </popu>
 </template>
 <script>
 import popu from '@/components/template/popu.vue';

src/views/issue.vue

@@ -1,108 +1,15 @@
 <template>
-  <div class="app-container">
-    <!-- 筛选条件 -->
-    <div class="screen-container">
-      <Collapse :screen-form="screenForm">
-        <template #right_btn>
-          <el-button size="mini" @click="resetScreenForm">清空</el-button>
-          <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="screenForm" :model="screenForm" label-width="60px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="18" :lg="18">
-                <el-form-item label="标题" prop="title">
-                  <el-input v-model="screenForm.title" placeholder="请输入标题"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-    </div>
-
-    <div class="mymain-container">
-      <div class="btn-group clearfix">
-        <div class="fl">
-          <el-button
-            class="fl"
-            size="small"
-            type="primary"
-            icon="el-icon-plus"
-            @click="clickImport()"
-            v-if="$checkBtnRole('add', $route.meta.roles)"
-            >新增</el-button
-          >
-          <div class="tips fl">导入模板第一行必须为空白行、第一列必须为经销商编号</div>
-        </div>
-      </div>
-      <div class="table">
-        <el-table
-          v-loading="listLoading"
-          :data="dataList"
-          element-loading-text="Loading"
-          border
-          fit
-          highlight-current-row
-          stripe
-        >
-          <el-table-column align="center" label="操作" fixed="right" width="160">
-            <template slot-scope="scope">
-              <el-button type="text" @click="openDetail(scope.row.id)" v-if="checkBtnRole('edit')">详情</el-button>
-              <el-button type="text" @click="handleExport(scope.row)" v-if="checkBtnRole('edit')">下载</el-button>
-              <el-popconfirm
-                style="margin-left: 10px"
-                title="确定删除吗？"
-                @onConfirm="deleteData(scope.row.id)"
-                v-if="$checkBtnRole('del', $route.meta.roles)"
-              >
-                <el-button slot="reference" type="text">删除</el-button>
-              </el-popconfirm>
-            </template>
-          </el-table-column>
-          <el-table-column
-            align="center"
-            label="标题"
-            prop="title"
-            min-width="140"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column align="center" label="操作人" prop="operatorUserName" min-width="140" show-overflow-tooltip>
-            <template slot-scope="scope"> {{ scope.row.operatorNickName }}({{ scope.row.operatorUserName }}) </template>
-          </el-table-column>
-          <el-table-column
-            align="center"
-            prop="remark"
-            label="备注"
-            min-width="140"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="创建时间"
-            prop="createTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-        </el-table>
-      </div>
-
-      <div class="pagination clearfix">
-        <div class="fr">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-          >
-          </el-pagination>
-        </div>
-      </div>
-    </div>
-
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :optionsEvensGroup="optionsEvensGroup"
+    :exportList="exportList"
+    :operation="operation()"
+    :columnParsing="columnParsing"
+  >
+    <template #moreSearch>
+      <div class="tips fl">导入模板第一行必须为空白行、第一列必须为经销商编号</div>
+    </template>
     <!-- 新增 -->
     <el-dialog
       title="新增"
@@ -183,20 +90,48 @@
         <el-button @click="detailDialog = false">关 闭</el-button>
       </div>
     </el-dialog>
-  </div>
+  </template-page>
 </template>
 
 <script>
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
 import { getToken } from '@/utils/auth'
-import { getList, getDownloadList, deleteData, exportFile, handleImport } from '@/api/issue'
+import { getListV2, getDownloadList, deleteData, exportFile, handleImport } from '@/api/issue'
 import FileUpload from '@/components/Common/file-upload.vue'
-
 export default {
-  components: {
-    FileUpload
-  },
+  components: { TemplatePage, Popu, FileUpload },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
+      visible: false,
+      // 事件组合
+      optionsEvensGroup: [
+        [
+          [
+            {
+              name: '新增',
+              click: this.addOn(() => {
+                this.clickImport()
+              }),
+              isRole: this.$checkBtnRole('add', this.$route.meta.roles)
+            }
+          ]
+        ]
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
+      recordSelected: [],
       imageURL: this.$imageUrl,
       dataList: null, // 列表数据
       listLoading: true, // 列表加载loading
@@ -222,11 +157,68 @@ export default {
       detailTable_listTotal: 0 // 详情 - 列表总数
     }
   },
-  computed: {},
-  created() {
-    this.getList()
-  },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getListV2(...p)
+    },
+    // 列表导出函数
+    exportList: () => {},
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.checkBtnRole('edit') ? (
+              <el-button
+                size="mini"
+                type="text"
+                onClick={() => {
+                  this.openDetail(row.id)
+                }}
+              >
+                详情
+              </el-button>
+            ) : null}
+            {this.checkBtnRole('edit') ? (
+              <el-button
+                size="mini"
+                type="text"
+                onClick={() => {
+                  this.handleExport(row)
+                }}
+              >
+                下载
+              </el-button>
+            ) : null}
+            {
+              <el-popconfirm
+                style="margin-left: 10px;font-size: 12px;"
+                title="确定删除吗？"
+                onOnConfirm={() => this.deleteData(row.id)}
+              >
+                <el-button slot="reference" type="text">
+                  删除
+                </el-button>
+              </el-popconfirm>
+            }
+          </div>
+        )
+      }
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
+    },
     // 查询按钮权限
     checkBtnRole(value) {
       return true
@@ -237,48 +229,6 @@ export default {
       let index = btnRole.indexOf(value)
       return index >= 0 ? true : false
     },
-
-    // 获取列表
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNo: this.currentPage,
-        pageSize: this.pageSize,
-        title: this.screenForm.title
-      }
-      getList(params).then(res => {
-        this.listLoading = false
-        this.dataList = res.data ? res.data.records : []
-        this.listTotal = res.data ? res.data.total : 0
-      })
-    },
-
-    // 更改每页数量
-    handleSizeChange(val) {
-      this.pageSize = val
-      this.currentPage = 1
-      this.getList()
-    },
-
-    // 更改当前页
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.getList()
-    },
-
-    // 提交筛选表单
-    submitScreenForm() {
-      this.currentPage = 1
-      this.getList()
-    },
-
-    // 重置筛选表单
-    resetScreenForm() {
-        this.$refs.screenForm.resetFields()
-      this.currentPage = 1
-      this.getList()
-    },
-
     // 操作 - 删除
     deleteData(id) {
       deleteData({ id }).then(res => {
@@ -321,7 +271,9 @@ export default {
 
     // 取消 导入
     cancelImportForm() {
-      this.importFormDialog = false
+      this.addOff(() => {
+        this.importFormDialog = false
+      })()
       this.fileList = []
       this.importForm.title = ''
       this.importForm.remark = ''
@@ -372,7 +324,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .tips {
   font-size: 14px;
   color: red;

src/views/notice.vue

@@ -1,158 +1,15 @@
 <template>
-  <div class="app-container">
-    <!-- 筛选条件 -->
-    <div class="screen-container">
-      <Collapse :screen-form="screenForm">
-        <template #right_btn>
-          <el-button size="mini" @click="resetScreenForm">清空</el-button>
-          <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
-        </template>
-        <template #search>
-          <el-form ref="screenForm" :model="screenForm" label-width="70px" size="mini" label-position="left">
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="通知类型" prop="type">
-                  <el-input v-model="screenForm.type" placeholder="请输入通知类型"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="文件编码" prop="code">
-                  <el-input v-model="screenForm.code" placeholder="请输入文件编码"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="文件标题" prop="title">
-                  <el-input v-model="screenForm.title" placeholder="请输入文件标题"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :lg="6">
-                <el-form-item label="发布日期" prop="date">
-                  <el-date-picker
-                    v-model="screenForm.date"
-                    type="datetimerange"
-:default-time="['00:00:00','23:59:59']"
-                    range-separator="至"
-                    style="width: 100%"
-                    value-format="yyyy-MM-dd HH:mm:ss"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"
-                  >
-                  </el-date-picker>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </template>
-      </Collapse>
-    </div>
-
-    <div class="mymain-container">
-      <div class="btn-group clearfix">
-        <div class="fl">
-          <el-button class="fl" size="small" type="primary" icon="el-icon-plus" @click="openMainForm()">新增</el-button>
-          <el-button class="fl" size="small" type="danger" icon="el-icon-minus" @click="batchDelete()"
-            >批量删除</el-button
-          >
-        </div>
-      </div>
-      <div class="table">
-        <el-table
-          v-loading="listLoading"
-          :data="dataList"
-          element-loading-text="Loading"
-          border
-          fit
-          highlight-current-row
-          stripe
-          @selection-change="handleSelectionChange"
-        >
-          <el-table-column align="center" label="操作" fixed="right" width="120">
-            <template slot-scope="scope">
-              <el-button type="text" @click="openDetail(scope.row.id)" v-if="checkBtnRole('edit')">浏览</el-button>
-              <el-popconfirm style="margin-left: 10px" title="确定删除吗？" @onConfirm="deleteData(scope.row.noticeId)">
-                <el-button slot="reference" type="text">删除</el-button>
-              </el-popconfirm>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" type="selection" width="55"></el-table-column>
-          <el-table-column
-            align="center"
-            label="通知类型"
-            prop="type"
-            min-width="120"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="文件编码"
-            prop="code"
-            min-width="140"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="文件标题"
-            prop="title"
-            min-width="140"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="接收人"
-            prop="adminNickName"
-            min-width="140"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="发送人"
-            prop="issueNickName"
-            min-width="140"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="发送人编号"
-            prop="issueUserId"
-            min-width="140"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="发布日期"
-            prop="issueTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            label="创建时间"
-            prop="createTime"
-            min-width="160"
-            show-overflow-tooltip
-          ></el-table-column>
-          <!-- <el-table-column align="center" label="已确认" prop="readFlag" min-width="140" show-overflow-tooltip></el-table-column> -->
-        </el-table>
-      </div>
-
-      <div class="pagination clearfix">
-        <div class="fr">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="listTotal"
-          >
-          </el-pagination>
-        </div>
-      </div>
-    </div>
-
-    <!-- 新增 -->
-    <el-dialog
+  <template-page
+    ref="pageRef"
+    :getList="getList"
+    :tableEvents="tableEvents"
+    :optionsEvensGroup="optionsEvensGroup"
+    :operation="operation()"
+    :tableAttributes="tableAttributes"
+    :columnParsing="columnParsing"
+  >
+   <!-- 新增 -->
+   <el-dialog
       title="新增"
       :visible.sync="mainFormDialog"
       :show-close="false"
@@ -324,20 +181,76 @@
         <el-button @click="detailDialog = false" v-if="detailData.readFlag">关 闭</el-button>
       </div>
     </el-dialog>
-  </div>
+  </template-page>
 </template>
 
 <script>
-import { getList, getDownloadList, deleteData, addData, getDepartmentList, getDetail, confirmCheck } from '@/api/notice'
+import TemplatePage from '@/components/template/template-page-1.vue'
+import import_mixin from '@/components/template/import_mixin.js'
+import add_callback_mixin from '@/components/template/add_callback_mixin.js'
+import Popu from '@/components/template/popu.vue'
+import {
+  getListV2,
+  getDownloadList,
+  deleteData,
+  addData,
+  getDepartmentList,
+  getDetail,
+  confirmCheck
+} from '@/api/notice'
 import { getFileUrl } from '@/api/common'
 import ImageUpload from '@/components/Common/image-upload.vue'
-
 export default {
-  components: {
-    ImageUpload
-  },
+  components: { TemplatePage, Popu, ImageUpload },
+  mixins: [import_mixin, add_callback_mixin],
   data() {
     return {
+      visible: false,
+      // 事件组合
+      optionsEvensGroup: [
+        [
+          [
+            {
+              name: '新增',
+              click: this.addOn(() => {
+                this.openMainForm()
+              })
+              // isRole: this.$checkBtnRole('add', this.$route.meta.roles)
+            }
+          ]
+        ],
+        [
+          [
+            {
+              name: '批量删除',
+              click: async () => {
+                if (this.recordSelected.length === 0) {
+                  this.$message.error('请选择需要删除的数据')
+                  return
+                }
+                let ids = this.recordSelected.map(v => {
+                  return v.id
+                })
+                let params = ids
+                await deleteData({ id: params.join(',') })
+                this.$refs.pageRef.refreshList()
+                this.$message.success('批量删除成功')
+              }
+            }
+          ]
+        ]
+      ],
+      // 表格属性
+      tableAttributes: {
+        // 启用勾选列
+        selectColumn: true
+      }, // 关闭新增弹窗
+
+      // 表格事件
+      tableEvents: {
+        'selection-change': this.selectionChange
+      },
+      recordSelected: [],
       imageURL: this.$imageUrl,
       dataList: null, // 列表数据
       listLoading: true, // 列表加载loading
@@ -390,11 +303,56 @@ export default {
       detailTable_listTotal: 0 // 已阅记录 - 列表总数
     }
   },
-  computed: {},
-  created() {
-    this.getList()
-  },
   methods: {
+    // 列表请求函数
+    getList(...p) {
+      this.recordSelected = []
+      return getListV2(...p)
+    },
+    // 列表导出函数
+    exportList: () => {},
+    // 表格列解析渲染数据更改
+    columnParsing(item, defaultData) {
+      return defaultData
+    },
+    // 监听勾选变化
+    selectionChange(data) {
+      console.log(data);
+      this.recordSelected = data
+    },
+    operation() {
+      return (h, { row, index, column }) => {
+        return (
+          <div class="operation-btns">
+            {this.checkBtnRole('edit') ? (
+              <el-button
+                size="mini"
+                type="text"
+                onClick={() => {
+                  this.openDetail(row.id)
+                }}
+              >
+                浏览
+              </el-button>
+            ) : null}
+            <el-popconfirm
+              style="margin-left: 10px"
+              title="确定删除吗？"
+              onOnConfirm={() => this.deleteData(row.noticeId)}
+            >
+              <el-button slot="reference" type="text">
+                删除
+              </el-button>
+            </el-popconfirm>
+          </div>
+        )
+      }
+    },
+    handleClose() {
+      this.addOff(() => {
+        this.visible = false
+      })()
+    },
     // 查询按钮权限
     checkBtnRole(value) {
       return true
@@ -413,56 +371,6 @@ export default {
       })
     },
 
-    // 获取列表
-    getList() {
-      this.listLoading = true
-      let params = {
-        pageNum: this.currentPage,
-        pageSize: this.pageSize,
-        type: this.screenForm.type,
-        code: this.screenForm.code,
-        title: this.screenForm.title,
-        startTime: this.screenForm.date ? this.screenForm.date[0] : '',
-        endTime: this.screenForm.date ? this.screenForm.date[1] : ''
-      }
-      getList(params).then(res => {
-        this.listLoading = false
-        this.dataList = res.data ? res.data.records : []
-        this.listTotal = res.data ? res.data.total : 0
-      })
-    },
-
-    // 更改每页数量
-    handleSizeChange(val) {
-      this.pageSize = val
-      this.currentPage = 1
-      this.getList()
-    },
-
-    // 更改当前页
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.getList()
-    },
-
-    // 提交筛选表单
-    submitScreenForm() {
-      this.currentPage = 1
-      this.getList()
-    },
-
-    // 重置筛选表单
-    resetScreenForm() {
-        this.$refs.screenForm.resetFields()
-      this.currentPage = 1
-      this.getList()
-    },
-
-    // 表格选择
-    handleSelectionChange(val) {
-      this.multipleSelection = val
-    },
-
     // 批量删除
     batchDelete() {
       if (this.multipleSelection.length < 1) {
@@ -480,7 +388,7 @@ export default {
           })
           deleteData({ noticeIds: ids.join(',') }).then(res => {
             this.$successMsg('删除成功')
-            this.getList()
+            this.$refs.pageRef.refreshList()
           })
         })
         .catch(() => {})
@@ -490,7 +398,7 @@ export default {
     deleteData(id) {
       deleteData({ noticeIds: id }).then(res => {
         this.$successMsg('删除成功')
-        this.getList()
+        this.$refs.pageRef.refreshList()
       })
     },
 
@@ -534,7 +442,7 @@ export default {
       confirmCheck({ noticeIds: id }).then(res => {
         this.$successMsg('查收成功')
         this.detailDialog = false
-        this.getList()
+        this.$refs.pageRef.refreshList()
       })
     },
 
@@ -573,7 +481,9 @@ export default {
 
     // 关闭 表单
     closeMainForm() {
-      this.mainFormDialog = false
+      this.addOff(() => {
+        this.mainFormDialog = false
+      })()
       this.fileList = []
       this.$refs.mainForm.resetFields()
     },
@@ -594,7 +504,8 @@ export default {
           }
           addData(params).then(res => {
             this.closeMainForm()
-            this.getList()
+            this.$refs.pageRef.refreshList()
+
             this.mainFormDialog = false
           })
         }
@@ -604,7 +515,7 @@ export default {
 }
 </script>
 
-<style scoped lang="scss">
+<style lang="scss" scoped>
 .detail-container {
   .title {
     font-size: 16px;