From f7230c0500c1ebe61e5f852b9bf6f4bc1cc81eee Mon Sep 17 00:00:00 2001
From: wuhui_zzw <1760308791@qq.com>
Date: Wed, 10 Jan 2024 13:32:20 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=EF=BC=9A=E4=BE=9B=E5=BA=94?=
 =?UTF-8?q?=E9=93=BE=E7=9B=B8=E5=85=B3=E5=8A=9F=E8=83=BD=EF=BC=88=E5=BC=80?=
 =?UTF-8?q?=E5=8F=91=E4=B8=AD=20-=20=E6=A0=B9=E6=8D=AE=E9=9C=80=E6=B1=82?=
 =?UTF-8?q?=E5=85=88=E5=BC=80=E5=8F=91=E6=96=B0=E7=A7=AF=E5=88=86=E5=85=91?=
 =?UTF-8?q?=E6=8D=A2=E6=B5=81=E7=A8=8B=EF=BC=8C=E4=BE=9B=E5=BA=94=E9=93=BE?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=E6=9A=82=E5=81=9C=E5=BC=80=E5=8F=91=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.js                           |   2 +
 src/router/modules/supplier.js                |  32 +
 .../supplier/list/handle/supplierDetails.vue  | 302 +++++++++
 .../supplier/list/handle/supplierEditForm.vue | 269 ++++++++
 .../supplier/list/handle/supplierInfo.vue     | 310 +++++++++
 src/views/supplier/list/index.vue             | 351 ++++++++++
 src/views/supplier/list/record.vue            | 624 ++++++++++++++++++
 7 files changed, 1890 insertions(+)
 create mode 100644 src/router/modules/supplier.js
 create mode 100644 src/views/supplier/list/handle/supplierDetails.vue
 create mode 100644 src/views/supplier/list/handle/supplierEditForm.vue
 create mode 100644 src/views/supplier/list/handle/supplierInfo.vue
 create mode 100644 src/views/supplier/list/index.vue
 create mode 100644 src/views/supplier/list/record.vue

diff --git a/src/router/index.js b/src/router/index.js
index 0f16261..ac27bdd 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -31,6 +31,7 @@ import stationRouter from './modules/station'
 import serviceRouter from './modules/service'
 import communityRouter from './modules/community'
 import deliveryRouter from './modules/delivery'
+import supplierRouter from './modules/supplier'
 
 export const constantRoutes = [
   configRouter,
@@ -56,6 +57,7 @@ export const constantRoutes = [
   serviceRouter,
   communityRouter,
   deliveryRouter,
+  supplierRouter,
   {
     path: roterPre,
     component: Layout,
diff --git a/src/router/modules/supplier.js b/src/router/modules/supplier.js
new file mode 100644
index 0000000..07b0f11
--- /dev/null
+++ b/src/router/modules/supplier.js
@@ -0,0 +1,32 @@
+import Layout from '@/layout'
+import { roterPre } from '@/settings'
+const supplierRouter =
+    {
+      path: `${roterPre}/supplier`,
+      name: 'supplier',
+      meta: {
+        icon: 'dashboard',
+        title: '供应链'
+      },
+      alwaysShow: true,
+      component: Layout,
+      children: [
+        {
+          path: 'list',
+          name: 'SupplierList',
+          meta: {
+            title: '供应商列表',
+            noCache: true
+          },
+          component: () => import('@/views/supplier/list/index')
+        }
+
+
+
+
+
+
+      ]
+    }
+
+export default supplierRouter
diff --git a/src/views/supplier/list/handle/supplierDetails.vue b/src/views/supplier/list/handle/supplierDetails.vue
new file mode 100644
index 0000000..957f217
--- /dev/null
+++ b/src/views/supplier/list/handle/supplierDetails.vue
@@ -0,0 +1,302 @@
+<template>
+  <div>
+    <el-drawer :with-header="false" :size="1000" :visible.sync="drawer" :direction="direction" :before-close="handleClose">
+      <div v-loading="loading">
+        <!--顶部内容-->
+        <div v-if="!isAdd" class="head">
+          <div class="full">
+            <img class="order_icon" :src="orderImg" alt="" />
+            <div class="text">
+              <div class="title">
+                <span class="bold">{{ merData.mer_name }}</span>
+                <el-tag v-if="merData.is_trader" type="danger" class="tags_name" effect="dark" size="mini">自营</el-tag>
+                <el-tag v-if="merData.merchantType" type="warning" class="tags_name" effect="dark" size="mini">{{merData.merchantType.type_name}}</el-tag>
+              </div>
+              <div>
+                <span class="mr20">{{ merData.mer_address }}</span>
+              </div>
+            </div>
+            <div>
+              <el-button
+                v-if="isEdit"
+                size="small"
+                @click="cancelEdit"
+                >取消</el-button
+              >
+              <el-button
+                v-if="!isEdit"
+                type="primary"
+                size="small"
+                @click="merEdit"
+                >编辑</el-button
+              >
+              <el-button
+                v-if="isEdit"
+                type="success"
+                size="small"
+                @click="saveInfo"
+                >完成</el-button
+              >
+              <el-dropdown @command="handleCommand">
+                <el-button icon="el-icon-more" size="small"></el-button>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item command="password">修改管理员密码</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </div>
+          </div>
+          <ul class="list">
+            <li class="item">
+              <div class="title">联系人</div>
+              <div>{{merData.real_name}}</div>
+            </li>
+            <li class="item">
+              <div class="title">联系电话</div>
+              <div>{{ merData.mer_phone }}</div>
+            </li>
+            <li class="item">
+              <div class="title">状态</div>
+              <div>{{ merData.status==1 ? '开启' : '关闭' }}</div>
+            </li>
+            <li class="item">
+              <div class="title">入驻时间</div>
+              <div>{{ merData.create_time }}</div>
+            </li>
+          </ul>
+        </div>
+        <div v-else class="head">
+          <div class="text">
+            <div class="title">
+              <span class="bold">添加供应商</span>
+            </div>
+          </div>
+        </div>
+        <!--具体内容-->
+        <supplierEditForm ref="editForm" :supplierId="supplierId" :isAdd="isAdd" :merData="merData" @modifyCopy="modifyCopy" @success="editSuccess" v-if="isEdit || isAdd"></supplierEditForm>
+        <supplierInfo ref="supplierInfo" :merData="merData" v-else-if="!isEdit && !isAdd"></supplierInfo>
+      </div>
+      <div v-if="isAdd" class="footer">
+        <el-button size="small" @click="handleClose">取消</el-button>
+        <el-button type="primary" size="small" @click="submitInfo">提交</el-button>
+      </div>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+import { merchantDetail } from '@/api/merchant';
+import supplierInfo from './supplierInfo';
+import supplierEditForm from './supplierEditForm';
+export default {
+  props: {
+    drawer: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  components: { supplierInfo, supplierEditForm },
+  data() {
+    return {
+      loading: true,
+      supplierId: '',
+      isEdit: false,
+      isAdd: false,
+      direction: 'rtl',
+      activeName: 'detail',
+      merData: {},
+      orderImg: require('@/assets/images/store_icon.png'),
+
+    };
+  },
+  filters: {},
+  methods: {
+    handleClose() {
+      if(this.isEdit || this.isAdd) {
+        this.$refs.editForm.resetData();
+        this.$refs.editForm.activeName = 'detail';
+      }else{
+        this.$refs.supplierInfo.activeName = 'detail';
+      }
+      this.$emit('closeDrawer');
+    },
+    getInfo(id) {
+      this.supplierId = id
+      this.isAdd = false;
+      merchantDetail(id)
+        .then((res) => {
+          this.loading = false;
+          this.drawer = true;
+          this.merData = res.data;
+        })
+        .catch((res) => {
+          this.$message.error(res.message);
+        });
+    },
+    initData(){
+      this.merData = {
+        is_trader:0
+      }
+      this.isEdit = false;
+      this.isAdd = true;
+      this.loading = false;
+    },
+    merEdit(){
+      this.isEdit = true;
+      this.$nextTick(()=>{
+        this.$refs.editForm.getCategorySelect();
+        this.getInfo(this.supplierId);
+      })
+    },
+    cancelEdit() {
+      this.isEdit = false
+    },
+    // 编辑成功回调
+    editSuccess(){
+      if(this.isAdd){
+        this.handleClose();
+      }else{
+        this.isEdit = false;
+      }
+      this.$emit('getList')
+    },
+    // 修改采集商品次数
+    modifyCopy(){
+      this.$emit('handleTimes',this.supplierId);
+    },
+     //下拉
+    handleCommand() {
+      this.$emit('onPassword',this.supplierId);
+    },
+    saveInfo(){
+      this.$refs.editForm.onSubmit(this.supplierId);
+      setTimeout(()=>{
+        this.getInfo(this.supplierId);
+      },500)
+    },
+    submitInfo(){
+      this.$refs.editForm.handleCreate();
+    }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.head {
+  padding: 20px 20px 10px;
+  .full {
+    display: flex;
+    align-items: center;
+    .order_icon {
+      width: 60px;
+      height: 60px;
+    }
+    .text {
+      align-self: center;
+      flex: 1;
+      min-width: 0;
+      padding-left: 12px;
+      font-size: 13px;
+      color: #606266;
+      .title {
+        margin-bottom: 10px;
+        font-weight: 500;
+        font-size: 16px;
+        line-height: 16px;
+        color: #282828;
+      }
+    }
+  }
+  .bold{
+    font-weight: bold;
+  }
+  .list {
+    display: flex;
+    margin-top: 20px;
+    overflow: hidden;
+    list-style: none;
+    padding: 0;
+    .item {
+      flex: none;
+      width: 200px;
+      font-size: 14px;
+      line-height: 14px;
+      color: rgba(0, 0, 0, 0.85);
+      .title {
+        margin-bottom: 12px;
+        font-size: 13px;
+        line-height: 13px;
+        color: #666666;
+      }
+    }
+  }
+}
+.el-tabs--border-card {
+  box-shadow: none;
+  border-bottom: none;
+}
+.section {
+  padding: 20px 0 5px;
+  border-bottom: 1px dashed #eeeeee;
+  .title {
+    padding-left: 10px;
+    border-left: 3px solid #437FFD;
+    font-size: 15px;
+    line-height: 15px;
+    color: #303133;
+  }
+  .list {
+    display: flex;
+    flex-wrap: wrap;
+    list-style: none;
+    padding: 0;
+  }
+  .item {
+    flex: 0 0 calc(100% / 2);
+    display: flex;
+    margin-top: 16px;
+    font-size: 13px;
+    color: #606266;
+
+    &:nth-child(2n + 1) {
+      padding-right: 20px;
+      padding-left: 20px;
+    }
+    &:nth-child(2n) {
+     padding-right: 20px;
+    }
+  }
+  .value {
+    flex: 1;
+    image {
+      display: inline-block;
+      width: 40px;
+      height: 40px;
+      margin: 0 12px 12px 0;
+      vertical-align: middle;
+    }
+  }
+}
+.tab {
+  display: flex;
+  align-items: center;
+  .el-image {
+    width: 36px;
+    height: 36px;
+    margin-right: 10px;
+  }
+}
+/deep/.el-drawer__body {
+  overflow: auto;
+}
+.gary {
+  color: #aaa;
+}
+.footer{
+  width: 100%;
+  text-align: center;
+  position: absolute;
+  bottom: 17px;
+  padding-top: 17px;
+  border-top: 1px dashed #eeeeee;
+}
+</style>
diff --git a/src/views/supplier/list/handle/supplierEditForm.vue b/src/views/supplier/list/handle/supplierEditForm.vue
new file mode 100644
index 0000000..208e162
--- /dev/null
+++ b/src/views/supplier/list/handle/supplierEditForm.vue
@@ -0,0 +1,269 @@
+<template>
+  <el-form ref="merDataField" size="small" :rules="ruleValidate" :model="merData" label-width="130px" @submit.native.prevent>
+    <el-tabs v-loading="loading" type="border-card" v-model="activeName">
+      <div class="section">
+        <div class="title">基础信息</div>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="供应商名称：" prop="supplier_name">
+              <el-input v-model="merData.supplier_name" placeholder="请填写供应商名称" class="selWidth" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商地址：" prop="detailed_address">
+              <el-input v-model="merData.detailed_address" placeholder="请填写详细地址" class="selWidth" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系人姓名：" prop="name">
+              <el-input type="text" placeholder="请填写联系人姓名" v-model="merData.name" class="selWidth" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系电话：" prop="phone">
+              <el-input placeholder="请填写联系电话" v-model="merData.phone" class="selWidth" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商邮箱：" prop="email">
+              <el-input v-model="merData.email" placeholder="请填写邮箱地址" class="selWidth" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="排序：" prop="sort">
+              <el-input-number v-model="merData.sort" controls-position="right" placeholder="请输入排序"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="状态：" prop="is_show">
+              <el-switch v-model="merData.is_show" :active-value="1" :inactive-value="0" :width="55" active-text="开启" inactive-text="关闭" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="商品审核：" prop="is_examine">
+              <el-switch v-model="merData.is_examine" :active-value="1" :inactive-value="0" :width="50" active-text="是" inactive-text="否" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="备注：" prop="mark">
+              <el-input type="textarea" v-model="merData.mark" placeholder="请填写备注" class="selWidth" :maxlength="250" autosize :rows="5" resize="none" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <div class="title">账号密码</div>
+        <el-row :gutter="24" class="mt20">
+          <el-col :span="24">
+            <el-form-item label="商户账号：" prop="supplier_account">
+              <el-input type="text" v-model="merData.supplier_account" :disabled="!isAdd" class="selWidth" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="登陆密码：" prop="supplier_password">
+              <el-input type="password" v-model="merData.supplier_password" :disabled="!isAdd" class="selWidth" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </div>
+    </el-tabs>
+  </el-form>
+</template>
+
+<script>
+import { merCategoryListApi } from '@/api/product'
+import { getstoreTypeApi, merchantUpdate, merchantCreate } from "@/api/merchant";
+export default {
+  props: {
+    merData: {
+      type: Object,
+      default: {},
+    },
+    isAdd: {
+      type: Boolean,
+      default: false,
+    }
+  },
+  data() {
+    const validatePhone = (rule, value, callback) => {
+      if (!value) {
+        return callback(new Error('请填写联系方式'))
+      } else if (!/^1[3456789]\d{9}$/.test(value)) {
+        callback(new Error('格式不正确!'))
+      } else {
+        callback()
+      }
+    }
+    return {
+      loading: false,
+      supplierId: '',
+      direction: 'rtl',
+      activeName: 'detail',
+      merCateList: [],
+      storeType: [],
+      ruleValidate: {
+        supplier_name: [{ required: true, message: '请输入供应商名称', trigger: 'blur' }],
+        supplier_account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+        supplier_password: [{ required: true, message: '请输入登录密码', trigger: 'blur' }],
+
+
+
+
+      },
+    };
+  },
+  filters: {
+  },
+  mounted() {
+    this.getCategorySelect();
+    this.getStoreType()
+  },
+  methods: {
+    // 商户分类；
+    getCategorySelect() {
+      merCategoryListApi().then(res => {
+        this.merCateList = res.data.list
+      }).catch(res => {
+        this.$message.error(res.message)
+      })
+    },
+    /**获取店铺类型 */
+    getStoreType(){
+      getstoreTypeApi().then(res => {
+        this.storeType = res.data
+      }).catch(res => {
+        this.$message.error(res.message)
+      })
+    },
+    /**修改采集次数 */
+    modifyCopy() {
+      this.$emit('modifyCopy')
+    },
+    /**重置表单数据 */
+    resetData(){
+      this.$refs.merDataField.resetFields();
+    },
+    /*提交信息*/
+    onSubmit(id){
+      this.$refs['merDataField'].validate(valid => {
+        if (valid) {
+          this.loading = true;
+          merchantUpdate(id,this.merData)
+          .then(async res => {
+            this.$message.success(res.message);
+            this.loading = false;
+            this.$emit('success');
+          })
+          .catch(res => {
+            this.loading = false;
+            this.$message.error(res.message);
+          });
+        }
+      });
+    },
+    /**创建商户 */
+    handleCreate(){
+      this.$refs['merDataField'].validate((valid) => {
+        if (valid) {
+          merchantCreate(this.merData)
+            .then(async (res) => {
+              this.$message.success(res.message);
+              this.$emit('success');
+            })
+            .catch((res) => {
+              this.$message.error(res.message);
+            });
+        } else {
+          if(!this.merData.supplier_name)return this.$message.error('请填写基本信息-供应商名称');
+          if(!this.merData.category_id)return this.$message.error('请选择基本信息-商户分类');
+          if(!this.merData.type_id)return this.$message.error('请选择基本信息-店铺类型');
+          if(!this.merData.mer_account)return this.$message.error('请填写账号信息-商户账号');
+          if(!this.merData.mer_phone)return this.$message.error('请填写账号信息-联系电话');
+        }
+      });
+    }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.selWidth{
+  width: 100%;
+}
+.el-tabs--border-card {
+  box-shadow: none;
+  border-bottom: none;
+}
+.section {
+  padding: 20px 0 5px;
+  border-bottom: 1px dashed #eeeeee;
+  .title {
+    padding-left: 10px;
+    border-left: 3px solid #437FFD;
+    font-size: 15px;
+    line-height: 15px;
+    color: #303133;
+  }
+  .list {
+    display: flex;
+    flex-wrap: wrap;
+    list-style: none;
+    padding: 0;
+  }
+  .item {
+    flex: 0 0 calc(100% / 2);
+    display: flex;
+    margin-top: 16px;
+    font-size: 13px;
+    color: #606266;
+
+    &:nth-child(2n + 1) {
+      padding-right: 20px;
+      padding-left: 20px;
+    }
+    &:nth-child(2n) {
+     padding-right: 20px;
+    }
+  }
+  .value {
+    flex: 1;
+    image {
+      display: inline-block;
+      width: 40px;
+      height: 40px;
+      margin: 0 12px 12px 0;
+      vertical-align: middle;
+    }
+  }
+}
+.info-red{
+  color: red;
+  font-size: 12px;
+}
+/deep/.el-input-number.is-controls-right .el-input__inner{
+ padding: 0 40px 0 10px;
+}
+/deep/.el-form-item__label{
+  font-weight: normal;
+  color: #282828;
+}
+.tab {
+  display: flex;
+  align-items: center;
+  .el-image {
+    width: 36px;
+    height: 36px;
+    margin-right: 10px;
+  }
+}
+/deep/.el-drawer__body {
+  overflow: auto;
+}
+.gary {
+  color: #aaa;
+}
+.input-tips{
+  font-size: 12px;
+  margin-left: 180px;
+  line-height: 20px;
+  color: #9d9d9d;
+}
+</style>
diff --git a/src/views/supplier/list/handle/supplierInfo.vue b/src/views/supplier/list/handle/supplierInfo.vue
new file mode 100644
index 0000000..edce92a
--- /dev/null
+++ b/src/views/supplier/list/handle/supplierInfo.vue
@@ -0,0 +1,310 @@
+<template>
+  <div>
+    <el-tabs type="border-card" v-model="activeName">
+      <el-tab-pane label="基本信息" name="detail">
+        <div class="section">
+          <div class="title">基础信息</div>
+          <ul class="list">
+            <li class="item">
+              <div>商户名称：</div>
+              <div class="value">
+                {{merData.mer_name}}
+              </div>
+            </li>
+            <li class="item">
+              <div>商户类型：</div>
+              <div class="value">{{merData.is_trader == 1 ? "自营" : "非自营"}}</div>
+            </li>
+            <li class="item">
+              <div>商户分类：</div>
+              <div v-if="merData.merchantCategory" class="value">
+                {{merData.merchantCategory.category_name}}
+                <span class="info info-red">(该分类下的商户手续费是{{merData.merchantCategory.commission_rate*100}}%)</span>
+              </div>
+            </li>
+            <li class="item">
+              <div>推荐商户：</div>
+              <div class="value">{{merData.is_best == 1 ? "是" : "否"}}</div>
+            </li>
+            <li v-if="merData.merchantType" class="item">
+              <div>店铺类型：</div>
+              <div class="value">{{merData.merchantType.type_name}}</div>
+            </li>
+            <li class="item">
+              <div>商户状态：</div>
+              <div class="value">{{merData.status == 1 ? "开启" : "关闭"}}</div>
+            </li>
+            <li class="item">
+              <div>排序：</div>
+              <div class="value">{{merData.sort}}</div>
+            </li>
+            <li class="item">
+              <div>更新时间：</div>
+              <div class="value">{{merData.update_time}}</div>
+            </li>
+            <li class="item">
+              <div>备注：</div>
+              <div class="value">{{merData.mark}}</div>
+            </li>
+            <li class="item">
+              <div>人均消费额：</div>
+              <div class="value">{{merData.avg_consumption}}</div>
+            </li>
+            <li class="item">
+              <div>商户标签：</div>
+              <div class="value">{{merData.mer_label}}</div>
+            </li>
+          </ul>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="经营信息" name="operate">
+        <div class="section">
+          <div class="title">费用信息</div>
+          <ul class="list">
+            <li class="item item100">
+              <div>商户手续费单独设置：</div>
+              <div class="value">
+                {{merData.commission_switch ? "开启" : "关闭"}}
+              </div>
+            </li>
+            <li v-if="merData.commission_switch" class="item item100">
+              <div>商户手续费：</div>
+              <div class="value">
+                {{ merData.commission_rate}}%
+                <span class="info info-red">(注：此处如未设置手续费，系统会自动读取商户分类下对应手续费；此处已设置，则优先以此处设置为准)</span>
+              </div>
+            </li>
+            <li class="item">
+              <div>店铺保证金：</div>
+              <div class="value">
+                {{merData.is_margin == 0 ? '无' : merData.ot_margin}}
+              </div>
+            </li>
+            <li v-if="merData.is_margin != 0" class="item">
+              <div>保证金支付状态：</div>
+              <div class="value">{{merData.is_margin == 1 ? '待缴' : merData.is_margin == 0 ? '无' : '已缴' }}
+                <span v-if="(merData.is_margin==10 && merData.margin-merData.ot_margin<0)" class="info-red">(需补缴)</span>
+              </div>
+            </li>
+            <li v-if="merData.is_margin != 0" class="item">
+              <div>保证金余额：</div>
+              <div class="value">{{merData.margin}}</div>
+            </li>
+          </ul>
+        </div>
+        <div class="section">
+          <div class="title">审核信息</div>
+          <ul class="list">
+            <li class="item">
+              <div>商品审核：</div>
+              <div class="value">{{merData.is_audit == 1 ? '需审核' : '免审核'}}</div>
+            </li>
+            <li class="item">
+              <div>直播间审核：</div>
+              <div class="value">{{merData.is_bro_room == 1 ? '需审核' : '免审核'}}</div>
+            </li>
+            <li class="item">
+              <div>直播间商品审核：</div>
+              <div class="value">{{merData.is_bro_goods == 1 ? '需审核' : '免审核'}}</div>
+            </li>
+          </ul>
+        </div>
+        <div class="section">
+          <div class="title">其他信息</div>
+          <ul class="list">
+            <li class="item item100">
+              <div>搜索商户关键字：</div>
+              <div class="value">{{merData.mer_keyword}}</div>
+            </li>
+            <li class="item item100">
+              <div>剩余商品采集数：</div>
+              <div class="value">{{merData.copy_product_num}}次</div>
+            </li>
+            <li class="item item100">
+              <div>商户资质：</div>
+              <div class="value">
+                <el-image
+                  v-for="(item, index) in merData.mer_certificate"
+                  :key="index"
+                  :src="item"
+                  @click="lookImg(item)"
+                  style="width: 36px;height: 36px;margin-right: 5px;"
+                  />
+              </div>
+            </li>
+          </ul>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="账号信息" name="account">
+        <div class="section">
+          <div class="title">登录账号</div>
+          <ul class="list">
+            <li class="item">
+              <div>商户账号：</div>
+              <div class="value">
+                {{merData.mer_account}}
+              </div>
+            </li>
+            <li class="item">
+              <div>登录密码：</div>
+              <div class="value">{{merData.mer_password}}</div>
+
+            </li>
+            <li class="item">
+              <div>联系人：</div>
+              <div class="value">{{merData.real_name}}</div>
+            </li>
+            <li class="item">
+              <div>联系电话：</div>
+              <div class="value">{{merData.mer_phone}}</div>
+            </li>
+            <!-- <li class="item">
+              <div>绑定手机号：</div>
+              <div class="value">{{merData.real_name}}</div>
+            </li>
+            <li class="item">
+              <div>绑定微信用户昵称/ID：</div>
+              <div class="value">{{merData.real_name}}</div>
+            </li>  -->
+          </ul>
+        </div>
+        <div v-if="merData.sub_mchid" class="section">
+          <div class="title">财务帐号</div>
+          <ul class="list">
+            <li class="item">
+              <div>微信分账商户号：</div>
+              <div class="value">{{merData.sub_mchid}}</div>
+            </li>
+          </ul>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="积分设置" name="integral">
+        <div class="section">
+          <div class="title">登录账号</div>
+          <ul class="list">
+            <li class="item">
+              <div>商户积分兑换平台积分比例：</div>
+              <div class="value">
+                1 : {{merData.mer_integral_platform_rate}}
+              </div>
+            </li>
+            <li class="item">
+              <div>平台积分转换商户积分比例：</div>
+              <div class="value">{{merData.mer_integral_merchant_rate}} : 1</div>
+            </li>
+          </ul>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+     <div class="images" v-show="false" v-viewer="{ movable: false }">
+      <img v-for="(src,index) in merData.mer_certificate" :src="src" :key="index" />
+    </div>
+  </div>
+</template>
+<script>
+
+export default {
+  props: {
+    merData: {
+      type: Object,
+      default: {},
+    },
+  },
+  data() {
+    return {
+      loading: true,
+      supplierId: '',
+      direction: 'rtl',
+      activeName: 'detail',
+    };
+  },
+  filters: {
+  },
+  methods: {
+    lookImg(item) {
+      this.imageUrl = item;
+      const viewer = this.$el.querySelector('.images').$viewer;
+      viewer.show();
+      this.$nextTick(() => {
+        let i = this.merData.mer_certificate.findIndex((e) => e === item);
+        viewer.update().view(i);
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.el-tabs--border-card {
+  box-shadow: none;
+  border-bottom: none;
+}
+.section {
+  padding: 20px 0 5px;
+  border-bottom: 1px dashed #eeeeee;
+  .title {
+    padding-left: 10px;
+    border-left: 3px solid #437FFD;
+    font-size: 15px;
+    line-height: 15px;
+    color: #303133;
+  }
+  .list {
+    display: flex;
+    flex-wrap: wrap;
+    list-style: none;
+    padding: 0;
+    margin-top: 5px;
+  }
+  .item {
+    flex: 0 0 calc(100% / 2);
+    display: flex;
+    margin-top: 16px;
+    font-size: 13px;
+    color: #606266;
+    padding-right: 20px;
+    padding-left: 20px;
+    &.item100{
+     flex: 0 0 calc(100% / 1);
+     padding-right: 20px;
+     padding-left: 20px;
+    }
+    &:nth-child(2n + 1) {
+      padding-right: 20px;
+      padding-left: 20px;
+    }
+    // &:nth-child(2n) {
+    //  padding-right: 20px;
+    // }
+  }
+  .value {
+    flex: 1;
+    image {
+      display: inline-block;
+      width: 40px;
+      height: 40px;
+      margin: 0 12px 12px 0;
+      vertical-align: middle;
+    }
+  }
+}
+.info-red{
+  color: red;
+  font-size: 12px;
+}
+.tab {
+  display: flex;
+  align-items: center;
+  .el-image {
+    width: 36px;
+    height: 36px;
+    margin-right: 10px;
+  }
+}
+/deep/.el-drawer__body {
+  overflow: auto;
+}
+.gary {
+  color: #aaa;
+}
+
+</style>
diff --git a/src/views/supplier/list/index.vue b/src/views/supplier/list/index.vue
new file mode 100644
index 0000000..fc4df3f
--- /dev/null
+++ b/src/views/supplier/list/index.vue
@@ -0,0 +1,351 @@
+<template>
+  <div class="divBox">
+    <el-card class="box-card">
+      <!--顶部搜索-->
+      <div slot="header" class="clearfix">
+        <div class="container">
+          <el-form size="small" label-width="100px" :inline="true">
+            <el-form-item label="关键字：" label-width="80px" style="display: inline-block;">
+              <el-input style="width: 350px" v-model="tableFrom.keyword" @keyup.enter.native="getList(1)" placeholder="请输入供应商名称/联系人姓名/联系电话" class="selWidth">
+                <el-button slot="append" icon="el-icon-search" class="el-button-solt" @click="getList(1)" />
+              </el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+        <el-button size="small" type="primary" @click="addSupplier">添加供应商</el-button>
+      </div>
+      <!--列表-->
+      <el-table v-loading="listLoading" :data="tableData.data" style="width: 100%" size="small" highlight-current-row class="switchTable">
+        <el-table-column prop="mer_id" label="ID" min-width="60" />
+        <el-table-column prop="mer_name" label="商户名称" min-width="150" />
+        <el-table-column prop="real_name" label="商户姓名" min-width="150" />
+
+        <el-table-column prop="status" label="推荐" min-width="100">
+          <template slot-scope="scope">
+            <el-switch
+              v-model="scope.row.is_best"
+              :active-value="1"
+              :inactive-value="0"
+              active-text="是"
+              inactive-text="否"
+              disabled
+              @click.native="onchangeIsShow(scope.row)"
+            />
+          </template>
+        </el-table-column>
+         <el-table-column prop="status" label="开启/关闭" min-width="100">
+          <template slot-scope="scope">
+            <el-switch
+              v-model="scope.row.status"
+              :active-value="1"
+              :inactive-value="0"
+              active-text="开启"
+              inactive-text="关闭"
+              disabled
+              @click.native="onchangeIsClose(scope.row)"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column prop="create_time" label="创建时间" min-width="150" />
+        <el-table-column prop="margin" label="保证金" min-width="150">
+          <template slot-scope="scope">
+            <span>{{scope.row.is_margin == 1 ? '未支付' : scope.row.is_margin == 0 ? '无' : '已支付'}}</span>
+
+          </template>
+        </el-table-column>
+        <el-table-column prop="sort" label="排序" min-width="100" />
+        <el-table-column prop="mark" label="备注" min-width="200" />
+
+        <el-table-column label="操作" min-width="150" fixed="right" align="center">
+          <template slot-scope="scope">
+            <!-- <router-link
+              v-if="tableFrom.status === '1'"
+              :to="{path: roterPre+ '/merchant/list/reconciliation/' + scope.row.mer_id + '/1' }"
+            >
+              <el-button type="text" size="small" class="mr10">对账</el-button>
+            </router-link> -->
+            <el-button
+              v-if="tableFrom.status === '1'"
+              type="text"
+              size="small"
+              @click="onLogo(scope.row.mer_id)"
+            >登录</el-button>
+            <el-button type="text" size="small" @click="onEdit(scope.row.mer_id)">编辑</el-button>
+            <el-button type="text" size="small" @click="onDetails(scope.row.mer_id)">详情</el-button>
+            <el-button
+              v-if="tableFrom.status === '0'"
+              type="text"
+              size="small"
+              @click="handleDelete(scope.row.mer_id, scope.$index)"
+            >删除</el-button>
+            <!-- <el-button
+              v-if="tableFrom.status === '1'"
+              type="text"
+              size="small"
+              @click="onDeduct(scope.row.mer_id)"
+            >扣除保证金</el-button> -->
+          </template>
+        </el-table-column>
+      </el-table>
+      <!--分页-->
+      <div class="block">
+        <el-pagination
+          :page-sizes="[20, 40, 60, 80]"
+          :page-size="tableFrom.limit"
+          :current-page="tableFrom.page"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="tableData.total"
+          @size-change="handleSizeChange"
+          @current-change="pageChange"
+        />
+      </div>
+    </el-card>
+    <!-- 添加、编辑、详情 -->
+    <supplier-detail
+      ref="supplierDetail"
+      :supplierId="supplierId"
+      @closeDrawer="closeDrawer"
+      @changeDrawer="changeDrawer"
+      @onPassword="onPassword"
+      @handleTimes="handleTimes"
+      @getList="getList"
+      :drawer="drawer"
+    ></supplier-detail>
+  </div>
+</template>
+
+<script>
+import supplierDetail from './handle/supplierDetails.vue';
+
+
+
+
+import {
+  merchantListApi,
+  merchantCreateApi,
+  merchantUpdateApi,
+  merchantDeleteForm,
+  merchantStatuseApi,
+  merchantPasswordApi,
+  merchantLoginApi,
+  changeCopyApi,
+  merchantCountApi,
+  merchantIsCloseApi,
+  getstoreTypeApi,
+  getMerCateApi, marginDeductionForm
+} from "@/api/merchant";
+import { fromList } from "@/libs/constants.js";
+import { roterPre } from "@/settings";
+import SettingMer from "@/libs/settingMer";
+import Cookies from "js-cookie";
+export default {
+  name: "SupplierList",
+  components: { supplierDetail },
+  data() {
+    return {
+      fromList: fromList,
+      roterPre: roterPre,
+      isChecked: false,
+      listLoading: true,
+      merCateList: [],
+      storeType: [],
+      headeNum: [
+        {
+          count: '',
+          type: "1",
+          title: "正常开启的商户"
+        },
+        {
+          count: '',
+          type: "0",
+          title: "已关闭商户"
+        }
+      ],
+      tableData: {
+        data: [],
+        total: 0
+      },
+      tableFrom: {
+        page: 1,
+        limit: 20,
+        date: "",
+        status: "1",
+        keyword: "",
+        is_trader: "",
+        is_best: "",
+        category_id: '',
+        type_id: ""
+      },
+      autoUpdate: true,
+      supplierId: "",
+      drawer: false,
+      timeVal: []
+    };
+  },
+  mounted() {
+    this.getHeadNum();
+    this.getMerCategory();
+    this.getStoreType();
+    this.getList("");
+  },
+  methods: {
+    // 添加供应商
+    addSupplier() {
+      this.drawer = true;
+      this.$refs.supplierDetail.initData();
+    },
+
+
+
+
+
+
+
+
+
+
+
+    onLogo(id) {
+      merchantLoginApi(id)
+        .then(res => {
+          Cookies.set("merchantToken", res.data.token);
+          window.open(SettingMer.httpUrl + res.data.url);
+        })
+        .catch(res => {
+          this.$message.error(res.message);
+        });
+    },
+    // 选择时间
+    selectChange(tab) {
+      this.tableFrom.date = tab;
+      this.timeVal = [];
+      this.tableFrom.page = 1;
+      this.getList("");
+    },
+    // 具体日期
+    onchangeTime(e) {
+      this.timeVal = e;
+      this.tableFrom.date = this.timeVal ? this.timeVal.join("-") : "";
+      this.tableFrom.page = 1;
+      this.getList("");
+    },
+    // 获取开启商户数
+    getHeadNum() {
+      merchantCountApi()
+        .then(res => {
+          this.headeNum[0]["count"] = res.data.valid;
+          this.headeNum[1]["count"] = res.data.invalid;
+        })
+        .catch(res => {});
+    },
+    // 商户分类；
+    getMerCategory() {
+        getMerCateApi().then(res => {
+            this.merCateList = res.data
+        }).catch(res => {
+            this.$message.error(res.message)
+        })
+    },
+    getStoreType(){
+        getstoreTypeApi().then(res => {
+            this.storeType = res.data
+        }).catch(res => {
+            this.$message.error(res.message)
+        })
+    },
+    // 列表
+    getList(num) {
+      this.listLoading = true;
+      this.tableFrom.page = num ? num : this.tableFrom.page;
+      merchantListApi(this.tableFrom)
+        .then(res => {
+          this.tableData.data = res.data.list;
+          this.tableData.total = res.data.count;
+          this.listLoading = false;
+        })
+        .catch(res => {
+          this.listLoading = false;
+          this.$message.error(res.message);
+        });
+    },
+    pageChange(page) {
+      this.tableFrom.page = page;
+      this.getList("");
+    },
+    handleSizeChange(val) {
+      this.tableFrom.limit = val;
+      this.getList(1);
+    },
+    // 修改状态
+    onchangeIsShow(row) {
+      const title = row.is_best === 0 ? "是否开启推荐商户" : "是否关闭推荐商户";
+      this.$modalSure(title).then(() => {
+        merchantStatuseApi(row.mer_id, row.is_best === 1 ? 0 : 1)
+          .then(({ message }) => {
+            this.$message.success(message);
+            this.getList("");
+          })
+          .catch(({ message }) => {
+            this.$message.error(message);
+          });
+      });
+    },
+    // 开启关闭
+    onchangeIsClose(row) {
+      merchantIsCloseApi(row.mer_id, row.status === 1 ? 0 : 1)
+        .then(({ message }) => {
+          this.$message.success(message);
+          this.getList("");
+        })
+        .catch(({ message }) => {
+          this.$message.error(message);
+        });
+    },
+
+    // 编辑
+    onEdit(id) {
+      this.supplierId = id;
+      this.$refs.supplierDetail.isEdit = true;
+      this.$refs.supplierDetail.getInfo(id);
+      this.drawer = true;
+
+    },
+    // 详情
+    onDetails(id) {
+      this.supplierId = id;
+      this.$refs.supplierDetail.isEdit = false;
+      this.$refs.supplierDetail.getInfo(id);
+      this.drawer = true;
+    },
+    changeDrawer(v) {
+      this.drawer = v;
+    },
+    closeDrawer() {
+      this.drawer = false;
+    },
+    // 删除
+    handleDelete(id) {
+      this.$modalForm(merchantDeleteForm(id)).then(() => this.getList(""));
+    },
+    // 扣除保证金
+    onDeduct(id) {
+      this.$modalForm(marginDeductionForm(id)).then(() => this.getList(""));
+    },
+    // 设置复制次数
+    handleTimes(id) {
+      this.$modalForm(changeCopyApi(id)).then(() => this.getList(""));
+    },
+
+    // 修改密码表单
+    onPassword(id) {
+      this.$modalForm(merchantPasswordApi(id));
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+
+
+
+</style>
diff --git a/src/views/supplier/list/record.vue b/src/views/supplier/list/record.vue
new file mode 100644
index 0000000..b6db117
--- /dev/null
+++ b/src/views/supplier/list/record.vue
@@ -0,0 +1,624 @@
+<template>
+<div class="divBox">
+    <el-card class="box-card mb20">
+        <div slot="header" class="clearfix">
+            <router-link v-if="$route.params.type === '1'" :to="{path:roterPre+'/merchant/list'}">
+                <el-button size="mini" class="mr20 mb20" icon="el-icon-back">返回</el-button>
+            </router-link>
+            <router-link v-else :to="{path:roterPre+'/accounts/reconciliation'}">
+                <el-button size="mini" class="mr20 mb20" icon="el-icon-back">返回</el-button>
+            </router-link>
+            <div v-if="$route.params.type === '1'" class="filter-container">
+                <el-form :inline="true">
+                    <el-form-item label="使用状态：" class="mr20">
+                        <el-select v-model="tableFrom.status" placeholder="请选择评价状态" @change="init">
+                            <el-option label="全部" value="" />
+                            <el-option label="未对账" value="0" />
+                            <el-option label="已对账" value="1" />
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="时间选择：" class="mr10">
+                        <el-date-picker v-model="timeVal" type="daterange" align="right" unlink-panels format="yyyy 年 MM 月 dd 日" value-format="yyyy/MM/dd" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" @change="onchangeTime" />
+                    </el-form-item>
+                </el-form>
+            </div>
+            <el-button v-if="$route.params.type === '1'" size="small" type="primary" @click="onAdd(0)">商户对账</el-button>
+        </div>
+        <el-table v-loading="listLoading" :data="tableData.data" style="width: 100%" size="mini" class="table" highlight-current-row>
+            <el-table-column type="expand">
+                <template slot-scope="props">
+                    <el-form label-position="left" inline class="demo-table-expand demo-table-expands">
+                        <el-form-item label="收货人：">
+                            <span>{{ props.row.real_name | filterEmpty }}</span>
+                        </el-form-item>
+                        <el-form-item label="电话：">
+                            <span>{{ props.row.user_phone | filterEmpty }}</span>
+                        </el-form-item>
+                        <el-form-item label="地址：">
+                            <span>{{ props.row.user_address | filterEmpty }}</span>
+                        </el-form-item>
+                        <el-form-item label="商品总数：">
+                            <span>{{ props.row.total_num | filterEmpty }}</span>
+                        </el-form-item>
+                        <el-form-item label="支付状态：">
+                            <span>{{ props.row.pay_type | payTypeFilter }}</span>
+                        </el-form-item>
+                        <el-form-item label="支付时间：">
+                            <span>{{ props.row.pay_time | filterEmpty }}</span>
+                        </el-form-item>
+                        <el-form-item label="对账备注：">
+                            <span>{{ props.row.admin_mark }}</span>
+                        </el-form-item>
+                    </el-form>
+                </template>
+            </el-table-column>
+            <el-table-column v-if="$route.params.type === '1'" width="50">
+                <template slot="header" slot-scope="scope">
+                    <el-popover placement="top-start" width="100" trigger="hover" class="tabPop">
+                        <div>
+                            <span class="spBlock onHand" :class="{'check': chkName === 'dan'}" @click="onHandle('dan',scope.$index)">选中本页</span>
+                            <span class="spBlock onHand" :class="{'check': chkName === 'duo'}" @click="onHandle('duo')">选中全部</span>
+                        </div>
+                        <el-checkbox slot="reference" :value="(chkName === 'dan' && checkedPage.indexOf(tableFrom.page) > -1) || chkName === 'duo'" @change="changeType" />
+                    </el-popover>
+                </template>
+                <template slot-scope="scope">
+                    <el-checkbox :value="checkedIds.indexOf(scope.row.order_id) > -1 || (chkName === 'duo' && noChecked.indexOf(scope.row.order_id) === -1)" @change="(v)=>changeOne(v,scope.row)" />
+                </template>
+            </el-table-column>
+            <el-table-column prop="order_id" label="ID" width="60" />
+            <el-table-column label="是否对账" min-width="100">
+                <template slot-scope="scope">
+                    <span>{{ scope.row.reconciliation_id | reconciliationFilter }}</span>
+                </template>
+            </el-table-column>
+            <el-table-column prop="order_sn" label="订单编号" min-width="190" />
+            <el-table-column label="商品信息" min-width="330">
+                <template slot-scope="scope">
+                    <div v-for="(val, i ) in scope.row.orderProduct" :key="i" class="tabBox acea-row row-middle">
+                        <div class="demo-image__preview">
+                            <el-image :src="val.cart_info.product.image" :preview-src-list="[val.cart_info.product.image]" />
+                        </div>
+                        <span class="tabBox_tit">{{ val.cart_info.product.store_name + ' | ' }}{{ val.cart_info.productAttr.sku }}</span>
+                        <span class="tabBox_pice">{{ '￥'+ val.cart_info.productAttr.price + ' x '+ val.product_num }}</span>
+                    </div>
+                </template>
+            </el-table-column>
+            <el-table-column label="商品总价" min-width="150">
+                <template slot-scope="scope">
+                    <span>{{ getTotal(scope.row.orderProduct) }}</span>
+                </template>
+            </el-table-column>
+            <el-table-column prop="pay_price" label="实际支付" min-width="100" />
+            <el-table-column label="佣金金额" min-width="100">
+              <template slot-scope="scope">
+                <span>{{Number(scope.row.extension_one)+Number(scope.row.extension_two)}}</span>
+              </template>
+            </el-table-column>
+            <el-table-column prop="total_postage" label="邮费" min-width="100" />
+          <el-table-column prop="order_rate" label="手续费" min-width="100" />
+            <el-table-column prop="create_time" label="下单时间" min-width="150" />
+            <el-table-column v-if="$route.params.type === '1'" label="操作" min-width="80" fixed="right" align="center">
+                <template slot-scope="scope">
+                    <el-button type="text" size="small" @click="addMark(scope.row.order_id)">添加备注</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+        <div class="block mb20">
+            <el-pagination :page-sizes="[10, 20, 30, 40]" :page-size="tableFrom.limit" :current-page="tableFrom.page" layout="total, sizes, prev, pager, next, jumper" :total="tableData.total" @size-change="handleSizeChange" @current-change="pageChange" />
+        </div>
+    </el-card>
+    <el-card class="box-card">
+        <el-table v-loading="listLoading" :data="tableDataRefund.data" style="width: 100%" size="mini" class="table" highlight-current-row>
+            <el-table-column type="expand">
+                <template slot-scope="props">
+                    <el-form label-position="left" inline class="demo-table-expand">
+                        <el-form-item label="订单号：">
+                            <span>{{ props.row.order.order_sn }}</span>
+                        </el-form-item>
+                        <el-form-item label="退款商品总价：">
+                            <span>{{ getTotalRefund(props.row.refundProduct) }}</span>
+                        </el-form-item>
+                        <el-form-item label="退款商品总数：">
+                            <span>{{ props.row.refund_num }}</span>
+                        </el-form-item>
+                        <el-form-item label="申请退款时间：">
+                            <span>{{ props.row.create_time | filterEmpty }}</span>
+                        </el-form-item>
+                        <el-form-item label="对账备注：">
+                            <span>{{ props.row.admin_mark }}</span>
+                        </el-form-item>
+                    </el-form>
+                </template>
+            </el-table-column>
+            <el-table-column v-if="$route.params.type === '1'" width="50">
+                <template slot="header" slot-scope="scope">
+                    <el-popover placement="top-start" width="100" trigger="hover" class="tabPop">
+                        <div>
+                            <span class="spBlock onHand" :class="{'check': chkNameRefund === 'dan'}" @click="onHandleRefund('dan',scope.$index)">选中本页</span>
+                            <span class="spBlock onHand" :class="{'check': chkNameRefund === 'duo'}" @click="onHandleRefund('duo')">选中全部</span>
+                        </div>
+                        <el-checkbox slot="reference" :value="(chkNameRefund === 'dan' && checkedPage.indexOf(tableFrom.page) > -1) || chkNameRefund === 'duo'" @change="changeTypeRefund" />
+                    </el-popover>
+                </template>
+                <!--:disabled="isDisabled"-->
+                <template slot-scope="scope">
+                    <el-checkbox :value="refundCheckedIds.indexOf(scope.row.refund_order_id) > -1 || (chkNameRefund === 'duo' && refundNoChecked.indexOf(scope.row.refund_order_id) === -1)" @change="(v)=>changeOneRefund(v,scope.row)" />
+                </template>
+            </el-table-column>
+            <el-table-column prop="refund_order_id" label="ID" width="60" />
+            <el-table-column label="退款单号" min-width="170">
+                <template slot-scope="scope">
+                    <span style="display: block;" v-text="scope.row.refund_order_sn" />
+                    <span v-show="scope.row.is_del > 0" style="color: #ED4014;display: block;">用户已删除</span>
+                </template>
+            </el-table-column>
+            <el-table-column label="是否对账" min-width="100">
+                <template slot-scope="scope">
+                    <span>{{ scope.row.reconciliation_id | reconciliationFilter }}</span>
+                </template>
+            </el-table-column>
+            <el-table-column prop="user.nickname" label="用户信息" min-width="130" />
+            <el-table-column prop="refund_price" label="退款金额" min-width="130" />
+            <el-table-column prop="nickname" label="商品信息" min-width="330">
+                <template slot-scope="scope">
+                    <div v-for="(val, i ) in scope.row.refundProduct" :key="i" class="tabBox acea-row row-middle">
+                        <div class="demo-image__preview">
+                            <el-image :src="val.product.cart_info.product.image" :preview-src-list="[val.product.cart_info.product.image]" />
+                        </div>
+                        <span class="tabBox_tit">{{ val.product.cart_info.product.store_name + ' | ' }}{{ val.product.cart_info.productAttr.sku }}</span>
+                        <span class="tabBox_pice">{{ '￥'+ val.product.cart_info.productAttr.price + ' x '+ val.product.product_num }}</span>
+                    </div>
+                </template>
+            </el-table-column>
+            <el-table-column prop="serviceScore" label="订单状态" min-width="250">
+                <template slot-scope="scope">
+                    <span style="display: block">{{ scope.row.status | orderRefundFilter }}</span>
+                    <span style="display: block">退款原因：{{ scope.row.refund_message }}</span>
+                    <!--<p>备注说明：{{scope.row.mark}}</p>-->
+                    <span style="display: block">状态变更时间：{{ scope.row.status_time }}</span>
+                    <!--<p>备注凭证：{{}}</p>-->
+                </template>
+            </el-table-column>
+            <el-table-column v-if="$route.params.type === '1'" key="10" label="操作" min-width="80" fixed="right" align="center">
+
+                <template slot-scope="scope">
+                    <el-button type="text" size="small" @click="onOrderMark(scope.row.refund_order_id)">订单备注</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+        <div class="block">
+            <el-pagination :page-sizes="[10, 20, 30, 40]" :page-size="tableFrom.limit" :current-page="tableFrom.page" layout="total, sizes, prev, pager, next, jumper" :total="tableDataRefund.total" @size-change="handleSizeChangeRefund" @current-change="pageChangeRefund" />
+        </div>
+    </el-card>
+</div>
+</template>
+
+<script>
+
+import {
+    merOrderListApi,
+    refundOrderListApi,
+    orderMarkApi,
+    refundMarkApi,
+    reconciliationApi
+} from '@/api/merchant'
+import {
+    reconciliationOrderApi,
+    reconciliationRefundApi
+} from '@/api/accounts'
+import {
+    roterPre
+} from '@/settings'
+export default {
+    name: 'Record',
+    data() {
+        return {
+            roterPre: roterPre,
+            chkName: '',
+            chkNameRefund: '',
+            isIndeterminate: true,
+            resource: [],
+            visible: false,
+            timeVal: [],
+            pickerOptions: {
+                shortcuts: [{
+                    text: '最近一周',
+                    onClick(picker) {
+                        const end = new Date()
+                        const start = new Date()
+                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
+                        picker.$emit('pick', [start, end])
+                    }
+                }, {
+                    text: '最近一个月',
+                    onClick(picker) {
+                        const end = new Date()
+                        const start = new Date()
+                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
+                        picker.$emit('pick', [start, end])
+                    }
+                }, {
+                    text: '最近三个月',
+                    onClick(picker) {
+                        const end = new Date()
+                        const start = new Date()
+                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
+                        picker.$emit('pick', [start, end])
+                    }
+                }]
+            },
+            listLoading: true,
+            tableData: {
+                data: [],
+                total: 0
+            },
+            tableDataRefund: {
+                data: [],
+                total: 0
+            },
+            tableFrom: {
+                page: 1,
+                limit: 10,
+                date: '',
+                status: ''
+            },
+            ids: [],
+            idsRefund: [],
+            checkedPage: [],
+            checkedIds: [], // 订单当前页选中的数据
+            noChecked: [], // 订单全选状态下当前页不选中的数据
+            refundCheckedIds: [], // 退款单当前页选中的数据
+            refundNoChecked: [] // 退款单全选状态下当前页不选中的数据
+        }
+    },
+    mounted() {
+        this.init()
+    },
+    created() {
+        this.tempRoute = Object.assign({}, this.$route)
+    },
+    methods: {
+        isDisabled(row) {
+            if (row.status !== 3) {
+                return false
+            }
+            return true
+        },
+        init() {
+            this.tableFrom.page = 1
+            this.getList()
+            this.getRefundList()
+            if (this.$route.params.type === 0) {
+                this.setTagsViewTitle()
+            }
+        },
+        // 订单
+        onHandle(name) {
+            this.chkName = this.chkName === name ? '' : name
+            this.changeType(!(this.chkName === ''))
+        },
+        changeOne(v, order) {
+            if (v) {
+                if (this.chkName === 'duo') {
+                    const index = this.noChecked.indexOf(order.order_id)
+                    if (index > -1) this.noChecked.splice(index, 1)
+                } else {
+                    const index = this.checkedIds.indexOf(order.order_id)
+                    if (index === -1) this.checkedIds.push(order.order_id)
+                }
+            } else {
+                if (this.chkName === 'duo') {
+                    const index = this.noChecked.indexOf(order.order_id)
+                    if (index === -1) this.noChecked.push(order.order_id)
+                } else {
+                    const index = this.checkedIds.indexOf(order.order_id)
+                    if (index > -1) this.checkedIds.splice(index, 1)
+                }
+            }
+        },
+        changeType(v) {
+            if (v) {
+                if (!this.chkName) {
+                    this.chkName = 'dan'
+                }
+            } else {
+                this.chkName = ''
+            }
+            const index = this.checkedPage.indexOf(this.tableFrom.page)
+            if (this.chkName === 'dan') {
+                this.checkedPage.push(this.tableFrom.page)
+            } else if (index > -1) {
+                this.checkedPage.splice(index, 1)
+            }
+            this.syncCheckedId()
+        },
+        syncCheckedId() {
+            const ids = this.tableData.data.map(v => v.order_id)
+            if (this.chkName === 'duo') {
+                this.checkedIds = []
+            } else if (this.chkName === 'dan') {
+                ids.forEach(id => {
+                    const index = this.checkedIds.indexOf(id)
+                    if (index === -1) {
+                        this.checkedIds.push(id)
+                    }
+                })
+            } else {
+                ids.forEach(id => {
+                    const index = this.checkedIds.indexOf(id)
+                    if (index > -1) {
+                        this.checkedIds.splice(index, 1)
+                    }
+                })
+            }
+        },
+        // 退款订单
+        onHandleRefund(name) {
+            this.chkNameRefund = this.chkNameRefund === name ? '' : name
+            this.changeTypeRefund(!(this.chkNameRefund === ''))
+        },
+        changeOneRefund(v, order) {
+            if (v) {
+                if (this.chkNameRefund === 'duo') {
+                    const index = this.refundNoChecked.indexOf(order.refund_order_id)
+                    if (index > -1) this.refundNoChecked.splice(index, 1)
+                } else {
+                    const index = this.refundCheckedIds.indexOf(order.refund_order_id)
+                    if (index === -1) this.refundCheckedIds.push(order.refund_order_id)
+                }
+            } else {
+                if (this.chkNameRefund === 'duo') {
+                    const index = this.refundNoChecked.indexOf(order.refund_order_id)
+                    if (index === -1) this.refundNoChecked.push(order.refund_order_id)
+                } else {
+                    const index = this.refundCheckedIds.indexOf(order.refund_order_id)
+                    if (index > -1) this.refundCheckedIds.splice(index, 1)
+                }
+            }
+        },
+        changeTypeRefund(v) {
+            if (v) {
+                if (!this.chkNameRefund) {
+                    this.chkNameRefund = 'dan'
+                }
+            } else {
+                this.chkNameRefund = ''
+            }
+            const index = this.checkedPage.indexOf(this.tableFrom.page)
+            if (this.chkNameRefund === 'dan') {
+                this.checkedPage.push(this.tableFrom.page)
+            } else if (index > -1) {
+                this.checkedPage.splice(index, 1)
+            }
+            this.syncCheckedIdRefund()
+        },
+        syncCheckedIdRefund() {
+            const ids = this.tableDataRefund.data.map(v => v.refund_order_id)
+            if (this.chkNameRefund === 'duo') {
+                this.refundCheckedIds = []
+            } else if (this.chkNameRefund === 'dan') {
+                ids.forEach(id => {
+                    const index = this.refundCheckedIds.indexOf(id)
+                    if (index === -1) {
+                        this.refundCheckedIds.push(id)
+                    }
+                })
+            } else {
+                ids.forEach(id => {
+                    const index = this.refundCheckedIds.indexOf(id)
+                    if (index > -1) {
+                        this.refundCheckedIds.splice(index, 1)
+                    }
+                })
+            }
+        },
+        onAdd() {
+            // if (this.ids.length === 0 || this.idsRefund.length === 0) return this.$message.warning('请先选择对账单')
+            const datas = {
+                order_ids: this.checkedIds,
+                order_out_ids: this.noChecked,
+                order_type: this.chkName === 'duo' ? 1 : 0,
+                refund_order_ids: this.refundCheckedIds,
+                refund_out_ids: this.refundNoChecked,
+                refund_type: this.chkNameRefund === 'duo' ? 1 : 0,
+                date: this.tableFrom.date
+            }
+            this.$modalSure('发起商户对账吗').then(() => {
+                reconciliationApi(this.$route.params.id, datas, ).then(({
+                    message
+                }) => {
+                    this.$message.success(message)
+                    this.tableFrom.page = 1
+                    this.getList()
+                    this.getRefundList()
+                    this.chkName = ''
+                    this.chkNameRefund = ''
+                    this.refundCheckedIds = []
+                    this.checkedIds = []
+                    this.noChecked = []
+                    this.refundNoChecked = []
+                }).catch(({
+                    message
+                }) => {
+                    this.$message.error(message)
+                })
+            })
+        },
+        // 具体日期
+        onchangeTime(e) {
+            this.timeVal = e
+            this.tableFrom.date = this.timeVal ? this.timeVal.join('-') : ''
+            this.tableFrom.page = 1
+            this.getList()
+            this.getRefundList()
+        },
+        // 退款备注
+        onOrderMark(id) {
+            this.$modalForm(refundMarkApi(id)).then(() => this.getRefundList())
+        },
+        // 订单备注
+        addMark(id) {
+            this.$modalForm(orderMarkApi(id)).then(() => this.getList())
+        },
+        getTotalRefund(row) {
+            let sum = 0
+            for (let i = 0; i < row.length; i++) {
+                sum += row[i].product.cart_info.productAttr.price * row[i].refund_num
+            }
+            return sum
+        },
+        getTotal(row) {
+            let sum = 0
+            for (let i = 0; i < row.length; i++) {
+                sum += row[i].cart_info.productAttr.price * row[i].product_num
+            }
+            return sum
+        },
+        // 列表
+        getList() {
+            this.listLoading = true
+            this.$route.params.type === '1' ? merOrderListApi(this.$route.params.id, this.tableFrom).then(res => {
+                this.tableData.data = res.data.list
+                this.tableData.total = res.data.count
+                this.tableData.data.map((item) => {
+                    this.$set(item, {
+                        checked: false
+                    })
+                })
+                this.listLoading = false
+            }).catch(res => {
+                this.listLoading = false
+                this.$message.error(res.message)
+            }) : reconciliationOrderApi(this.$route.params.id, this.tableFrom).then(res => {
+                this.tableData.data = res.data.list
+                this.tableData.total = res.data.count
+                this.tableData.data.map((item) => {
+                    this.$set(item, {
+                        checked: false
+                    })
+                })
+                this.listLoading = false
+            }).catch(res => {
+                this.listLoading = false
+                this.$message.error(res.message)
+            })
+        },
+        pageChange(page) {
+            this.tableFrom.page = page
+            this.getList()
+        },
+        handleSizeChange(val) {
+            this.tableFrom.limit = val
+            this.chkName = ''
+            this.getList()
+        },
+        // 退款列表
+        getRefundList() {
+            this.listLoading = true
+            this.$route.params.type === '1' ? refundOrderListApi(this.$route.params.id, this.tableFrom).then(res => {
+                this.tableDataRefund.data = res.data.list
+                this.tableDataRefund.total = res.data.count
+                this.listLoading = false
+            }).catch(res => {
+                this.listLoading = false
+                this.$message.error(res.message)
+            }) : reconciliationRefundApi(this.$route.params.id, this.tableFrom).then(res => {
+                this.tableDataRefund.data = res.data.list
+                this.tableDataRefund.total = res.data.count
+                this.listLoading = false
+            }).catch(res => {
+                this.listLoading = false
+                this.$message.error(res.message)
+            })
+        },
+        pageChangeRefund(page) {
+            this.tableFrom.page = page
+            this.getRefundList()
+        },
+        handleSizeChangeRefund(val) {
+            this.tableFrom.limit = val
+            this.getRefundList()
+        },
+        setTagsViewTitle() {
+            const title = '查看订单'
+            const route = Object.assign({}, this.tempRoute, {
+                title: `${title}-${this.$route.params.id}`
+            })
+            this.$store.dispatch('tagsView/updateVisitedView', route)
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.spBlock {
+    cursor: pointer;
+}
+
+.check {
+    color: #00a2d4;
+}
+
+.tabPop {
+    /deep/ .el-popover {
+        width: 100px !important;
+    }
+}
+
+.fang {
+    display: inline-block;
+    position: relative;
+    border: 1px solid #DCDFE6;
+    border-radius: 2px;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    width: 14px;
+    height: 14px;
+    background-color: #fff;
+    z-index: 1;
+    -webkit-transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+    transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+}
+
+.el-table /deep/.DisabledSelection .cell .el-checkbox__inner {
+    margin-left: -30px;
+    position: relative;
+}
+
+.el-table /deep/.DisabledSelection .cell:before {
+    content: "全选";
+    position: absolute;
+    right: 11px;
+}
+
+.demo-table-expands {
+    /deep/ label {
+        width: 84px !important;
+        color: #99a9bf;
+    }
+}
+
+.selWidth {
+    width: 300px;
+}
+
+.el-dropdown-link {
+    cursor: pointer;
+    color: #409EFF;
+    font-size: 12px;
+}
+
+.el-icon-arrow-down {
+    font-size: 12px;
+}
+
+.tabBox_tit {
+    width: 60%;
+    font-size: 12px !important;
+    margin: 0 2px 0 10px;
+    letter-spacing: 1px;
+    padding: 5px 0;
+    box-sizing: border-box;
+}
+</style>