From 2ee8676c4e52dcdd423889119462adfe03181194 Mon Sep 17 00:00:00 2001
From: yanran200730 <yanran200830@163.com>
Date: Mon, 8 Aug 2022 11:24:16 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppAnnounce/components/Detail.vue         | 67 ++++++++++++-------
 .../Announce/AppAnnounce/components/List.vue  | 52 ++++++++------
 2 files changed, 74 insertions(+), 45 deletions(-)

diff --git a/project/sass/apps/Announce/AppAnnounce/components/Detail.vue b/project/sass/apps/Announce/AppAnnounce/components/Detail.vue
index c3634670..5b1900c0 100644
--- a/project/sass/apps/Announce/AppAnnounce/components/Detail.vue
+++ b/project/sass/apps/Announce/AppAnnounce/components/Detail.vue
@@ -121,13 +121,14 @@
                     <el-radio-button size="small" label="1">已执行</el-radio-button>
                     <el-radio-button size="small" label="2">无法执行</el-radio-button>
                   </el-radio-group>
-                  <div class="userSelcet" placeholder="请选择创建人">
-                    <span v-if="search1.deptartId"><ai-open-data type="departmentName" :openid="search1.deptartId"></ai-open-data></span>
-                    <span v-else>请选择部门</span>
-                    <ai-user-get :instance="instance" @change="e => onUserChange(e, 'search1')" isChooseUnit :isMultiple="false" v-model="user1">
-                      <div class="select-btn">选择</div>
-                    </ai-user-get>
-                  </div>
+                  <ai-user-get :instance="instance" @change="e => onUserChange(e, 'search1')" isChooseUnit isStrictly :isMultiple="false" v-model="user1">
+                    <div class="userSelcet">
+                      <span style="color: #606266;" v-if="search1.deptartId"><ai-open-data type="departmentName" :openid="search1.deptartId"></ai-open-data></span>
+                      <span v-else>请选择部门</span>
+                      <i class="el-icon-arrow-up"  v-if="!search1.deptartId"></i>
+                      <i class="el-icon-circle-close" v-if="search1.deptartId" @click.stop="user1 = [], search1.deptartId = '', search1.current = 1, getMemberInfo()"></i>
+                    </div>
+                  </ai-user-get>
                 </div>
                 <el-button :type="isDisabled ? '' : 'primary'" :disabled="isDisabled" @click="sendMsg(0)" v-if="info.status === '4'">{{ isDisabled ? min + '分钟后可再次提醒' : '提醒成员发送' }}</el-button>
               </div>
@@ -190,13 +191,14 @@
                     <el-radio-button size="small" label="1">已送达</el-radio-button>
                     <el-radio-button size="small" label="2">无法送达</el-radio-button>
                   </el-radio-group>
-                  <div class="userSelcet" placeholder="请选择创建人">
-                    <span v-if="search2.deptartId"><ai-open-data type="departmentName" :openid="search2.deptartId"></ai-open-data></span>
-                    <span v-else>请选择部门</span>
-                    <ai-user-get :instance="instance"  @change="e => onUserChange(e, 'search2')" isChooseUnit :isMultiple="false" v-model="user2">
-                      <div class="select-btn">选择</div>
-                    </ai-user-get>
-                  </div>
+                  <ai-user-get :instance="instance" isStrictly @change="e => onUserChange(e, 'search2')" isChooseUnit :isMultiple="false" v-model="user2">
+                    <div class="userSelcet">
+                      <span style="color: #606266;" v-if="search2.deptartId"><ai-open-data type="departmentName" :openid="search2.deptartId"></ai-open-data></span>
+                      <span v-else>请选择部门</span>
+                      <i class="el-icon-arrow-up"  v-if="!search2.deptartId"></i>
+                      <i class="el-icon-circle-close" v-if="search2.deptartId" @click.stop="user2 = [], search2.deptartId = '', search2.current = 1, getGroupInfo()"></i>
+                    </div>
+                  </ai-user-get>
                 </div>
                 <el-button :type="isDisabled ? '' : 'primary'" :disabled="isDisabled"  @click="sendMsg(1)" v-if="info.status === '4'">{{ isDisabled ? min + '分钟后可再次提醒' : '提醒成员发送' }}</el-button>
               </div>
@@ -513,32 +515,45 @@
     .userSelcet {
       display: flex;
       align-items: center;
+      justify-content: space-between;
+      width: 215px;
       height: 32px;
       line-height: 32px;
       margin-left: 12px;
       border-radius: 4px;
       border: 1px solid #d0d4dc;
       overflow: hidden;
+      cursor: pointer;
+      transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
 
-      .select-btn {
-        width: 40px;
-        cursor: pointer;
+      &:hover {
+        border-color: #26f;
+      }
+
+      i {
+        display: flex;
+        position: relative;
+        align-items: center;
+        justify-content: center;
+        width: 30px;
+        height: 100%;
+        line-height: 32px;
+        font-size: 14px;
         text-align: center;
-        border-left: 1px solid #d0d4dc;
-        color: #666;
-        font-size: 12px;
+        color: #d0d4dc;
+        transform: rotateZ(180deg);
+      }
 
-        &:hover {
-          color: #2266FF;
-        }
+      .el-icon-circle-close:hover {
+        opacity: 0.6;
       }
 
       span {
-        width: 200px;
+        flex: 1;
         padding: 0 15px;
         font-size: 12px;
-        background: #F5F5F5;
-        color: #999;
+        // background: #F5F5F5;
+        color: #d0d4dc;
       }
     }
 
diff --git a/project/sass/apps/Announce/AppAnnounce/components/List.vue b/project/sass/apps/Announce/AppAnnounce/components/List.vue
index 646ad150..1661c8c0 100644
--- a/project/sass/apps/Announce/AppAnnounce/components/List.vue
+++ b/project/sass/apps/Announce/AppAnnounce/components/List.vue
@@ -33,13 +33,14 @@
             @change="search.current = 1, getList()"
             placeholder="选择群发结束日期">
           </el-date-picker>
-          <div class="userSelcet" placeholder="请选择创建人">
-            <span v-if="search.createUserId"><ai-open-data type="userName" :openid="search.createUserId"></ai-open-data></span>
-            <span v-else>创建人</span>
-            <ai-user-get isStrictly :instance="instance" @change="onUserChange" :isMultiple="false" v-model="user">
-              <div class="select-btn">选择</div>
-            </ai-user-get>
-          </div>
+          <ai-user-get :instance="instance" @change="onUserChange" :isMultiple="false" v-model="user">
+            <div class="userSelcet">
+              <span style="color: #606266;" v-if="search.createUserId"><ai-open-data type="userName" :openid="search.createUserId"></ai-open-data></span>
+              <span v-else>创建人</span>
+              <i class="el-icon-arrow-up"  v-if="!search.createUserId"></i>
+              <i class="el-icon-circle-close" v-if="search.createUserId" @click.stop="user = [], search.createUserId = '', search.current = 1, getList()"></i>
+            </div>
+          </ai-user-get>
         </template>
         <template slot="right">
           <el-input
@@ -252,31 +253,44 @@
     .userSelcet {
       display: flex;
       align-items: center;
+      justify-content: space-between;
+      width: 215px;
       height: 32px;
       line-height: 32px;
       border-radius: 4px;
       border: 1px solid #d0d4dc;
       overflow: hidden;
+      cursor: pointer;
+      transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
 
-      .select-btn {
-        width: 40px;
-        cursor: pointer;
+      &:hover {
+        border-color: #26f;
+      }
+
+      i {
+        display: flex;
+        position: relative;
+        align-items: center;
+        justify-content: center;
+        width: 30px;
+        height: 100%;
+        line-height: 32px;
+        font-size: 14px;
         text-align: center;
-        border-left: 1px solid #d0d4dc;
-        color: #666;
-        font-size: 12px;
+        color: #d0d4dc;
+        transform: rotateZ(180deg);
+      }
 
-        &:hover {
-          color: #2266FF;
-        }
+      .el-icon-circle-close:hover {
+        opacity: 0.6;
       }
 
       span {
-        width: 200px;
+        flex: 1;
         padding: 0 15px;
         font-size: 12px;
-        background: #F5F5F5;
-        color: #999;
+        // background: #F5F5F5;
+        color: #d0d4dc;
       }
     }
   }