update: style

src/components/allCustomers/allCustomersList.vue

@@ -3,7 +3,7 @@
     <div class="header-nav">
       <nav-path :navpath="navpath"></nav-path>
     </div>
-    <div class="top-search-wrap">
+    <!-- <div class="top-search-wrap">
       <p class="label" style="margin-right: 61px;">客户类型</p>
       <el-checkbox-group v-model="customerType" class="flex-wrap" @change="onSearch">
         <el-checkbox label="notMember">非会员</el-checkbox>
@@ -12,7 +12,7 @@
         <el-checkbox label="wxOpenCarMember">微信会员</el-checkbox>
         <el-checkbox label="posMember">POS会员</el-checkbox>
       </el-checkbox-group>
-    </div>
+    </div> -->
     <div class="list-section-contain">
       <div class="contain-header">
         <div class="top-header">
@@ -28,8 +28,15 @@
         <div class="action-wrap">
           <div class="left">
             <el-input style="width:300px;" v-model="pageParam.phoneNameCard"
-              prefix-icon="el-icon-search" placeholder="输入客户姓名/昵称/手机号码" @keyup.enter.native="onSearch"
-              clearable></el-input>
+              prefix-icon="el-icon-search" placeholder="输入客户姓名/昵称/手机号码"
+              @keyup.enter.native="onSearch" clearable></el-input>
+            <el-select v-model="customerType" multiple placeholder="请选择" style="width: 300px;margin-left:10px;">
+              <el-option label="非会员" value="notMember" />
+              <el-option-group label="会员">
+                <el-option label="微信会员" value="wxOpenCarMember" />
+                <el-option label="POS会员" value="posMember" />
+              </el-option-group>
+            </el-select>
             <el-button type="text" @click="showSearch = !showSearch" class="senior-search">高级搜索<i
                 :class="showSearch ? 'el-icon-d-arrow-left' : 'el-icon-d-arrow-right'"></i>
             </el-button>
@@ -83,8 +90,9 @@
                 <span v-else-if="colum == 'grade'">{{ row.gradeName }}</span>
                 <!-- 状态 -->
                 <span v-else-if="colum == 'status'">
-                  <span title="取消关注公众号" v-if="row.status==0" style="margin-right: 6px;"><svg class="icon status-icon unfollow" aria-hidden="true"
-                     ><use xlink:href="#icon-weixinquguan"></use>
+                  <span title="取消关注公众号" v-if="row.status==0" style="margin-right: 6px;"><svg
+                      class="icon status-icon unfollow" aria-hidden="true">
+                      <use xlink:href="#icon-weixinquguan"></use>
                     </svg></span><i :title="row.status==1?'已关注公众号':'未关注公众号'" v-else
                     :class="['iconfont status-icon ',row.status==1?'icon-weixin1 follow':'icon-weixin1']"></i><i
                     :title="row.wxStatus==1?'已使用小程序':'未使用小程序'"

src/components/allCustomers/components/customermainstoreDialog.vue

@@ -12,9 +12,13 @@
           </el-select>
         </el-form-item>
         <el-form-item label="专属导购：" prop="mainClerkId">
-          <el-select v-model="form.mainClerkId" style="width: 386px">
-            <el-option v-for="item in clerkOptions" :key="item.clerkId" :label="item.clerkName"
-              :value="item.clerkId"></el-option>
+          <el-select v-model="form.mainClerkId" style="width: 386px"
+            popper-class="clerk-option-wrap">
+            <el-option v-for="item in clerkOptions" :key="item.clerkId" :value="item.clerkId"
+              :label="item.clerkName">
+              <p class="clerk-name">{{item.clerkName}}</p>
+              <p class="clerk-code">{{item.clerkCode}}</p>
+            </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="原因备注：" prop="remark">
@@ -147,8 +151,10 @@ export default {
       if (n) {
         const { memberId, mainStoreName, mainStoreId, mainClerkId } = this.obj;
         this.form = Object.assign({}, this.form, { memberId, mainStoreId, mainClerkId, mainStoreIdBak: mainStoreId });
-        this.getMainStoreCodeName(mainStoreName);
-        this.getClerckList(mainStoreId, true);
+        if (mainStoreId) {
+          this.getMainStoreCodeName(mainStoreName);
+          this.getClerckList(mainStoreId, true);
+        }
       }
     }
   }
@@ -165,4 +171,23 @@ export default {
 .customer-dailog .el-dialog__body {
   padding-bottom: 0;
 }
+.el-select-dropdown.clerk-option-wrap .el-select-dropdown__item {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  height: 57px;
+}
+.clerk-option-wrap {
+  color: #303133;
+  .clerk-name {
+    margin: 0 0 3px;
+    font-size: 14px;
+    line-height: 20px;
+  }
+  .clerk-code {
+    margin: 0;
+    font-size: 12px;
+    line-height: 17px;
+  }
+}
 </style>
\ No newline at end of file

src/components/allCustomers/customerDetail.less

@@ -182,7 +182,7 @@
       justify-content: flex-start;
       align-items: center;
       .flex-moudle-item {
-        width: 285px;
+        width: 400px;
         height: 224px;
         padding: 20px;
         background: #ffffff;
@@ -327,9 +327,9 @@
         display: flex;
         flex-direction: column;
         justify-content: space-between;
+        width: 300px;
         height: 224px;
         .flex-column-item {
-          width: 223px;
           height: 107px;
           padding: 20px;
           background: #ffffff;