添加采销咨询平台页面

src/apis/service/client/business/index.js

@@ -0,0 +1,25 @@
+// 企业客户/供应商账号相关
+import http from "@/apis/axios";
+const api = "admin/";
+export default {
+  // 添加
+  add: (data, params) => http(api + "customeradd", data, "post", params),
+  // 删除
+  delete: (data, params) => http(api + "gooddel", data, "post", params),
+  // 分页查询
+  list: (data, params) => http(api + "customerlist", data, "post", params),
+  // 详情
+  detail: (data, params) => http(api + "customerinfo", data, "post", params),
+  // 更改
+  update: (data, params) => http(api + "customersave", data, "post", params),
+  // 更新状态
+  status: (data, params) => http(api + "customerstatus", data, "post", params),
+  // 提交审核申请
+  again: (data, params) => http(api + 'customeragain', data, 'post', params),
+  // 审核人提交审核结果
+  exam: (data, params) => http(api + 'customerexam', data, 'post', params),
+  // 获取全部企业
+  companyall: (data, params) => http(api + "companyall", data, "post", params),
+
+
+};

src/apis/service/client/company/index.js

@@ -0,0 +1,35 @@
+// 物业管理员
+import http from "@/apis/axios";
+const api = "admin/";
+export default {
+  // 添加
+  add: (data, params) => http(api + "companyadd", data, "post", params),
+  // 删除
+  delete: (data, params) => http(api + "delete", data, "post", params),
+  // 分页查询
+  list: (data, params) => http(api + "companylist", data, "post", params),
+  // 详情
+  detail: (data, params) => http(api + "companyinfo", data, "post", params),
+  // 更新
+  update: (data, params) => http(api + "companysave", data, "post", params),
+  // 修改状态
+  status: (data, params) => http(api + 'companystatus', data, 'post', params),
+  // 提交审核申请
+  again: (data, params) => http(api + 'companyagain', data, 'post', params),
+  // 审核人提交审核结果
+  exam: (data, params) => http(api + 'companyexam', data, 'post', params),
+  // 企业财务信息
+  bank: (data, params) => http(api + 'companybank', data, 'post', params),
+  // 企业财务录入
+  attrAdd: (data, params) => http(api + 'companyattradd', data, 'post', params),
+  // 省级列表
+  pList: (data, params) => http('api/getprovince', data, 'post', params),
+  // 市级列表
+  cList: (data, params) => http('api/getcity', data, 'post', params),
+  // 县区列表
+  aList: (data, params) => http('api/getarea', data, 'post', params),
+  // 银行卡验证
+  getbank: (data, params) => http('api/getbank', data, 'post', params),
+  
+
+};

src/apis/service/goodStore/brand/index.js

@@ -0,0 +1,21 @@
+// 物业管理员
+import http from "@/apis/axios";
+const api = "admin/";
+export default {
+  // 添加
+  add: (data, params) => http(api + "brandadd", data, "post", params),
+  // 删除
+  delete: (data, params) => http(api + "delete", data, "post", params),
+  // 分页查询
+  list: (data, params) => http(api + "brandlist", data, "post", params),
+  // 详情
+  detail: (data, params) => http(api + "brandinfo", data, "post", params),
+  // 更新
+  update: (data, params) => http(api + "brandsave", data, "post", params),
+  // 修改状态
+  status: (data, params) => http(api + 'brandstatus', data, 'post', params),
+  // 提交审核申请
+  again: (data, params) => http(api + 'brandagain', data, 'post', params),
+  // 审核人提交审核结果
+  exam: (data, params) => http(api + 'brandexam', data, 'post', params),
+};

src/apis/service/goodStore/goods/index.js

@@ -0,0 +1,30 @@
+// 物业管理员
+import http from "@/apis/axios";
+const api = "admin/";
+export default {
+  // 添加
+  add: (data, params) => http(api + "goodadd", data, "post", params),
+  // 删除
+  delete: (data, params) => http(api + "gooddel", data, "post", params),
+  // 分页查询
+  list: (data, params) => http(api + "goodlist", data, "post", params),
+  // 详情
+  detail: (data, params) => http(api + "goodinfo", data, "post", params),
+  // 更改
+  update: (data, params) => http(api + "goodsave", data, "post", params),
+  // 更新状态
+  status: (data, params) => http(api + "goodstatus", data, "post", params),
+  // 复制
+  copy: (data, params) => http(api + "goodcopy", data, "post", params),
+  // 获取全部分类
+  catAll: (data, params) => http(api + "catAll", data, "post", params),
+  // 获取全部品牌
+  brandAll: (data, params) => http(api + "brandall", data, "post", params),
+  // 获取全部供应商账号
+  supplierAll: (data, params) => http(api + "supplierall", data, "post", params),
+  // 商品种类ID换取规格值
+  specByCat: (data, params) => http(api + "SpecByCat", data, "post", params),
+  // 规格属性值新建
+  specinfoadd: (data, params) => http(api + "specinfoadd", data, "post", params),
+
+};

src/apis/service/goodStore/sort/index.js

@@ -0,0 +1,30 @@
+// 物业管理员
+import http from "@/apis/axios";
+const api = "admin/";
+export default {
+  // 添加
+  add: (data, params) => http(api + "catadd", data, "post", params),
+  // 删除
+  delete: (data, params) => http(api + "delete", data, "post", params),
+  // 分页查询
+  list: (data, params) => http(api + "goodcat", data, "post", params),
+  // 详情
+  detail: (data, params) => http(api + "catinfo", data, "post", params),
+  // 更新
+  update: (data, params) => http(api + "catsave", data, "post", params),
+  // 审核
+  check: (data, params) => http(api + "catexam", data, "post", params),
+  // 获取全部规格
+  specAll: (data, params) => http(api + "specall", data, "post", params),
+  // 获取全部分类
+  catAll: (data, params) => http(api + "catAll", data, "post", params),
+  // 修改状态
+  status: (data, params) => http(api + 'catstatus', data, 'post', params),
+  // 提交审核申请
+  again: (data, params) => http(api + 'catagain', data, 'post', params),
+  // 审核人提交审核结果
+  exam: (data, params) => http(api + 'catexam', data, 'post', params),
+  // 分类利率设置
+  catarateadd: (data, params) => http(api + 'catarateadd', data, 'post', params),
+
+};

src/apis/service/goodStore/specs/index.js

@@ -0,0 +1,23 @@
+// 物业管理员
+import http from "@/apis/axios";
+const api = "admin/";
+export default {
+  // 添加
+  add: (data, params) => http(api + "specadd", data, "post", params),
+  // 删除
+  delete: (data, params) => http(api + "delete", data, "post", params),
+  // 分页查询
+  list: (data, params) => http(api + "speclist", data, "post", params),
+  // 详情
+  detail: (data, params) => http(api + "specinfo", data, "post", params),
+  // 更新
+  update: (data, params) => http(api + "specsave", data, "post", params),
+  // 审核
+  check: (data, params) => http(api + "specex", data, "post", params),
+  // 修改状态
+  status: (data, params) => http(api + 'specstatus', data, 'post', params),
+  // 提交审核申请
+  again: (data, params) => http(api + 'specagain', data, 'post', params),
+  // 审核人提交审核结果
+  exam: (data, params) => http(api + 'specex', data, 'post', params),
+};

src/apis/service/process/read/index.js

@@ -0,0 +1,13 @@
+// 物业管理员
+import http from '@/apis/axios'
+const api = 'admin/'
+export default {
+  // 分页查询
+  list: (data, params) => http(api + 'msglist', data, 'post', params),
+  // 详情
+  detail: (data, params) => http(api + 'msginfo', data, 'post', params),
+  // 修改状态
+  status: (data, params) => http(api + 'msglimitread', data, 'post', params),
+  // 全部标记未已读
+  allStatus: (data, params) => http(api + 'msgallread', data, 'post', params),
+}

src/apis/service/process/unRead/index.js

@@ -0,0 +1,13 @@
+// 物业管理员
+import http from '@/apis/axios'
+const api = 'admin/'
+export default {
+ // 分页查询
+ list: (data, params) => http(api + 'msglist', data, 'post', params),
+ // 详情
+ detail: (data, params) => http(api + 'msginfo', data, 'post', params),
+ // 修改状态
+ status: (data, params) => http(api + 'msglimitread', data, 'post', params),
+ // 全部标记未已读
+ allStatus: (data, params) => http(api + 'msgallread', data, 'post', params),
+}

src/components/globalComponents/tree-table/index.js

@@ -0,0 +1,2 @@
+import Main from './main.vue'
+export default Main

src/components/globalComponents/tree-table/main.vue

@@ -0,0 +1,155 @@
+<template>
+  <div class="tree-table">
+    <div class="tree-table-header">
+      <template v-for="(header, index) in columns">
+        <div :key="'header' + index" class="header-item" v-if="header.show">
+          <span>{{ header.label }}</span>
+        </div>
+      </template>
+    </div>
+    <div class="tree-table-body">
+      <tree-rob
+        v-if="data && data.length > 0"
+        :data="data"
+        :columns="columns"
+        @again="again"
+        @statusConfirm="statusConfirm"
+        @openModal="openModal"
+        @setNewProfit="setNewProfit"
+      ></tree-rob>
+      <div v-else class="no-data">暂无数据</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import treeRob from "./tree-row";
+export default {
+  name: "treeTable",
+  components: {
+    treeRob,
+  },
+  props: {
+    /**
+     * el-table 属性集合
+     * 自定义属性：
+     * @param {Array} _defaultHeader_  : 默认的表格头部，支持['setcol', 'screen'] setcol-列设置 screen-筛选
+     * 可使用插槽扩展表格头部：
+     * table-header - 具名插槽
+     * slotProps：selection - 表格选中的数据  alldata - 表格当前全部数据
+     * <template #table-header="slotProps">
+     *   <el-button size="small" @click="click(slotProps)">扩展1</el-button>
+     * </template>
+     */
+    table: {
+      type: Object,
+      default: () => {},
+    },
+    // el-table 表格数据 对应data字段
+    data: {
+      type: Array,
+      default: () => [],
+    },
+    /**
+     * el-table-column 表格列属性集合
+     * 自定义属性：
+     * @param {Boolean}       _noset_        : 是否不允许设置列
+     * @param {Boolean}        _screen_      : 是否允许筛选
+     * @param {Boolean}        _hidden_      : 是否隐藏列
+     * @param {String/Boolean} _screen_tip_  : 筛选按钮提示信息，为false不提示
+     * @param {String} _screen_tip_effect_   : 筛选按钮提示信息主题，dark/light
+     * @param {String} _screen_tip_placement_: 筛选按钮提示信息位置，top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end
+     * @param {Array}          _keys_        : 支持的筛选key
+     * @param {Array}      _select_options_  : 若需支持包含select的key，value的备选数据，示例：{_select_options_: [{id:'', label:''},...]}
+     * @param {Array}  _select_options_end_  : 若需支持包含select的key，value_end的备选数据，默认使用_select_options_，示例：{_select_options_: [{id:'', label:''},...]}
+     * @param {Array}          _keys_        : 支持的筛选key
+     * @param {String}         _slot_        : 使用具名插槽时的名称
+     * @param {Function}       _format_      : 数据格式化函数，支持返回html
+     * @param {Function}       _render_      : 自定义列，采用vue中的render函数，示例: { _render_:(h, scope) => { return h(...) } }
+     */
+    columns: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  methods: {
+    again(id) {
+      this.$emit("again", id);
+    },
+    statusConfirm(id, status, ex_status) {
+      this.$emit("statusConfirm", id, status, ex_status);
+    },
+    openModal(id, is, app) {
+      this.$emit("openModal", id, is, app);
+    },
+    setNewProfit(e) {
+      this.$emit("setNewProfit", e);
+    },
+  },
+};
+</script>
+
+<style  lang="scss" scoped>
+.tree-table {
+  width: 100%;
+  position: relative;
+  margin: 0 0 50px 0;
+  .tree-table-header {
+    width: 100%;
+    display: flex;
+    border-top: 1px solid #dfe6ec;
+    border-left: 1px solid #dfe6ec;
+    .header-item {
+      flex: 1;
+      text-align: center;
+      padding: 12px 0;
+      height: 48px;
+      border-bottom: 1px solid #dfe6ec;
+      border-right: 1px solid #dfe6ec;
+      align-items: stretch;
+      span {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: normal;
+        word-break: break-all;
+        line-height: 23px;
+        height: 23px;
+        padding: 0;
+        margin: 0;
+        list-style: none;
+        font-style: normal;
+        text-decoration: none;
+        text-indent: initial;
+        border-spacing: 2px;
+        font-size: 14px;
+        border: none;
+        font-weight: 500;
+        font-family: "Microsoft Yahei", sans-serif;
+        -webkit-tap-highlight-color: transparent;
+        -webkit-font-smoothing: antialiased;
+        display: inline-block;
+        -webkit-box-sizing: border-box;
+        box-sizing: border-box;
+        position: relative;
+        vertical-align: middle;
+        padding-left: 10px;
+        padding-right: 10px;
+        width: 100%;
+        color: #909399;
+      }
+    }
+  }
+  .tree-table-body {
+    width: 100%;
+    // border-top: 1px solid #dfe6ec;
+    border-left: 1px solid #dfe6ec;
+  }
+  .no-data {
+    padding: 25px 0;
+    text-align: center;
+    color: #909399;
+    border-right: 1px solid #dfe6ec;
+    border-bottom: 1px solid #dfe6ec;
+  }
+}
+</style>

src/components/globalComponents/tree-table/tree-row.vue

@@ -0,0 +1,487 @@
+<template>
+  <div class="body-main">
+    <div
+      class="body-row-node"
+      v-for="(node, index) in data"
+      :key="'node' + node.level + index"
+    >
+      <div class="body-row">
+        <template v-for="(item, cindex) in columns">
+          <div class="body-item" :key="'item' + index + cindex">
+            <div class="item-div" v-if="item.prop == 'ex_status'">
+              <el-tag
+                :size="tablebtnSize"
+                v-if="node.ex_status === '0'"
+                :class="{
+                  'hover-tag':
+                    node.status === '0' &&
+                    powers.some((itemsome) => itemsome == '010'),
+                }"
+                :type="'warning'"
+                @click="
+                  openModal(
+                    node.id,
+                    false,
+                    true,
+                    node.status === '0' &&
+                      powers.some((itemsome) => itemsome == '010')
+                  )
+                "
+              >
+                <i
+                  class="el-icon-thumb"
+                  v-if="
+                    node.status === '0' &&
+                    powers.some((itemsome) => itemsome == '010')
+                  "
+                  style="margin-right: 1px"
+                ></i>
+                {{ node.ex_status_cn }}
+              </el-tag>
+              <el-tag
+                :size="tablebtnSize"
+                v-else-if="node.ex_status === '1'"
+                :type="'success'"
+              >
+                {{ node.ex_status_cn }}
+              </el-tag>
+              <el-tag
+                :size="tablebtnSize"
+                v-else-if="node.ex_status === '2'"
+                :class="{
+                  'hover-tag':
+                    node.status === '0' &&
+                    powers.some((itemsome) => itemsome == '009'),
+                }"
+                :type="'danger'"
+                @click="
+                  again(
+                    node.id,
+                    node.status === '0' &&
+                      powers.some((itemsome) => itemsome == '009')
+                  )
+                "
+              >
+                <i
+                  class="el-icon-thumb"
+                  v-if="
+                    node.status === '0' &&
+                    powers.some((itemsome) => itemsome == '009')
+                  "
+                  style="margin-right: 1px"
+                ></i>
+                {{ node.ex_status_cn }}
+              </el-tag>
+              <el-tag
+                :size="tablebtnSize"
+                v-else-if="node.ex_status === '3'"
+                :class="{
+                  'hover-tag':
+                    node.status === '0' &&
+                    powers.some((itemsome) => itemsome == '009'),
+                }"
+                :type="'info'"
+                @click="
+                  again(
+                    node.id,
+                    node.status === '0' &&
+                      powers.some((itemsome) => itemsome == '009')
+                  )
+                "
+              >
+                <i
+                  class="el-icon-thumb"
+                  v-if="
+                    node.status === '0' &&
+                    powers.some((itemsome) => itemsome == '009')
+                  "
+                  style="margin-right: 1px"
+                ></i>
+                {{ node.ex_status_cn }}
+              </el-tag>
+            </div>
+            <div class="item-div" v-else-if="item.prop == 'status'">
+              <span class="item-div-item">
+                <el-tag
+                  v-if="node[item.prop] === '1'"
+                  type="success"
+                  :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+                  :size="tablebtnSize"
+                  @click="
+                    statusConfirm(
+                      node.id,
+                      node.status,
+                      node.ex_status,
+                      powers.some((itemsome) => itemsome == '004')
+                    )
+                  "
+                >
+                  <i
+                    class="el-icon-thumb"
+                    v-if="powers.some((itemsome) => itemsome == '004')"
+                    style="margin-right: 1px"
+                  ></i>
+                  启用</el-tag
+                >
+                <el-tag
+                  v-else
+                  :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+                  :size="tablebtnSize"
+                  type="warning"
+                  @click="
+                    statusConfirm(
+                      node.id,
+                      node.status,
+                      node.ex_status,
+                      powers.some((itemsome) => itemsome == '004')
+                    )
+                  "
+                >
+                  <i
+                    class="el-icon-thumb"
+                    v-if="powers.some((itemsome) => itemsome == '004')"
+                    style="margin-right: 1px"
+                  ></i>
+                  禁用</el-tag
+                >
+              </span>
+            </div>
+            <div class="item-div" v-else-if="item.prop == 'desc'">
+              <span class="item-div-item">
+                <el-link
+                  class="mini-link"
+                  v-if="
+                    (node.status === '0' &&
+                      node.ex_status === '3' &&
+                      powers.some((itemsome) => itemsome == '005')) ||
+                    (node.status === '0' &&
+                      node.ex_status === '2' &&
+                      powers.some((itemsome) => itemsome == '005'))
+                  "
+                  type="primary"
+                  :underline="false"
+                  :size="tablebtnSize"
+                  @click="openModal(node.id, false, false)"
+                >
+                  修改
+                </el-link>
+                <el-link
+                  v-if="powers.some((itemsome) => itemsome == '007')"
+                  class="mini-link"
+                  type="primary"
+                  :underline="false"
+                  :size="tablebtnSize"
+                  @click="openModal(node.id, true, false)"
+                >
+                  详情
+                </el-link>
+
+                <el-link
+                  v-if="
+                    node.rateEdit &&
+                    powers.some((itemsome) => itemsome == '017')
+                  "
+                  class="mini-link"
+                  type="primary"
+                  :underline="false"
+                  :size="tablebtnSize"
+                  @click="setNewProfit(node)"
+                >
+                  提交新毛利
+                </el-link>
+              </span>
+            </div>
+            <div
+              class="item-div item-input"
+              v-else-if="
+                node.rateEdit === true && item.prop == 'in_rate' && item.show
+              "
+            >
+              <el-input-number
+                style="width: 100%"
+                v-model="node.in_rate_new"
+                :step="0.01"
+                :min="0"
+                :max="100"
+                :precision="2"
+                :placeholder="node.in_rate"
+                step-strictly
+                :controls="false"
+              ></el-input-number>
+            </div>
+            <div
+              class="item-div item-input"
+              v-else-if="
+                node.rateEdit === true && item.prop == 'low_rate' && item.show
+              "
+            >
+              <el-input-number
+                style="width: 100%"
+                v-model="node.low_rate_new"
+                :step="0.01"
+                :min="0"
+                :max="100"
+                :precision="2"
+                :placeholder="node.low_rate"
+                step-strictly
+                :controls="false"
+              ></el-input-number>
+            </div>
+            <div
+              class="item-div item-input"
+              v-else-if="
+                node.rateEdit === true && item.prop == 'out_rate' && item.show
+              "
+            >
+              <el-input-number
+                style="width: 100%"
+                v-model="node.out_rate_new"
+                :step="0.01"
+                :min="0"
+                :max="100"
+                :precision="2"
+                :placeholder="node.out_rate"
+                step-strictly
+                :controls="false"
+              ></el-input-number>
+            </div>
+            <div
+              class="item-div item-input"
+              v-else-if="
+                node.rateEdit === true && item.prop == 'rate' && item.show
+              "
+            >
+              <el-input-number
+                style="width: 100%"
+                v-model="node.rate_new"
+                :step="0.01"
+                :min="0"
+                :max="100"
+                :precision="2"
+                :placeholder="node.rate"
+                step-strictly
+                :controls="false"
+              ></el-input-number>
+            </div>
+            <div class="item-div" v-else>
+              <span
+                :class="{
+                  pad2: node.level === 2 && cindex === 0,
+                  pad3: node.level === 3 && cindex === 0,
+                }"
+                class="item-div-item"
+              >
+                <i
+                  style="color: rgb(102, 102, 102)"
+                  class="hasHover"
+                  @click="openI(node.open, node.cat_pid, node.id)"
+                  :class="{
+                    'el-icon-arrow-right': !node['open'],
+                    'el-icon-arrow-down': node['open'],
+                  }"
+                  v-if="
+                    cindex === 0 && node.children && node.children.length > 0
+                  "
+                ></i>
+                {{ node[item.prop] }}</span
+              >
+            </div>
+          </div>
+        </template>
+      </div>
+      <treeRob
+        :data="node.children"
+        v-if="node.children && node.children.length > 0 && node.open"
+        :columns="columns"
+        @again="again"
+        @statusConfirm="statusConfirm"
+        @openModal="openModal"
+        @setNewProfit="setNewProfit"
+      ></treeRob>
+    </div>
+  </div>
+</template>
+
+<script>
+import treeRob from "./tree-row.vue";
+import { mapGetters } from "vuex";
+export default {
+  name: "treeRob",
+  components: {
+    treeRob,
+  },
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find((item) => item.menu_route == "sort") ||
+        {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  props: {
+    // el-table 表格数据 对应data字段
+    data: {
+      type: Array,
+      default: () => [],
+    },
+    /**
+     * el-table-column 表格列属性集合
+     * 自定义属性：
+     */
+    columns: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  methods: {
+    openI(open, pid, id) {
+      if (open === false || open === true) {
+        this.data.map((v1) => {
+          if (v1.id === id) {
+            v1.open = !open;
+          }
+          return v1;
+        });
+      }
+    },
+    again(id, type) {
+      if (!type) {
+        return;
+      }
+      this.$emit("again", id);
+    },
+    wealWithItem(item, pop) {
+      let value = "";
+      let old = parseFloat(item[`${pop}`] + "");
+      let newi = parseFloat(item[`${pop}_new`] + "");
+      if (old !== newi) {
+        value = newi;
+      }
+      return value;
+    },
+    setNewProfit(node) {
+      let edit = false;
+      let model = {
+        id: node.id,
+        in_rate: this.wealWithItem(node, "in_rate"),
+        out_rate: this.wealWithItem(node, "out_rate"),
+        low_rate: this.wealWithItem(node, "low_rate"),
+        rate: this.wealWithItem(node, "rate"),
+      };
+      if (
+        model.in_rate === "" &&
+        model.out_rate === "" &&
+        model.low_rate === "" &&
+        model.rate === ""
+      ) {
+        edit = true;
+      }
+      if (edit) {
+        this.$message.warning("您未修改毛利！");
+      } else {
+        this.$emit("setNewProfit", model);
+      }
+    },
+    statusConfirm(id, status, ex, type) {
+      if (!type) {
+        return;
+      }
+      this.$emit("statusConfirm", id, status, ex);
+    },
+    openModal(id, is, app, type) {
+      if (!type) {
+        return;
+      }
+      this.$emit("openModal", id, is, app);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.body-main {
+  width: 100%;
+  position: relative;
+  .body-row-node {
+    width: 100%;
+    position: relative;
+    .body-row {
+      width: 100%;
+      display: flex;
+      height: 42px;
+      .body-item {
+        background: #fff;
+        display: inline-block;
+        flex: 1;
+        text-align: center;
+        border-right: 1px solid #dfe6ec;
+        border-bottom: 1px solid #dfe6ec;
+        &:first-child {
+          text-align: left;
+        }
+        .item-div {
+          padding: 8px 0;
+          &.item-input {
+            padding: 0;
+          }
+
+          span.item-div-item {
+            text-overflow: ellipsis;
+            white-space: normal;
+            word-break: break-all;
+            line-height: 23px;
+            height: 23px;
+            overflow: hidden;
+            padding: 0;
+            margin: 0;
+            list-style: none;
+            font-style: normal;
+            text-decoration: none;
+            text-indent: initial;
+            border-spacing: 2px;
+            font-size: 12px;
+            border: none;
+            font-weight: 500;
+            font-family: "Microsoft Yahei", sans-serif;
+            -webkit-tap-highlight-color: transparent;
+            -webkit-font-smoothing: antialiased;
+            display: inline-block;
+            -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+            position: relative;
+            vertical-align: middle;
+            padding-left: 10px;
+            padding-right: 10px;
+            width: 100%;
+            color: #606266;
+            &.open-i {
+              &:hover {
+                cursor: pointer;
+              }
+            }
+            &.pad2 {
+              padding-left: 30px;
+            }
+            &.pad3 {
+              padding-left: 50px;
+            }
+          }
+        }
+      }
+      &:hover {
+        .body-item {
+          background: #f5f7fa;
+        }
+      }
+    }
+
+    // flex:1
+    //  display: flex;
+  }
+}
+</style>

src/views/client/business/addEdit.vue

@@ -0,0 +1,545 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="5vh"
+    width="700px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            v-if="isApproval"
+            :model="cexForm"
+            status-icon
+            :rules="cexRules"
+            ref="cexForm"
+            label-width="80px"
+            class="cexForm-ruleForm"
+            ><el-row>
+              <el-col :span="12">
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">所属企业：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.company
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">账号：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.username
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">真实姓名：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.name
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">手机号：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.mobile
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">邮箱：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.email
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div" v-if="dataInfo.company">
+                  <el-col :span="8" class="tr cexForm-label">备注：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.remark
+                  }}</el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="审核状态" prop="status">
+                  <el-select
+                    v-model="cexForm.status"
+                    placeholder="请选择审核状态"
+                    @change="selectChange"
+                  >
+                    <el-option
+                      v-for="item in statusList"
+                      :key="item.code"
+                      :label="item.name"
+                      :value="item.code"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="审核说明" prop="remark">
+                  <el-input
+                    v-model="cexForm.remark"
+                    type="textarea"
+                    placeholder="请输入审核说明"
+                    :rows="5"
+                    maxlength="300"
+                    show-word-limit
+                  ></el-input>
+                </el-form-item>
+                <el-col :span="24" style="text-align: right">
+                  <el-button type="primary" @click="submitCexForm"
+                    >保 存
+                  </el-button>
+                  <el-button @click="showModelThis = false">取 消</el-button>
+                </el-col>
+              </el-col>
+            </el-row></el-form
+          >
+
+          <el-form
+            v-else
+            :model="ruleForm"
+            status-icon
+            :rules="rulesThis"
+            ref="ruleForm"
+            label-width="80px"
+            class="demo-ruleForm"
+            ><el-row>
+              <el-col :span="24">
+                <el-form-item label="所属企业" prop="company_id">
+                  <el-select
+                    :disabled="isDetail"
+                    v-model="ruleForm.company_id"
+                    filterable
+                    clearable
+                    :size="searchSize"
+                    placeholder="请选择所属企业"
+                    style="width: 100%"
+                  >
+                    <el-option
+                      v-for="item in companyList"
+                      :key="'company' + item.id"
+                      :label="item.company"
+                      :value="item.id"
+                      :disabled="item.status === '0'"
+                    />
+                  </el-select>
+                  <!-- <el-input
+                    v-model="ruleForm.company_id"
+                    :disabled="isDetail"
+                  /> -->
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item
+                  v-if="id === 'add' || isDetail"
+                  label="账号"
+                  prop="username"
+                >
+                  <el-input v-model="ruleForm.username" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="真实姓名" prop="contact">
+                  <el-input v-model="ruleForm.contact" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="手机号" prop="mobile">
+                  <el-input v-model="ruleForm.mobile" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="邮箱" prop="email">
+                  <el-input v-model="ruleForm.email" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="信息备注" prop="remark">
+              <el-input
+                v-model="ruleForm.remark"
+                type="textarea"
+                placeholder="请输入备注"
+                :rows="5"
+                maxlength="300"
+                show-word-limit
+                :disabled="isDetail"
+              ></el-input>
+            </el-form-item>
+            <el-col :span="24" style="text-align: right">
+              <el-tag
+                type="warning"
+                class="fl"
+                style="max-width: 500px"
+                v-if="dataInfo.ex_remark && dataInfo.ex_status === '2'"
+                >审核备注：{{ dataInfo.ex_remark }}</el-tag
+              >
+
+              <el-button type="primary" @click="submitForm" v-if="!isDetail"
+                >保 存
+              </el-button>
+              <el-button @click="showModelThis = false">{{
+                isDetail ? "关 闭" : "取 消"
+              }}</el-button>
+            </el-col>
+          </el-form>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+import asyncRequest from "@/apis/service/client/business";
+import {
+  isnumber,
+  isMobile,
+  validEmail,
+  isAlphanumeric,
+  isChinese,
+  isEmoticon,
+  validAlphabets,
+} from "@/utils/validate";
+import statusList from "@/assets/js/cexStatusList";
+export default {
+  name: "specs",
+  props: ["showModel", "id", "isDetail", "isApproval"],
+  data() {
+    const validateusername = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("账号不能为空！"));
+      } else {
+        if (value.lenght < 6 || value.lenght > 18) {
+          callback(new Error("账号规则为6~18位数字与字母组合！"));
+        } else {
+          if (isnumber(value)) {
+            callback(new Error("账号规则为6~18位数字与字母组合！"));
+          } else if (validAlphabets(value)) {
+            callback(new Error("账号规则为6~18位数字与字母组合！"));
+          } else if (!isAlphanumeric(value)) {
+            callback(new Error("账号规则为6~18位数字与字母组合！"));
+          } else {
+            callback();
+          }
+        }
+      }
+    };
+    const validatecontact = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("真实姓名不能为空！"));
+      } else {
+        if (value.lenght < 2 || value.lenght > 12) {
+          callback(new Error("真实姓名规则为2~12位汉字！"));
+        } else {
+          if (!isChinese(value)) {
+            callback(new Error("真实姓名为6~18位数字与字母组合！"));
+          } else if (isEmoticon(value)) {
+            callback(new Error("真实姓名为6~18位数字与字母组合！"));
+          } else {
+            callback();
+          }
+        }
+      }
+    };
+    const validatemobile = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("手机号不能为空！"));
+      } else {
+        if (!isMobile(value)) {
+          callback(new Error("手机号格式不正确！"));
+        } else {
+          callback();
+        }
+      }
+    };
+
+    const validateEmail = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("邮箱不能为空！"));
+      } else {
+        if (!validEmail(value)) {
+          callback(new Error("邮箱格式不正确！"));
+        } else {
+          callback();
+        }
+      }
+    };
+    return {
+      statusList: statusList,
+      loading: false,
+      title: "添加企业客户",
+      showModelThis: this.showModel,
+      dataInfo: {},
+      companyList: [],
+      cexForm: {
+        id: this.id,
+        remark: "",
+        status: "1",
+      },
+      ruleForm: {
+        id: this.id, //企业id
+        company_id: "", //id
+        type: "2",
+        username: "", //账号
+        contact: "", //真实姓名
+        mobile: "", //手机号
+        emailz: "", //邮箱
+        remark: "",
+      },
+      cexRules: {
+        status: {
+          required: true,
+          message: "请选择审核状态",
+          trigger: "change",
+        },
+        remark: [
+          {
+            required: false,
+            message: "请输入审核说明！",
+            trigger: "blur",
+          },
+        ],
+      },
+      rulesThis: this.rules,
+      rules: {
+        company_id: [
+          {
+            required: true,
+            message: "请选择企业！",
+            trigger: "change",
+          },
+        ],
+        username: [
+          {
+            required: true,
+            validator: validateusername,
+            trigger: "blur",
+          },
+        ],
+        contact: [
+          {
+            required: true,
+            validator: validatecontact,
+            trigger: "blur",
+          },
+        ],
+        mobile: [
+          {
+            required: true,
+            validator: validatemobile,
+            trigger: "blur",
+          },
+        ],
+        email: [
+          {
+            required: true,
+            validator: validateEmail,
+            trigger: "blur",
+          },
+        ],
+
+        remark: [
+          {
+            required: false,
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      console.log("closeModel!!");
+    },
+    selectChange() {
+      if (this.cexForm.status === "1") {
+        this.cexRules.remark[0].required = false;
+      } else {
+        this.cexRules.remark[0].required = true;
+      }
+    },
+    async initForm() {
+      if (this.isApproval) {
+        this.loading = true;
+        this.title = "企业客户审核";
+        await this.getCompanyList();
+        await this.initData();
+        await this.resetcexForm();
+        this.selectChange();
+        this.loading = false;
+      } else {
+        this.loading = true;
+        await this.getCompanyList();
+        if (this.id === "add") {
+          this.title = "添加企业客户";
+
+          // this.ruleForm.isAdmin = 0;
+          this.rulesThis = this.rules;
+          await this.resetForm();
+        } else {
+          if (this.isDetail) {
+            this.title = "企业客户";
+            this.rulesThis = {};
+          } else {
+            this.title = "修改企业客户";
+            this.rulesThis = this.rules;
+          }
+          await this.resetForm();
+          await this.initData();
+        }
+        this.loading = false;
+      }
+    },
+    async resetcexForm() {
+      if (this.$refs.cexForm) {
+        this.$refs.cexForm.resetFields();
+        this.$refs.cexForm.clearValidate();
+        this.cexForm = {
+          id: this.id,
+          remark: "",
+          status: "1",
+        };
+      }
+    },
+    async initData() {
+      this.loading = true;
+      let res = await asyncRequest.detail({ id: this.id });
+      this.loading = false;
+      if (res.code === 0) {
+        let data = res.data;
+        this.dataInfo = data;
+        this.ruleForm = {
+          id: this.id, //企业id
+          type: "2",
+          company_id: data.company_id, //企业id
+          username: data.username, //账号
+          contact: data.name, //真实姓名
+          mobile: data.mobile, //手机号
+          email: data.email, //邮箱
+          remark: data.remark,
+        };
+      }
+    },
+    async resetForm() {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          this.ruleForm = {
+            id: this.id, //企业id
+            type: "2",
+            company_id: "", //企业id
+            username: "", //账号
+            contact: "", //联系人
+            mobile: "", //手机号
+            emailz: "", //邮箱
+            remark: "",
+          };
+        }
+      });
+    },
+    async submitCexForm() {
+      await this.$refs.cexForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          console.log(this.id);
+          console.log(this.cexForm);
+          let obj = JSON.parse(JSON.stringify(this.cexForm));
+
+          obj.id = this.id;
+          console.log(obj);
+          let res = await asyncRequest.exam(obj);
+          this.loading = false;
+          if (res.code === 0) {
+            let title = "审核审批成功！";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          let obj = JSON.parse(JSON.stringify(this.ruleForm));
+          let res = {};
+          if (this.id === "add") {
+            delete obj["id"];
+            res = await asyncRequest.add(obj);
+          } else {
+            res = await asyncRequest.update(obj);
+          }
+          this.loading = false;
+          if (res.code === 0) {
+            let title = this.id === "add" ? "添加成功" : "修改成功";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async getCompanyList() {
+      let res = await asyncRequest.companyall({ type: "2" });
+      if (res.code === 0) {
+        this.companyList = res.data;
+      }
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.business {
+  .cexForm-ruleForm {
+    .cexForm-div {
+      margin-bottom: 0px;
+      .cexForm-label {
+        padding-right: 12px;
+        color: #606266;
+        line-height: 40px;
+        font-size: 14px;
+      }
+      .cexForm-main {
+        line-height: 40px;
+        color: rgb(151, 168, 190);
+        line-height: 40px;
+        font-size: 14px;
+      }
+    }
+  }
+}
+</style>
+   

src/views/client/business/index.vue

@@ -0,0 +1,545 @@
+<template>
+  <div class="business pagePadding">
+    <div
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+    >
+      <el-row :gutter="10">
+        <el-col :span="24" style="padding: 0 0 18px 0">
+          <el-col :span="3">
+            <el-select
+              v-model="parmValue.status"
+              filterable
+              clearable
+              :size="searchSize"
+              placeholder="账号状态"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in statusList"
+                :key="'status' + item.code"
+                :label="item.name"
+                :value="item.code"
+              />
+            </el-select>
+          </el-col>
+
+          <el-col :span="8">
+            <ul class="el-list-select-input clearfix">
+              <li>
+                <el-select
+                  v-model="select"
+                  :size="searchSize"
+                  placeholder="查询类型"
+                >
+                  <el-option label="客户姓名" value="1"></el-option>
+                  <el-option label="公司名称" value="2"></el-option>
+                  <el-option label="业务员姓名" value="3"></el-option>
+                </el-select>
+              </li>
+              <li>
+                <el-input
+                  :size="searchSize"
+                  v-model="input"
+                  :maxlength="40"
+                  placeholder="关键字"
+                >
+                  <el-button
+                    slot="append"
+                    @click="searchList"
+                    icon="el-icon-search"
+                  ></el-button>
+                </el-input>
+              </li>
+            </ul>
+          </el-col>
+          <el-col :span="13" style="float: right">
+            <el-button
+              type="warning"
+              v-if="powers.some((item) => item == '024')"
+              :size="searchSize"
+              @click="restSearch"
+            >
+              重置
+            </el-button>
+            <el-button
+              type="primary"
+              v-if="powers.some((item) => item == '002')"
+              :size="searchSize"
+              style="float: right; margin-left: 5px"
+              @click="searchList"
+            >
+              刷新
+            </el-button>
+            <el-button
+              v-if="powers.some((item) => item == '003')"
+              :size="searchSize"
+              type="success"
+              style="float: right"
+              @click="openModal('add', false, false, true)"
+            >
+              添加
+            </el-button>
+          </el-col>
+        </el-col>
+      </el-row>
+
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        row-key="id"
+        border
+        v-loading="loading"
+        :size="size"
+      >
+        <el-table-column
+          prop="company"
+          label="企业名称"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="真实姓名"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <!-- <el-table-column
+          prop="mobile"
+          label="手机号"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="email"
+          label="邮箱"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column> -->
+        <el-table-column
+          prop="admin_name"
+          label="业务员"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column label="审核状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              :size="tablebtnSize"
+              v-if="scope.row.ex_status === '0'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010'),
+              }"
+              :type="'warning'"
+              @click="
+                openModal(
+                  scope.row.id,
+                  false,
+                  true,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '010')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '1'"
+              :type="'success'"
+            >
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '2'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'danger'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '3'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'info'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              v-if="scope.row.status === '1'"
+              type="success"
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              启用</el-tag
+            >
+            <el-tag
+              v-else
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              type="warning"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              禁用</el-tag
+            >
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="addtime"
+          label="创建时间"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column fixed="right" label="操作" align="center">
+          <template slot-scope="scope">
+            <el-link
+              v-if="
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '3' &&
+                  powers.some((item) => item == '005')) ||
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '2' &&
+                  powers.some((item) => item == '005'))
+              "
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, false, false, true)"
+            >
+              修改
+            </el-link>
+            <!-- <el-link
+          type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+            @click="deleteById(scope.row.id)"
+          >
+            删除
+          </el-link>  -->
+            <el-link
+              v-if="powers.some((item) => item == '007')"
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, true, false, true)"
+            >
+              详情
+            </el-link>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div
+        class="Pagination"
+        style="text-align: right; margin-top: 10px"
+        v-show="count > 0"
+      >
+        <el-pagination
+          :size="searchSize"
+          @size-change="handleSizeChange"
+          @current-change="handlePageChange"
+          :current-page="parmValue.page"
+          :page-sizes="[10, 15, 20, 30, 40]"
+          :page-size="parmValue.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="count"
+        ></el-pagination>
+      </div>
+      <add-edit
+        :showModel="showModel"
+        :id="modelId"
+        :isApproval="approval"
+        :isDetail="isDetail"
+        @refresh="searchList"
+        @cancel="showModel = false"
+      ></add-edit>
+    </div>
+    <div v-else>
+      <no-auth></no-auth>
+    </div>
+  </div>
+</template>
+   <script>
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/client/business";
+import addEdit from "./addEdit";
+import statusList from "@/assets/js/statusList";
+import { mapGetters } from "vuex";
+export default {
+  name: "business",
+  data() {
+    return {
+      statusList: statusList,
+      approval: false,
+      loading: true,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      select: "1",
+      input: "",
+      parmValue: {
+        status: "",
+        staff: "", //客户姓名
+        name: "", // 公司名称
+        admin: "", //业务员姓名
+        type: "2",
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      },
+      count: 0, // 总条数
+      tableData: [],
+    };
+  },
+  mixins: [mixinPage],
+  mounted() {
+    this.searchList();
+  },
+  components: {
+    addEdit,
+  },
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "business"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  methods: {
+    restSearch() {
+      this.input = "";
+      this.select = "1";
+      this.parmValue = {
+        status: "",
+        type: "2",
+        staff: "", //客户姓名
+        name: "", // 公司名称
+        admin: "", //业务员姓名
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(id, isDetail, approval, type) {
+      if (!type) {
+        return;
+      }
+      this.showModel = true;
+      this.modelId = id;
+      this.isDetail = isDetail;
+      this.approval = approval;
+    },
+    async deleteById(id) {
+      await this.$confirm("确定要删除？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.delete({ id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "删除成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+
+    async again(id, type) {
+      if (!type) {
+        return;
+      }
+      await this.$confirm("确定要提交审核？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.again({ id: id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "提交成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async searchList() {
+      this.loading = true;
+      if (this.select === "1") {
+        this.parmValue.staff = this.input; //客户姓名
+        this.parmValue.name = ""; // 公司名称
+        this.parmValue.admin = ""; //业务员姓名
+      } else if (this.select === "2") {
+        this.parmValue.staff = ""; //客户姓名
+        this.parmValue.name = this.input; // 公司名称
+        this.parmValue.admin = ""; //业务员姓名
+      } else if (this.select === "3") {
+        this.parmValue.staff = ""; //客户姓名
+        this.parmValue.name = ""; // 公司名称
+        this.parmValue.admin = this.input; //业务员姓名
+      } else {
+        this.parmValue.staff = ""; //客户姓名
+        this.parmValue.name = ""; // 公司名称
+        this.parmValue.admin = ""; //业务员姓名
+      }
+      let res = await asyncRequest.list(this.parmValue);
+      if (res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.map((v1) => {
+          if (v1.addtime) {
+            v1.addtime = v1.addtime.replaceAll(".000", "");
+          }
+          return v1;
+        });
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    async statusConfirm(id, status, ex_status, type) {
+      if (!type) {
+        return;
+      }
+      if (ex_status === "1") {
+        await this.$confirm(`确定要改为${status === "1" ? "禁用" : "启用"}？`, {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            this.loading = true;
+            const model = {
+              id: id,
+              status: status === "1" ? "0" : "1",
+            };
+            const res = await asyncRequest.status(model);
+            if (res.code === 0) {
+              this.loading = false;
+              this.$notify.success({
+                title: "状态修改成功！",
+                message: "",
+              });
+              await this.searchList();
+            } else {
+              this.loading = false;
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        if (status === "0") {
+          this.$message.warning("只有审核通过的规格，才能启用！");
+        }
+      }
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.business {
+}
+</style>
+   

src/views/client/company/addEdit.vue

@@ -0,0 +1,463 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="5vh"
+    width="700px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            v-if="isApproval"
+            :model="cexForm"
+            status-icon
+            :rules="cexRules"
+            ref="cexForm"
+            label-width="80px"
+            class="cexForm-ruleForm"
+            ><el-row>
+              <el-col :span="12">
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">企业名称：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.company_name
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label clearfix">
+                    <span class="fr">统一社会</span><span class="fr">信用代码：</span>
+                  </el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.invoice
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">企业类型：</el-col>
+                  <el-col :span="16" class="cexForm-main">
+                    <el-tag type="info" v-for="model in typeStr" :key="model">{{
+                      model
+                    }}</el-tag>
+                  </el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="审核状态" prop="status">
+                  <el-select
+                    v-model="cexForm.status"
+                    placeholder="请选择审核状态"
+                    @change="selectChange"
+                  >
+                    <el-option
+                      v-for="item in statusList"
+                      :key="item.code"
+                      :label="item.name"
+                      :value="item.code"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="审核说明" prop="remark">
+                  <el-input
+                    v-model="cexForm.remark"
+                    type="textarea"
+                    placeholder="请输入审核说明"
+                    :rows="5"
+                    maxlength="300"
+                    show-word-limit
+                  ></el-input>
+                </el-form-item>
+                <el-col :span="24" style="text-align: right">
+                  <el-button type="primary" @click="submitCexForm"
+                    >保 存
+                  </el-button>
+                  <el-button @click="showModelThis = false">取 消</el-button>
+                </el-col>
+              </el-col>
+            </el-row></el-form
+          >
+
+          <el-form
+            v-else
+            :model="ruleForm"
+            status-icon
+            :rules="rulesThis"
+            ref="ruleForm"
+            label-width="140px"
+            class="demo-ruleForm"
+            ><el-row>
+              <el-col :span="24">
+                <el-form-item
+                  label="企业名称"
+                  prop="company_name"
+                  :disabled="isDetail"
+                >
+                  <el-input
+                    placeholder="请输入企业名称"
+                    v-model="ruleForm.company_name"
+                    :disabled="isDetail"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="统一社会信用代码" prop="invoice">
+                  <el-input
+                    v-model="ruleForm.invoice"
+                    placeholder="请输入统一社会信用代码"
+                    :disabled="isDetail"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="企业类型" prop="type">
+                  <el-checkbox-group v-model="ruleForm.type">
+                    <el-checkbox
+                      v-for="(item, i) in typeList"
+                      :key="item.code + i"
+                      :label="item.code"
+                      >{{ item.name }}</el-checkbox
+                    >
+                  </el-checkbox-group>
+                </el-form-item>
+              </el-col>
+            </el-row>
+
+            <el-col :span="24" style="text-align: right">
+              <el-tag
+                type="warning"
+                class="fl"
+                style="max-width: 500px"
+                v-if="dataInfo.ex_remark && dataInfo.ex_status === '2'"
+                >审核备注：{{ dataInfo.ex_remark }}</el-tag
+              >
+
+              <el-button type="primary" @click="submitForm" v-if="!isDetail"
+                >保 存
+              </el-button>
+              <el-button @click="showModelThis = false">{{
+                isDetail ? "关 闭" : "取 消"
+              }}</el-button>
+            </el-col>
+          </el-form>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+import asyncRequest from "@/apis/service/client/company";
+import {
+  isnumber,
+  isMobile,
+  validEmail,
+  isAlphanumeric,
+  isChinese,
+  isEmoticon,
+  validAlphabets,
+  isCreditCode,
+} from "@/utils/validate";
+import statusList from "@/assets/js/cexStatusList";
+export default {
+  name: "company",
+  props: ["showModel", "id", "isDetail", "isApproval"],
+  data() {
+    const validatename = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("企业名称不能为空！"));
+      } else {
+        if (value.length > 100) {
+          callback(new Error("企业名称不能超过100字符！"));
+        } else {
+          if (isEmoticon(value)) {
+            callback(new Error("企业名称不能使用表情包！"));
+          } else {
+            callback();
+          }
+        }
+      }
+    };
+    const validateinvoice = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("统一社会信用代码不能为空！"));
+      } else if (!isCreditCode(value)) {
+        callback(new Error("统一社会信用代码不正确！"));
+      } else {
+        callback();
+      }
+    };
+    return {
+      statusList: statusList,
+      loading: false,
+      title: "添加企业",
+      showModelThis: this.showModel,
+      dataInfo: {},
+      typeStr: [],
+      typeList: [
+        {
+          code: "1",
+          name: "供应商",
+        },
+        {
+          code: "2",
+          name: "企业客户",
+        },
+      ],
+      cexForm: {
+        id: this.id,
+        remark: "",
+        status: "1",
+      },
+      ruleForm: {
+        id: this.id,
+        invoice: "",
+        type: [],
+        company_name: "",
+      },
+      cexRules: {
+        status: {
+          required: true,
+          message: "请选择审核状态",
+          trigger: "change",
+        },
+        remark: [
+          {
+            required: false,
+            message: "请输入审核说明！",
+            trigger: "blur",
+          },
+        ],
+      },
+      rulesThis: this.rules,
+      rules: {
+        company_name: [
+          {
+            required: true,
+            validator: validatename,
+            trigger: "blur",
+          },
+        ],
+        type: [
+          {
+            type: "array",
+            required: true,
+            message: "请至少选择一个企业类型",
+            trigger: "change",
+          },
+        ],
+
+        invoice: [
+          {
+            required: true,
+            validator: validateinvoice,
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      console.log("closeModel!!");
+    },
+    selectChange() {
+      if (this.cexForm.status === "1") {
+        this.cexRules.remark[0].required = false;
+      } else {
+        this.cexRules.remark[0].required = true;
+      }
+    },
+    async initForm() {
+      if (this.isApproval) {
+        this.loading = true;
+        this.title = "企业审核";
+        await this.initData();
+        await this.resetcexForm();
+        this.selectChange();
+        this.loading = false;
+      } else {
+        if (this.id === "add") {
+          this.title = "添加企业";
+          // this.ruleForm.isAdmin = 0;
+          this.loading = false;
+          this.rulesThis = this.rules;
+          await this.resetForm();
+        } else {
+          if (this.isDetail) {
+            this.title = "企业";
+            this.rulesThis = {};
+          } else {
+            this.title = "修改企业";
+            this.rulesThis = this.rules;
+          }
+          await this.resetForm();
+          await this.initData();
+        }
+      }
+    },
+    async resetcexForm() {
+      if (this.$refs.cexForm) {
+        this.$refs.cexForm.resetFields();
+        this.$refs.cexForm.clearValidate();
+        this.cexForm = {
+          id: this.id,
+          remark: "",
+          status: "1",
+        };
+      }
+    },
+    async initData() {
+      this.loading = true;
+      let res = await asyncRequest.detail({ id: this.id });
+      this.loading = false;
+      if (res.code === 0) {
+        let data = res.data;
+        this.dataInfo = data;
+        this.ruleForm = {
+          id: this.id,
+          invoice: data.invoice,
+          type: [],
+          company_name: data.company,
+        };
+        this.typeStr=[]
+        if (data.is_supplier === "1") {
+          this.ruleForm.type.push("1");
+          this.typeStr.push("供应商");
+        }
+        if (data.is_customer === "1") {
+          this.ruleForm.type.push("2");
+          this.typeStr.push("企业客户");
+        }
+      }
+    },
+    async resetForm() {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          this.ruleForm = {
+            id: this.id,
+            invoice: "91110113MA004JNJ28",
+            type: ["1"],
+            company_name: "北京万宇恒通国际科贸有限公司",
+            // isAdmin: 0
+          };
+        }
+      });
+    },
+    async submitCexForm() {
+      await this.$refs.cexForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          console.log(this.id);
+          console.log(this.cexForm);
+          let obj = JSON.parse(JSON.stringify(this.cexForm));
+
+          obj.id = this.id;
+          console.log(obj);
+          let res = await asyncRequest.exam(obj);
+          this.loading = false;
+          if (res.code === 0) {
+            let title = "审核审批成功！";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          let obj = JSON.parse(JSON.stringify(this.ruleForm));
+          // obj.type = obj.type.join();
+          let res = {};
+          if (this.id === "add") {
+            delete obj["id"];
+            res = await asyncRequest.add(obj);
+          } else {
+            res = await asyncRequest.update(obj);
+          }
+          this.loading = false;
+          if (res.code === 0) {
+            let title = this.id === "add" ? "添加成功" : "修改成功";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.company {
+  .cexForm-ruleForm {
+    .cexForm-div {
+      margin-bottom: 22px;
+      .cexForm-label {
+        padding-right: 12px;
+        color: #606266;
+        line-height: 40px;
+        font-size: 14px;
+        span{
+          width: 100%;
+          display: inline-block;
+           line-height: 20px;
+           height: 20px;
+           vertical-align: top;
+          &:first-child{
+            padding-right: 13px;
+           
+          }
+        }
+      }
+      .cexForm-main {
+        line-height: 40px;
+        color: rgb(151, 168, 190);
+        line-height: 40px;
+        font-size: 14px;
+      }
+    }
+  }
+}
+</style>
+   

src/views/client/company/bankModal.vue

@@ -0,0 +1,367 @@
+<template>
+  <el-dialog
+    :title="'财务信息'"
+    :center="true"
+    align="left"
+    width="1040px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card style="margin-top: -16px">
+      <el-row :gutter="10" v-if="editModal === false">
+        <el-col :span="24" style="padding: 0 5px 8px 0">
+          <span style="height: 36px; line-height: 36px; padding: 0 0 0 8px">{{
+            title
+          }}</span>
+          <el-button
+            :size="searchSize"
+            type="success"
+            style="float: right"
+            @click="openModal('add')"
+          >
+            添加
+          </el-button>
+        </el-col>
+        <el-col :span="24">
+          <el-table
+            :data="tableData"
+            stripe
+            v-loading="loading"
+            border
+            :size="size"
+            style="width: 100%"
+          >
+            <el-table-column
+              prop="bank_name"
+              label="开户银行"
+              show-overflow-tooltip
+              align="center"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="company"
+              label="账号"
+              show-overflow-tooltip
+              align="center"
+            >
+            </el-table-column>
+
+            <el-table-column label="状态" show-overflow-tooltip align="center">
+              <template slot-scope="scope">
+                <el-tag
+                  :size="tablebtnSize"
+                  v-if="scope.row.status === '1'"
+                  type="success"
+                  @click="statusConfirm(scope.row.id, scope.row.status)"
+                  ><i class="el-icon-thumb" style="margin-right: 1px"></i
+                  >启用</el-tag
+                >
+                <el-tag
+                  v-else
+                  :size="tablebtnSize"
+                  type="warning"
+                  @click="statusConfirm(scope.row.id, scope.row.status)"
+                  ><i class="el-icon-thumb" style="margin-right: 1px"></i
+                  >禁用</el-tag
+                >
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="bank_addr"
+              label="开户行地址"
+              show-overflow-tooltip
+              align="center"
+            ></el-table-column>
+          </el-table>
+        </el-col>
+      </el-row>
+      <el-row :gutter="10" v-else>
+        <el-form
+          :model="ruleForm"
+          status-icon
+          :rules="rulesThis"
+          ref="ruleForm"
+          label-width="120px"
+          class="demo-ruleForm"
+          ><el-row>
+            <el-col :span="24">
+              <el-form-item label="银行所在区" prop="bankaddr">
+                <el-cascader
+                  placeholder="请选择银行所在区"
+                  v-model="ruleForm.bankaddr"
+                  style="width: 100%"
+                  :props="regionProps"
+                ></el-cascader>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="银行名称" prop="bankname">
+                <el-input
+                  placeholder="请输入银行名称"
+                  v-model="ruleForm.bankname"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="银行卡号" prop="bankcode">
+                <el-input
+                  placeholder="银行卡号"
+                  v-model="ruleForm.bankcode"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-col :span="24" style="text-align: right">
+            <el-button type="primary" @click="submitForm">保 存 </el-button>
+            <el-button @click="showModelThis = false">取 消</el-button>
+          </el-col>
+        </el-form>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+let id = 0;
+import asyncRequest from "@/apis/service/client/company";
+import { mapGetters } from "vuex";
+export default {
+  name: "goods",
+  props: ["showModel", "id", "title"],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+  },
+  data() {
+    const validatename = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("规格名称不能为空！"));
+      } else {
+        if (value.lenght < 2 || value.lenght > 12) {
+          callback(new Error("规格名称规则为2~12位汉字！"));
+        } else {
+          if (!isChinese(value)) {
+            callback(new Error("规格名称规则为2~12位汉字！"));
+          } else if (isEmoticon(value)) {
+            callback(new Error("规格名称规则为2~12位汉字！"));
+          } else {
+            callback();
+          }
+        }
+      }
+    };
+    const validatecode = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("银行卡号不能为空！"));
+      } else {
+        if (value.lenght < 8 || value.lenght > 32) {
+          callback(
+            new Error("银行卡号规则为8~32位数字、字母、数字与字母组合！")
+          );
+        } else if (!isAlphanumeric(value)) {
+          callback(
+            new Error("银行卡号规则为8~32位数字、字母、数字与字母组合！")
+          );
+        } else {
+          callback();
+        }
+      }
+    };
+    return {
+      regionProps: {
+        lazy: true,
+        lazyLoad: this.getall,
+      },
+      loading: false,
+      showModelThis: this.showModel,
+      tableData: [],
+      editModal: true,
+      editId: 0,
+      ruleForm: {
+        id: this.id,
+        bankname: "北京有限公司",
+        bankaddr: [],
+        bankcode: "11050162550000000142"
+        //"6228481091494940719",
+        //"20000048109600041400861",
+      },
+      rulesThis: this.rules,
+      rules: {
+        bankname: [
+          {
+            required: true,
+            validator: validatename,
+            trigger: "blur",
+          },
+        ],
+        bankcode: [
+          {
+            required: true,
+            validator: validatecode,
+            trigger: "blur",
+          },
+        ],
+        bankaddr: [
+          {
+            required: true,
+            type: "array",
+            message: "排序不能为空！",
+            trigger: "change",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      this.showModelThis = false;
+    },
+    async initForm() {
+      console.log(this.id);
+      this.loading = true;
+      let res = await asyncRequest.bank({ id: this.id });
+      if (res.code === 0 && res.data) {
+        this.tableData = res.data;
+        // this.tableData.map((v1) => {
+        //   v1.addtime = v1.addtime.replaceAll(".000", "");
+        //   return v1;
+        // });
+      } else {
+        this.tableData = [];
+      }
+      this.loading = false;
+    },
+    openModal(id) {
+      this.editModal = true;
+      this.editId = id;
+    },
+    getall(node, resolve) {
+      const { level, value } = node;
+      this.getList(level, value)
+        .then((res) => {
+          let list = res;
+          list.map((v1) => {
+            v1.value =
+              v1[
+                `${level == 0 ? "province" : level == 1 ? "city" : "area"}_code`
+              ];
+            v1.label =
+              v1[
+                `${level == 0 ? "province" : level == 1 ? "city" : "area"}_name`
+              ];
+            v1.leaf = level >= 2;
+            return v1;
+          });
+          resolve(list);
+        })
+        .catch((error) => {
+          resolve([]);
+        });
+    },
+    getList(level, id) {
+      return new Promise((resolve, reject) => {
+        let api = "";
+        let res = {};
+        if (level === 0) {
+          api = "pList";
+        } else if (level === 1) {
+          api = "cList";
+        } else if (level === 2) {
+          api = "aList";
+        }
+        let model = {
+          code: id,
+        };
+        if (level === 0) {
+          delete model["code"];
+        }
+        asyncRequest[api](model)
+          .then((res) => {
+            if (res.code === 0 && res.data) {
+              resolve(res.data);
+            } else {
+              resolve([]);
+            }
+          })
+          .catch((error) => {
+            reject(error);
+          });
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          let rescode = await asyncRequest.getbank({
+            bankcode: this.ruleForm.bankcode,
+          });
+          if (rescode.code === 0) {
+            let obj = JSON.parse(JSON.stringify(this.ruleForm));
+            obj.bankaddr = obj.bankaddr.join();
+            obj.id = this.id;
+            let res = await asyncRequest.attrAdd(obj);
+            this.loading = false;
+            if (res.code === 0) {
+              let title = this.id === "add" ? "添加成功" : "修改成功";
+              this.$notify.success({
+                title,
+                message: "",
+              });
+              // this.showModelThis = false;
+              // // 刷新
+              // this.$emit("refresh");
+            }
+          } else {
+            console.log(rescode);
+          }
+        } else {
+          // console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.goods {
+  .activeImg {
+    display: inline-block;
+    width: 100%;
+  }
+  .img-box {
+    img {
+      width: 40px;
+      height: 40px;
+      display: inline-block;
+      margin: 0 3px;
+      border: 1px solid transparent;
+      &.active {
+        border: 1px solid red;
+      }
+      &:hover {
+        cursor: pointer;
+      }
+    }
+  }
+}
+</style>
+   

src/views/client/company/index.vue

@@ -0,0 +1,537 @@
+<template>
+  <div class="company pagePadding">
+    <div
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+    >
+      <el-row :gutter="10">
+        <el-col :span="24" style="padding: 0 0 18px 0">
+          <el-col :span="4">
+            <el-select
+              v-model="parmValue.status"
+              filterable
+              clearable
+              :size="searchSize"
+              placeholder="账号状态"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in statusList"
+                :key="'status' + item.code"
+                :label="item.name"
+                :value="item.code"
+              />
+            </el-select>
+          </el-col>
+          <el-col :span="4">
+            <el-select
+              v-model="parmValue.type"
+              filterable
+              clearable
+              :size="searchSize"
+              placeholder="请选择类型"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in typeList"
+                :key="'status' + item.code"
+                :label="item.name"
+                :value="item.code"
+              />
+            </el-select>
+          </el-col>
+          <el-col :span="4">
+            <el-input
+              :size="searchSize"
+              v-model="parmValue.name"
+              :maxlength="40"
+              placeholder="企业名称"
+            ></el-input>
+          </el-col>
+          <el-col :span="3" style="width: 152px">
+            <el-button
+              type="primary"
+              :size="searchSize"
+              @click="searchList"
+              icon="el-icon-search"
+            ></el-button>
+            <el-button type="warning" v-if="powers.some((item) => item == '024')"  :size="searchSize" @click="restSearch">
+              重置
+            </el-button>
+          </el-col>
+          <el-col :span="3" style="width: 195px; float: right">
+            <el-button
+            v-if="powers.some((item) => item == '002')" 
+              type="primary"
+              :size="searchSize"
+              style="float: right; margin-left: 5px"
+              @click="searchList"
+            >
+              刷新
+            </el-button>
+            <el-button
+            v-if="powers.some((item) => item == '003')" 
+              :size="searchSize"
+              type="success"
+              style="float: right"
+              @click="openModal('add', false, false, true)"
+            >
+              添加
+            </el-button>
+          </el-col>
+        </el-col>
+      </el-row>
+      <el-table
+        :data="tableData"
+        stripe
+        v-loading="loading"
+        border
+        :size="size"
+        style="width: 100%"
+      >
+        <el-table-column
+          prop="company"
+          label="企业名称"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column label="企业类型" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              :size="tablebtnSize"
+              v-if="scope.row.is_supplier === '1'"
+              type="success"
+              style="margin: 0 3px"
+              >供应商</el-tag
+            >
+            <el-tag
+              :size="tablebtnSize"
+              v-if="scope.row.is_customer === '1'"
+              type="warning"
+              style="margin: 0 3px"
+              >企业客户</el-tag
+            >
+          </template>
+        </el-table-column>
+
+        <el-table-column label="审核状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+             :size="tablebtnSize"
+              v-if="scope.row.ex_status === '0'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010'),
+              }"
+              :type="'warning'"
+              @click="
+                openModal(
+                  scope.row.id,
+                  false,
+                  true,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '010')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag  :size="tablebtnSize" v-else-if="scope.row.ex_status === '1'" :type="'success'">
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+             :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '2'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'danger'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+             :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '3'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'info'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              v-if="scope.row.status === '1'"
+              type="success"
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              启用</el-tag
+            >
+            <el-tag
+              v-else
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              type="warning"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              禁用</el-tag
+            >
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="addtime"
+          label="创建时间"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column fixed="right" label="操作" align="center">
+          <template slot-scope="scope">
+            <el-link
+              v-if="
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '3' &&
+                  powers.some((item) => item == '005')) ||
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '2' &&
+                  powers.some((item) => item == '005'))
+              "
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, false, false, true)"
+            >
+              修改
+            </el-link>
+            <!-- <el-link
+          type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+            @click="deleteById(scope.row.id)"
+          >
+            删除
+          </el-link>  -->
+            <el-link
+              v-if="powers.some((item) => item == '007')"
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, true, false, true)"
+            >
+              详情
+            </el-link>
+            <!-- <el-link
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openBankModal(scope.row.id, scope.row.company)"
+            >
+              财务
+            </el-link> -->
+          </template>
+        </el-table-column>
+      </el-table>
+      <div
+        class="Pagination"
+        style="text-align: right; margin-top: 10px"
+        v-show="count > 0"
+      >
+        <el-pagination
+          :size="searchSize"
+          @size-change="handleSizeChange"
+          @current-change="handlePageChange"
+          :current-page="parmValue.page"
+          :page-sizes="[10, 15, 20, 30, 40]"
+          :page-size="parmValue.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="count"
+        ></el-pagination>
+      </div>
+      <add-edit
+        :showModel="showModel"
+        :id="modelId"
+        :isApproval="approval"
+        :isDetail="isDetail"
+        @refresh="searchList"
+        @cancel="showModel = false"
+      ></add-edit>
+      <bank-modal
+        :showModel="showBankModel"
+        :id="modelBankId"
+        :title="modelBankTitle"
+        @cancel="showBankModel = false"
+      ></bank-modal>
+    </div>
+    <div v-else>
+      <no-auth></no-auth>
+    </div>
+  </div>
+</template>
+   <script>
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/client/company";
+import addEdit from "./addEdit";
+import bankModal from "./bankModal";
+import statusList from "@/assets/js/statusList";
+import { mapGetters } from "vuex";
+export default {
+  name: "company",
+  data() {
+    return {
+      typeList: [
+        {
+          code: "1",
+          name: "供应商",
+        },
+        {
+          code: "2",
+          name: "企业客户",
+        },
+      ],
+      statusList: statusList,
+      approval: false,
+      loading: true,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      showBankModel: false,
+      modelBankId: 0,
+      modelBankTitle: "",
+      parmValue: {
+        status: "",
+        name: "", // 名称
+        type: "",
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      },
+      count: 0, // 总条数
+      tableData: [],
+    };
+  },
+  mixins: [mixinPage],
+  mounted() {
+    this.searchList();
+  },
+  components: {
+    addEdit,
+    bankModal,
+  },
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "company"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        status: "",
+        name: "", // 名称
+        type: "",
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(id, isDetail, approval, type) {
+      if (!type) {
+        return;
+      }
+      this.showModel = true;
+      this.modelId = id;
+      this.isDetail = isDetail;
+      this.approval = approval;
+    },
+    openBankModal(id, title) {
+      this.showBankModel = true;
+      this.modelBankId = id;
+      console.log(this.modelBankId);
+      this.modelBankTitle = title;
+    },
+    async deleteById(id) {
+      await this.$confirm("确定要删除？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.delete({ id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "删除成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+
+    async again(id,type) {
+      if(!type){
+        return
+      }
+      await this.$confirm("确定要提交审核？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.again({ id: id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "提交成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async searchList() {
+      this.loading = true;
+      let res = await asyncRequest.list(this.parmValue);
+      if (res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.map((v1) => {
+          v1.addtime = v1.addtime.replaceAll(".000", "");
+          return v1;
+        });
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    async statusConfirm(id, status, ex_status,type) {
+      if(!type){
+        return
+      }
+      if (ex_status === "1") {
+        await this.$confirm(`确定要改为${status === "1" ? "禁用" : "启用"}？`, {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            this.loading = true;
+            const model = {
+              id: id,
+              status: status === "1" ? "0" : "1",
+            };
+            const res = await asyncRequest.status(model);
+            if (res.code === 0) {
+              this.loading = false;
+              this.$notify.success({
+                title: "状态修改成功！",
+                message: "",
+              });
+              await this.searchList();
+            } else {
+              this.loading = false;
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        if (status === "0") {
+          this.$message.warning("只有审核通过的规格，才能启用！");
+        }
+      }
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.specs {
+}
+</style>
+   

src/views/client/supplier/addEdit.vue

@@ -0,0 +1,545 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="5vh"
+    width="700px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            v-if="isApproval"
+            :model="cexForm"
+            status-icon
+            :rules="cexRules"
+            ref="cexForm"
+            label-width="80px"
+            class="cexForm-ruleForm"
+            ><el-row>
+              <el-col :span="12">
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">所属企业：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.company
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">账号：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.username
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">真实姓名：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.name
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">手机号：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.mobile
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">邮箱：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.email
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div" v-if="dataInfo.company">
+                  <el-col :span="8" class="tr cexForm-label">备注：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.remark
+                  }}</el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="审核状态" prop="status">
+                  <el-select
+                    v-model="cexForm.status"
+                    placeholder="请选择审核状态"
+                    @change="selectChange"
+                  >
+                    <el-option
+                      v-for="item in statusList"
+                      :key="item.code"
+                      :label="item.name"
+                      :value="item.code"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="审核说明" prop="remark">
+                  <el-input
+                    v-model="cexForm.remark"
+                    type="textarea"
+                    placeholder="请输入审核说明"
+                    :rows="5"
+                    maxlength="300"
+                    show-word-limit
+                  ></el-input>
+                </el-form-item>
+                <el-col :span="24" style="text-align: right">
+                  <el-button type="primary" @click="submitCexForm"
+                    >保 存
+                  </el-button>
+                  <el-button @click="showModelThis = false">取 消</el-button>
+                </el-col>
+              </el-col>
+            </el-row></el-form
+          >
+
+          <el-form
+            v-else
+            :model="ruleForm"
+            status-icon
+            :rules="rulesThis"
+            ref="ruleForm"
+            label-width="80px"
+            class="demo-ruleForm"
+            ><el-row>
+              <el-col :span="24">
+                <el-form-item label="所属企业" prop="company_id">
+                  <el-select
+                    v-model="ruleForm.company_id"
+                    filterable
+                    clearable
+                    :disabled="isDetail"
+                    :size="searchSize"
+                    placeholder="请选择所属企业"
+                    style="width: 100%"
+                  >
+                    <el-option
+                      v-for="item in companyList"
+                      :key="'company' + item.id"
+                      :label="item.company"
+                      :value="item.id"
+                      :disabled="item.status === '0'"
+                    />
+                  </el-select>
+                  <!-- <el-input
+                    v-model="ruleForm.company_id"
+                    :disabled="isDetail"
+                  /> -->
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item
+                  v-if="id === 'add' || isDetail"
+                  label="账号"
+                  prop="username"
+                >
+                  <el-input v-model="ruleForm.username" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="真实姓名" prop="contact">
+                  <el-input v-model="ruleForm.contact" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="手机号" prop="mobile">
+                  <el-input v-model="ruleForm.mobile" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="邮箱" prop="email">
+                  <el-input v-model="ruleForm.email" :disabled="isDetail" />
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="信息备注" prop="remark">
+              <el-input
+                v-model="ruleForm.remark"
+                type="textarea"
+                placeholder="请输入备注"
+                :rows="5"
+                maxlength="300"
+                show-word-limit
+                :disabled="isDetail"
+              ></el-input>
+            </el-form-item>
+            <el-col :span="24" style="text-align: right">
+              <el-tag
+                type="warning"
+                class="fl"
+                style="max-width: 500px"
+                v-if="dataInfo.ex_remark && dataInfo.ex_status === '2'"
+                >审核备注：{{ dataInfo.ex_remark }}</el-tag
+              >
+
+              <el-button type="primary" @click="submitForm" v-if="!isDetail"
+                >保 存
+              </el-button>
+              <el-button @click="showModelThis = false">{{
+                isDetail ? "关 闭" : "取 消"
+              }}</el-button>
+            </el-col>
+          </el-form>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+import asyncRequest from "@/apis/service/client/business";
+import {
+  isnumber,
+  isMobile,
+  validEmail,
+  isAlphanumeric,
+  isChinese,
+  isEmoticon,
+  validAlphabets,
+} from "@/utils/validate";
+import statusList from "@/assets/js/cexStatusList";
+export default {
+  name: "specs",
+  props: ["showModel", "id", "isDetail", "isApproval"],
+  data() {
+    const validateusername = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("账号不能为空！"));
+      } else {
+        if (value.lenght < 6 || value.lenght > 18) {
+          callback(new Error("账号规则为6~18位数字与字母组合！"));
+        } else {
+          if (isnumber(value)) {
+            callback(new Error("账号规则为6~18位数字与字母组合！"));
+          } else if (validAlphabets(value)) {
+            callback(new Error("账号规则为6~18位数字与字母组合！"));
+          } else if (!isAlphanumeric(value)) {
+            callback(new Error("账号规则为6~18位数字与字母组合！"));
+          } else {
+            callback();
+          }
+        }
+      }
+    };
+    const validatecontact = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("真实姓名不能为空！"));
+      } else {
+        if (value.lenght < 2 || value.lenght > 12) {
+          callback(new Error("真实姓名规则为2~12位汉字！"));
+        } else {
+          if (!isChinese(value)) {
+            callback(new Error("真实姓名为6~18位数字与字母组合！"));
+          } else if (isEmoticon(value)) {
+            callback(new Error("真实姓名为6~18位数字与字母组合！"));
+          } else {
+            callback();
+          }
+        }
+      }
+    };
+    const validatemobile = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("手机号不能为空！"));
+      } else {
+        if (!isMobile(value)) {
+          callback(new Error("手机号格式不正确！"));
+        } else {
+          callback();
+        }
+      }
+    };
+
+    const validateEmail = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("邮箱不能为空！"));
+      } else {
+        if (!validEmail(value)) {
+          callback(new Error("邮箱格式不正确！"));
+        } else {
+          callback();
+        }
+      }
+    };
+    return {
+      statusList: statusList,
+      loading: false,
+      title: "添加企业客户",
+      showModelThis: this.showModel,
+      dataInfo: {},
+      companyList: [],
+      cexForm: {
+        id: this.id,
+        remark: "",
+        status: "1",
+      },
+      ruleForm: {
+        id: this.id, //企业id
+        company_id: "", //id
+        username: "", //账号
+        type: "1",
+        contact: "", //真实姓名
+        mobile: "", //手机号
+        emailz: "", //邮箱
+        remark: "",
+      },
+      cexRules: {
+        status: {
+          required: true,
+          message: "请选择审核状态",
+          trigger: "change",
+        },
+        remark: [
+          {
+            required: false,
+            message: "请输入审核说明！",
+            trigger: "blur",
+          },
+        ],
+      },
+      rulesThis: this.rules,
+      rules: {
+        company_id: [
+          {
+            required: true,
+            message: "请选择企业！",
+            trigger: "change",
+          },
+        ],
+        username: [
+          {
+            required: true,
+            validator: validateusername,
+            trigger: "blur",
+          },
+        ],
+        contact: [
+          {
+            required: true,
+            validator: validatecontact,
+            trigger: "blur",
+          },
+        ],
+        mobile: [
+          {
+            required: true,
+            validator: validatemobile,
+            trigger: "blur",
+          },
+        ],
+        email: [
+          {
+            required: true,
+            validator: validateEmail,
+            trigger: "blur",
+          },
+        ],
+
+        remark: [
+          {
+            required: false,
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      console.log("closeModel!!");
+    },
+    selectChange() {
+      if (this.cexForm.status === "1") {
+        this.cexRules.remark[0].required = false;
+      } else {
+        this.cexRules.remark[0].required = true;
+      }
+    },
+    async initForm() {
+      if (this.isApproval) {
+        this.loading = true;
+        this.title = "企业客户审核";
+        await this.getCompanyList();
+        await this.initData();
+        await this.resetcexForm();
+        this.selectChange();
+        this.loading = false;
+      } else {
+        this.loading = true;
+        await this.getCompanyList();
+        if (this.id === "add") {
+          this.title = "添加企业客户";
+
+          // this.ruleForm.isAdmin = 0;
+          this.rulesThis = this.rules;
+          await this.resetForm();
+        } else {
+          if (this.isDetail) {
+            this.title = "企业客户";
+            this.rulesThis = {};
+          } else {
+            this.title = "修改企业客户";
+            this.rulesThis = this.rules;
+          }
+          await this.resetForm();
+          await this.initData();
+        }
+        this.loading = false;
+      }
+    },
+    async resetcexForm() {
+      if (this.$refs.cexForm) {
+        this.$refs.cexForm.resetFields();
+        this.$refs.cexForm.clearValidate();
+        this.cexForm = {
+          id: this.id,
+          remark: "",
+          status: "1",
+        };
+      }
+    },
+    async initData() {
+      this.loading = true;
+      let res = await asyncRequest.detail({ id: this.id });
+      this.loading = false;
+      if (res.code === 0) {
+        let data = res.data;
+        this.dataInfo = data;
+        this.ruleForm = {
+          id: this.id, //企业id
+          type: "1",
+          company_id: data.company_id, //企业id
+          username: data.username, //账号
+          contact: data.name, //真实姓名
+          mobile: data.mobile, //手机号
+          email: data.email, //邮箱
+          remark: data.remark,
+        };
+      }
+    },
+    async resetForm() {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          this.ruleForm = {
+            id: this.id, //企业id
+            company_id: "", //企业id
+            type: "1",
+            username: "", //账号
+            contact: "", //联系人
+            mobile: "", //手机号
+            emailz: "", //邮箱
+            remark: "",
+          };
+        }
+      });
+    },
+    async submitCexForm() {
+      await this.$refs.cexForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          console.log(this.id);
+          console.log(this.cexForm);
+          let obj = JSON.parse(JSON.stringify(this.cexForm));
+
+          obj.id = this.id;
+          console.log(obj);
+          let res = await asyncRequest.exam(obj);
+          this.loading = false;
+          if (res.code === 0) {
+            let title = "审核审批成功！";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          let obj = JSON.parse(JSON.stringify(this.ruleForm));
+          let res = {};
+          if (this.id === "add") {
+            delete obj["id"];
+            res = await asyncRequest.add(obj);
+          } else {
+            res = await asyncRequest.update(obj);
+          }
+          this.loading = false;
+          if (res.code === 0) {
+            let title = this.id === "add" ? "添加成功" : "修改成功";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async getCompanyList() {
+      let res = await asyncRequest.companyall({ type: "2" });
+      if (res.code === 0) {
+        this.companyList = res.data;
+      }
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.business {
+  .cexForm-ruleForm {
+    .cexForm-div {
+      margin-bottom: 0px;
+      .cexForm-label {
+        padding-right: 12px;
+        color: #606266;
+        line-height: 40px;
+        font-size: 14px;
+      }
+      .cexForm-main {
+        line-height: 40px;
+        color: rgb(151, 168, 190);
+        line-height: 40px;
+        font-size: 14px;
+      }
+    }
+  }
+}
+</style>
+   

src/views/client/supplier/index.vue

@@ -0,0 +1,547 @@
+<template>
+  <div class="business pagePadding">
+    <div
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+    >
+      <el-row :gutter="10">
+        <el-col :span="24" style="padding: 0 0 18px 0">
+          <el-col :span="3">
+            <el-select
+              v-model="parmValue.status"
+              filterable
+              clearable
+              :size="searchSize"
+              placeholder="账号状态"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in statusList"
+                :key="'status' + item.code"
+                :label="item.name"
+                :value="item.code"
+              />
+            </el-select>
+          </el-col>
+          <el-col :span="8">
+            <ul class="el-list-select-input clearfix">
+              <li>
+                <el-select
+                  v-model="select"
+                  :size="searchSize"
+                  placeholder="查询类型"
+                >
+                  <el-option label="客户姓名" value="1"></el-option>
+                  <el-option label="公司名称" value="2"></el-option>
+                  <el-option label="业务员姓名" value="3"></el-option>
+                </el-select>
+              </li>
+              <li>
+                <el-input
+                  :size="searchSize"
+                  v-model="input"
+                  :maxlength="40"
+                  placeholder="关键字"
+                >
+                  <el-button
+                    slot="append"
+                    @click="searchList"
+                    icon="el-icon-search"
+                  ></el-button>
+                </el-input>
+              </li>
+            </ul>
+          </el-col>
+          <el-col :span="13" style="float: right">
+            <el-button
+              type="warning"
+              v-if="powers.some((item) => item == '024')"
+              :size="searchSize"
+              @click="restSearch"
+            >
+              重置
+            </el-button>
+            <el-button
+              type="primary"
+              :size="searchSize"
+              v-if="powers.some((item) => item == '002')"
+              style="float: right; margin-left: 5px"
+              @click="searchList"
+            >
+              刷新
+            </el-button>
+            <el-button
+              v-if="powers.some((item) => item == '003')"
+              :size="searchSize"
+              type="success"
+              style="float: right"
+              @click="openModal('add', false, false)"
+            >
+              添加
+            </el-button>
+          </el-col>
+        </el-col>
+      </el-row>
+
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        row-key="id"
+        border
+        v-loading="loading"
+        :size="size"
+        default-expand-all
+        :tree-props="{ children: 'staff', hasChildren: 'hasChildren' }"
+      >
+        <el-table-column
+          prop="company"
+          label="企业名称"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="真实姓名"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <!-- <el-table-column
+          prop="mobile"
+          label="手机号"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="email"
+          label="邮箱"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column> -->
+        <el-table-column
+          prop="admin_name"
+          label="业务员"
+          show-overflow-tooltip
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column label="审核状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              :size="tablebtnSize"
+              v-if="scope.row.ex_status === '0'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010'),
+              }"
+              :type="'warning'"
+              @click="
+                openModal(
+                  scope.row.id,
+                  false,
+                  true,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '010')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '1'"
+              :type="'success'"
+            >
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '2'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'danger'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '3'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'info'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              v-if="scope.row.status === '1'"
+              type="success"
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              启用</el-tag
+            >
+            <el-tag
+              v-else
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              type="warning"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              禁用</el-tag
+            >
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="addtime"
+          label="创建时间"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column fixed="right" label="操作" align="center">
+          <template slot-scope="scope">
+            <el-link
+              v-if="
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '3' &&
+                  powers.some((item) => item == '005')) ||
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '2' &&
+                  powers.some((item) => item == '005'))
+              "
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, false, false, true)"
+            >
+              修改
+            </el-link>
+            <!-- <el-link
+          type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+            @click="deleteById(scope.row.id)"
+          >
+            删除
+          </el-link>  -->
+            <el-link
+              v-if="powers.some((item) => item == '007')"
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, true, false, true)"
+            >
+              详情
+            </el-link>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div
+        class="Pagination"
+        style="text-align: right; margin-top: 10px"
+        v-show="count > 0"
+      >
+        <el-pagination
+          :size="searchSize"
+          @size-change="handleSizeChange"
+          @current-change="handlePageChange"
+          :current-page="parmValue.page"
+          :page-sizes="[10, 15, 20, 30, 40]"
+          :page-size="parmValue.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="count"
+        ></el-pagination>
+      </div>
+      <add-edit
+        :showModel="showModel"
+        :id="modelId"
+        :isApproval="approval"
+        :isDetail="isDetail"
+        @refresh="searchList"
+        @cancel="showModel = false"
+      ></add-edit>
+    </div>
+    <div v-else>
+      <no-auth></no-auth>
+    </div>
+  </div>
+</template>
+   <script>
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/client/business";
+import addEdit from "./addEdit";
+import statusList from "@/assets/js/statusList";
+import { mapGetters } from "vuex";
+export default {
+  name: "business",
+  data() {
+    return {
+      statusList: statusList,
+      approval: false,
+      loading: true,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      select: "1",
+      input: "",
+      parmValue: {
+        status: "",
+        staff: "", //客户姓名
+        name: "", // 公司名称
+        admin: "", //业务员姓名
+        type: "1",
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      },
+      count: 0, // 总条数
+      tableData: [],
+    };
+  },
+  mixins: [mixinPage],
+  mounted() {
+    this.searchList();
+  },
+  components: {
+    addEdit,
+  },
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "supplier"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  methods: {
+    restSearch() {
+      this.input = "";
+      this.select = "1";
+      this.parmValue = {
+        status: "",
+        type: "1",
+        staff: "", //客户姓名
+        name: "", // 公司名称
+        admin: "", //业务员姓名
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(id, isDetail, approval, type) {
+      if (!type) {
+        return;
+      }
+      this.showModel = true;
+      this.modelId = id;
+      this.isDetail = isDetail;
+      this.approval = approval;
+    },
+    async deleteById(id) {
+      await this.$confirm("确定要删除？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.delete({ id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "删除成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+
+    async again(id, type) {
+      if (!type) {
+        return;
+      }
+      await this.$confirm("确定要提交审核？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.again({ id: id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "提交成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async searchList() {
+      this.loading = true;
+      if (this.select === "1") {
+        this.parmValue.staff = this.input; //客户姓名
+        this.parmValue.name = ""; // 公司名称
+        this.parmValue.admin = ""; //业务员姓名
+      } else if (this.select === "2") {
+        this.parmValue.staff = ""; //客户姓名
+        this.parmValue.name = this.input; // 公司名称
+        this.parmValue.admin = ""; //业务员姓名
+      } else if (this.select === "3") {
+        this.parmValue.staff = ""; //客户姓名
+        this.parmValue.name = ""; // 公司名称
+        this.parmValue.admin = this.input; //业务员姓名
+      } else {
+        this.parmValue.staff = ""; //客户姓名
+        this.parmValue.name = ""; // 公司名称
+        this.parmValue.admin = ""; //业务员姓名
+      }
+      let res = await asyncRequest.list(this.parmValue);
+      if (res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.map((v1) => {
+          if (v1.addtime) {
+            v1.addtime = v1.addtime.replaceAll(".000", "");
+          }
+          return v1;
+        });
+        console.log(this.tableData);
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    async statusConfirm(id, status, ex_status, type) {
+      if (!type) {
+        return;
+      }
+      if (ex_status === "1") {
+        await this.$confirm(`确定要改为${status === "1" ? "禁用" : "启用"}？`, {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            this.loading = true;
+            const model = {
+              id: id,
+              status: status === "1" ? "0" : "1",
+            };
+            const res = await asyncRequest.status(model);
+            if (res.code === 0) {
+              this.loading = false;
+              this.$notify.success({
+                title: "状态修改成功！",
+                message: "",
+              });
+              await this.searchList();
+            } else {
+              this.loading = false;
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        if (status === "0") {
+          this.$message.warning("只有审核通过的规格，才能启用！");
+        }
+      }
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.business {
+}
+</style>
+   

src/views/goodStore/brand/addEdit.vue

@@ -0,0 +1,568 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="18vh"
+    width="900px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            v-if="isApproval"
+            :model="cexForm"
+            status-icon
+            :rules="cexRules"
+            ref="cexForm"
+            label-width="80px"
+            class="cexForm-ruleForm"
+            ><el-row>
+              <el-col :span="12">
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">LOGO：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.logo
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">品牌名称：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.name
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">企业名称：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.company
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">品牌排序：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.order
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">品牌备注：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.fremark
+                  }}</el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="审核状态" prop="status">
+                  <el-select
+                    v-model="cexForm.status"
+                    placeholder="请选择审核状态"
+                    @change="selectChange"
+                  >
+                    <el-option
+                      v-for="item in statusList"
+                      :key="item.code"
+                      :label="item.name"
+                      :value="item.code"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="审核说明" prop="remark">
+                  <el-input
+                    v-model="cexForm.remark"
+                    type="textarea"
+                    placeholder="请输入审核说明"
+                    :rows="5"
+                    maxlength="300"
+                    show-word-limit
+                  ></el-input>
+                </el-form-item>
+                <el-col :span="24" style="text-align: right">
+                  <el-button type="primary" @click="submitCexForm"
+                    >保 存
+                  </el-button>
+                  <el-button @click="showModelThis = false">取 消</el-button>
+                </el-col>
+              </el-col>
+            </el-row></el-form
+          >
+          <el-form
+            v-else
+            :model="ruleForm"
+            status-icon
+            :rules="rulesThis"
+            ref="ruleForm"
+            label-width="80px"
+            class="demo-ruleForm"
+          >
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="品牌名称" prop="name">
+                  <el-input
+                    v-model="ruleForm.name"
+                    :disabled="isDetail"
+                  ></el-input>
+                </el-form-item>
+                <el-form-item label="企业名称" prop="company">
+                  <el-input
+                    v-model="ruleForm.company"
+                    :disabled="isDetail"
+                  ></el-input>
+                </el-form-item>
+                <el-form-item label="品牌排序" prop="order">
+                  <el-input-number
+                    :disabled="isDetail"
+                    id="tl-number"
+                    style="width: 100%; text-align: left"
+                    v-model="ruleForm.order"
+                    :step="1"
+                    :min="1"
+                    :max="1000"
+                    :precision="0"
+                    step-strictly
+                    :controls="false"
+                  ></el-input-number>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item
+                  label="LOGO"
+                  prop="image"
+                  :disabled="isDetail"
+                  class="activity-upload"
+                >
+                  <div class="btnupload" style="position: relative">
+                    <img v-if="img" :src="img" class="avatar" />
+                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                    <file-upload
+                      class="Upload"
+                      :accept="'.jpg,.png,.bmp,.jpeg,.gif'"
+                      :multiple="true"
+                      :uploadcondition="beforeAvatarUpload"
+                      @UploadErrorEvent="UploadErrorEvent"
+                      @UploadSuccessEvent="UploadSuccessEvent"
+                    ></file-upload>
+                  </div>
+                  <div class="txt-tips fl">
+                    <p>大小：小于1M</p>
+                    <p>尺寸：100*100</p>
+                    <p>类型：jpg.png.bmp.jpeg.gif</p>
+
+                    <p></p>
+                  </div>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="规格备注" prop="remark">
+              <el-input
+                v-model="ruleForm.remark"
+                type="textarea"
+                placeholder="请输入备注"
+                :rows="5"
+                maxlength="300"
+                show-word-limit
+                :disabled="isDetail"
+              ></el-input>
+            </el-form-item>
+            <el-col :span="24" style="text-align: right">
+              <el-tag
+                type="warning"
+                class="fl"
+                style="max-width: 500px"
+                v-if="dataInfo.ex_remark && dataInfo.ex_status === 2"
+                >审核备注：{{ dataInfo.ex_remark }}</el-tag
+              >
+              <el-button type="primary" @click="submitForm" v-if="!isDetail"
+                >保 存
+              </el-button>
+              <el-button @click="showModelThis = false">{{
+                isDetail ? "关 闭" : "取 消"
+              }}</el-button>
+            </el-col>
+          </el-form>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+import asyncRequest from "@/apis/service/goodStore/brand";
+import {
+  isnumber,
+  isMobile,
+  validEmail,
+  isAlphanumeric,
+  isChinese,
+  isEmoticon,
+  validAlphabets,
+} from "@/utils/validate";
+
+import statusList from "@/assets/js/cexStatusList";
+export default {
+  name: "brand",
+  props: ["showModel", "id", "isDetail", "isApproval"],
+  data() {
+    return {
+      img:"",
+      statusList: statusList,
+      loading: false,
+      title: "添加商品规格",
+      showModelThis: this.showModel,
+      dataInfo: {},
+      cexForm: {
+        id: this.id,
+        remark: "",
+        status: "1",
+      },
+      ruleForm: {
+        img: "",
+        id: this.id,
+        company: "",
+        name: "",
+        order: "1",
+        remark: "",
+      },
+      cexRules: {
+        status: {
+          required: true,
+          message: "请选择审核状态",
+          trigger: "change",
+        },
+        remark: [
+          {
+            required: false,
+            message: "请输入审核说明！",
+            trigger: "blur",
+          },
+        ],
+      },
+      rulesThis: this.rules,
+      rules: {
+        order: [
+          {
+            required: true,
+            message: "请输入排序",
+            trigger: "blur",
+          },
+        ],
+        name: [
+          {
+            required: true,
+            message: "请输入品牌名称",
+            trigger: "blur",
+          },
+          {
+            min: 2,
+            max: 30,
+            message: "长度在 2 到 30 个字符",
+            trigger: "blur",
+          },
+        ],
+        company: [
+          {
+            required: true,
+            message: "请输入品牌企业",
+            trigger: "blur",
+          },
+          {
+            min: 2,
+            max: 30,
+            message: "长度在 2 到 30 个字符",
+            trigger: "blur",
+          },
+        ],
+        image: [{ required: false, message: "请上传图片", trigger: "blur" }],
+        remark: [
+          {
+            required: false,
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      console.log("closeModel!!");
+    },
+    selectChange() {
+      if (this.cexForm.status === "1") {
+        this.cexRules.remark[0].required = false;
+      } else {
+        this.cexRules.remark[0].required = true;
+      }
+    },
+    async initForm() {
+      if (this.isApproval) {
+        this.loading = true;
+        this.title = "商品品牌审核";
+        await this.initData();
+        await this.resetcexForm();
+        this.selectChange()
+        this.loading = false;
+      } else {
+        if (this.id === "add") {
+          this.title = "添加商品品牌";
+          // this.ruleForm.isAdmin = 0;
+          this.loading = false;
+          this.rulesThis = this.rules;
+          await this.resetForm();
+        } else {
+          if (this.isDetail) {
+            this.title = "商品品牌详情";
+            this.rulesThis = {};
+          } else {
+            this.title = "修改商品品牌";
+            this.rulesThis = this.rules;
+          }
+          await this.resetForm();
+          await this.initData();
+        }
+      }
+    },
+    async initData() {
+      this.loading = true;
+      let res = await asyncRequest.detail({ id: this.id });
+      this.loading = false;
+      if (res.code === 0) {
+        let data = res.data;
+        this.dataInfo = data;
+        console.log(this.dataInfo);
+        this.ruleForm = {
+          img: data.brand_logo,
+          id: this.id,
+          company: data.brand_company,
+          name: data.brand_name,
+          order: data.order,
+          remark: data.brand_desc,
+        };
+      }
+    },
+    async resetForm() {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          this.ruleForm = {
+            img: "",
+            id: this.id,
+            company: "",
+            name: "",
+            order: "1",
+            remark: "",
+          };
+        }
+      });
+    },
+    async resetcexForm() {
+      if (this.$refs.cexForm) {
+        this.$refs.cexForm.resetFields();
+        this.$refs.cexForm.clearValidate();
+        this.cexForm = {
+          id: this.id,
+          remark: "",
+          status: "1",
+        };
+      }
+    },
+    async submitCexForm() {
+      await this.$refs.cexForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          let obj = JSON.parse(JSON.stringify(this.cexForm));
+          obj.id = this.id;
+          let res = await asyncRequest.exam(obj);
+          this.loading = false;
+          if (res.code === 0) {
+            let title = "审核审批成功！";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          let obj = JSON.parse(JSON.stringify(this.ruleForm));
+          let res = {};
+          if (this.id === "add") {
+            delete obj["id"];
+            res = await asyncRequest.add(obj);
+          } else {
+            res = await asyncRequest.update(obj);
+          }
+          this.loading = false;
+          if (res.code === 0) {
+            let title = this.id === "add" ? "添加成功" : "修改成功";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    //图片上传失败
+    UploadErrorEvent() {
+      this.$message.error("图片上传失败!");
+      this.ruleForm.image = "";
+      this.img = "";
+      this.$refs.ruleForm.validateField("image");
+    },
+
+    //图片上传成功
+    UploadSuccessEvent(data) {
+      this.img = data.url;
+      this.ruleForm.image = data.url;
+      this.$message.success("图片上传成功!");
+      this.$refs.ruleForm.validateField("image");
+    },
+
+    //判断图片规格
+    beforeAvatarUpload(file) {
+      let isJPG = false;
+      if (
+        file.type === "image/jpg" ||
+        file.type === "image/png" ||
+        file.type === "image/bmp" ||
+        file.type === "image/jpeg" ||
+        file.type === "image/gif"
+      ) {
+        isJPG = true;
+      }
+      const isLt2M = file.size / 1024 / 1024 < 1;
+      if (!isJPG) {
+        this.$message.error("图片格式不正确！");
+      }
+      if (!isLt2M) {
+        this.$message.error("图片大小不能超过 1MB!");
+      }
+      return isJPG && isLt2M;
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.brand {
+  .cexForm-ruleForm {
+    .cexForm-div {
+      margin-bottom: 0px;
+      .cexForm-label {
+        padding-right: 12px;
+        color: #606266;
+        line-height: 40px;
+        font-size: 14px;
+      }
+      .cexForm-main {
+        line-height: 40px;
+        color: rgb(151, 168, 190);
+        line-height: 40px;
+        font-size: 14px;
+      }
+    }
+  }
+  .activity-upload {
+    .btnupload {
+      float: left;
+      border: 1px solid #cccccc;
+      box-sizing: border-box;
+      width: 135px;
+      height: 135px;
+      line-height: 135px;
+      text-align: center;
+    }
+    .Upload {
+      width: 135px;
+      height: 135px;
+      line-height: 135px;
+      text-align: center;
+      position: absolute;
+      line-height: 0px;
+      top: 0;
+      left: 0;
+      line-height: 135px;
+    }
+    .fileUp {
+      vertical-align: top;
+    }
+    .avatar {
+      width: 135px;
+      height: 135px;
+      line-height: 135px;
+      text-align: center;
+    }
+    .avatar-uploader .el-upload:hover {
+      border-color: #409eff;
+    }
+    .avatar-uploader-icon {
+      font-size: 28px;
+      color: #8c939d;
+      width: 50px;
+      height: 50px;
+      line-height: 50px;
+      text-align: center;
+    }
+    .avatar {
+      width: 100%;
+      height: 100%;
+      display: block;
+    }
+    .txt-tips {
+      display: inline-block;
+      font-size: 13px;
+      color: #606266;
+      padding: 18px 0 0 18px;
+      p {
+        margin: 0;
+        line-height: 30px;
+      }
+    }
+    .avatar-uploader .el-upload {
+      border: 1px dashed #d9d9d9;
+      border-radius: 6px;
+      cursor: pointer;
+      position: relative;
+      overflow: hidden;
+    }
+  }
+}
+</style>
+   
+   

src/views/goodStore/brand/index.vue

@@ -0,0 +1,470 @@
+<template>
+  <div class="brand pagePadding">
+    <el-row :gutter="10">
+      <el-col :span="24" style="padding: 0 0 18px 0">
+        <el-col :span="4">
+          <el-select
+            v-model="parmValue.status"
+            filterable
+            clearable
+            :size="searchSize"
+            placeholder="请选择状态"
+            style="width: 100%"
+          >
+            <el-option
+              v-for="item in statusList"
+              :key="'status' + item.code"
+              :label="item.name"
+              :value="item.code"
+            />
+          </el-select>
+        </el-col>
+        <el-col :span="4">
+          <el-input
+            :size="searchSize"
+            v-model="parmValue.fullName"
+            :maxlength="40"
+            placeholder="企业名称"
+          ></el-input>
+        </el-col>
+        <el-col :span="4">
+          <el-input
+            :size="searchSize"
+            v-model="parmValue.fullName"
+            :maxlength="40"
+            placeholder="品牌名称"
+          ></el-input>
+        </el-col>
+
+        <el-col :span="3" style="width: 152px">
+          <el-button
+            type="primary"
+            :size="searchSize"
+            @click="searchList"
+            icon="el-icon-search"
+          ></el-button>
+          <el-button  v-if="powers.some((item) => item == '024')" type="warning" :size="searchSize" @click="restSearch">
+            重置
+          </el-button>
+        </el-col>
+        <el-col :span="3" style="width: 195px; float: right">
+          <el-button
+           v-if="powers.some((item) => item == '002')"
+            type="primary"
+            :size="searchSize"
+            style="float: right; margin-left: 5px"
+            @click="searchList"
+          >
+            刷新
+          </el-button>
+          <el-button
+           v-if="powers.some((item) => item == '003')"
+            type="success"
+            :size="searchSize"
+            style="float: right"
+            @click="openModal('add', false, false)"
+          >
+            添加
+          </el-button>
+        </el-col>
+      </el-col>
+    </el-row>
+    <el-table
+      :data="tableData"
+      stripe
+      v-loading="loading"
+      border
+      :size="size"
+      style="width: 100%"
+    >
+      <el-table-column
+        prop="brand_name"
+        label="品牌名称"
+        show-overflow-tooltip
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        prop="brand_company"
+        label="企业名称"
+        show-overflow-tooltip
+        align="center"
+      ></el-table-column>
+      <el-table-column label="审核状态" show-overflow-tooltip align="center">
+        <template slot-scope="scope">
+          <el-tag
+            :size="tablebtnSize"
+            v-if="scope.row.ex_status === '0'"
+            :class="{
+              'hover-tag':
+                scope.row.status === '0' &&
+                powers.some((item) => item == '010'),
+            }"
+            :type="'warning'"
+            @click="
+              openModal(
+                scope.row.id,
+                false,
+                true,
+                scope.row.status === '0' && powers.some((item) => item == '010')
+              )
+            "
+          >
+            <i
+              class="el-icon-thumb"
+              v-if="
+                scope.row.status === '0' && powers.some((item) => item == '010')
+              "
+              style="margin-right: 1px"
+            ></i>
+            {{ scope.row.ex_status_cn }}
+          </el-tag>
+          <el-tag
+            :size="tablebtnSize"
+            v-else-if="scope.row.ex_status === '1'"
+            :type="'success'"
+          >
+            {{ scope.row.ex_status_cn }}
+          </el-tag>
+          <el-tag
+            :size="tablebtnSize"
+            v-else-if="scope.row.ex_status === '2'"
+            :class="{
+              'hover-tag':
+                scope.row.status === '0' &&
+                powers.some((item) => item == '009'),
+            }"
+            :type="'danger'"
+            @click="
+              again(
+                scope.row.id,
+                scope.row.status === '0' && powers.some((item) => item == '009')
+              )
+            "
+          >
+            <i
+              class="el-icon-thumb"
+              v-if="
+                scope.row.status === '0' && powers.some((item) => item == '009')
+              "
+              style="margin-right: 1px"
+            ></i>
+            {{ scope.row.ex_status_cn }}
+          </el-tag>
+          <el-tag
+            :size="tablebtnSize"
+            v-else-if="scope.row.ex_status === '3'"
+            :class="{
+              'hover-tag':
+                scope.row.status === '0' &&
+                powers.some((item) => item == '009'),
+            }"
+            :type="'info'"
+            @click="
+              again(
+                scope.row.id,
+                scope.row.status === '0' && powers.some((item) => item == '009')
+              )
+            "
+          >
+            <i
+              class="el-icon-thumb"
+              v-if="
+                scope.row.status === '0' && powers.some((item) => item == '009')
+              "
+              style="margin-right: 1px"
+            ></i>
+            {{ scope.row.ex_status_cn }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="状态" show-overflow-tooltip align="center">
+        <template slot-scope="scope">
+          <el-tag
+            v-if="scope.row.status === '1'"
+            type="success"
+            :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+            :size="tablebtnSize"
+            @click="
+              statusConfirm(
+                scope.row.id,
+                scope.row.status,
+                scope.row.ex_status,
+                powers.some((item) => item == '004')
+              )
+            "
+          >
+            <i
+              class="el-icon-thumb"
+              v-if="powers.some((item) => item == '004')"
+              style="margin-right: 1px"
+            ></i>
+            启用</el-tag
+          >
+          <el-tag
+            v-else
+            :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+            :size="tablebtnSize"
+            type="warning"
+            @click="
+              statusConfirm(
+                scope.row.id,
+                scope.row.status,
+                scope.row.ex_status,
+                powers.some((item) => item == '004')
+              )
+            "
+          >
+            <i
+              class="el-icon-thumb"
+              v-if="powers.some((item) => item == '004')"
+              style="margin-right: 1px"
+            ></i>
+            禁用</el-tag
+          >
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="addtime"
+        label="创建时间"
+        show-overflow-tooltip
+        align="center"
+      ></el-table-column>
+      <el-table-column fixed="right" label="操作" align="center">
+        <template slot-scope="scope">
+          <el-link
+            v-if="
+              (scope.row.status === '0' &&
+                scope.row.ex_status === '3' &&
+                powers.some((item) => item == '005')) ||
+              (scope.row.status === '0' &&
+                scope.row.ex_status === '2' &&
+                powers.some((item) => item == '005'))
+            "
+            type="primary"
+            style="margin: 0 4px"
+            :underline="false"
+            :size="tablebtnSize"
+            @click="openModal(scope.row.id, false, false, true)"
+          >
+            修改
+          </el-link>
+          <!-- <el-link
+            type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+            @click="deleteById(scope.row.id)"
+          >
+            删除
+          </el-link> -->
+          <el-link
+            v-if="powers.some((item) => item == '007')"
+            type="primary"
+            style="margin: 0 4px"
+            :underline="false"
+            :size="tablebtnSize"
+            @click="openModal(scope.row.id, true, false, true)"
+          >
+            详情
+          </el-link>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div
+      class="Pagination"
+      style="text-align: right; margin-top: 10px"
+      v-show="count > 0"
+    >
+      <el-pagination
+        :size="searchSize"
+        @size-change="handleSizeChange"
+        @current-change="handlePageChange"
+        :current-page="parmValue.page"
+        :page-sizes="[10, 15, 20, 30, 40]"
+        :page-size="parmValue.size"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="count"
+      ></el-pagination>
+    </div>
+    <add-edit
+      :showModel="showModel"
+      :id="modelId"
+      :isApproval="approval"
+      :isDetail="isDetail"
+      @refresh="searchList"
+      @cancel="showModel = false"
+    ></add-edit>
+  </div>
+</template>
+   <script>
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/goodStore/brand";
+import addEdit from "./addEdit";
+import statusList from "@/assets/js/statusList";
+import { mapGetters } from "vuex";
+export default {
+  name: "brand",
+  data() {
+    return {
+      statusList: statusList,
+      approval: false,
+      loading: true,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      parmValue: {
+        loginName: "", // 账户
+        fullName: "", // 姓名
+        type: 2, // 用户类型（1运营人员 2物业人员）
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      },
+      count: 0, // 总条数
+      tableData: [],
+    };
+  },
+  mixins: [mixinPage],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "brand"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  mounted() {
+    this.searchList();
+  },
+  components: {
+    addEdit,
+  },
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        loginName: "", // 账户
+        fullName: "", // 姓名
+        type: 2, // 用户类型（1运营人员 2物业人员）
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(id, isDetail, approval, type) {
+      if (!type) {
+        return;
+      }
+      this.showModel = true;
+      this.modelId = id;
+      this.isDetail = isDetail;
+      this.approval = approval;
+    },
+    async deleteById(id) {
+      await this.$confirm("确定要删除？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.delete({ id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "删除成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async again(id, type) {
+      if (!type) {
+        return;
+      }
+      await this.$confirm("确定要提交审核？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.again({ id: id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "提交成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async searchList() {
+      this.loading = true;
+      let res = await asyncRequest.list(this.parmValue);
+      if (res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.map((v1) => {
+          v1.addtime = v1.addtime.replaceAll(".000", "");
+          return v1;
+        });
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    async statusConfirm(id, status, ex_status, type) {
+      if (!type) {
+        return;
+      }
+      if (ex_status === "1") {
+        await this.$confirm(`确定要改为${status === "1" ? "禁用" : "启用"}？`, {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            this.loading = true;
+            const model = {
+              id: id,
+              status: status === "1" ? "0" : "1",
+            };
+            const res = await asyncRequest.status(model);
+            if (res.code === 0) {
+              this.loading = false;
+              this.$notify.success({
+                title: "状态修改成功！",
+                message: "",
+              });
+              await this.searchList();
+            } else {
+              this.loading = false;
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        if (status === "0") {
+          this.$message.warning("只有审核通过的规格，才能启用！");
+        }
+      }
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.brand {
+}
+</style>
+   

src/views/goodStore/goods/addEdit.vue

@@ -0,0 +1,1278 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="8vh"
+    width="1040px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-col :span="10" :offset="7">
+            <div style="margin: -5px 0 10px 0">
+              <el-steps
+                :active="step"
+                simple
+                process-status="finish"
+                finish-status="success"
+              >
+                <el-step
+                  v-for="(item, index) in stepList"
+                  :key="index"
+                  :title="item"
+                />
+              </el-steps>
+            </div>
+          </el-col>
+          <el-row :gutter="10" v-if="step === 0">
+            <el-form
+              :model="baseForm"
+              status-icon
+              :rules="baseRules"
+              ref="baseForm"
+              label-width="110px"
+              class="demo-ruleForm"
+            >
+              <el-col :span="24">
+                <el-form-item label="商品名称" prop="good_name">
+                  <el-input
+                    placeholder="请输入商品名称"
+                    v-model="baseForm.good_name"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="供应商联系人" prop="supplier">
+                  <el-select
+                    v-model="baseForm.supplier"
+                    filterable
+                    clearable
+                    style="width: 100%"
+                    placeholder="请选择供应商联系人"
+                  >
+                    <el-option
+                      v-for="group in supplierOptions"
+                      :key="group.id"
+                      :label="group.name"
+                      :value="group.id"
+                    >
+                      <span>{{ group.name }}</span
+                      ><span class="fr">{{ group.company }}</span>
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="商品单位" prop="unit">
+                  <el-input
+                    placeholder="请输入单位"
+                    v-model="baseForm.unit"
+                    :disabled="isDetail"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="商品分类" prop="catid">
+                  <el-cascader
+                    v-model="baseForm.catid"
+                    style="width: 100%"
+                    filterable
+                    placeholder="请选择商品分类"
+                    clearable
+                    :options="catOptions"
+                    :props="{ expandTrigger: 'hover', checkStrictly: true }"
+                  ></el-cascader>
+                </el-form-item>
+                <el-form-item label="商品品牌" prop="brandid">
+                  <el-select
+                    style="width: 100%"
+                    v-model="baseForm.brandid"
+                    clearable
+                    placeholder="请选择商品品牌"
+                  >
+                    <el-option
+                      v-for="item in brandidOptions"
+                      :key="item.id"
+                      :label="item.brand_name"
+                      :value="item.id"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item
+                  label="商品主图"
+                  prop="image"
+                  class="activity-upload"
+                >
+                  <div class="img-list-main clearfix">
+                    <div
+                      class="img-item"
+                      v-for="(item, index) in baseForm.image"
+                      :key="item + index"
+                    >
+                      <img :src="item" class="avatar" />
+                      <i class="el-icon-close" @click="closeImg(index)"></i>
+                    </div>
+                    <div
+                      class="btnupload"
+                      v-if="baseForm.image.length < 5"
+                      style="position: relative"
+                    >
+                      <i class="el-icon-plus avatar-uploader-icon"></i>
+                      <file-upload
+                        class="Upload"
+                        :accept="'.jpg,.png,.bmp,.jpeg,.gif'"
+                        :multiple="true"
+                        :uploadcondition="beforeAvatarUpload"
+                        @UploadErrorEvent="UploadErrorEvent"
+                        @UploadSuccessEvent="UploadSuccessEvent"
+                      ></file-upload>
+                    </div>
+                  </div>
+                  <div class="txt-tips fl">
+                    <p>
+                      <span sty>大小：小于1M；</span><span>尺寸：100*100；</span
+                      ><span>类型：jpg.png.bmp.jpeg.gif</span>
+                    </p>
+                  </div>
+                </el-form-item>
+              </el-col>
+            </el-form>
+
+            <el-col :span="24" style="text-align: right">
+              <el-tag type="warning" class="fl" style="margin-left: 100px"
+                >更换商品分类，会影响规格与价格，请慎重修改</el-tag
+              >
+              <el-button type="primary" @click="baseSubmitForm"
+                >下一步
+              </el-button>
+              <el-button @click="showModelThis = false">{{
+                isDetail ? "关 闭" : "取 消"
+              }}</el-button>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10" v-else>
+            <el-col :span="24" style="max-height: 560px; overflow-y: scroll">
+              <el-form
+                :model="ruleForm"
+                status-icon
+                ref="ruleForm"
+                label-width="60px"
+                class="demo-goods-ruleForm"
+              >
+                <el-form-item label="规格" required>
+                  <div class="mack-mian clearfix">
+                    <div
+                      class="mock-item-div clearfix"
+                      v-for="(item, index) in mock"
+                      :key="'specItem' + index"
+                    >
+                      <div class="mock-title clearfix">
+                        <el-input
+                          :size="size"
+                          class="fr"
+                          style="width: 250px"
+                          maxlength="40"
+                          placeholder="新增规格值，如红色"
+                          v-model="item.value"
+                        >
+                          <el-button
+                            slot="append"
+                            @click="specinfoadd(item.spec_id, item.value)"
+                            >提交</el-button
+                          >
+                        </el-input>
+                        <span class="fl">{{ item.spec_name }}</span>
+                      </div>
+                      <div v-if="item.child && item.child.length > 0">
+                        <el-checkbox-group
+                          v-model="item.change"
+                          @change="groupChange($event, index, item)"
+                        >
+                          <el-checkbox
+                            v-for="(sub, i) in item.child"
+                            :key="'sub' + i"
+                            :label="sub.id"
+                            >{{ sub.spec_value }}</el-checkbox
+                          >
+                        </el-checkbox-group>
+                      </div>
+                      <div v-else style="padding: 0 0 12px 0">
+                        <el-tag type="info">暂无规格值</el-tag>
+                      </div>
+                    </div>
+                  </div>
+                </el-form-item>
+                <div class="tips-error">{{ ruleForm.spec }}</div>
+                <el-form-item label="价格" required style="padding: 0 0 12px 0">
+                  <div
+                    class="ladder-table clearfix"
+                    v-if="left && left.header && left && left.header.length > 0"
+                  >
+                    <div class="left" :style="{ width: leftS }">
+                      <div class="ladder-header" v-if="left && left.header">
+                        <ul class="header-spec clearfix">
+                          <li
+                            v-for="(h, hi) in left.header"
+                            :key="'leftHeader' + hi"
+                          >
+                            <span>{{ h.spec_name }}</span>
+                          </li>
+                        </ul>
+                      </div>
+                      <div class="ladder-body" v-if="left.specList">
+                        <ul
+                          v-for="(item, index) in left.specList"
+                          :key="'item' + index"
+                        >
+                          <li
+                            class="clearfix"
+                            v-for="(sub, subi) in item"
+                            :key="'sub' + subi"
+                          >
+                            <span>
+                              {{ sub.spec_value }}
+                            </span>
+                          </li>
+                        </ul>
+                      </div>
+                    </div>
+                    <div class="right" :style="{ paddingLeft: leftS }">
+                      <div class="ladder-header" v-if="right && right.header">
+                        <ul class="header-spec clearfix">
+                          <li
+                            v-for="(h, hi) in right.header"
+                            :key="'rightHeader' + hi"
+                          >
+                            <div class="all">
+                              <div class="title">
+                                <span> 阶梯{{ hi + 1 }}</span>
+                                <i
+                                  class="el-icon-close"
+                                  @click="closeImg(index)"
+                                ></i>
+                              </div>
+                              <div class="main">
+                                <span>{{ h.num }}</span>
+                                <span>{{ h.price }}</span>
+                              </div>
+                            </div>
+                          </li>
+                        </ul>
+                      </div>
+                      <div class="ladder-body" v-if="right && right.specList">
+                        <ul
+                          v-for="(h, hi) in right.specList"
+                          :key="'rightspec' + hi"
+                        >
+                          <li v-for="(s, si) in h" :key="'rightspecsi' + si">
+                            <div
+                              class="input-main"
+                              v-for="(n, ni) in s.limit"
+                              :key="'rightni' + ni"
+                            >
+                              <el-input-number
+                                style="width: 50%"
+                                v-model="n.num"
+                                :step="1"
+                                :min="0"
+                                :max="99999999"
+                                :precision="0"
+                                placeholder="起订量"
+                                step-strictly
+                                :controls="false"
+                              ></el-input-number>
+                              <el-input-number
+                                style="width: 50%"
+                                v-model="n.price"
+                                :step="0.01"
+                                :min="0"
+                                :max="99999999"
+                                :precision="2"
+                                step-strictly
+                                placeholder="成本价"
+                                :controls="false"
+                              ></el-input-number>
+                            </div>
+                          </li>
+                        </ul>
+                      </div>
+                    </div>
+                  </div>
+                  <div v-else>
+                    <el-tag type="warning">请选择规格值</el-tag>
+                  </div>
+                </el-form-item>
+                <div class="tips-error">{{ ruleForm.table }}</div>
+              </el-form>
+            </el-col>
+            <el-col :span="24" style="text-align: right">
+              <el-button type="primary" @click="step--" v-if="!isDetail"
+                >上一步
+              </el-button>
+              <el-button type="primary" @click="submitForm" v-if="!isDetail"
+                >保 存
+              </el-button>
+              <el-button @click="showModelThis = false">{{
+                isDetail ? "关 闭" : "取 消"
+              }}</el-button>
+            </el-col>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+import asyncRequest from "@/apis/service/goodStore/goods";
+
+
+export default {
+  name: "goods",
+  props: ["showModel", "id", "isDetail"],
+  data() {
+    return {
+      leftS: "0px",
+      size: "small",
+      mock: [],
+      ladderNum: 5, //阶梯数
+      left: {
+        header: [],
+        middle: [],
+        specList: [],
+      },
+      right: {
+        header: [],
+        specList: [],
+      },
+      headLadder: {
+        num: "起订量≥",
+        price: "成本价",
+      },
+
+      catOptions: [],
+      brandidOptions: [],
+      supplierOptions: [],
+      oldcatid: [],
+      stepList: ["基础信息", "规格与价格"],
+      step: 0,
+      loading: false,
+      title: "添加商品",
+      showModelThis: this.showModel,
+      baseForm: {
+        id: this.id,
+        catid: [],
+        good_name: "",
+        unit: "",
+        supplier: "",
+        brandid: "",
+        image: [],
+      },
+
+      baseRules: {
+        supplier: [
+          {
+            required: true,
+            message: "请选择供应商联系人",
+            trigger: "change",
+          },
+        ],
+        image: [
+          {
+            required: true,
+            message: "请选择商品主图",
+            trigger: "change",
+          },
+        ],
+        catid: [
+          {
+            required: true,
+            message: "请选择商品分类",
+            trigger: "change",
+          },
+        ],
+        brandid: [
+          {
+            required: true,
+            message: "请选择商品品牌",
+            trigger: "change",
+          },
+        ],
+        good_name: [
+          {
+            required: true,
+            message: "请输入商品名称",
+            trigger: "blur",
+          },
+          {
+            min: 2,
+            max: 50,
+            message: "长度在 2 到 50 个字符",
+            trigger: "blur",
+          },
+        ],
+        unit: [
+          {
+            required: true,
+            message: "请输入商品单位",
+            trigger: "blur",
+          },
+          {
+            min: 1,
+            max: 10,
+            message: "长度在 1 到 10 个字符",
+            trigger: "blur",
+          },
+        ],
+      },
+      ruleForm: {
+        spec: "",
+        table: "",
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      this.showModelThis = false;
+    },
+    async initForm() {
+      this.mock = [];
+      this.left = {
+        header: [],
+        middle: [],
+        specList: [],
+      };
+      this.right = {
+        header: [],
+        specList: [],
+      };
+      this.step = 0;
+      this.loading = true;
+      // brandidOptions
+      await this.getAllbrandid();
+      await this.getAllCat();
+      await this.getAllSupplier();
+
+      if (this.id === "add") {
+        this.title = "添加商品";
+        // this.ruleForm.isAdmin = 0;
+
+        await this.resetForm();
+      } else {
+        if (this.isDetail) {
+          this.title = "商品详情";
+        } else {
+          this.title = "修改商品";
+        }
+        await this.resetForm();
+        await this.initData();
+      }
+      this.loading = false;
+    },
+    async initData() {
+      this.loading = true;
+      let res = await asyncRequest.detail({ id: this.id });
+      this.loading = false;
+      if (res.code === 0) {
+        await this.resetForm(res.data);
+      }
+    },
+    async resetForm(data) {
+      // 重置
+      await this.$nextTick(async () => {
+        if (this.$refs.baseForm) {
+          this.$refs.baseForm.resetFields();
+          this.$refs.baseForm.clearValidate();
+          if (data) {
+            this.baseForm = {
+              id: this.id,
+              catid: data.good_cat.split(","),
+              good_name: data.good_name,
+              unit: data.good_unit,
+              supplier: data.supplier,
+              brandid: data.brand_id,
+              image: data.galley.split(","),
+            };
+            this.oldcatid = this.baseForm.catid;
+            await this.specByCat(false);
+            this.dealWithEditMock(data.attr);
+          } else {
+            this.baseForm = {
+              id: this.id,
+              catid: ["1", "2", "3"],
+              good_name:
+                "2018春秋新款V领修身丝绒西装女 双排扣复古极简中长款工装外套",
+              unit: "件",
+              supplier: "8",
+              brandid: "3",
+              image: [
+                "http://cum.sit.wanyuhengtong.com/20210425/1edfa0da4eee9b24d1f35d52b6a0ec0a.jpg",
+                "http://cum.sit.wanyuhengtong.com/20210425/cc70a4c06c83d9d8ac27ae35b118a23f.jpg",
+                "http://cum.sit.wanyuhengtong.com/20210425/a5e05dc1c5c75030bcc95f1da1d2d9cb.jpg",
+                "http://cum.sit.wanyuhengtong.com/20210425/9d505e7632891459a29f2fafe28d6705.jpg",
+                "http://cum.sit.wanyuhengtong.com/20210425/714914d7545184e99e240b3affeada07.jpg",
+              ],
+            };
+          }
+
+          this.ruleForm = {
+            spec: "",
+            table: "",
+          };
+        }
+      });
+    },
+    dealWithEditMock(attr) {
+      console.log(this.mock);
+      attr.forEach((v1) => {
+        if (v1 && v1.spec && v1.spec.length > 0) {
+          v1.spec.forEach((v2) => {
+            this.mock.forEach((v3, i) => {
+              if (v2.spec_id === v3.spec_id) {
+                console.log(v2.spec_info_id);
+                console.log(v3);
+                let index = v3.change.findIndex((v4) => {
+                  v4 === v2.spec_info_id;
+                });
+                if (index === -1) {
+                  v3.change.push(v2.spec_info_id);
+                }
+              }
+              this.$set(this.mock, i, v3);
+            });
+          });
+        }
+      });
+      // console.log(attr);
+      console.log(this.mock);
+      this.groupChange();
+      this.resume(attr);
+    },
+    resume(attr) {
+      this.right.specList.forEach((v1) => {
+        v1.forEach((v2) => {
+          attr.forEach((v3) => {
+            let is = true;
+            v3.spec.forEach((v4) => {
+              let index = v2.specid.findIndex((v5) => v5 === v4.spec_info_id);
+              if (index === -1) {
+                is = false;
+              }
+            });
+            if (is) {
+              v2.limit.forEach((v6, i) => {
+                if (v3.limit[i]) {
+                  v6.num = v3.limit[i].begin_num;
+                  v6.price = v3.limit[i].shop_price;
+                }
+              });
+            }
+          });
+        });
+      });
+      console.log(attr);
+      console.log(this.right.specList);
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          let change = false;
+          this.mock.forEach((v1) => {
+            if (v1.change && v1.change.length > 0) {
+              change = true;
+            }
+          });
+          if (!change) {
+            this.ruleForm.spec = "请选择规格！";
+            return;
+          } else {
+            this.ruleForm.spec = "";
+            let table = false;
+            let hasnot = false;
+            let stock = [];
+            this.right.specList.forEach((v1) => {
+              if (v1) {
+                v1.forEach((v2) => {
+                  if (v2 && v2.limit && v2.limit.length > 0) {
+                    let list = [];
+                    v2.limit.forEach((v3) => {
+                      if (v3.num != 0 && v3.price != 0) {
+                        table = true;
+                        list.push(v3);
+                      }
+                      if (
+                        (v3.num != 0 && v3.price == 0) ||
+                        (v3.num == 0 && v3.price !== 0)
+                      ) {
+                        hasnot = true;
+                      }
+                    });
+                    if (list.length > 0) {
+                      let model = Object.assign({}, v2);
+                      model.limit = list;
+                      stock.push(model);
+                    }
+                  }
+                });
+              }
+            });
+
+            if (hasnot) {
+              this.ruleForm.table =
+                "请选择起订量与成本价需成对填写，未成对请设为零！";
+            } else {
+              if (!table) {
+                this.ruleForm.table = "至少填写一堆起订量与成本价！";
+              } else {
+                this.ruleForm.table = "";
+                this.loading = true;
+                let obj = JSON.parse(JSON.stringify(this.baseForm));
+                obj.stock = stock;
+                obj.catid = obj.catid[obj.catid.length - 1];
+                obj.image = obj.image.join();
+                //split(",");
+                console.log(obj);
+                let res = {};
+                if (this.id === "add") {
+                  delete obj["id"];
+                  res = await asyncRequest.add(obj);
+                } else {
+                  res = await asyncRequest.update(obj);
+                }
+                this.loading = false;
+                if (res.code === 0) {
+                  let title = this.id === "add" ? "添加成功" : "修改成功";
+                  this.$notify.success({
+                    title,
+                    message: "",
+                  });
+                  this.showModelThis = false;
+                  // 刷新
+                  this.$emit("refresh");
+                }
+              }
+            }
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async baseSubmitForm() {
+      await this.$refs.baseForm.validate(async (valid) => {
+        if (valid) {
+          await this.handleChange();
+        }
+      });
+    },
+    groupChange($event, index, item) {
+      this.$set(this.mock, index, item);
+      this.actionSpecList();
+    },
+    actionSpecList() {
+      // this.leftS = "0px";
+      this.left.header = [];
+      this.left.middle = [];
+      this.left.specList = [];
+      console.log(this.mock);
+      console.log(this.right.specList);
+      this.mock.forEach((v1) => {
+        if (
+          v1.change &&
+          v1.change.length > 0 &&
+          v1.child &&
+          v1.child.length > 0
+        ) {
+          this.left.header.push({
+            spec_id: v1.spec_id,
+            spec_name: v1.spec_name,
+          });
+          let arr = [];
+          let changeList = v1.change;
+          changeList.forEach((v2) => {
+            let index = v1.child.findIndex((v3) => v2 === v3.id);
+            if (index !== -1) {
+              let x = {
+                spec_id: v1.spec_id,
+                spec_name: v1.spec_name,
+                id: v1.child[index].id,
+                spec_value: v1.child[index].spec_value,
+              };
+              arr.push(x);
+            }
+          });
+          this.left.middle.push(arr);
+        }
+      });
+      let lang = this.left.header.length;
+      this.leftS = lang * 70 + "px";
+      if (this.left.middle.length > 1) {
+        this.left.specList = this.doExchange(this.left.middle);
+      } else if (this.left.middle.length === 0) {
+        this.left.specList = [];
+      } else {
+        let list1 = [];
+        this.left.middle.forEach((v1) => {
+          if (v1) {
+            v1.forEach((v2) => {
+              let list2 = [];
+              list2.push(v2);
+              list1.push(list2);
+            });
+          }
+        });
+        this.left.specList = list1;
+      }
+      this.right.header = [];
+      for (let i = 0; i < this.ladderNum; i++) {
+        this.right.header.push(this.headLadder);
+      }
+      this.right.specList = [];
+      this.left.specList.forEach((v1) => {
+        let arr = [];
+        let model = {
+          specid: [],
+          limit: [],
+        };
+        v1.forEach((v2) => {
+          model.specid.push(v2.id);
+        });
+        for (let i = 0; i < this.ladderNum; i++) {
+          let bodyLadder = {
+            num: 0,
+            price: 0,
+          };
+          model.limit.push(bodyLadder);
+        }
+        arr.push(model);
+        this.right.specList.push(arr);
+      });
+      console.log(this.right.specList);
+    },
+
+    closeLadder(index) {
+      console.log(index);
+    },
+    async handleChange(type) {
+      if (this.baseForm.catid !== this.oldcatid && this.oldcatid.length === 0) {
+        await this.specByCat();
+
+        if (this.step === 0 && !type) {
+          this.step = 1;
+        }
+      } else if (
+        this.baseForm.catid !== this.oldcatid &&
+        this.oldcatid.length > 0
+      ) {
+        await this.$confirm(
+          "分类修改会影响该商品规格与价格！",
+          "确定要修改？",
+          {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+          }
+        )
+          .then(async () => {
+            await this.specByCat();
+            if (this.step === 0) {
+              this.step = 1;
+            }
+          })
+          .catch(() => {
+            this.baseForm.catid = this.oldcatid;
+          });
+      } else {
+        if (this.step === 0 && !type) {
+          this.step = 1;
+        }
+      }
+    },
+    //  商品种类ID换取规格值
+    async specByCat(type) {
+      console.log("准备拉取！");
+      this.mock = [];
+      this.$set(this.mock);
+      let list = this.baseForm.catid;
+      let res = await asyncRequest.specByCat({ catid: list[list.length - 1] });
+      if (res.code === 0) {
+        this.dealWitHInitMock(res.data, type);
+        this.oldcatid = list;
+      } else if (res.code !== 101 && res.code !== 102) {
+        this.baseForm.catid = this.oldcatid;
+      }
+    },
+    //  规格属性值新建
+    async specinfoadd(id, value) {
+      console.log(id, value);
+      let list = this.baseForm.catid;
+      let model = {
+        catid: list[list.length - 1],
+        specid: id,
+        spec_value: value,
+      };
+      let res = await asyncRequest.specinfoadd(model);
+      if (res.code === 0) {
+        await this.specByCat(true);
+      }
+    },
+    dealWitHInitMock(list, type) {
+      console.log(list, type);
+      if (!type) {
+        this.mock = [];
+        console.log("12345678");
+        console.log(this.mock);
+
+        this.left.header = [];
+        this.left.specList = [];
+        this.right.header = [];
+        this.right.specList = [];
+        list.map((v1) => {
+          v1.value = "";
+          v1.change = [];
+          return v1;
+        });
+        this.mock = list;
+        console.log(this.mock);
+        this.mock.forEach((v3, i) => {
+          this.$set(this.mock, i, v3);
+        });
+      } else {
+        let arr = JSON.parse(JSON.stringify(this.mock));
+        list.map((v1) => {
+          v1.value = "";
+          let index = arr.findIndex((v2) => v2.spec_id === v1.spec_id);
+          if (index !== -1) {
+            v1.change = arr[index].change;
+          }
+          return v1;
+        });
+        this.mock = list;
+        this.mock.forEach((v3, i) => {
+          this.$set(this.mock, i, v3);
+        });
+      }
+    },
+    async getAllbrandid() {
+      const res = await asyncRequest.brandAll({});
+      if (res.code === 0 && res.data) {
+        this.brandidOptions = res.data;
+      }
+    },
+    async getAllCat() {
+      const res = await asyncRequest.catAll({});
+      if (res.code === 0 && res.data) {
+        let list = res.data;
+        list.map((v1) => {
+          v1.value = v1.id;
+          v1.label = v1.cat_name;
+          if (v1.child && v1.child.length > 0) {
+            v1.child.map((v2) => {
+              v2.value = v2.id;
+              v2.label = v2.cat_name;
+              if (v2.child && v2.child.length > 0) {
+                v2.child.map((v3) => {
+                  v3.value = v3.id;
+                  v3.label = v3.cat_name;
+                  return v3;
+                });
+                v2.children = v2.child;
+              }
+              return v2;
+            });
+            v1.children = v1.child;
+          }
+
+          return v1;
+        });
+        this.catOptions = list;
+      }
+    },
+    async getAllSupplier() {
+      const res = await asyncRequest.supplierAll({});
+      if (res.code === 0 && res.data) {
+        let list = res.data;
+        this.supplierOptions = list;
+      }
+    },
+    //图片上传失败
+    UploadErrorEvent() {
+      this.$message.error("图片上传失败!");
+      this.$refs.ruleForm.validateField("image");
+    },
+    closeImg(index) {
+      this.baseForm.image.splice(index, 1);
+      this.$refs.baseForm.validateField("image");
+    },
+    //图片上传成功
+    UploadSuccessEvent(data) {
+      console.log(data);
+      this.baseForm.image.push(data.url);
+      this.$message.success("图片上传成功!");
+      this.$refs.baseForm.validateField("image");
+    },
+    //判断图片规格
+    beforeAvatarUpload(file) {
+      console.log(file);
+      let isJPG = false;
+      if (
+        file.type === "image/jpg" ||
+        file.type === "image/png" ||
+        file.type === "image/bmp" ||
+        file.type === "image/jpeg" ||
+        file.type === "image/gif"
+      ) {
+        isJPG = true;
+      }
+      const isLt2M = file.size / 1024 / 1024 < 1;
+      if (!isJPG) {
+        this.$message.error("图片格式不正确！");
+      }
+      if (!isLt2M) {
+        this.$message.error("图片大小不能超过 1MB!");
+      }
+      return isJPG && isLt2M;
+    },
+    doExchange(arr) {
+      let len = arr.length;
+      // 当数组大于等于2个的时候
+      if (len >= 2) {
+        // 第一个数组的长度
+        let len1 = arr[0].length;
+        // 第二个数组的长度
+        let len2 = arr[1].length;
+        // 2个数组产生的组合数
+        let lenBoth = len1 * len2;
+        //  申明一个新数组
+        let items = new Array(lenBoth);
+        // 申明新数组的索引
+        let index = 0;
+        for (let i = 0; i < len1; i++) {
+          for (let j = 0; j < len2; j++) {
+            if (arr[0][i] instanceof Array) {
+              items[index] = arr[0][i].concat(arr[1][j]);
+            } else {
+              items[index] = [arr[0][i]].concat(arr[1][j]);
+            }
+            index++;
+          }
+        }
+        let newArr = new Array(len - 1);
+        for (let i = 2; i < arr.length; i++) {
+          newArr[i - 1] = arr[i];
+        }
+        newArr[0] = items;
+        return this.doExchange(newArr);
+      } else {
+        return arr[0];
+      }
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.goods {
+  $goodsBoderColor: #dfe6ec;
+  .tips-error {
+    color: #ff8888;
+    font-size: 12px;
+    height: 22px;
+    line-height: 20px;
+    padding-left: 60px;
+  }
+  .ladder-table {
+    position: relative;
+
+    width: 100%;
+    border: 1px solid $goodsBoderColor;
+
+    .left {
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: 3;
+      background: #fff;
+      // width: 140px;
+      .ladder-header {
+        position: relative;
+        width: 100%;
+        .header-spec {
+          position: relative;
+          // border-bottom: 1px solid $goodsBoderColor;
+          li {
+            float: left;
+            width: 70px;
+            height: 50px;
+            line-height: 50px;
+            overflow: hidden;
+            padding: 0 10px;
+            font-size: 12px;
+            color: #909399;
+            border-right: 1px solid $goodsBoderColor;
+            span {
+              height: 25px;
+              line-height: 25px;
+              min-height: 50px;
+              overflow: hidden;
+            }
+          }
+        }
+      }
+      .ladder-body {
+        position: relative;
+        width: 100%;
+        ul {
+          width: 100%;
+          display: flex;
+          li {
+            flex: 1;
+            height: 40px;
+            line-height: 40px;
+            padding: 0 10px;
+            border-top: 1px solid $goodsBoderColor;
+            border-right: 1px solid $goodsBoderColor;
+            span {
+              display: block;
+              height: 40px;
+              width: 49px;
+              overflow: hidden;
+              line-height: 40px;
+              color: #606266;
+              font-size: 12px;
+              text-overflow: ellipsis;
+              white-space: normal;
+              word-break: break-all;
+              //               overflow: hidden;
+              // text-overflow:ellipsis;
+              // white-space: nowrap;
+            }
+          }
+        }
+      }
+    }
+    .right {
+      position: relative;
+      // padding-left: 140px;
+      width: 100%;
+      overflow-x: scroll;
+      background: #fff;
+      .ladder-header {
+        position: relative;
+        width: 100%;
+        .header-spec {
+          display: flex;
+          li {
+            min-width: 240px;
+            flex: 1;
+            .all {
+              width: 100%;
+              .title {
+                width: 100%;
+                height: 25px;
+                padding: 0 10px;
+                font-size: 12px;
+                color: #909399;
+                line-height: 25px;
+                text-align: center;
+                position: relative;
+                border-right: 1px solid $goodsBoderColor;
+                border-bottom: 1px solid $goodsBoderColor;
+                i {
+                  position: absolute;
+                  top: 2px;
+                  right: 2px;
+                  z-index: 2;
+                  &:hover {
+                    cursor: pointer;
+                  }
+                }
+              }
+              .main {
+                width: 100%;
+                height: 25px;
+                span {
+                  vertical-align: top;
+                  width: 50%;
+                  height: 25px;
+                  line-height: 25px;
+                  text-align: center;
+                  padding: 0 10px;
+                  font-size: 12px;
+                  color: #909399;
+                  line-height: 25px;
+                  display: inline-block;
+                  border-right: 1px solid $goodsBoderColor;
+                  border-bottom: 1px solid $goodsBoderColor;
+                }
+              }
+            }
+          }
+        }
+      }
+      .ladder-body {
+        position: relative;
+        width: 100%;
+        ul {
+          width: 100%;
+          position: relative;
+          li {
+            width: 100%;
+            display: flex;
+            .input-main {
+              flex: 1;
+              min-width: 240px;
+              .el-input-number {
+                .el-input {
+                  input.el-input_inner {
+                    border-radius: 0;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+  .mack-mian {
+    position: relative;
+    width: 100%;
+    .mock-item-div {
+      width: 100%;
+      background: rgba(246, 247, 248, 1);
+      padding: 12px 12px 0 12px;
+      margin: 0 0 10px 0;
+      .mock-title {
+        width: 100%;
+        padding: 0 0 5px 0;
+        border-bottom: 1px solid rgba(226, 226, 226, 1);
+      }
+    }
+  }
+
+  .activity-upload {
+    position: relative;
+    .img-list-main {
+      position: relative;
+      width: auto;
+      border-left: 1px solid rgb(220, 223, 230);
+      .img-item {
+        float: left;
+        width: 167px;
+        height: 167px;
+        border: 1px solid rgb(220, 223, 230);
+        border-left: 0;
+        position: relative;
+        img {
+          display: inline-block;
+          width: 100%;
+          height: 100%;
+        }
+        i {
+          position: absolute;
+          right: 6px;
+          font-size: 16px;
+          top: 6px;
+          z-index: 2;
+          color: #909399;
+          &:hover {
+            cursor: pointer;
+            color: rgb(56, 193, 231);
+          }
+        }
+      }
+    }
+    .btnupload {
+      float: left;
+      border: 1px solid rgb(220, 223, 230);
+      border-left: 0;
+      box-sizing: border-box;
+      width: 167px;
+      height: 167px;
+      line-height: 167px;
+      text-align: center;
+    }
+    .Upload {
+      width: 167px;
+      height: 167px;
+      line-height: 167px;
+      text-align: center;
+      position: absolute;
+      line-height: 0px;
+      top: 0;
+      left: 0;
+      z-index: 2;
+      line-height: 167px;
+    }
+    .fileUp {
+      vertical-align: top;
+    }
+    .avatar {
+      width: 167px;
+      height: 167px;
+      line-height: 167px;
+      text-align: center;
+    }
+    .avatar-uploader .el-upload:hover {
+      border-color: #409eff;
+    }
+    .avatar-uploader-icon {
+      font-size: 33px;
+      color: #8c939d;
+      width: 50px;
+      height: 50px;
+      line-height: 50px;
+      text-align: center;
+    }
+    .avatar {
+      width: 100%;
+      height: 100%;
+      display: block;
+    }
+    .txt-tips {
+      display: inline-block;
+      font-size: 13px;
+      color: #606266;
+      padding: 15px 0 0 15px;
+      p {
+        margin: 0;
+        line-height: 30px;
+        span {
+          padding: 0 15px 0 0;
+        }
+      }
+    }
+    .avatar-uploader .el-upload {
+      border: 1px dashed #d9d9d9;
+      border-radius: 6px;
+      cursor: pointer;
+      position: relative;
+      overflow: hidden;
+    }
+  }
+}
+</style>
+   

src/views/goodStore/goods/imgShow.vue

@@ -0,0 +1,92 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="8vh"
+    width="600px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+  >
+    <el-card>
+      <el-row :gutter="10" >
+        <el-col :span="24">
+          <img class="activeImg" :src="activeImg" alt="" />
+        </el-col>
+        <el-col :span="24" style="text-align: right;padding-top:10px"  v-if="imgList&&imgList.length>0">
+          <div class="img-box">
+            <img
+              @click="initForm(i)"
+              :class="{ active: activeIndex === i }"
+              v-for="(img, i) in imgList"
+              :key="'imgboxitem' + i"
+              :src="img"
+              alt=""
+            />
+          </div>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+export default {
+  name: "goods",
+  props: ["showModel", "imgList", "index"],
+  data() {
+    return {
+      activeImg: "",
+      activeIndex: this.index,
+      showModelThis: this.showModel,
+    };
+  },
+  methods: {
+    closeModel() {
+      this.showModelThis = false;
+    },
+    initForm(index) {
+      this.activeIndex = index;
+      this.activeImg = this.imgList[index];
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm(this.index);
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.goods {
+  .activeImg {
+    display: inline-block;
+    width: 100%;
+  }
+  .img-box {
+    img {
+      width: 40px;
+      height: 40px;
+      display: inline-block;
+      margin: 0 3px;
+      border:1px solid transparent;
+      &.active {
+        border: 1px solid red;
+      }
+      &:hover {
+        cursor: pointer;
+      }
+    }
+  }
+}
+</style>
+   

src/views/goodStore/goods/index.vue

@@ -0,0 +1,774 @@
+<template>
+  <div class="goods pagePadding">
+    <div
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+    >
+      <el-row style="margin-bottom: 10px">
+        <el-col :span="6" style="width: 316px">
+          <period-date-picker
+            :start="parmValue.start"
+            :end="parmValue.end"
+            :type="1"
+            :size="searchSize"
+            @timeReturned="timeReturned($event)"
+          ></period-date-picker>
+        </el-col>
+        <el-col :span="18" id="el-cor-full-style">
+          <el-row :gutter="10">
+            <el-col :span="6">
+              <el-cascader
+                v-model="parmValue.catid"
+                style="width: 100%"
+                filterable
+                :size="searchSize"
+                clearable
+                placeholder="商品分类"
+                :options="catOptions"
+                :props="{ expandTrigger: 'hover', checkStrictly: true }"
+                @change="handleChange"
+              ></el-cascader>
+            </el-col>
+            <el-col :span="6">
+              <el-select
+                v-model="parmValue.status"
+                filterable
+                clearable
+                :size="searchSize"
+                placeholder="请选择状态"
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="item in statusList"
+                  :key="'status' + item.code"
+                  :label="item.name"
+                  :value="item.code"
+                />
+              </el-select>
+            </el-col>
+
+            <el-col :span="6">
+              <el-input
+                :size="searchSize"
+                style="100%"
+                v-model="parmValue.supplier_name"
+                :maxlength="40"
+                placeholder="供货商名称"
+              ></el-input>
+            </el-col>
+            <el-col :span="6">
+              <el-input
+                :size="searchSize"
+                style="100%"
+                v-model="parmValue.good_code"
+                :maxlength="40"
+                placeholder="商品编码"
+              ></el-input>
+            </el-col>
+          </el-row>
+        </el-col>
+      </el-row>
+      <el-row style="margin-bottom: 18px">
+        <el-col :span="6" style="width: 316px">
+          <el-input
+            :size="searchSize"
+            :maxlength="10"
+            placeholder="最低售价"
+            v-model="parmValue.sale_price_start"
+            style="width: 150px"
+          ></el-input>
+          <samp>至</samp>
+          <el-input
+            :size="searchSize"
+            :maxlength="10"
+            placeholder="最高售价"
+            v-model="parmValue.sale_price_end"
+            style="width: 150px"
+          ></el-input>
+        </el-col>
+
+        <el-col :span="18" id="el-cor-full-style">
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-input
+                :size="searchSize"
+                v-model="parmValue.goods_name"
+                :maxlength="40"
+                placeholder="商品名称"
+              >
+                <el-button
+                  slot="append"
+                  icon="el-icon-search"
+                  @click="searchList"
+                ></el-button>
+              </el-input>
+            </el-col>
+            <el-col :span="12">
+              <el-button
+               v-if="powers.some((item) => item == '024')"
+                type="warning"
+                class="fl"
+                :size="searchSize"
+                @click="restSearch"
+              >
+                重置
+              </el-button>
+              <el-button
+               v-if="powers.some((item) => item == '002')"
+                type="primary"
+                :size="searchSize"
+                class="fr"
+                style="margin-left: 5px"
+                @click="searchList"
+              >
+                刷新
+              </el-button>
+              <el-button
+               v-if="powers.some((item) => item == '003')"
+                type="success"
+                :size="searchSize"
+                style="float: right"
+                @click="openModal('add', false)"
+              >
+                添加
+              </el-button>
+            </el-col>
+          </el-row></el-col
+        >
+      </el-row>
+      <el-table
+        :data="tableData"
+        stripe
+        v-loading="loading"
+        border
+        :size="size"
+        style="width: 100%"
+      >
+        <el-table-column label="商品信息" align="left" min-width="165">
+          <template slot-scope="item">
+            <div class="good_name_title">
+              {{ item.row.good_name }}
+            </div>
+            <div
+              class="good_name_img"
+              v-if="item.row.galleyList && item.row.galleyList.length > 0"
+            >
+              <img
+                v-for="(img, i) in item.row.galleyList"
+                :key="item.row.id + 'goodimg' + i"
+                :src="img"
+                @click="showGalley(item.row.galleyList, i)"
+                alt=""
+              />
+            </div> </template
+        ></el-table-column>
+        <el-table-column label="供应商信息" show-overflow-tooltip align="left">
+          <template slot-scope="item">
+            <div v-if="item.row.supplier_info">
+              <div class="good_name_title">
+                企业：{{ item.row.supplier_info.company }}
+              </div>
+              <div class="good_name_title">
+                联系人：{{ item.row.supplier_info.name }}
+              </div>
+            </div>
+          </template></el-table-column
+        >
+        <el-table-column
+          prop="good_code"
+          label="商品编码"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column
+          prop="catName"
+          label="商品分类"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+
+        <el-table-column label="状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              v-if="scope.row.status === '1'"
+              type="success"
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  powers.some((item) => item == '026')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '026')"
+                style="margin-right: 1px"
+              ></i>
+              销售中</el-tag
+            >
+            <el-tag
+              v-else
+              :class="{ 'hover-tag': powers.some((item) => item == '026') }"
+              :size="tablebtnSize"
+              type="warning"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  powers.some((item) => item == '026')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '026')"
+                style="margin-right: 1px"
+              ></i>
+              已下架</el-tag
+            >
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="addtime"
+          label="创建时间"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column fixed="right" label="操作" align="center">
+          <template slot-scope="scope">
+            <el-link
+              v-if="powers.some((item) => item == '011')"
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="
+                showPrice(
+                  scope.row.LimitPrice,
+                  scope.row.left,
+                  scope.row.right,
+                  scope.row.lang
+                )
+              "
+            >
+              价格
+            </el-link>
+            <el-link
+              v-if="powers.some((item) => item == '012')"
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="copy(scope.row.id)"
+            >
+              复制
+            </el-link>
+            <el-link
+              v-if="
+                scope.row.status === '0' && powers.some((item) => item == '005')
+              "
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, false)"
+            >
+              修改
+            </el-link>
+            <el-link
+              v-if="powers.some((item) => item == '006')"
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="deleteById(scope.row.id, scope.row.status)"
+            >
+              删除
+            </el-link>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div
+        class="Pagination"
+        style="text-align: right; margin-top: 10px"
+        v-show="count > 0"
+      >
+        <el-pagination
+          :size="searchSize"
+          @size-change="handleSizeChange"
+          @current-change="handlePageChange"
+          :current-page="parmValue.page"
+          :page-sizes="[10, 15, 20, 30, 40]"
+          :page-size="parmValue.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="count"
+        ></el-pagination>
+      </div>
+      <add-edit
+        :showModel="showModel"
+        :id="modelId"
+        :isDetail="isDetail"
+        @refresh="searchList"
+        @cancel="showModel = false"
+      ></add-edit>
+      <ladder-price
+        :showModel="showLadderPrice"
+        :left="left"
+        :right="right"
+        :lang="lang"
+        @cancel="showLadderPrice = false"
+      ></ladder-price>
+      <imgShow
+        :showModel="showImgModel"
+        :imgList="imgList"
+        :index="index"
+        @cancel="showImgModel = false"
+      ></imgShow>
+    </div>
+    <div v-else>
+      <no-auth></no-auth>
+    </div>
+  </div>
+</template>
+   <script>
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/goodStore/goods";
+import addEdit from "./addEdit";
+import ladderPrice from "./ladderPrice";
+import imgShow from "./imgShow";
+// import PeriodDatePicker from "@/components/PeriodDatePicker";
+import statusList from "@/assets/js/statusList";
+import { timestampToTime } from "@/utils/validate";
+import { mapGetters } from "vuex";
+export default {
+  name: "goods",
+  components: {
+    addEdit,
+    // PeriodDatePicker,
+    ladderPrice,
+    imgShow,
+  },
+  data() {
+    return {
+      imgList: [],
+      index: 0,
+      showImgModel: false,
+      statusList: statusList,
+      catOptions: [],
+      showLadderPrice: false,
+      loading: false,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      left: {},
+      right: {},
+      lang: "0px",
+      parmValue: {
+        catid: "", //种类id
+        start: "", //起始时间,
+        end: "", //结束时间
+        sale_price_start: "", //最低售价
+        sale_price_end: "", //最高售价
+        status: "",
+        goods_name: "", //商品名称
+        good_code: "", //商品code
+        supplier_name: "", //供货商
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      },
+      count: 0, // 总条数
+      tableData: [],
+      headLadder: {
+        num: "起订量≥",
+        price: "成本价",
+      },
+    };
+  },
+  mixins: [mixinPage],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "goods"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  mounted() {
+    this.searchList();
+    this.getAllCat();
+  },
+
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        catid: "", //种类id
+        start: "", //起始时间,
+        end: "", //结束时间
+        sale_price_start: "", //最低售价
+        sale_price_end: "", //最高售价
+        status: "",
+        goods_name: "", //商品名称
+        good_code: "", //商品code
+        supplier_name: "", //供货商
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    async handleChange() {
+      this.parmValue.page = 1;
+      await this.searchList();
+    },
+    async timeReturned(e) {
+      if (e.startTime !== "") {
+        this.parmValue.start = timestampToTime(e.startTime);
+      } else {
+        this.parmValue.start = "";
+      }
+
+      if (e.endTime !== "") {
+        this.parmValue.end = timestampToTime(e.endTime);
+      } else {
+        this.parmValue.end = "";
+      }
+      if (this.parmValue.start !== "" && this.parmValue.end !== "") {
+        this.parmValue.page = 1;
+        await this.searchList();
+      }
+    },
+    openModal(id, isDetail) {
+      if (id !== "add") {
+        this.$message.warning("正在开发中！");
+      } else {
+        this.showModel = true;
+        this.modelId = id;
+        this.isDetail = isDetail;
+      }
+    },
+    showGalley(list, i) {
+      this.imgList = list;
+      this.index = i;
+      this.showImgModel = true;
+    },
+    async copy(id) {
+      let res = await asyncRequest.copy({ id: id });
+      if (res.code === 0) {
+        this.$notify.success({
+          title: "商品复制成功！",
+          message: "",
+        });
+        this.searchList();
+      }
+    },
+    async deleteById(id, status) {
+      if (status === "0") {
+        await this.$confirm("确定要删除该商品？", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            let res = await asyncRequest.delete({ goodids: id });
+            if (res.code === 0) {
+              this.$notify.success({
+                title: "删除成功",
+                message: "",
+              });
+              this.searchList();
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        this.$message.warning("只有已下架的商品才能被删除！");
+      }
+    },
+    showPrice(attr, left, right, lang) {
+      if (attr && attr.length > 0) {
+        this.left = left;
+        this.right = right;
+        this.lang = lang;
+        this.showLadderPrice = true;
+      } else {
+        this.$message.warning("该商品暂无阶梯价格信息！");
+      }
+    },
+    async searchList() {
+      let obj = JSON.parse(JSON.stringify(this.parmValue));
+
+      if (obj.catid === "") {
+        obj.catid = "0";
+      }
+      this.loading = true;
+      let res = await asyncRequest.list(obj);
+      if (res.code === 0 && res.data) {
+        let list = res.data.list;
+
+        list = list.map((v1) => {
+          v1.catName = "";
+          v1.galleyList = v1.galley.split(",");
+          v1.addtime = v1.addtime.replaceAll(".000", "");
+          if (v1 && v1.cat && v1.cat.length > 0) {
+            v1.cat.forEach((v2, index) => {
+              v1.catName += index !== 0 ? "/" + v2.cat_name : v2.cat_name;
+            });
+          } else {
+            v1.catName = "";
+          }
+          if (v1 && v1.LimitPrice && v1.LimitPrice.length > 0) {
+            v1.left = {
+              header: [],
+              spec: [],
+            };
+            v1.right = {
+              header: [],
+              spec: [],
+            };
+            v1.left.header = v1.LimitPrice[0].spec;
+            v1.lang = v1.left.header.length * 100 + "px";
+            let ladderNum = 0;
+            v1.LimitPrice.forEach((a) => {
+              if (a.limit && a.limit.length > ladderNum) {
+                ladderNum = a.limit.length;
+              }
+              if (a.spec && a.spec.length > 0) {
+                v1.left.spec.push(a.spec);
+              }
+            });
+            for (let i = 0; i < ladderNum; i++) {
+              v1.right.header.push(this.headLadder);
+            }
+
+            v1.right.spec = v1.LimitPrice;
+            v1.right.spec.map((v1) => {
+              if (v1.limit && v1.limit.length > 0) {
+                for (let j = 0; j < ladderNum; j++) {
+                  if (!v1.limit[j]) {
+                    v1.limit.push({
+                      begin_num: "",
+                      shop_price: "",
+                    });
+                  }
+                }
+              }
+            });
+          }
+          return v1;
+        });
+        this.tableData = list;
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    async getAllCat() {
+      const res = await asyncRequest.catAll({});
+      if (res.code === 0 && res.data) {
+        let list = res.data;
+        list.map((v1) => {
+          v1.value = v1.id;
+          v1.label = v1.cat_name;
+          if (v1.child && v1.child.length > 0) {
+            v1.child.map((v2) => {
+              v2.value = v2.id;
+              v2.label = v2.cat_name;
+              if (v2.child && v2.child.length > 0) {
+                v2.child.map((v3) => {
+                  v3.value = v3.id;
+                  v3.label = v3.cat_name;
+                  return v3;
+                });
+                v2.children = v2.child;
+              }
+              return v2;
+            });
+            v1.children = v1.child;
+          }
+          return v1;
+        });
+        this.catOptions = list;
+      }
+    },
+    async statusConfirm(id, status, type) {
+      if (!type) {
+        return;
+      }
+      await this.$confirm(
+        `确定要改为${status === "1" ? "已下架" : "销售中"}？`,
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(async () => {
+          this.loading = true;
+          const model = {
+            goodids: id,
+            status: status === "1" ? "0" : "1",
+          };
+          const res = await asyncRequest.status(model);
+          if (res.code === 0) {
+            this.loading = false;
+            this.$notify.success({
+              title: "状态修改成功！",
+              message: "",
+            });
+            await this.searchList();
+          } else {
+            this.loading = false;
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.goods {
+  $gBC: #dfe6ec;
+  .list-table {
+    position: relative;
+    width: 100%;
+    border-top: 1px solid $gBC;
+    border-left: 1px solid $gBC;
+    .left {
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: 2;
+      background: #fff;
+      .header {
+        width: 100%;
+        display: flex;
+        .header-item {
+          width: 100px;
+          flex: 1;
+          padding: 0 10px;
+          height: 50px;
+          line-height: 50px;
+          border-right: 1px solid $gBC;
+          border-bottom: 1px solid $gBC;
+        }
+      }
+      .header-body {
+        width: 100%;
+        position: relative;
+        .header-body-row {
+          width: 100%;
+          display: flex;
+          .heder-body-col {
+            flex: 1;
+            padding: 0 10px;
+            height: 30px;
+            border-right: 1px solid $gBC;
+            border-bottom: 1px solid $gBC;
+            line-height: 30px;
+          }
+        }
+      }
+    }
+    .right {
+      position: relative;
+      width: 100%;
+      display: block;
+      overflow-x: scroll;
+      .header {
+        width: 100%;
+        display: flex;
+        .header-col {
+          min-width: 240px;
+          flex: 1;
+          height: 50px;
+          line-height: 50px;
+
+          // position: relative;
+          .header-col-jieti {
+            height: 50px;
+            line-height: 50px;
+            // position: relative;
+            width: 100%;
+            .header-col-jieti-title {
+              // position: relative;
+              width: 100%;
+              line-height: 25px;
+              border-right: 1px solid $gBC;
+              border-bottom: 1px solid $gBC;
+              height: 25px;
+            }
+            .header-col-jieti-main {
+              // position: relative;
+              width: 100%;
+              .header-col-item {
+                // position: relative;
+                height: 25px;
+                line-height: 25px;
+                width: 50%;
+                border-right: 1px solid $gBC;
+                border-bottom: 1px solid $gBC;
+              }
+            }
+          }
+        }
+      }
+      .right-body {
+        position: relative;
+        .right-body-col {
+          position: relative;
+          width: 100%;
+          display: flex;
+          .right-body-col-item {
+            min-width: 240px;
+            flex: 1;
+
+            position: relative;
+            overflow: hidden;
+            .right-body-col-item-div {
+              position: relative;
+              height: 30px;
+              line-height: 30px;
+              width: 50%;
+              padding: 0 10px;
+              border-right: 1px solid $gBC;
+              border-bottom: 1px solid $gBC;
+            }
+          }
+        }
+      }
+    }
+  }
+  .good_name_img {
+    position: relative;
+    width: 156px;
+    img {
+      position: relative;
+      width: 30px;
+      height: 30px;
+      display: inline-block;
+      border-top: 1px solid #dfe6ec;
+      border-right: 1px solid #dfe6ec;
+      border-bottom: 1px solid #dfe6ec;
+      &:hover {
+        cursor: pointer;
+      }
+      &:first-child {
+        border-left: 1px solid #dfe6ec;
+      }
+    }
+  }
+}
+</style>
+   

src/views/goodStore/goods/ladderPrice.vue

@@ -0,0 +1,258 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="12vh"
+    width="1040px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+  >
+  <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <div
+            v-if="
+              left &&
+              left.header &&
+              left.header.length > 0 &&
+              right &&
+              right.header &&
+              right.header.length > 0
+            "
+          >
+            <div class="list-table clearfix">
+              <div class="left" :style="{ width: lang }">
+                <div class="header">
+                  <div
+                    class="header-item"
+                    v-for="(lhead, lhi) in left.header"
+                    :key="'lhead' + lhi"
+                  >
+                    {{ lhead.spec_name }}
+                  </div>
+                </div>
+                <div
+                  class="header-body"
+                  v-if="left.spec && left.spec.length > 0"
+                >
+                  <div
+                    class="header-body-row"
+                    v-for="(lhr, lhri) in left.spec"
+                    :key="'lheadrow' + lhri"
+                  >
+                    <div
+                      class="heder-body-col"
+                      v-for="(lhc, lhci) in lhr"
+                      :key="'lheadcol' + lhci"
+                    >
+                      {{ lhc.spec_value }}
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div class="right" :style="{ paddingLeft: lang }">
+                <div class="header">
+                  <div
+                    class="header-col clearfix"
+                    v-for="(lhr, lhri) in right.header"
+                    :key="'lheadr' + lhri"
+                  >
+                    <div class="header-col-jieti clearfix">
+                      <div class="header-col-jieti-title tc clearfix">
+                        阶梯{{ lhri + 1 }}
+                      </div>
+                      <div class="header-col-jieti-main clearfix">
+                        <div class="header-col-item fl tc">{{ lhr.num }}</div>
+                        <div class="header-col-item fl tc">{{ lhr.price }}</div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="right-body"
+                  v-if="right.spec && right.spec.length > 0"
+                >
+                  <div
+                    class="right-body-col"
+                    v-for="(lbr, lbri) in right.spec"
+                    :key="'lbodyr' + lbri"
+                  >
+                    <div
+                      class="right-body-col-item clearfix"
+                      v-for="(lbritem, lbritemi) in lbr.limit"
+                      :key="'lbritem' + lbritemi"
+                    >
+                      <div class="right-body-col-item-div fl tc">
+                        {{ lbritem.begin_num }}
+                      </div>
+                      <div class="right-body-col-item-div fl tc">
+                        {{ lbritem.shop_price }}
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div v-else class="tc">
+            <el-tag type="warning">暂无阶梯价！</el-tag>
+          </div>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+export default {
+  name: "goods",
+  props: ["showModel", "left", "right", "lang"],
+  data() {
+    return {
+      loading: true,
+      title: "商品阶梯价格",
+       showModelThis: this.showModel,
+    };
+  },
+  methods: {
+    closeModel(e) {
+      console.log(e);
+      this.showModelThis = false;
+    },
+    async initForm() {
+      this.loading = false;
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.goods {
+  $gBC: #dfe6ec;
+  .list-table {
+    position: relative;
+    width: 100%;
+    border-top: 1px solid $gBC;
+    border-left: 1px solid $gBC;
+    .left {
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: 2;
+      background: #fff;
+      .header {
+        width: 100%;
+        display: flex;
+        .header-item {
+          width: 100px;
+          flex: 1;
+          padding: 0 10px;
+          height: 64px;
+          line-height: 64px;
+          border-right: 1px solid $gBC;
+          border-bottom: 1px solid $gBC;
+        }
+      }
+      .header-body {
+        width: 100%;
+        position: relative;
+        .header-body-row {
+          width: 100%;
+          display: flex;
+          .heder-body-col {
+            flex: 1;
+            padding: 0 10px;
+            height: 38px;
+            border-right: 1px solid $gBC;
+            border-bottom: 1px solid $gBC;
+            line-height: 38px;
+          }
+        }
+      }
+    }
+    .right {
+      position: relative;
+      width: 100%;
+      display: block;
+      overflow-x: scroll;
+      .header {
+        width: 100%;
+        display: flex;
+        .header-col {
+          min-width: 220px;
+          flex: 1;
+          height: 64px;
+          line-height: 64px;
+
+          // position: relative;
+          .header-col-jieti {
+            height: 64px;
+            line-height: 64px;
+            // position: relative;
+            width: 100%;
+            .header-col-jieti-title {
+              // position: relative;
+              width: 100%;
+              line-height: 32px;
+              border-right: 1px solid $gBC;
+              border-bottom: 1px solid $gBC;
+              height: 32px;
+            }
+            .header-col-jieti-main {
+              // position: relative;
+              width: 100%;
+              .header-col-item {
+                // position: relative;
+                height: 32px;
+                line-height: 32px;
+                width: 50%;
+                border-right: 1px solid $gBC;
+                border-bottom: 1px solid $gBC;
+              }
+            }
+          }
+        }
+      }
+      .right-body {
+        position: relative;
+        .right-body-col {
+          position: relative;
+          width: 100%;
+          display: flex;
+          .right-body-col-item {
+            min-width: 220px;
+            flex: 1;
+
+            position: relative;
+            overflow: hidden;
+            .right-body-col-item-div {
+              position: relative;
+              height: 38px;
+              line-height: 38px;
+              width: 50%;
+              padding: 0 10px;
+              border-right: 1px solid $gBC;
+              border-bottom: 1px solid $gBC;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+   

src/views/goodStore/sort/addEdit.vue

@@ -0,0 +1,530 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="18vh"
+    width="900px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            v-if="isApproval"
+            :model="cexForm"
+            status-icon
+            :rules="cexRules"
+            ref="cexForm"
+            label-width="80px"
+            class="cexForm-ruleForm"
+            ><el-row>
+              <el-col :span="12">
+                <el-row class="cexForm-div" v-if="dataInfo && dataInfo.parent">
+                  <el-col :span="8" class="tr cexForm-label">上级分类：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.parent.cat_pid === "0"
+                      ? dataInfo.parent.cat_name
+                      : dataInfo.parent.cat_pid_name +
+                        "/" +
+                        dataInfo.parent.cat_name
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">分类名称：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.cat_name
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">规格：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    dataInfo.specName
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">分类备注：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.cat_remark
+                  }}</el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="审核状态" prop="status">
+                  <el-select
+                    v-model="cexForm.status"
+                    placeholder="请选择审核状态"
+                    @change="selectChange"
+                  >
+                    <el-option
+                      v-for="item in statusList"
+                      :key="item.code"
+                      :label="item.name"
+                      :value="item.code"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="审核说明" prop="remark">
+                  <el-input
+                    v-model="cexForm.remark"
+                    type="textarea"
+                    placeholder="请输入审核说明"
+                    :rows="5"
+                    maxlength="300"
+                    show-word-limit
+                  ></el-input>
+                </el-form-item>
+                <el-col :span="24" style="text-align: right">
+                  <el-button type="primary" @click="submitCexForm"
+                    >保 存
+                  </el-button>
+                  <el-button @click="showModelThis = false">取 消</el-button>
+                </el-col>
+              </el-col>
+            </el-row></el-form
+          >
+
+          <el-form
+            v-else
+            :model="ruleForm"
+            status-icon
+            :rules="rulesThis"
+            ref="ruleForm"
+            label-width="80px"
+            class="demo-ruleForm"
+            ><el-row>
+              <el-form-item label="上级分类" prop="pid">
+                <el-cascader
+                  v-model="ruleForm.pid"
+                  style="width: 60%"
+                  filterable
+                  clearable
+                  :options="catOptions"
+                  :props="{ expandTrigger: 'hover', checkStrictly: true }"
+                  @change="handleChange"
+                ></el-cascader>
+                <el-tag style="margin: 0 0 0 10px" type="warning"
+                  >提示：不选择上级分类时，默认为一级分类</el-tag
+                >
+              </el-form-item>
+              <el-form-item label="分类名称" prop="cat_name">
+                <el-input
+                  v-model="ruleForm.cat_name"
+                  :disabled="isDetail"
+                ></el-input>
+              </el-form-item>
+
+              <el-form-item label="规格" prop="spec">
+                <el-select
+                  v-model="ruleForm.spec"
+                  multiple
+                  filterable
+                  style="width: 100%"
+                  clearable
+                  :disabled="isDetail"
+                  class="setWidth"
+                >
+                  <el-option
+                    v-for="item in specOptions"
+                    :key="`cat` + item.id"
+                    :label="item.spec_name"
+                    :value="item.id"
+                    :disabled="item.status !== '1'"
+                  >
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="备注" prop="cat_remark">
+                <el-input
+                  v-model="ruleForm.cat_remark"
+                  type="textarea"
+                  placeholder="请输入备注"
+                  :rows="5"
+                  maxlength="300"
+                  show-word-limit
+                  :disabled="isDetail"
+                />
+              </el-form-item>
+
+              <el-col :span="24" style="text-align: right">
+                <el-tag
+                  type="warning"
+                  class="fl"
+                  style="max-width: 500px"
+                  v-if="dataInfo.ex_remark && dataInfo.ex_status === '2'"
+                  >审核备注：{{ dataInfo.ex_remark }}</el-tag
+                >
+
+                <el-button type="primary" @click="submitForm" v-if="!isDetail"
+                  >保 存
+                </el-button>
+                <el-button @click="showModelThis = false">{{
+                  isDetail ? "关 闭" : "取 消"
+                }}</el-button>
+              </el-col>
+            </el-row>
+          </el-form>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+import asyncRequest from "@/apis/service/goodStore/sort";
+import {
+  isnumber,
+  isMobile,
+  validEmail,
+  isAlphanumeric,
+  isChinese,
+  isEmoticon,
+  validAlphabets,
+} from "@/utils/validate";
+import statusList from "@/assets/js/cexStatusList";
+export default {
+  name: "specs",
+  props: ["showModel", "id", "isDetail", "isApproval"],
+  data() {
+    const validatename = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("分类名称不能为空！"));
+      } else {
+        callback();
+        // if (value.lenght < 2 || value.lenght > 12) {
+        //   callback(new Error("分类名称规则为2~12位汉字！"));
+        // } else {
+        //   if (!isChinese(value)) {
+        //     console.log(9999);
+        //     callback(new Error("分类名称规则为2~12位汉字！"));
+        //   } else if (isEmoticon(value)) {
+        //     console.log(2345);
+        //     callback(new Error("分类名称规则为2~12位汉字！"));
+        //   } else {
+        //     callback();
+        //   }
+        // }
+      }
+    };
+    return {
+      statusList: statusList,
+      specOptions: [],
+      catOptions: [],
+      loading: false,
+      title: "商品分类",
+      showModelThis: this.showModel,
+      dataInfo: {},
+      cexForm: {
+        catid: this.id,
+        remark: "",
+        status: "1",
+      },
+      ruleForm: {
+        catid: this.id,
+        spec: "",
+        cat_name: "",
+        spec: [],
+        cat_remark: "",
+      },
+      cexRules: {
+        status: {
+          required: true,
+          message: "请选择审核状态",
+          trigger: "change",
+        },
+        remark: [
+          {
+            required: false,
+            message: "请输入审核说明！",
+            trigger: "blur",
+          },
+        ],
+      },
+      rulesThis: this.rules,
+      rules: {
+        pid: [
+          {
+            required: false,
+            message: "请选择上级分类",
+            trigger: "change",
+          },
+        ],
+        cat_name: [
+          {
+            required: true,
+            validator: validatename,
+            trigger: "blur",
+          },
+        ],
+        spec: [
+          {
+            required: true,
+            message: "请选择规格",
+            trigger: "change",
+          },
+        ],
+
+        cat_remark: [
+          {
+            required: false,
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      console.log("closeModel!!");
+    },
+    selectChange() {
+      if (this.cexForm.status === "1") {
+        this.cexRules.remark[0].required = false;
+      } else {
+        this.cexRules.remark[0].required = true;
+      }
+    },
+    async initForm() {
+      this.loading = true;
+      await this.getAllCat();
+      await this.getAllSpec();
+      if (this.isApproval) {
+        this.title = "商品分类审核";
+        await this.initData();
+        await this.resetcexForm();
+        this.selectChange()
+      } else {
+        if (this.id === "add") {
+          this.title = "添加商品分类";
+          // this.ruleForm.isAdmin = 0;
+          this.loading = false;
+          this.rulesThis = this.rules;
+          await this.resetForm();
+        } else {
+          if (this.isDetail) {
+            this.title = "商品分类详情";
+            this.rulesThis = {};
+          } else {
+            this.title = "修改商品分类";
+            this.rulesThis = this.rules;
+          }
+          await this.initData();
+        }
+        this.loading = false;
+      }
+    },
+    async initData() {
+      this.loading = true;
+      let res = await asyncRequest.detail({ catid: this.id });
+      this.loading = false;
+      if (res.code === 0) {
+        let data = res.data;
+        this.dataInfo = data;
+        let list = this.dataInfo.spec;
+        let str = "";
+        this.specOptions.forEach((v1) => {
+          let find = list.findIndex((v2) => v2 === v1.id);
+          if (find !== -1) {
+            str +=
+              str === ""
+                ? this.specOptions[find].spec_name
+                : "," + this.specOptions[find].spec_name;
+          }
+        });
+        this.dataInfo.specName = str;
+        if (this.dataInfo.parent && this.dataInfo.parent.cat_pid !== "0") {
+          let pid = this.dataInfo.parent.cat_pid;
+          let index = -1;
+          index = this.catOptions.findIndex((v1) => v1.id === pid);
+          if (index !== -1) {
+            this.dataInfo.parent.cat_pid_name = this.catOptions[index].cat_name;
+          } else {
+            this.dataInfo.parent.cat_pid_name = "";
+          }
+        }
+        await this.resetForm(data);
+      }
+    },
+    async getAllCat() {
+      const res = await asyncRequest.catAll({});
+      if (res.code === 0 && res.data) {
+        let list = res.data;
+        list.map((v1) => {
+          v1.value = v1.id;
+          v1.label = v1.cat_name;
+          if (v1.child && v1.child.length > 0) {
+            v1.child.map((v2) => {
+              v2.value = v2.id;
+              v2.label = v2.cat_name;
+              v2.child = [];
+              // v2.children = v2.child;
+              return v2;
+            });
+          }
+          v1.children = v1.child;
+          return v1;
+        });
+        this.catOptions = list;
+      }
+    },
+    async getAllSpec() {
+      const res = await asyncRequest.specAll({});
+      if (res.code === 0 && res.data) {
+        this.specOptions = res.data;
+      }
+    },
+    async resetForm(data) {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          if (data) {
+            this.ruleForm.catid = this.id;
+            this.ruleForm.cat_remark = data.cat_dec;
+            this.ruleForm.cat_name = data.cat_name;
+            this.ruleForm.pid = [];
+            if (data.parent) {
+              if (data.parent.cat_pid !== "0") {
+                this.ruleForm.pid.push(data.parent.cat_pid);
+              }
+              if (data.parent.id) {
+                this.ruleForm.pid.push(data.parent.id);
+              }
+            } else {
+              this.ruleForm.pid = [];
+            }
+            // data.spec
+            this.ruleForm.spec = data.spec;
+            console.log(this.ruleForm);
+          } else {
+            this.ruleForm = {
+              catid: this.id,
+              spec: [],
+              cat_name: "",
+              pid: [],
+              cat_remark: "",
+            };
+          }
+        }
+      });
+    },
+    async resetcexForm() {
+      if (this.$refs.cexForm) {
+        this.$refs.cexForm.resetFields();
+        this.$refs.cexForm.clearValidate();
+        this.cexForm = {
+          catid: this.id,
+          remark: "",
+          status: "1",
+        };
+      }
+    },
+    async submitCexForm() {
+      await this.$refs.cexForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          console.log(this.id);
+          console.log(this.cexForm);
+          let obj = JSON.parse(JSON.stringify(this.cexForm));
+          obj.id = this.id;
+          console.log(obj);
+          let res = await asyncRequest.exam(obj);
+          this.loading = false;
+          if (res.code === 0) {
+            let title = "审核审批成功！";
+            this.$notify.success({
+              title,
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async submitForm() {
+      console.log(12345);
+      await this.$refs.ruleForm.validate( async (valid) => {
+        console.log(valid);
+        if (valid) {
+          this.loading = true;
+          let obj = JSON.parse(JSON.stringify(this.ruleForm));
+          obj.pid = obj.pid.join();
+          obj.spec = obj.spec.join();
+          if (obj.pid === "") {
+            obj.pid = "0";
+          }
+
+          let res = {};
+          if (this.id === "add") {
+            delete obj["catid"];
+            res = await asyncRequest.add(obj);
+          } else {
+            res = await asyncRequest.update(obj);
+          }
+          this.loading = false;
+          if (res.code === 0) {
+            let title = this.id === "add" ? "添加成功" : "修改成功";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      console.log(val);
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.sort {
+  .cexForm-ruleForm {
+    .cexForm-div {
+      margin-bottom: 2px;
+      .cexForm-label {
+        padding-right: 12px;
+        color: #606266;
+        line-height: 40px;
+        font-size: 14px;
+      }
+      .cexForm-main {
+        line-height: 40px;
+        color: rgb(151, 168, 190);
+        line-height: 40px;
+        font-size: 14px;
+      }
+    }
+  }
+}
+</style>

src/views/goodStore/sort/index.vue

@@ -0,0 +1,397 @@
+<template>
+  <div class="sort pagePadding">
+    <div
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+    >
+      <el-row :gutter="10">
+        <el-col :span="24" style="padding: 0 0 18px 0">
+          <el-col :span="4">
+            <el-select
+              v-model="parmValue.status"
+              filterable
+              clearable
+              :size="searchSize"
+              placeholder="请选择状态"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in statusList"
+                :key="'status' + item.code"
+                :label="item.name"
+                :value="item.code"
+              />
+            </el-select>
+          </el-col>
+
+          <el-col :span="4">
+            <el-input
+              :size="searchSize"
+              v-model="parmValue.cat_name"
+              :maxlength="40"
+              placeholder="分类名称"
+            ></el-input>
+          </el-col>
+          <el-col :span="3" style="width: 152px">
+            <el-button
+              type="primary"
+              :size="searchSize"
+              @click="searchList"
+              icon="el-icon-search"
+            ></el-button>
+            <el-button type="warning"  v-if="powers.some((item) => item == '024')" :size="searchSize" @click="restSearch">
+              重置
+            </el-button>
+          </el-col>
+          <el-col :span="3" style="width: 195px; float: right">
+            <el-button
+             v-if="powers.some((item) => item == '002')"
+              type="primary"
+              :size="searchSize"
+              style="float: right; margin-left: 5px"
+              @click="searchList"
+            >
+              刷新
+            </el-button>
+            <el-button
+             v-if="powers.some((item) => item == '003')"
+              type="success"
+              :size="searchSize"
+              style="float: right"
+              @click="openModal('add', false, false)"
+            >
+              添加
+            </el-button>
+          </el-col>
+        </el-col>
+      </el-row>
+      <treeTable
+        v-loading="loading"
+        :data="tableData"
+        :columns="columns"
+        @again="again"
+        @statusConfirm="statusConfirm"
+        @openModal="openModal"
+        @setNewProfit="setNewProfit"
+      ></treeTable>
+      <div
+        class="Pagination"
+        style="text-align: right; margin-top: 10px"
+        v-show="count > 0"
+      >
+        <el-pagination
+          :size="searchSize"
+          @size-change="handleSizeChange"
+          @current-change="handlePageChange"
+          :current-page="parmValue.page"
+          :page-sizes="[10, 15, 20, 30, 40]"
+          :page-size="parmValue.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="count"
+        ></el-pagination>
+      </div>
+      <add-edit
+        :showModel="showModel"
+        :id="modelId"
+        :isDetail="isDetail"
+        :isApproval="approval"
+        @refresh="searchList"
+        @cancel="showModel = false"
+      ></add-edit>
+    </div>
+    <div v-else>
+      <no-auth></no-auth>
+    </div>
+  </div>
+</template>
+   <script>
+import statusList from "@/assets/js/statusList";
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/goodStore/sort";
+import addEdit from "./addEdit";
+import { mapGetters } from "vuex";
+// import treeTable from "@/components/tree-table/index";
+export default {
+  name: "sort",
+  data() {
+    return {
+      columns: [
+        {
+          label: "分类名称",
+          prop: "cat_name",
+          show: true,
+        },
+        {
+          label: "商品规格",
+          prop: "spec",
+          show: true,
+        },
+        {
+          label: "预算>成本(%)",
+          prop: "in_rate",
+          show: false,
+        },
+        {
+          label: "成本>售价(%)",
+          prop: "out_rate",
+          show: false,
+        },
+        {
+          label: "最低毛利(%)",
+          prop: "low_rate",
+          show: false,
+        },
+        {
+          label: "单品修改下限(%)",
+          prop: "rate",
+          show: false,
+        },
+
+        {
+          label: "审核状态",
+          prop: "ex_status",
+          show: true,
+        },
+        {
+          label: "状态",
+          prop: "status",
+          show: true,
+        },
+        {
+          label: "创建时间",
+          prop: "addtime",
+          show: true,
+        },
+        {
+          label: "操作",
+          prop: "desc",
+          show: true,
+        },
+      ],
+      statusList: statusList,
+      loading: true,
+      showModel: false,
+      approval: false,
+      isDetail: false,
+      modelId: 0,
+      parmValue: {
+        status: "", //状态
+        cat_name: "", // 分类名称
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      },
+      count: 0, // 总条数
+      tableData: [],
+    };
+  },
+  mixins: [mixinPage],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find((item) => item.menu_route == "sort") ||
+        {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  mounted() {
+    this.searchList();
+  },
+  components: {
+    addEdit,
+    // treeTable,
+  },
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        status: "", //状态
+        cat_name: "", // 分类名称
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(id, isDetail, approval) {
+      this.showModel = true;
+      this.modelId = id;
+      this.isDetail = isDetail;
+      this.approval = approval;
+      console.log(this.modelId, this.isDetail, this.approval, this.showModel);
+    },
+    async setNewProfit(e) {
+      console.log(e);
+      // let edit = true;
+      await this.$confirm(
+        "毛利率修改会在次日零点生效！",
+        "确定要修改毛利率？",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(async () => {
+          let res = await asyncRequest.catarateadd(e);
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "毛利率修改成功！",
+              message: "毛利率修改会在次日零点生效!",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async deleteById(id) {
+      await this.$confirm("确定要删除？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.delete({ id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "删除成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async again(id) {
+      await this.$confirm("确定要提交审核？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.again({ id: id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "提交成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+
+    async searchList() {
+      this.loading = true;
+      let res = await asyncRequest.list(this.parmValue);
+      if (res.code === 0 && res.data) {
+        this.tableData = [];
+        let list = res.data.list;
+        list = list.map((v1) => {
+          v1 = this.dealwidthListDate(v1, 1);
+          return v1;
+        });
+
+        this.tableData = list;
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    dealwidthListDate(v1, level) {
+      v1.level = level;
+      v1.spec = v1.spec.join();
+      v1.open = false;
+      v1.rateEdit = false;
+      v1.addtime = v1.addtime.replaceAll(".000", "");
+      if (v1.rateinfo) {
+        if (v1.rateinfo.in_rate) {
+          v1.in_rate = v1.rateinfo.in_rate;
+          v1.in_rate_new = v1.rateinfo.in_rate;
+          this.columns[2].show = true;
+        }
+        if (v1.rateinfo.low_rate) {
+          v1.low_rate = v1.rateinfo.low_rate;
+          v1.low_rate_new = v1.rateinfo.low_rate;
+          this.columns[3].show = true;
+        }
+
+        if (v1.rateinfo.out_rate) {
+          v1.out_rate = v1.rateinfo.out_rate;
+          v1.out_rate_new = v1.rateinfo.out_rate;
+          this.columns[4].show = true;
+        }
+
+        if (v1.rateinfo.rate) {
+          v1.rate = v1.rateinfo.rate;
+          v1.rate_new = v1.rateinfo.rate;
+          this.columns[5].show = true;
+        }
+      }
+      if (v1.in_rate || v1.low_rate || v1.rate || v1.out_rate) {
+        v1.rateEdit = true;
+      }
+      if (v1.child && v1.child.length > 0) {
+        v1.hasChildren = false;
+        v1.child.map((v2) => {
+          v2 = this.dealwidthListDate(v2, level + 1);
+          return v2;
+        });
+      } else {
+        v1.hasChildren = false;
+        v1.children = [];
+      }
+      v1.children = v1.child;
+      return v1;
+    },
+    async statusConfirm(id, status, ex_status) {
+      if (ex_status === "1") {
+        await this.$confirm(`确定要改为${status === "1" ? "禁用" : "启用"}？`, {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            this.loading = true;
+            const model = {
+              id: id,
+              status: status === "1" ? "0" : "1",
+            };
+            const res = await asyncRequest.status(model);
+            if (res.code === 0) {
+              this.loading = false;
+              this.$notify.success({
+                title: "状态修改成功！",
+                message: "",
+              });
+              await this.searchList();
+            } else {
+              this.loading = false;
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        if (status === "0") {
+          this.$message.warning("只有审核通过的分类，才能启用！");
+        }
+      }
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.sort {
+}
+</style>
+   

src/views/goodStore/specs/addEdit.vue

@@ -0,0 +1,420 @@
+<template>
+  <el-dialog
+    :title="title"
+    :center="true"
+    align="left"
+    top="5vh"
+    width="700px"
+    @close="closeModel"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+  >
+    <el-card>
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            v-if="isApproval"
+            :model="cexForm"
+            status-icon
+            :rules="cexRules"
+            ref="cexForm"
+            label-width="80px"
+            class="cexForm-ruleForm"
+            ><el-row>
+              <el-col :span="12">
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">规格名称：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.name
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">规格排序：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.weight
+                  }}</el-col>
+                </el-row>
+                <el-row class="cexForm-div">
+                  <el-col :span="8" class="tr cexForm-label">规格备注：</el-col>
+                  <el-col :span="16" class="cexForm-main">{{
+                    ruleForm.Fremark
+                  }}</el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="审核状态" prop="status">
+                  <el-select
+                    v-model="cexForm.status"
+                    placeholder="请选择审核状态"
+                    @change="selectChange"
+                  >
+                    <el-option
+                      v-for="item in statusList"
+                      :key="item.code"
+                      :label="item.name"
+                      :value="item.code"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="审核说明" prop="remark">
+                  <el-input
+                    v-model="cexForm.remark"
+                    type="textarea"
+                    placeholder="请输入审核说明"
+                    :rows="5"
+                    maxlength="300"
+                    show-word-limit
+                  ></el-input>
+                </el-form-item>
+                <el-col :span="24" style="text-align: right">
+                  <el-button type="primary" @click="submitCexForm"
+                    >保 存
+                  </el-button>
+                  <el-button @click="showModelThis = false">取 消</el-button>
+                </el-col>
+              </el-col>
+            </el-row></el-form
+          >
+
+          <el-form
+            v-else
+            :model="ruleForm"
+            status-icon
+            :rules="rulesThis"
+            ref="ruleForm"
+            label-width="80px"
+            class="demo-ruleForm"
+            ><el-row>
+              <el-col :span="12">
+                <el-form-item label="规格名称" prop="name" :disabled="isDetail">
+                  <el-input
+                    placeholder="规格名称"
+                    v-model="ruleForm.name"
+                    :disabled="isDetail"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="规格排序" prop="weight">
+                  <el-input-number
+                    :disabled="isDetail"
+                    id="tl-number"
+                    style="width: 100%; text-align: left"
+                    v-model="ruleForm.weight"
+                    :step="1"
+                    :min="1"
+                    :max="1000"
+                    :precision="0"
+                    step-strictly
+                    :controls="false"
+                  ></el-input-number>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="规格备注" prop="remark">
+              <el-input
+                v-model="ruleForm.remark"
+                type="textarea"
+                placeholder="请输入备注"
+                :rows="5"
+                maxlength="300"
+                show-word-limit
+                :disabled="isDetail"
+              ></el-input>
+            </el-form-item>
+            <el-col :span="24" style="text-align: right">
+              <el-tag
+                type="warning"
+                class="fl"
+                style="max-width: 500px"
+                v-if="dataInfo.ex_remark && dataInfo.ex_status === '2'"
+                >审核备注：{{ dataInfo.ex_remark }}</el-tag
+              >
+
+              <el-button type="primary" @click="submitForm" v-if="!isDetail"
+                >保 存
+              </el-button>
+              <el-button @click="showModelThis = false">{{
+                isDetail ? "关 闭" : "取 消"
+              }}</el-button>
+            </el-col>
+          </el-form>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+   <script>
+import asyncRequest from "@/apis/service/goodStore/specs";
+import {
+  isnumber,
+  isMobile,
+  validEmail,
+  isAlphanumeric,
+  isChinese,
+  isEmoticon,
+  validAlphabets,
+} from "@/utils/validate";
+import statusList from "@/assets/js/cexStatusList";
+export default {
+  name: "specs",
+  props: ["showModel", "id", "isDetail", "isApproval"],
+  data() {
+    const validatename = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("规格名称不能为空！"));
+      } else {
+        if (value.lenght < 2 || value.lenght > 12) {
+          callback(new Error("规格名称规则为2~12位汉字！"));
+        } else {
+          if (!isChinese(value)) {
+            console.log(9999);
+            callback(new Error("规格名称规则为2~12位汉字！"));
+          } else if (isEmoticon(value)) {
+            console.log(2345);
+            callback(new Error("规格名称规则为2~12位汉字！"));
+          } else {
+            callback();
+          }
+        }
+      }
+    };
+    return {
+      statusList: statusList,
+      loading: false,
+      title: "添加商品规格",
+      showModelThis: this.showModel,
+      dataInfo: {},
+      cexForm: {
+        id: this.id,
+        remark: "",
+        status: "1",
+      },
+      ruleForm: {
+        id: this.id,
+        remark: "",
+        weight: "1",
+        name: "",
+      },
+      cexRules: {
+        status: {
+          required: true,
+          message: "请选择审核状态",
+          trigger: "change",
+        },
+        remark: [
+          {
+            required: false,
+            message: "请输入审核说明！",
+            trigger: "blur",
+          },
+        ],
+      },
+      rulesThis: this.rules,
+      rules: {
+        name: [
+          {
+            required: true,
+            validator: validatename,
+            trigger: "blur",
+          },
+        ],
+        weight: [
+          {
+            required: true,
+            message: "排序不能为空！",
+            trigger: "blur",
+          },
+        ],
+
+        remark: [
+          {
+            required: false,
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    closeModel() {
+      console.log("closeModel!!");
+    },
+    selectChange() {
+      if (this.cexForm.status === "1") {
+        this.cexRules.remark[0].required = false;
+      } else {
+        this.cexRules.remark[0].required = true;
+      }
+    },
+    async initForm() {
+      if (this.isApproval) {
+        this.loading = true;
+        this.title = "商品规格审核";
+        await this.initData();
+        await  this.resetcexForm()
+        this.selectChange()
+        this.loading = false;
+      } else {
+        if (this.id === "add") {
+          this.title = "添加商品规格";
+          // this.ruleForm.isAdmin = 0;
+          this.loading = false;
+          this.rulesThis = this.rules;
+          await this.resetForm();
+        } else {
+          if (this.isDetail) {
+            this.title = "商品规格";
+            this.rulesThis = {};
+          } else {
+            this.title = "修改商品规格";
+            this.rulesThis = this.rules;
+          }
+          await this.resetForm();
+          await this.initData();
+        }
+      }
+    },
+       async resetcexForm() {
+      if (this.$refs.cexForm) {
+        this.$refs.cexForm.resetFields();
+        this.$refs.cexForm.clearValidate();
+        this.cexForm = {
+          id: this.id,
+          remark: "",
+          status: "1",
+        };
+      }
+    },
+    async initData() {
+      this.loading = true;
+      let res = await asyncRequest.detail({ id: this.id });
+      this.loading = false;
+      if (res.code === 0) {
+        let data = res.data;
+        this.dataInfo = data;
+        this.ruleForm = {
+          id: this.id,
+          remark: data.spec_desc,
+          weight: data.weight,
+          name: data.spec_name,
+        };
+      }
+    },
+    async resetForm() {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          this.ruleForm = {
+            id: this.id,
+            remark: "",
+            weight: "",
+            name: "",
+            // isAdmin: 0
+          };
+        }
+      });
+    },
+    async submitCexForm() {
+      await this.$refs.cexForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          console.log(this.id);
+          console.log(this.cexForm);
+          let obj = JSON.parse(JSON.stringify(this.cexForm));
+
+          obj.id = this.id;
+          console.log(obj);
+          let res = await asyncRequest.exam(obj);
+          this.loading = false;
+          if (res.code === 0) {
+            let title = "审核审批成功！";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.loading = true;
+          let obj = JSON.parse(JSON.stringify(this.ruleForm));
+          let res = {};
+          if (this.id === "add") {
+            delete obj["id"];
+            res = await asyncRequest.add(obj);
+          } else {
+            res = await asyncRequest.update(obj);
+          }
+          this.loading = false;
+          if (res.code === 0) {
+            let title = this.id === "add" ? "添加成功" : "修改成功";
+            this.$notify.success({
+              title,
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.specs {
+  .cexForm-ruleForm {
+    .cexForm-div {
+      margin-bottom: 22px;
+      .cexForm-label {
+        padding-right: 12px;
+        color: #606266;
+        line-height: 40px;
+        font-size: 14px;
+      }
+      .cexForm-main {
+        line-height: 40px;
+        color: rgb(151, 168, 190);
+        line-height: 40px;
+        font-size: 14px;
+      }
+    }
+  }
+}
+</style>
+   

src/views/goodStore/specs/index copy 2.vue

@@ -0,0 +1,395 @@
+<template>
+  <div class="page specs pagePadding">
+    <ex-table
+      v-if="rules.some(item => item == '001')"
+      :table="table"
+      :data="tableData"
+      :columns="columns"
+      :page="pageInfo"
+      @page-curr-change="pageInfo.curr = $event; searchList();"
+      @page-size-change="pageInfo.curr = 1;pageInfo.size = $event; searchList();"
+      @screen-reset="pageInfo.curr = 1;searchList()"
+      @screen-submit="pageInfo.curr = 1; searchList()"
+    >
+      <template #status="{scope}">
+        <el-tag
+          :type="scope.row.status == 1 ? 'success' : scope.row.status == 0 ? 'warning' : ''"
+          v-text="(statusOptions.find(item => item.id == scope.row.status) || {}).label || '--'"
+        ></el-tag>
+      </template>
+      <template #operation="{scope}">
+        <el-tooltip
+          v-if="rules.some(item => item == '004')"
+          class="item"
+          effect="dark"
+          :content="scope.row.status == 0 ? '启用' : scope.row.status == 1 ? '禁用' : '--'"
+          placement="top"
+        >
+          <i
+            class="tb-icon"
+            :class="scope.row.status == 0 ? 'el-icon-circle-check' : scope.row.status == 1 ? 'el-icon-circle-close' : ''"
+            @click="enableOrDisableAuth( scope.row.status == 0 ? 1 : scope.row.status == 1 ? 0 : '', [scope.row])"
+          ></i>
+        </el-tooltip>
+        <el-tooltip
+          v-if="rules.some(item => item == '007')"
+          class="item"
+          effect="dark"
+          content="编辑"
+          placement="top"
+        >
+          <i class="tb-icon el-icon-edit" @click="addOrUpdateHandle(scope.row.id, 'edit')"></i>
+        </el-tooltip>
+      </template>
+    </ex-table>
+    <no-auth v-else></no-auth>
+    <!-- 弹窗 新增/修改 -->
+    <!-- <add-or-update
+      v-if="isAddOrUpdate"
+      ref="addOrUpdate"
+      :authOptions="authOptions"
+      @refreshDataList="pageInfo.curr = 1;searchList()"
+    /> -->
+  </div>
+</template>
+<script>
+// import ExTable from "@/components/ExTable.vue";
+import asyncRequest from "@/apis/service/goodStore/specs";
+// import AddOrUpdate from "./addOrEditAuth";
+
+export default {
+  name: "dataAuth",
+  // components: { ExTable,
+  // //  AddOrUpdate 
+  //  },
+  computed: {
+       rules() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "specs"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+    // rules() {
+    //   let tran =
+    //     this.$store.state.common.ruleslist.find(
+    //       item => item.name == "data_power"
+    //     ) || {};
+    //   return this.$store.state.common.ruleslist.filter(
+    //     item => item.pid === tran.id
+    //   );
+    // }
+  },
+  data() {
+    return {
+      isAddOrUpdate: false,
+      // 状态
+      statusOptions: [
+        { id: 0, label: "禁用" },
+        { id: 1, label: "启用" }
+      ],
+      // 共享数据权限
+      authOptions: [
+        { id: 1, label: "只读" },
+        { id: 2, label: "读写" }
+      ],
+      // 表格 - 数据
+      tableData: [],
+      // 表格 - 参数
+      table: {
+        stripe: true,
+        border: true,
+        _defaultHeader_: ["setcol"]
+      },
+      // 表格 - 分页
+      pageInfo: {
+        size: 10,
+        curr: 1,
+        total: 0
+      },
+      // 表格 - 列参数
+      columns: [
+        { type: "selection", fixed: "left", _noset_: true },
+        {
+          type: "index",
+          label: "序号",
+          fixed: "left",
+          width: "50",
+          _noset_: true
+        },
+        {
+          prop: "id",
+          label: "ID",
+          "min-width": "70",
+          sortable: true
+        },
+        {
+          prop: "shar_rulenames",
+          label: "菜单数据",
+          "min-width": "120"
+        },
+        {
+          prop: "usernames",
+          label: "数据源用户",
+          "min-width": "120"
+        },
+        {
+          prop: "groupnames",
+          label: "数据源用户组",
+          "min-width": "120"
+        },
+        {
+          prop: "shar_usernames",
+          label: "数据共享用户",
+          "min-width": "120"
+        },
+        {
+          prop: "shar_groupnames",
+          label: "数据共享用户组",
+          "min-width": "120"
+        },
+        {
+          prop: "data_shar_auth",
+          label: "共享数据权限",
+          "min-width": "140",
+          sortable: true,
+          _format_: d => {
+            return (
+              this.authOptions.find(item => {
+                return item.id == d.data_shar_auth;
+              }) || {}
+            ).label;
+          }
+        },
+        {
+          prop: "created_at",
+          label: "添加时间",
+          "min-width": "160",
+          sortable: true
+        },
+        {
+          prop: "status",
+          label: "状态",
+          fixed: "right",
+          "min-width": "100",
+          sortable: true,
+          _slot_: "status"
+        },
+        {
+          prop: "",
+          label: "操作",
+          fixed: "right",
+          "min-width": "120",
+          _noset_: true,
+          _slot_: "operation"
+        }
+      ]
+    };
+  },
+  mounted() {
+    this.searchList();
+  },
+  methods: {
+    // 新建/编辑用户组
+    addOrUpdateHandle(id, type) {
+      let _this = this;
+      _this.isAddOrUpdate = true;
+      // 弹窗初始化
+      _this.$nextTick(() => {
+        _this.$refs.addOrUpdate.init(id, type);
+      });
+    },
+    /**
+     * 启用/禁用
+     * @param {String} status 0-禁用 1-启用
+     * @param {Array} selection 当前选择项
+     */
+    enableOrDisableAuth(status, selection) {
+      if (selection.length == 0)
+        return this.$message.warning("请至少选择一条数据！");
+      this.$confirm(
+        `此操作将${
+          status == 0 ? "禁用" : status == 1 ? "启用" : "--"
+        }选择的共享规则, 是否继续?`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }
+      ).then(() => {
+        this.enableOrDisableAuthService(
+          status,
+          selection.map(item => item.id)
+        );
+      });
+    },
+    /**
+     * 启用/禁用服务
+     */
+    enableOrDisableAuthService(status, ids) {
+      let loadding = this.$loading();
+      this.axios
+        .post(`/recruit/v1/shar_start_stop`, {
+          status: status,
+          id_list: ids
+        })
+        .then(res => {
+          loadding.close();
+          if (res && res.data && res.data.status == 0) {
+            this.$message.success("操作成功");
+            this.searchList();
+          } else {
+            this.$message.error(res.data.message);
+          }
+        })
+        .catch(error => {
+          loadding.close();
+          this.$message.error(error);
+        });
+    },
+    // // 刷新表格
+    // searchList() {
+    //  this.loading = true;
+    //   let res = await asyncRequest.list(this.parmValue);
+    //   if (res.code === 0 && res.data) {
+    //     this.tableData = res.data.list;
+    //     this.tableData.map((v1) => {
+    //       v1.addtime = v1.addtime.replaceAll(".000", "");
+    //       return v1;
+    //     });
+    //     this.count = Number(res.data.count);
+    //   } else {
+    //     this.tableData = [];
+    //     this.count = 0;
+    //   }
+    //   this.loading = false;
+    // },
+        restSearch() {
+      this.parmValue = {
+        status: "",
+        name: "", // 名称
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    //新建/编辑/详情/审核
+    openModal(id, isDetail, approval, type) {
+      if (!type) {
+        return;
+      }
+      this.showModel = true;
+      this.modelId = id;
+      this.isDetail = isDetail;
+      this.approval = approval;
+    },
+    //删除
+    async deleteById(id) {
+      await this.$confirm("确定要删除？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.delete({ id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "删除成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+//提交审核申请
+    async again(id, type) {
+      if (!type) {
+        return;
+      }
+      await this.$confirm("确定要提交审核？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.again({ id: id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "提交成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    //刷新表格
+    async searchList() {
+      this.loading = true;
+      let res = await asyncRequest.list(this.parmValue);
+      if (res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.map((v1) => {
+          v1.addtime = v1.addtime.replaceAll(".000", "");
+          return v1;
+        });
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    async statusConfirm(id, status, ex_status, type) {
+      if (!type) {
+        return;
+      }
+      if (ex_status === "1") {
+        await this.$confirm(`确定要改为${status === "1" ? "禁用" : "启用"}？`, {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            this.loading = true;
+            const model = {
+              id: id,
+              status: status === "1" ? "0" : "1",
+            };
+            const res = await asyncRequest.status(model);
+            if (res.code === 0) {
+              this.loading = false;
+              this.$notify.success({
+                title: "状态修改成功！",
+                message: "",
+              });
+              await this.searchList();
+            } else {
+              this.loading = false;
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        if (status === "0") {
+          this.$message.warning("只有审核通过的规格，才能启用！");
+        }
+      }
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/goodStore/specs/index.vue

@@ -0,0 +1,472 @@
+<template>
+  <div class="specs pagePadding">
+    <div
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+    >
+      <el-row :gutter="10">
+        <el-col :span="24" style="padding: 0 0 18px 0">
+          <el-col :span="4">
+            <el-select
+              v-model="parmValue.status"
+              filterable
+              clearable
+              :size="searchSize"
+              placeholder="请选择状态"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in statusList"
+                :key="'status' + item.code"
+                :label="item.name"
+                :value="item.code"
+              />
+            </el-select>
+          </el-col>
+          <el-col :span="4">
+            <el-input
+              :size="searchSize"
+              v-model="parmValue.name"
+              :maxlength="40"
+              placeholder="规格名称"
+            ></el-input>
+          </el-col>
+          <el-col :span="3" style="width: 152px">
+            <el-button
+              type="primary"
+              :size="searchSize"
+              @click="searchList"
+              icon="el-icon-search"
+            ></el-button>
+            <el-button
+              type="warning"
+              v-if="powers.some((item) => item == '024')"
+              :size="searchSize"
+              @click="restSearch"
+            >
+              重置
+            </el-button>
+          </el-col>
+          <el-col :span="3" style="width: 195px; float: right">
+            <el-button
+              v-if="powers.some((item) => item == '002')"
+              type="primary"
+              :size="searchSize"
+              style="float: right; margin-left: 5px"
+              @click="searchList"
+            >
+              刷新
+            </el-button>
+            <el-button
+              v-if="powers.some((item) => item == '003')"
+              :size="searchSize"
+              type="success"
+              style="float: right"
+              @click="openModal('add', false, false)"
+            >
+              添加
+            </el-button>
+          </el-col>
+        </el-col>
+      </el-row>
+      <el-table
+        :data="tableData"
+        stripe
+        v-loading="loading"
+        border
+        :size="size"
+        style="width: 100%"
+      >
+        <el-table-column
+          prop="spec_name"
+          label="规格名称"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column label="审核状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              :size="tablebtnSize"
+              v-if="scope.row.ex_status === '0'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010'),
+              }"
+              :type="'warning'"
+              @click="
+                openModal(
+                  scope.row.id,
+                  false,
+                  true,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '010')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '010')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '1'"
+              :type="'success'"
+            >
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '2'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'danger'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+            <el-tag
+              :size="tablebtnSize"
+              v-else-if="scope.row.ex_status === '3'"
+              :class="{
+                'hover-tag':
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009'),
+              }"
+              :type="'info'"
+              @click="
+                again(
+                  scope.row.id,
+                  scope.row.status === '0' &&
+                    powers.some((item) => item == '009')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="
+                  scope.row.status === '0' &&
+                  powers.some((item) => item == '009')
+                "
+                style="margin-right: 1px"
+              ></i>
+              {{ scope.row.ex_status_cn }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" show-overflow-tooltip align="center">
+          <template slot-scope="scope">
+            <el-tag
+              v-if="scope.row.status === '1'"
+              type="success"
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              启用</el-tag
+            >
+            <el-tag
+              v-else
+              :class="{ 'hover-tag': powers.some((item) => item == '004') }"
+              :size="tablebtnSize"
+              type="warning"
+              @click="
+                statusConfirm(
+                  scope.row.id,
+                  scope.row.status,
+                  scope.row.ex_status,
+                  powers.some((item) => item == '004')
+                )
+              "
+            >
+              <i
+                class="el-icon-thumb"
+                v-if="powers.some((item) => item == '004')"
+                style="margin-right: 1px"
+              ></i>
+              禁用</el-tag
+            >
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="addtime"
+          label="创建时间"
+          show-overflow-tooltip
+          align="center"
+        ></el-table-column>
+        <el-table-column fixed="right" label="操作" align="center">
+          <template slot-scope="scope">
+            <el-link
+              v-if="
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '3' &&
+                  powers.some((item) => item == '005')) ||
+                (scope.row.status === '0' &&
+                  scope.row.ex_status === '2' &&
+                  powers.some((item) => item == '005'))
+              "
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, false, false, true)"
+            >
+              修改
+            </el-link>
+            <!-- <el-link
+            type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+            @click="deleteById(scope.row.id)"
+          >
+            删除
+          </el-link> -->
+            <el-link
+              v-if="powers.some((item) => item == '007')"
+              type="primary"
+              style="margin: 0 4px"
+              :underline="false"
+              :size="tablebtnSize"
+              @click="openModal(scope.row.id, true, false, true)"
+            >
+              详情
+            </el-link>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div
+        class="Pagination"
+        style="text-align: right; margin-top: 10px"
+        v-show="count > 0"
+      >
+        <el-pagination
+          :size="searchSize"
+          @size-change="handleSizeChange"
+          @current-change="handlePageChange"
+          :current-page="parmValue.page"
+          :page-sizes="[10, 15, 20, 30, 40]"
+          :page-size="parmValue.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="count"
+        ></el-pagination>
+      </div>
+      <add-edit
+        :showModel="showModel"
+        :id="modelId"
+        :isApproval="approval"
+        :isDetail="isDetail"
+        @refresh="searchList"
+        @cancel="showModel = false"
+      ></add-edit>
+    </div>
+    <div v-else>
+      <no-auth></no-auth>
+    </div>
+  </div>
+</template>
+   <script>
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/goodStore/specs";
+import addEdit from "./addEdit";
+import statusList from "@/assets/js/statusList";
+import { mapGetters } from "vuex";
+export default {
+  name: "specs",
+  data() {
+    return {
+      statusList: statusList,
+      approval: false,
+      loading: true,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      parmValue: {
+        status: "",
+        name: "", // 名称
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      },
+      count: 0, // 总条数
+      tableData: [],
+    };
+  },
+  mixins: [mixinPage],
+  mounted() {
+    this.searchList();
+  },
+  components: {
+    addEdit,
+  },
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "specs"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        status: "",
+        name: "", // 名称
+        page: 1, // 页码
+        size: 10, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(id, isDetail, approval, type) {
+      if (!type) {
+        return;
+      }
+      this.showModel = true;
+      this.modelId = id;
+      this.isDetail = isDetail;
+      this.approval = approval;
+    },
+    async deleteById(id) {
+      await this.$confirm("确定要删除？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.delete({ id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "删除成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+
+    async again(id, type) {
+      if (!type) {
+        return;
+      }
+      await this.$confirm("确定要提交审核？", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          let res = await asyncRequest.again({ id: id });
+          if (res.code === 0) {
+            this.$notify.success({
+              title: "提交成功",
+              message: "",
+            });
+            this.searchList();
+          }
+        })
+        .catch(() => {
+          console.log("取消");
+        });
+    },
+    async searchList() {
+      this.loading = true;
+      let res = await asyncRequest.list(this.parmValue);
+      if (res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.map((v1) => {
+          v1.addtime = v1.addtime.replaceAll(".000", "");
+          return v1;
+        });
+        this.count = Number(res.data.count);
+      } else {
+        this.tableData = [];
+        this.count = 0;
+      }
+      this.loading = false;
+    },
+    async statusConfirm(id, status, ex_status, type) {
+      if (!type) {
+        return;
+      }
+      if (ex_status === "1") {
+        await this.$confirm(`确定要改为${status === "1" ? "禁用" : "启用"}？`, {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            this.loading = true;
+            const model = {
+              id: id,
+              status: status === "1" ? "0" : "1",
+            };
+            const res = await asyncRequest.status(model);
+            if (res.code === 0) {
+              this.loading = false;
+              this.$notify.success({
+                title: "状态修改成功！",
+                message: "",
+              });
+              await this.searchList();
+            } else {
+              this.loading = false;
+            }
+          })
+          .catch(() => {
+            console.log("取消");
+          });
+      } else {
+        if (status === "0") {
+          this.$message.warning("只有审核通过的规格，才能启用！");
+        }
+      }
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.specs {
+}
+</style>
+   

src/views/process/read/index.vue

@@ -0,0 +1,264 @@
+<template>
+  <div class="read pagePadding">
+    <ex-table
+      v-loading="loading"
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+      :table="table"
+      :data="tableData"
+      :columns="columns"
+      :page="pageInfo"
+      :size="size"
+      @page-curr-change="handlePageChange"
+      @page-size-change="handleSizeChange"
+      @screen-reset="
+        pageInfo.curr = 1;
+        parmValue.page = 1;
+        searchList();
+      "
+      @screen-submit="
+        pageInfo.curr = 1;
+        parmValue.page = 1;
+        searchList();
+      "
+    >
+      <template #table-header="{}">
+        <div style="width: 100%; height: 30px">
+          <el-row :gutter="10">
+            <el-col :span="24">
+              <el-col :span="3" style="width: 66px; float: right">
+                <el-button
+                  type="primary"
+                  :size="searchSize"
+                  style="float: right"
+                  @click="searchList"
+                >
+                  刷新
+                </el-button>
+              </el-col>
+              <el-col
+                :span="3"
+                style="width: 66px; float: right"
+                v-if="powers.some((item) => item == '003')"
+              >
+                <el-button
+                  :size="searchSize"
+                  type="success"
+                  style="float: right"
+                  @click="openModal('add', false)"
+                >
+                  添加
+                </el-button>
+              </el-col>
+            </el-col>
+          </el-row>
+        </div>
+      </template>
+      <!-- <template #status="{ scope }">
+        <el-tag
+          :size="tablebtnSize"
+          :type="scope.row.status == '0' ? 'warning' : ''"
+          v-text="
+            (statusOptions.find((item) => item.id == scope.row.status) || {})
+              .label || '--'
+          "
+        ></el-tag>
+      </template> -->
+
+      <template #operation="{ scope }">
+        <el-tooltip
+          v-if="powers.some((item) => item == '007')"
+          effect="dark"
+          content="详情"
+          placement="top"
+        >
+          <i
+            class="el-icon-view tb-icon"
+            @click="getRouter(scope.row.toRouter, scope.row.queryId)"
+          ></i>
+        </el-tooltip>
+      </template>
+    </ex-table>
+    <no-auth v-else></no-auth>
+  </div>
+</template>
+<script>
+import asyncRequest from "@/apis/service/process/read";
+import statusList from "@/assets/js/statusList";
+import roleLevel from "@/assets/js/roleLevel";
+import mixinPage from "@/mixins/elPaginationHandle";
+import { mapGetters } from "vuex";
+import resToken from "@/mixins/resToken";
+import routerList from "@/views/process/columns";
+export default {
+  name: "role",
+  mixins: [mixinPage, resToken],
+  computed: {
+    //组件SIZE设置
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find((item) => item.menu_route == "read") ||
+        {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      statusList: statusList,
+      roleLevel: roleLevel,
+      process_router_list: JSON.parse(JSON.stringify(routerList)),
+      loading: true,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      parmValue: {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      },
+      // 状态
+      // statusOptions: [
+      //   { id: 3, label: "完成" },
+      //   { id: 2, label: "流程中" },
+      //   { id: 1, label: "未操作" },
+      //   { id: 0, label: "未操作" },
+      // ],
+      // 角色等级
+      authOptions: [
+        { id: "1", label: "管理员" },
+        { id: "2", label: "非管理员" },
+      ],
+      // 表格 - 数据
+      tableData: [],
+      // 表格 - 参数
+      table: {
+        stripe: true,
+        border: true,
+        _defaultHeader_: ["setcol"],
+      },
+      // 表格 - 分页
+      pageInfo: {
+        size: 15,
+        curr: 1,
+        total: 0,
+      },
+      // 表格 - 列参数
+      columns: [
+        {
+          prop: "order_code",
+          label: "业务编号",
+        },
+        {
+          prop: "process_name",
+          label: "流程名称",
+          // sortable: true,
+        },
+        {
+          prop: "apply_name",
+          label: "申请人",
+        },
+       
+        {
+          prop: "action_name",
+          label: "操作人",
+        },
+        {
+          prop: "addtime",
+          label: "申请时间",
+        },
+        {
+          prop: "",
+          label: "操作",
+          fixed: "right",
+          _noset_: true,
+          _slot_: "operation",
+          width: "50",
+        },
+      ],
+    };
+  },
+  mounted() {
+    this.searchProList();
+    this.searchList();
+  },
+  methods: {
+    getRouter(toRouter, queryId) {
+      if (toRouter && queryId) {
+        this.routeGoto(toRouter, { id: queryId });
+      }else{
+         this.$message.warning("暂未找到相关流程！");
+      }
+    },
+
+    restSearch() {
+      // 表格 - 分页
+      this.pageInfo = {
+        size: 15,
+        curr: 1,
+        total: 0,
+      };
+      this.parmValue = {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      };
+      // this.searchProList();
+      this.searchList();
+    },
+
+    // 刷新表格
+    async searchList() {
+      this.loading = true;
+      const res = await asyncRequest.list(this.parmValue);
+      if (res && res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.forEach((v, i) => {
+          let index = this.process_router_list.findIndex(
+            (y) => y.type === v.order_type
+          );
+          if (index !== -1) {
+            const { name, toRouter, to } = this.process_router_list[index];
+            this.tableData[i].process_name = name;
+            this.tableData[i].toRouter = toRouter;
+            this.tableData[i].queryId =
+              to == "code" ? v.order_code : v.order_id;
+          } else {
+            this.tableData[i].process_name = "";
+            this.tableData[i].toRouter = "";
+            this.tableData[i].queryId = "";
+          }
+        });
+        this.pageInfo.total = Number(res.data.count);
+      } else if (res && res.code >= 100 && res.code <= 104) {
+        await this.logout();
+      } else {
+        this.tableData = [];
+        this.pageInfo.total = 0;
+      }
+      this.loading = false;
+    },
+    // 刷新表格
+    async searchProList() {
+      this.loading = true;
+      const res = await asyncRequest.processList({
+        page: 1, // 页码
+        size: 50, // 每页显示条数
+      });
+      if (res && res.code === 0 && res.data) {
+        console.log(res.data);
+      } else if (res && res.code >= 100 && res.code <= 104) {
+        await this.logout();
+      } else {
+        this.tableData = [];
+        this.pageInfo.total = 0;
+      }
+      this.loading = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/process/unRead/index.vue

@@ -0,0 +1,264 @@
+<template>
+  <div class="unRead pagePadding">
+    <ex-table
+      v-loading="loading"
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+      :table="table"
+      :data="tableData"
+      :columns="columns"
+      :page="pageInfo"
+      :size="size"
+      @page-curr-change="handlePageChange"
+      @page-size-change="handleSizeChange"
+      @screen-reset="
+        pageInfo.curr = 1;
+        parmValue.page = 1;
+        searchList();
+      "
+      @screen-submit="
+        pageInfo.curr = 1;
+        parmValue.page = 1;
+        searchList();
+      "
+    >
+      <template #table-header="{}">
+        <div style="width: 100%; height: 30px">
+          <el-row :gutter="10">
+            <el-col :span="24">
+              <el-col :span="3" style="width: 66px; float: right">
+                <el-button
+                  type="primary"
+                  :size="searchSize"
+                  style="float: right"
+                  @click="searchList"
+                >
+                  刷新
+                </el-button>
+              </el-col>
+              <el-col
+                :span="3"
+                style="width: 66px; float: right"
+                v-if="powers.some((item) => item == '003')"
+              >
+                <el-button
+                  :size="searchSize"
+                  type="success"
+                  style="float: right"
+                  @click="openModal('add', false)"
+                >
+                  添加
+                </el-button>
+              </el-col>
+            </el-col>
+          </el-row>
+        </div>
+      </template>
+      <!-- <template #status="{ scope }">
+        <el-tag
+          :size="tablebtnSize"
+          :type="scope.row.status == '0' ? 'warning' : ''"
+          v-text="
+            (statusOptions.find((item) => item.id == scope.row.status) || {})
+              .label || '--'
+          "
+        ></el-tag>
+      </template> -->
+
+      <template #operation="{ scope }">
+        <el-tooltip
+          v-if="powers.some((item) => item == '007')"
+          effect="dark"
+          content="详情"
+          placement="top"
+        >
+          <i
+            class="el-icon-view tb-icon"
+            @click="getRouter(scope.row.toRouter, scope.row.queryId)"
+          ></i>
+        </el-tooltip>
+      </template>
+    </ex-table>
+    <no-auth v-else></no-auth>
+  </div>
+</template>
+<script>
+import asyncRequest from "@/apis/service/process/unRead";
+import statusList from "@/assets/js/statusList";
+import roleLevel from "@/assets/js/roleLevel";
+import mixinPage from "@/mixins/elPaginationHandle";
+import { mapGetters } from "vuex";
+import resToken from "@/mixins/resToken";
+import routerList from "@/views/process/columns";
+export default {
+  name: "role",
+  mixins: [mixinPage, resToken],
+  computed: {
+    //组件SIZE设置
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find((item) => item.menu_route == "unRead") ||
+        {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      statusList: statusList,
+      roleLevel: roleLevel,
+      process_router_list: JSON.parse(JSON.stringify(routerList)),
+      loading: true,
+      showModel: false,
+      isDetail: false,
+      modelId: 0,
+      parmValue: {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      },
+      // 状态
+      // statusOptions: [
+      //   { id: 3, label: "完成" },
+      //   { id: 2, label: "流程中" },
+      //   { id: 1, label: "未操作" },
+      //   { id: 0, label: "未操作" },
+      // ],
+      // 角色等级
+      authOptions: [
+        { id: "1", label: "管理员" },
+        { id: "2", label: "非管理员" },
+      ],
+      // 表格 - 数据
+      tableData: [],
+      // 表格 - 参数
+      table: {
+        stripe: true,
+        border: true,
+        _defaultHeader_: ["setcol"],
+      },
+      // 表格 - 分页
+      pageInfo: {
+        size: 15,
+        curr: 1,
+        total: 0,
+      },
+      // 表格 - 列参数
+      columns: [
+        {
+          prop: "order_code",
+          label: "业务编号",
+        },
+        {
+          prop: "process_name",
+          label: "流程名称",
+          // sortable: true,
+        },
+        {
+          prop: "apply_name",
+          label: "申请人",
+        },
+       
+        {
+          prop: "action_name",
+          label: "操作人",
+        },
+        {
+          prop: "addtime",
+          label: "申请时间",
+        },
+        {
+          prop: "",
+          label: "操作",
+          fixed: "right",
+          _noset_: true,
+          _slot_: "operation",
+          width: "50",
+        },
+      ],
+    };
+  },
+  mounted() {
+    this.searchProList();
+    this.searchList();
+  },
+  methods: {
+    getRouter(toRouter, queryId) {
+      if (toRouter && queryId) {
+        this.routeGoto(toRouter, { id: queryId });
+      }else{
+         this.$message.warning("暂未找到相关流程！");
+      }
+    },
+
+    restSearch() {
+      // 表格 - 分页
+      this.pageInfo = {
+        size: 15,
+        curr: 1,
+        total: 0,
+      };
+      this.parmValue = {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      };
+      // this.searchProList();
+      this.searchList();
+    },
+
+    // 刷新表格
+    async searchList() {
+      this.loading = true;
+      const res = await asyncRequest.list(this.parmValue);
+      if (res && res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.forEach((v, i) => {
+          let index = this.process_router_list.findIndex(
+            (y) => y.type === v.order_type
+          );
+          if (index !== -1) {
+            const { name, toRouter, to } = this.process_router_list[index];
+            this.tableData[i].process_name = name;
+            this.tableData[i].toRouter = toRouter;
+            this.tableData[i].queryId =
+              to == "code" ? v.order_code : v.order_id;
+          } else {
+            this.tableData[i].process_name = "";
+            this.tableData[i].toRouter = "";
+            this.tableData[i].queryId = "";
+          }
+        });
+        this.pageInfo.total = Number(res.data.count);
+      } else if (res && res.code >= 100 && res.code <= 104) {
+        await this.logout();
+      } else {
+        this.tableData = [];
+        this.pageInfo.total = 0;
+      }
+      this.loading = false;
+    },
+    // 刷新表格
+    async searchProList() {
+      this.loading = true;
+      const res = await asyncRequest.processList({
+        page: 1, // 页码
+        size: 50, // 每页显示条数
+      });
+      if (res && res.code === 0 && res.data) {
+        console.log(res.data);
+      } else if (res && res.code >= 100 && res.code <= 104) {
+        await this.logout();
+      } else {
+        this.tableData = [];
+        this.pageInfo.total = 0;
+      }
+      this.loading = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>