From 7a9dff0999467e3b61a9064b04d7fb230877ea9d Mon Sep 17 00:00:00 2001
From: 22 <22@22.com>
Date: Mon, 1 Apr 2024 19:04:01 +0800
Subject: [PATCH] ..

---
 src/api/merchant.js                           |   3 +
 src/views/merchant/application/index.vue      |  29 +
 .../application/merApplicationDetail.vue      | 329 +++++++++++
 .../merchant/application/merEditForm.vue      | 511 ++++++++++++++++++
 src/views/merchant/application/merInfo.vue    | 429 +++++++++++++++
 vue.config.js                                 |   7 +
 6 files changed, 1308 insertions(+)
 create mode 100644 src/views/merchant/application/merApplicationDetail.vue
 create mode 100644 src/views/merchant/application/merEditForm.vue
 create mode 100644 src/views/merchant/application/merInfo.vue

diff --git a/src/api/merchant.js b/src/api/merchant.js
index 5b74093..896e11e 100644
--- a/src/api/merchant.js
+++ b/src/api/merchant.js
@@ -161,6 +161,9 @@ export function merchantLoginApi(mer_id) {
 export function intentionLstApi(data) {
   return request.get('merchant/intention/lst', data)
 }
+export function intentionDetailApi(mer_id) {
+  return request.get(`merchant/intention/detail/${mer_id}`)
+}
 /**
  * @description 申请管理 -- 备注
  */
diff --git a/src/views/merchant/application/index.vue b/src/views/merchant/application/index.vue
index 73e9e2c..c3ced15 100644
--- a/src/views/merchant/application/index.vue
+++ b/src/views/merchant/application/index.vue
@@ -127,6 +127,7 @@
               @click="onEdit(scope.row.mer_intention_id)"
               >备注</el-button
             >
+            <el-button type="text" size="small" @click="onDetails(scope.row.mer_intention_id)">详情</el-button>
             <el-button
               type="text"
               size="small"
@@ -148,6 +149,19 @@
         />
       </div>
     </el-card>
+
+    <!--商户详情-->
+    <mer-detail
+      ref="merDetail"
+      :merId="mer_id"
+      :merCateList="merCateList"
+      :storeType="storeType"
+      @closeDrawer="closeDrawer"
+      @changeDrawer="changeDrawer"
+      @getList="getList"
+      :drawer="drawer"
+    ></mer-detail>
+
   </div>
 </template>
 
@@ -169,11 +183,13 @@ import {
   getstoreTypeApi,
   getMerCateApi
 } from "@/api/merchant";
+import merDetail from './merApplicationDetail.vue';
 import { fromList, statusList } from "@/libs/constants.js";
 import { roterPre } from "@/settings";
 import timeOptions from '@/utils/timeOptions';
 export default {
   name: "MerchantApplication",
+  components: { merDetail },
   data() {
     return {
       props: {
@@ -204,6 +220,7 @@ export default {
       mer_id: this.$route.query.id ? this.$route.query.id : "",
       autoUpdate: true,
       timeVal: [],
+      drawer: false
     };
   },
   watch: {
@@ -252,6 +269,18 @@ export default {
           this.$message.error(res.message)
       })
     },
+    onDetails(id){
+      this.mer_id = id;
+      this.$refs.merDetail.isEdit = false;
+      this.$refs.merDetail.getInfo(id);
+      this.drawer = true;
+    },
+    changeDrawer(v) {
+      this.drawer = v;
+    },
+    closeDrawer() {
+      this.drawer = false;
+    },
     // 列表
     getList(num) {
       this.listLoading = true;
diff --git a/src/views/merchant/application/merApplicationDetail.vue b/src/views/merchant/application/merApplicationDetail.vue
new file mode 100644
index 0000000..6a5b5fe
--- /dev/null
+++ b/src/views/merchant/application/merApplicationDetail.vue
@@ -0,0 +1,329 @@
+<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
+              >
+            </div> -->
+          </div>
+          <ul class="list">
+            <li class="item">
+              <div class="title">联系人</div>
+              <div>{{merData.name}}</div>
+            </li>
+            <li class="item">
+              <div class="title">联系电话</div>
+              <div>{{ merData.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>
+        <!--详情-->
+        <merEditForm 
+          ref="editForm" 
+          :merId="merId" 
+          :merCateList="merCateList"
+          :storeType="storeType" 
+          :isAdd="isAdd" 
+          :merData="merData" 
+          @modifyCopy="modifyCopy" 
+          @success="editSuccess" 
+          v-if="isEdit || isAdd">
+        </merEditForm>
+        <mer-info ref="merInfo" :merData="merData" v-else-if="!isEdit && !isAdd"></mer-info>
+      </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>
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+import {
+  intentionDetailApi,
+} from '@/api/merchant';
+import merInfo from './merInfo';
+import merEditForm from './merEditForm';
+export default {
+  props: {
+    drawer: {
+      type: Boolean,
+      default: false,
+    },
+    merCateList: {
+      type: Array,
+      default: [],
+    },
+    storeType: {
+      type: Array,
+      default: [],
+    }
+  },
+  components: { merInfo, merEditForm },
+  data() {
+    return {
+      loading: true,
+      merId: '',
+      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.merInfo.activeName = 'detail';
+      }
+      this.$emit('closeDrawer');
+    },
+    getInfo(id) { 
+      this.merId = id
+      this.isAdd = false;
+      intentionDetailApi(id)
+        .then((res) => {
+          this.loading = false;
+          this.drawer = true;
+          this.merData = res.data;
+          if(!this.isEdit)this.$refs.merInfo.onOperateLog(this.merId);
+        })
+        .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.getInfo(this.merId);
+      })
+    },
+    cancelEdit() {
+      this.isEdit = false
+    },
+    // 编辑成功回调
+    editSuccess(){
+      if(this.isAdd){
+        this.handleClose();
+      }else{
+        this.isEdit = false;
+      }
+      this.$emit('getList')
+    },
+     //下拉
+    handleCommand() {
+      this.$emit('onPassword',this.merId);
+    },
+    saveInfo(){
+      this.$refs.editForm.onSubmit(this.merId);
+      setTimeout(()=>{
+        this.getInfo(this.merId);
+      },500)
+    },
+    submitInfo(){
+      this.$refs.editForm.handleCreate();
+    }
+  },
+};
+</script>
+
+
+
+
+<style lang="scss" scoped>
+.head {
+  padding: 20px 35px;
+  .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 8px;
+  border-bottom: 1px dashed #eeeeee;
+  .title {
+    padding-left: 10px;
+    border-left: 3px solid var(--prev-color-primary);
+    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;
+  }
+}
+::v-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/merchant/application/merEditForm.vue b/src/views/merchant/application/merEditForm.vue
new file mode 100644
index 0000000..b5df289
--- /dev/null
+++ b/src/views/merchant/application/merEditForm.vue
@@ -0,0 +1,511 @@
+<template>
+  <el-form
+    ref="merDataField"
+    size="small"
+    :rules="ruleValidate"
+    :model="merData"
+    label-width="120px"
+    @submit.native.prevent
+    >
+    <el-tabs v-loading="loading" type="border-card" v-model="activeName">
+      <el-tab-pane label="基本信息" name="detail">
+        <div class="section">
+          <div class="title">基础信息</div>
+          <el-row :gutter="24" class="mt20">
+            <el-col :span="12">
+              <el-form-item label="商户名称：" prop="mer_name">
+                <el-input
+                  size="small"
+                  v-model="merData.mer_name"
+                  placeholder="请填写商户名称"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="商户地址：" prop="mer_address">
+                <el-input
+                  size="small"
+                  v-model="merData.mer_address"
+                  placeholder="请填写详细地址"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="商户分类：" prop="category_id">
+               <el-select
+                  size="small"
+                  v-model="merData.category_id"
+                  placeholder="请选择"
+                  class="selWidth"
+                >
+                  <el-option
+                    v-for="item in merCateList"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                />
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="商户类型：" prop="is_trader">
+                <el-radio-group
+                  v-model="merData.is_trader"
+                >
+                  <el-radio :label="1" class="radio">自营</el-radio>
+                  <el-radio :label="0">非自营</el-radio>
+                </el-radio-group>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="店铺类型：" prop="type_id">
+                <el-select
+                  size="small"
+                  v-model="merData.type_id"
+                  placeholder="请选择"
+                  class="selWidth"
+                >
+                  <el-option
+                    v-for="item in storeType"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="推荐商户：" prop="is_best">
+                <el-switch
+                  v-model="merData.is_best"
+                  :active-value="1"
+                  :inactive-value="0"
+                  :width="50"
+                  active-text="是"
+                  inactive-text="否"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="排序：" prop="sort">
+                <el-input-number
+                  size="small"
+                  v-model="merData.sort"
+                  controls-position="right"
+                  placeholder="请输入排序"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="商户状态：" prop="status">
+                <el-switch
+                  v-model="merData.status"
+                  :active-value="1"
+                  :inactive-value="0"
+                  :width="55"
+                  active-text="开启"
+                  inactive-text="关闭"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="备注：" prop="mark">
+                <el-input
+                  type="textarea"
+                  size="small"
+                  v-model="merData.mark"
+                  placeholder="请填写备注"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="经营信息" name="operate">
+        <div class="section">
+          <div class="title">费用信息</div>
+          <el-row :gutter="24" class="mt20">
+            <el-col v-if="!isAdd" :span="24">
+              <el-form-item label="店铺保证金：" prop="ot_margin">
+                <span>{{merData.is_margin == 0 ? '无' : merData.ot_margin+'元'}}</span>
+              </el-form-item>
+            </el-col>
+            <el-col v-if="!isAdd && merData.is_margin != 0" :span="24">
+              <el-form-item label="保证金支付状态：">
+                <span>{{merData.is_margin == 1 ? '待缴' : merData.is_margin == 0 ? '无' : '已缴' }}</span>
+              </el-form-item>
+            </el-col>
+            <el-col v-if="!isAdd && merData.is_margin != 0" :span="24">
+              <el-form-item label="保证金余额：">
+                <span>{{merData.margin}}</span>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="手续费设置：" prop="commission_rate">
+                <el-switch
+                  v-model="merData.commission_switch"
+                  :active-value="1"
+                  :inactive-value="0"
+                  :width="55"
+                  active-text="开启"
+                  inactive-text="关闭"
+                />
+                <span v-if="merData.commission_switch">
+                  <el-input-number
+                    :min="0"
+                    v-model="merData.commission_rate"
+                    size="small"
+                    controls-position="right"
+                    placeholder="请输入手续费"
+                  />%
+                </span> 
+                <div class="info info-red">(注：此处如未设置手续费，系统会自动读取商户分类下对应手续费；此处已设置，则优先以此处设置为准)</div>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </div>
+        <div class="section">
+          <div class="title">审核信息</div>
+           <el-row :gutter="24" class="mt20">
+            <el-col :span="8">
+              <el-form-item label="商品审核：" prop="is_audit">
+                <el-switch
+                  v-model="merData.is_audit"
+                  :active-value="1"
+                  :inactive-value="0"
+                  :width="50"
+                  active-text="是"
+                  inactive-text="否"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="直播间审核：" prop="is_bro_room">
+                <el-switch
+                  v-model="merData.is_bro_room"
+                  :active-value="1"
+                  :inactive-value="0"
+                  :width="50"
+                  active-text="是"
+                  inactive-text="否"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="直播商品：" prop="is_bro_goods">
+                <el-switch
+                  v-model="merData.is_bro_goods"
+                  :active-value="1"
+                  :inactive-value="0"
+                  :width="50"
+                  active-text="是"
+                  inactive-text="否"
+                />
+              </el-form-item>
+            </el-col>
+           </el-row>
+        </div>
+        <div class="section">
+          <div class="title">其他信息</div>
+          <div class="mt20">
+            <el-row :gutter="24">
+              <el-col :span="12">
+                <el-form-item label="商户关键字：" prop="mer_keyword">
+                  <el-input
+                    size="small"
+                    v-model="merData.mer_keyword"
+                    placeholder="请填写商户关键字"
+                    class="selWidth"
+                  />
+                </el-form-item>
+              </el-col>
+           </el-row>
+           <el-row v-if="!isAdd" :gutter="24">
+            <el-col :span="12" style="position: relative;">
+              <el-form-item label="商品采集数：">
+                <el-input v-model="merData.copy_product_num" size="small" disabled ></el-input>
+                <el-button type="text" @click="modifyCopy" style="margin-left: 10px;position:absolute;right: -30px;">修改</el-button>
+              </el-form-item>
+            </el-col>
+           </el-row>
+          </div> 
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="账号信息" name="account">
+        <div class="section">
+          <div class="title">登录账号</div>
+           <el-row :gutter="24" class="mt20">
+            <el-col :span="12">
+              <el-form-item label="商户账号：" prop="mer_account">
+                <el-input
+                  type="text"
+                  size="small"
+                  v-model="merData.mer_account"
+                  :disabled="!isAdd"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="登陆密码：" prop="mer_password">
+                <el-input
+                  type="password"
+                  size="small"
+                  v-model="merData.mer_password"
+                  :disabled="!isAdd"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col v-if="!isAdd" :span="12">
+              <el-form-item label="联系人：" prop="real_name">
+                <el-input
+                  type="text"
+                  size="small"
+                  placeholder="请填写联系人"
+                  v-model="merData.real_name"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="联系电话：" prop="mer_phone">
+                <el-input
+                  size="small"
+                  placeholder="请填写联系电话"
+                  v-model="merData.mer_phone"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+           </el-row>
+        </div>
+        <div class="section">
+          <div class="title">财务帐号</div>
+           <el-row :gutter="24" class="mt20">
+            <el-col :span="12">
+              <el-form-item label="分账商户号：" prop="sub_mchid">
+                <el-input
+                  placeholder="请填写分账商户号"
+                  size="small"
+                  v-model="merData.sub_mchid"
+                  class="selWidth"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <div class="info-red" style="margin-left: 120px;">当开启自动分账时，每个子商户在微信后台的分账商户号，即特约子商户号</div>
+            </el-col>
+           </el-row>
+        </div>
+      </el-tab-pane>
+  </el-tabs>   
+</el-form>
+  
+</template>
+<script>
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+import { merchantUpdate, merchantCreate } from "@/api/merchant";
+export default {
+  props: {
+    merData: {
+      type: Object,
+      default: {},
+    },
+    isAdd: {
+      type: Boolean,
+      default: false,
+    },
+    merCateList: {
+      type: Array,
+      default: [],
+    },
+    storeType: {
+      type: Array,
+      default: [],
+    }
+  }, 
+  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,
+      merId: '',
+      direction: 'rtl',
+      activeName: 'detail',
+      ruleValidate: {
+        mer_name: [
+          { required: true, message: '请输入商户名称', trigger: 'blur' }
+        ],
+        mer_account: [
+          { required: true, message: '请输入商户账号', trigger: 'blur' }
+        ],
+        category_id: [
+          { required: true, message: '请选择商户分类', trigger: 'change' }
+        ],
+        type_id: [
+          { required: true, message: '请选择店铺类型', trigger: 'change' }
+        ],
+        mer_phone: [{ required: true, validator: validatePhone, trigger: 'blur' }],
+      },
+    };
+  },
+  filters: {
+  },
+  mounted() {  
+
+  },
+  methods: {
+
+    /**修改采集次数 */
+    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.mer_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>
+.el-tabs--border-card {
+  box-shadow: none;
+  border-bottom: none;
+}
+.section {
+  padding: 20px 0 8px;
+  border-bottom: 1px dashed #eeeeee;
+  .title {
+    padding-left: 10px;
+    border-left: 3px solid var(--prev-color-primary);
+    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;
+}
+::v-deep .el-input-number.is-controls-right .el-input__inner{
+ padding: 0 40px 0 10px;
+}
+::v-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;
+  }
+}
+::v-deep .el-drawer__body {
+  overflow: auto;
+}
+.gary {
+  color: #aaa;
+}
+
+</style>
+ 
\ No newline at end of file
diff --git a/src/views/merchant/application/merInfo.vue b/src/views/merchant/application/merInfo.vue
new file mode 100644
index 0000000..ed7149d
--- /dev/null
+++ b/src/views/merchant/application/merInfo.vue
@@ -0,0 +1,429 @@
+<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.category_name}}
+              </div>
+            </li>
+            <li class="item">
+              <div>店铺类型：</div>
+              <div class="value">{{merData.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.update_time}}</div>
+            </li>
+            <li class="item">
+              <div>备注：</div>
+              <div class="value">{{merData.mark}}</div>
+            </li>
+          </ul>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="企业信息" name="business">
+        <div class="section">
+          <ul class="list">
+            <li class="item">
+              <div>企业名称</div>
+              <div class="value">
+                {{merData.com.name}}
+              </div>
+            </li>  
+            <li class="item">
+              <div>企业类型</div>
+              <div class="value">
+                {{merData.com.type}}
+              </div>
+            </li>  
+            <li class="item">
+              <div>客服电话:</div>
+              <div class="value">
+                {{ merData.com.service}}
+              </div>
+            </li>
+            <li class="item">
+              <div>企业对接人姓名：</div>
+              <div class="value">
+                {{ merData.com.contact}}
+              </div>
+            </li>
+            <li class="item">
+              <div>企业对接人联系电话：</div>
+              <div class="value">
+                {{ merData.com.mobile}}
+              </div>
+            </li>
+            <li class="item">
+              <div>企业对接人编号:</div>
+              <div class="value">
+                {{ merData.com.number}}
+              </div>
+            </li>
+            <li class="item">
+              <div>发起人:</div>
+              <div class="value">
+                {{ merData.com.initiator}}
+              </div>
+            </li>
+            <li class="item">
+              <div>发起人电话:</div>
+              <div class="value">
+                {{ merData.com.inti_mobile}}
+              </div>
+            </li>
+            <li class="item item100">
+              <div>发起人编号:</div>
+              <div class="value">
+                {{ merData.com.inti_number}}
+              </div>
+            </li>
+            <li class="item item100">
+              <div>发起人手持介绍信照片:</div>
+              <div class="value">
+                <el-image v-for="(url,i) in  merData.com.init_image"
+                  :key="i"
+                  style="width: 100px; height: 100px"
+                  :src="url" 
+                  :preview-src-list="merData.com.init_image">
+                </el-image>
+              </div>
+            </li>
+            <li class="item item100">
+              <div>是否惠美乡村店铺:</div>
+              <div class="value">
+                {{ merData.com.is_huimei? '是': '否'}}
+              </div>
+            </li>
+            <li class="item item100">
+              <div>惠美乡村红头文件:</div>
+              <div class="value">
+                <el-image v-for="(url,i) in  merData.com.image_huimei"
+                  :key="i"
+                  style="width: 100px; height: 100px"
+                  :src="url" 
+                  :preview-src-list="merData.com.image_huimei">
+                </el-image>
+              </div>
+            </li>
+            <li class="item item100">
+              <div>是否退伍军人:</div>
+              <div class="value">
+                {{ merData.com.is_soldier? '是': '否'}}
+              </div>
+            </li>
+            <li class="item item100">
+              <div>退伍军人证件照:</div>
+              <div class="value">
+                <el-image v-for="(url,i) in  merData.com.image_soldier"
+                  :key="i"
+                  style="width: 100px; height: 100px"
+                  :src="url" 
+                  :preview-src-list="merData.com.image_soldier">
+                </el-image>
+              </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">
+                <el-image
+                  style="width: 100px; height: 100px"
+                  :src="merData.idcard.image1" 
+                  :preview-src-list="[merData.idcard.image1]">
+                </el-image>
+              </div>
+            </li>
+            <li class="item">
+              <div>身份证反面：</div>
+              <div class="value">
+                <el-image
+                  style="width: 100px; height: 100px"
+                  :src="merData.idcard.image2" 
+                  :preview-src-list="[merData.idcard.image2]">
+                </el-image>
+              </div>
+            </li>
+            <li class="item">
+              <div>身份证上的名字：</div>
+              <div class="value">{{merData.idcard.name}}</div>
+            </li>
+            <li class="item">
+              <div>身份证上的号码：</div>
+              <div class="value">{{merData.idcard.number}}</div>
+            </li>
+            <li class="item">
+              <div>身份证上的开始时间：</div>
+              <div class="value">{{merData.idcard.start}}</div>
+            </li>
+            <li class="item">
+              <div>身份证结束时间：</div>
+              <div class="value">{{merData.idcard.end}}</div>
+            </li>
+          </ul>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="营业执照信息" name="biz">
+        <div class="section">
+          <div class="title">营业执照信息</div>
+          <ul class="list">
+            <li class="item">
+              <div>营业执照照片：</div>
+              <div class="value">
+                <el-image v-for="(url,i) in  merData.biz.image"
+                  :key="i"
+                  style="width: 100px; height: 100px"
+                  :src="url" 
+                  :preview-src-list="merData.biz.image">
+                </el-image>
+              </div>
+            </li>
+            <li class="item">
+              <div>营业执照号码：</div>
+              <div class="value">{{merData.biz.number}}</div>
+            </li>
+            <li class="item">
+              <div>开始时间：</div>
+              <div class="value">{{merData.biz.start}}</div>
+            </li>
+            <li class="item">
+              <div>结束时间：</div>
+              <div class="value">{{merData.biz.end}}</div>
+            </li>
+            <li class="item">
+              <div>营业执照地址：</div>
+              <div class="value">{{merData.biz.address}}</div>
+            </li>
+            <li class="item">
+              <div>实际经营地址：</div>
+              <div class="value">{{merData.biz.address_true}}</div>
+            </li>
+          </ul>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="银行卡信息" name="bank">
+        <div class="section">
+          <div class="title">银行卡信息</div>
+          <ul class="list">
+            <li class="item">
+              <div>姓名：</div>
+              <div class="value">
+                {{merData.bank.bankCardUserName}}
+              </div>
+            </li>
+            <li class="item">
+              <div>银行：</div>
+              <div class="value">{{merData.bank.bankName}}</div>
+            </li>
+            <li class="item">
+              <div>卡号：</div>
+              <div class="value">{{merData.bank.bankCard}}</div>
+            </li>
+            <li class="item">
+              <div>开户行：</div>
+              <div class="value">{{merData.bank.bankBranchName}}</div>
+            </li>
+            <li class="item">
+              <div>营业执照地址：</div>
+              <div class="value">
+                <el-image v-for="(url,i) in  merData.bank.bankCardImg"
+                  :key="i"
+                  style="width: 100px; height: 100px"
+                  :src="url" 
+                  :preview-src-list="merData.bank.bankCardImg">
+                </el-image>
+              </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>
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+import { merchantOperateLog } from "@/api/merchant";
+export default {
+  props: {
+    merData: {
+      type: Object,
+      default: {},
+    },
+  },
+  data() {
+    return {
+      loading: true,
+      merId: '',
+      direction: 'rtl',
+      activeName: 'detail',
+      timeVal: [],
+      tableDataLog: {
+        data: [],
+        total: 0
+      },
+      tableFromLog: {
+        user_type: '',
+        date: [],
+        page: 1,
+        limit: 10
+      },
+    };
+  },
+  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);
+      });
+    },
+    // 具体日期
+    onchangeTime(e) {
+      this.timeVal = e
+      this.tableFromLog.date = e ? this.timeVal.join('-') : ''
+      this.onOperateLog(this.merId)
+    },
+    onOperateLog(id){
+      this.merId = id;
+      merchantOperateLog(id, this.tableFromLog).then((res) => {
+        this.tableDataLog.data = res.data.list
+        this.tableDataLog.total = res.data.count
+      });
+    },
+    pageChangeLog(page) {
+      this.tableFromLog.page = page
+      this.onOperateLog(this.merId)
+    },
+    handleSizeChangeLog(val) {
+      this.tableFromLog.limit = val
+      this.onOperateLog(this.merId)
+    },
+    operationType(type) {
+      if (type == 0) {
+        return '系统';
+      } else if (type == 1) {
+        return '用户';
+      } else if (type == 2) {
+        return '平台';
+      } else if (type == 3) {
+        return '商户';
+      } else if (type == 4) {
+        return '商家客服';
+      } else {
+        return '未知';
+      }
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.el-tabs--border-card {
+  box-shadow: none;
+  border-bottom: none;
+}
+.section {
+  padding: 20px 0 8px;
+  border-bottom: 1px dashed #eeeeee;
+  .title {
+    padding-left: 10px;
+    border-left: 3px solid var(--prev-color-primary);
+    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;
+  }
+}
+::v-deep .el-drawer__body {
+  overflow: auto;
+}
+.gary {
+  color: #aaa;
+}
+
+</style>
diff --git a/vue.config.js b/vue.config.js
index 6138b33..dd9aec7 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -38,6 +38,13 @@ module.exports = {
       errors: true
     },
     before: require('./mock/mock-server.js')
+    // proxy: {
+    //   '/api': {             //接口地址 以 api开头的都走下面的配置
+    //     target: 'http://192.168.1.224:8324',    //代理目标地址为后端服务器地址
+    //     ws: true,                           //是否支持 websocket 请求 支持
+    //     changeOrigin: true,                   //是否启用跨域 
+    //   }
+    // }
   },
   configureWebpack: {
     // provide the app's title in webpack's name field, so that