Signed-off-by: 李妹妹 <1639016684@qq.com>

src/views/live/live/index.vue

@@ -159,10 +159,10 @@
       </el-table-column>
       <el-table-column label="直播状态" align="center" prop="status">
         <template slot-scope="scope">
-          <el-tag v-if="scope.row.status == 1">待直播</el-tag>
-          <el-tag v-if="scope.row.status == 2">直播中</el-tag>
-          <el-tag v-if="scope.row.status == 3">已结束</el-tag>
-          <el-tag v-if="scope.row.status == 4">直播回放中</el-tag>
+          <el-tag type="warning" v-if="scope.row.status == 1">待直播</el-tag>
+          <el-tag style="color:#3491FA;background-color:#E8F7FF;border-color: #E8F7FF;" v-if="scope.row.status == 2">直播中</el-tag>
+          <el-tag type="info" v-if="scope.row.status == 3">已结束</el-tag>
+          <el-tag style="color:#9B6DDA;background-color:#F5E8FF;border-color: #F5E8FF;" v-if="scope.row.status == 4">直播回放中</el-tag>
         </template>
       </el-table-column>
       <el-table-column label="公司名称" align="center" prop="companyName" >
@@ -183,7 +183,7 @@
       <el-table-column label="上下架" align="center" prop="isShow">
         <template slot-scope="scope">
           <el-tag v-if="scope.row.isShow == 1">上架</el-tag>
-          <el-tag type="danger" v-if="scope.row.isShow == 2">下架</el-tag>
+          <el-tag type="info" v-if="scope.row.isShow == 2">下架</el-tag>
         </template>
       </el-table-column>
       <el-table-column label="审核状态" align="center" prop="isAudit">

src/views/live/liveAfteraSales/index.vue

@@ -3,7 +3,7 @@
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
 
       <el-form-item label="所属部门" prop="deptId">
-        <treeselect style="width:220px" v-model="queryParams.deptId" :options="deptOptions" :show-count="true" placeholder="请选择所属部门" />
+        <treeselect style="width:220px;" v-model="queryParams.deptId" :options="deptOptions" :show-count="true" placeholder="请选择所属部门" />
       </el-form-item>
 
       <el-form-item label="订单单号" prop="orderCode">
@@ -24,7 +24,7 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="会员手机号" prop="userPhone">
+      <el-form-item label="会员手机" prop="userPhone">
         <el-input
           v-model="queryParams.userPhone"
           placeholder="请输入手机号"
@@ -33,9 +33,6 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-
-
-
       <el-form-item label="退款类型" prop="refundType">
         <el-select  v-model="queryParams.refundType" placeholder="请选择退款类型" clearable size="small" >
           <el-option
@@ -78,15 +75,56 @@
           />
         </el-select>
       </el-form-item>
+ <el-form-item style="margin-left: 20px;">
+             <el-button type="text"  :icon="isCollapsed ? 'el-icon-arrow-down' : 'el-icon-arrow-up'"  @click="upDown">{{ isCollapsed ? '展开' : '收起' }} </el-button>
+             <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+             <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+           </el-form-item>
+     <div v-if="!isCollapsed">
+<el-form-item label="客户退回" prop="searchKey">
+  <div class="filter-combobox">
+    <el-select
+        slot="prepend"
+        v-model="searchType"
+        placeholder="请选择"
+        clearable
+        @change="handleTypeChange"
+        style="width: 105px"
+      >
+        <el-option label="物流状态" value="deliveryStatus" />
+        <el-option label="物流单号" value="deliverySn" />
+      </el-select>
+      <el-select v-if="searchType=='deliveryStatus'"  style="flex: 1;"
+      v-model="queryParams.deliveryStatus" placeholder="请选择物流状态" clearable size="small" >
+          <el-option
+            v-for="item in deliveryStatusOptions"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+            />
+        </el-select>
+      <el-input
+      v-if="searchType=='deliverySn'|| searchType==''"  style="flex: 1;"
+        v-model.trim="searchKey"
+        :placeholder="searchType=='deliverySn'?'物流/退回物流单号':''"
+        clearable
+        size="small"
+        @keyup.enter.native="handleQuery"
+        @clear="handleQuery"
+      >
+      </el-input>
+
+    </div>
+</el-form-item>
+<!-- <el-form-item label="客户退回物流状态" prop="deliveryStatus">
 
-      <el-form-item label="客户退回物流状态" prop="deliveryStatus">
         <el-select   v-model="queryParams.deliveryStatus" placeholder="请选择物流状态" clearable size="small" >
           <el-option
             v-for="item in deliveryStatusOptions"
             :key="item.dictValue"
             :label="item.dictLabel"
             :value="item.dictValue"
-          />
+            />
         </el-select>
       </el-form-item>
 
@@ -97,8 +135,7 @@
           clearable
           size="small"
           @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-
+      </el-form-item> -->
 
       <el-form-item label="提交时间" prop="createTime">
         <el-date-picker
@@ -111,10 +148,8 @@
           end-placeholder="结束日期">
         </el-date-picker>
       </el-form-item>
-      <el-form-item>
-        <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
+      </div>
+
     </el-form>
 
     <el-row :gutter="10" class="mb8">
@@ -219,6 +254,9 @@ export default {
   components: {productAfterSalesOrder, Treeselect},
   data() {
     return {
+      searchType:'',
+      searchKey:'',
+      isCollapsed:false,
       dateRange:[],
       // 遮罩层
       loading: true,
@@ -322,6 +360,7 @@ export default {
         this.liveAfterSalesList = response.rows;
         this.total = response.total;
         this.loading = false;
+        delete this.queryParams[this.searchType];
       });
     },
     // 取消按钮
@@ -359,13 +398,25 @@ export default {
       };
       this.resetForm("form");
     },
+    upDown() {
+         this.isCollapsed = !this.isCollapsed;
+       },
+    handleTypeChange(newType){
+      this.searchKey='';
+      this.searchType=newType
+    },
     /** 搜索按钮操作 */
     handleQuery() {
+      if(this.searchKey!=='' && this.searchType=='deliverySn'){
+       this.queryParams[this.searchType]=this.searchKey
+      }
       this.queryParams.pageNum = 1;
       this.getList();
     },
     /** 重置按钮操作 */
     resetQuery() {
+      this.searchKey= '';
+      this.queryParams[this.searchType]=null;
       this.resetForm("queryForm");
       this.handleQuery();
     },
@@ -465,3 +516,25 @@ export default {
   }
 };
 </script>
+<style scoped>
+ .filter-combobox {
+   display: flex;
+   align-items: flex-start;
+   width: 100%;
+ }
+ .filter-combobox ::v-deep .el-input--medium .el-input__inner{
+   height: 32px !important;
+   line-height: 32px;
+}
+.filter-combobox ::v-deep.el-input__icon{
+   height: 32px !important;
+line-height: 32px;
+}
+::v-deep .vue-treeselect__control{
+  height: 30px !important;
+  line-height: 30px;
+}
+::v-deep .vue-treeselect__placeholder{
+  line-height: 32px;
+}
+</style>

src/views/live/liveConfig/index.vue

@@ -33,11 +33,20 @@
 
           <div class="live-info-state">
             <div class="info-state-text live-time">直播时间：{{ liveInfo.startTime }} 至 {{ liveInfo.finishTime }}</div>
-            <div class="line"></div>
-            <div class="info-state-text live-state">{{ liveInfo.status == 3 ? '已结束' : liveInfo.status == 2 ? '直播中' : '未开始'}}</div>
-            <div class="line"></div>
-            <div class="info-state-text live-active-state">{{ liveInfo.isShow == 1 ? '上架' : '下架' }}</div>
-            <div class="line"></div>
+          </div>
+          <div class="live-info-state">
+            <!-- <div class="info-state-text live-state">
+            {{ liveInfo.status == 3 ? '已结束' : liveInfo.status == 2 ? '直播中' : '未开始'}}
+            </div> -->
+            <el-tag type="warning" v-if="liveInfo.status == 1">待直播</el-tag>
+            <el-tag style="color:#3491FA;background-color:#E8F7FF;border-color: #E8F7FF;" v-if="liveInfo.status == 2">直播中</el-tag>
+            <el-tag type="info" v-if="liveInfo.status == 3">已结束</el-tag>
+            <el-tag style="color:#9B6DDA;background-color:#F5E8FF;border-color: #F5E8FF;" v-if="liveInfo.status == 4">直播回放中</el-tag>
+            <div class="info-state-text live-active-state" style="margin-left: 5px;">
+            <el-tag v-if="liveInfo.isShow == 1">上架</el-tag>
+            <el-tag type="info" v-if="liveInfo.isShow == 2">下架</el-tag>
+            </div>
+
           </div>
         </div>
 
@@ -71,8 +80,9 @@
       <div class="container">
       <!-- 左边菜单 -->
         <div class="left-menu">
-          <el-menu default-active="1" class="el-menu-vertical-demo" @select="handleSelect">
+          <el-menu default-active="watchReward" class="el-menu-vertical-demo" @select="handleSelect">
             <el-menu-item :index="item.index" v-for="item in menuList" >
+              <i :class="item.icon"></i>
               <span>{{item.name}}</span>
             </el-menu-item>
           </el-menu>
@@ -135,18 +145,18 @@ export default {
       liveInfo: {},
       currentComponent: WatchReward,
       menuList:[
-        { name: '观看奖励', label: '观看奖励', index: 'watchReward'},
-        { name: '直播预告', label: '直播预告', index: 'preview'},
-        { name: '红包配置', label: '红包配置', index: 'liveRedConf'},
-        { name: '抽奖配置', label: '抽奖配置', index: 'liveLotteryConf'},
-        { name: '优惠券配置', label: '优惠券配置', index: 'liveCoupon'},
+        { name: '观看奖励', label: '观看奖励', index: 'watchReward',icon:'el-icon-coin'},
+        { name: '直播预告', label: '直播预告', index: 'preview',icon:'el-icon-video-play'},
+        { name: '红包配置', label: '红包配置', index: 'liveRedConf',icon:'el-icon-money'},
+        { name: '抽奖配置', label: '抽奖配置', index: 'liveLotteryConf',icon:'el-icon-present'},
+        { name: '优惠券配置', label: '优惠券配置', index: 'liveCoupon',icon:'el-icon-discount'},
         // { name: '答题', label: '答题', index: 'answer'},
-        { name: '直播商品', label: '直播商品', index: 'goods'},
-        { name: '回放设置', label: '回放设置', index: 'liveReplay'},
+        { name: '直播商品', label: '直播商品', index: 'goods',icon:'el-icon-shopping-bag-2'},
+        { name: '回放设置', label: '回放设置', index: 'liveReplay',icon:'el-icon-set-up'},
         // { name: '观看积分', label: '观看积分', index: 'watchScore'},
-        { name: '运营自动化', label: '运营自动化', index: 'task'},
-        { name: '弹幕脚本', label: '弹幕脚本', index: 'barrage'},
-        { name: '身份认证', label: '身份认证', index: 'idCard'},
+        { name: '运营自动化', label: '运营自动化', index: 'task',icon:'el-icon-coordinate'},
+        { name: '弹幕脚本', label: '弹幕脚本', index: 'barrage',icon:'el-icon-chat-dot-round'},
+        { name: '身份认证', label: '身份认证', index: 'idCard',icon:'el-icon-postcard'},
       ],
 
     }
@@ -184,7 +194,7 @@ export default {
 }
 
 .header-left-area {
-  flex: 0 0 120px;
+  flex: 0 0 100px;
   position: relative;
 }
 
@@ -204,7 +214,7 @@ export default {
 }
 
 .live-info-title .title-text {
-  font-size: 20px;
+  font-size: 18px;
   font-weight: 500;
   color: #303133;
 }
@@ -213,6 +223,7 @@ export default {
   display: flex;
   align-items: center;
   margin-top: 10px;
+  color: #999999;
 }
 
 .live-info-desc .line {
@@ -247,7 +258,7 @@ export default {
 
 .info-state-text {
   font-size: 14px;
-  color: #606266;
+  color: #999999;
 }
 
 .operation-wrapper {
@@ -284,7 +295,13 @@ export default {
   border-right: 1px solid #e4e7ed;
   flex-shrink: 0; /* 不收缩 */
 }
-
+.el-menu-item{
+  margin-right: 20px;
+}
+.el-menu-item.is-active,.el-menu-item:hover{
+  background-color: rgba(19,194,194,0.1);
+  border-radius: 8px 8px 8px 8px;
+}
 .right-info {
   flex: 1;
   padding: 20px;

src/views/live/liveConfig/watchReward.vue

@@ -314,8 +314,8 @@ export default {
 
 /* 开关容器样式 */
 .reward-switch {
-  margin-left: 200px;
-  margin-bottom: 20px;
+
+ /* margin-bottom: 20px; */
   padding: 20px;
   background-color: #fff;
   border-radius: 4px;

src/views/live/liveConsole/index.vue

@@ -6,31 +6,37 @@
       <el-tabs class="live-console-tab-left" v-model="tabRight.activeName" @tab-click="handleClick" :stretch="true">
         <el-tab-pane label="讨论" name="talk">
           <el-scrollbar style="height: 500px; width: 100%;" ref="manageRightRef">
-            <el-row v-for="m in msgList" >
-              <el-row v-if="m.userId !== userId" style="margin-top: 5px" type="flex" align="top" >
-                <el-col :span="3" style="margin-left: 10px"><el-avatar :src="m.avatar"/></el-col>
-                <el-col :span="15">
-                  <el-row style="margin-left: 10px">
-                    <el-col><div style="font-size: 12px; color: #999; margin-bottom: 3px;">{{ m.nickName }}</div></el-col>
-                    <el-col :span="24" style="max-width: 200px;">
-                      <div style="white-space: normal; word-wrap: break-word;background-color: #f0f2f5; padding: 8px; border-radius: 5px;font-size: 14px;width: 100%;">
-                        {{ m.msg }}
-                      </div>
-                    </el-col>
-                    <el-col>
-                      <a style="cursor: pointer;color: #ff0000;padding: 8px 8px 0 0;font-size: 12px;" @click="changeUserState(m)">{{ m.msgStatus === 1 ? '解禁' : '禁言' }}</a>
-                      <a style="cursor: pointer;color: #ff0000;padding: 8px 8px 0 0;font-size: 12px;" @click="blockUser(m)">拉黑</a>
-                    </el-col>
-                  </el-row>
+            <el-row v-for="m in msgList" style="margin-bottom: 20px;">
+              <el-row v-if="m.userId !== userId" type="flex" align="top" >
+                <el-col :span="24" style="display: flex; align-items: center;">
+                  <el-avatar style="width: 36px;height: 36px;" :src="m.avatar!==null?m.avatar: require('@/assets/image/default-a.png')"/>
+                   <div style="font-size: 14px; color: #999;margin: 0 12px;">{{ m.nickName }}</div>
+                   <div style="display: flex; align-items: center; gap: 8px;">
+                     <a style="cursor: pointer;color: #13C2C2;font-size: 14px;" @click="changeUserState(m)">{{ m.msgStatus === 1 ? '解禁' : '禁言' }}</a>
+                     <span style="color:#13C2C2;">|</span>
+                     <a style="cursor: pointer;color: #13C2C2;font-size: 14px;" @click="blockUser(m)">拉黑</a>
+                   </div>
+                  </el-col>
+              </el-row>
+              <el-row v-if="m.userId !== userId" type="flex" align="top">
+                <el-col :span="19" :offset="3">
+                  <div class="msg-box">
+                    {{ m.msg }}
+                  </div>
                 </el-col>
               </el-row>
-              <el-row v-if="m.userId === userId" style="padding: 8px 0" type="flex" align="top" justify="end">
+              <el-row v-if="m.userId === userId" style="padding: 8px 0;margin-right: 10px;" type="flex" align="top" justify="end">
                 <div style="display: flex;justify-content: flex-end">
                   <div style="display: flex;justify-content: flex-end;flex-direction: column;max-width: 200px;align-items: flex-end">
-                    <div style="font-size: 12px; color: #999; margin-bottom: 3px;">{{ m.nickName }}</div>
-                    <div style="white-space: normal; word-wrap: break-word;width: 100%; background-color: #e6f7ff; padding: 8px; border-radius: 5px;font-size: 14px;">{{ m.msg }}</div>
+                    <div style="display: flex;align-items: center;">
+                      <div style="font-size: 14px; color: #999;margin-right: 12px;">{{ m.nickName }}</div>
+                       <el-avatar :src="m.avatar?m.avatar: require('@/assets/image/default-a.png')" style="width: 36px;height: 36px;"/>
+                    </div>
+
+                   <div class="msg-box-right">
+                   {{ m.msg }}</div>
                   </div>
-                  <el-avatar :src="m.avatar" style="margin-left: 10px; margin-right: 10px;"/>
+
                 </div>
               </el-row>
             </el-row>
@@ -39,7 +45,7 @@
           </el-scrollbar>
 
           <!-- 消息输入区域 -->
-          <div style="padding: 10px; border-top: 1px solid #ebeef5; background-color: #fff; min-height: 120px;">
+          <div class="shuru" style="padding: 20px; border-top: 1px solid #ebeef5; background-color: #fff; min-height: 120px;">
             <el-input
               type="textarea"
               v-model="newMsg"
@@ -52,7 +58,7 @@
             >
             </el-input>
             <div style="display: flex; justify-content: flex-end; margin-top: 10px;">
-              <el-button plain @click="sendMessage">发送</el-button>
+              <el-button style="background: #13C2C2;color: #fff;" @click="sendMessage">发送</el-button>
             </div>
           </div>
         </el-tab-pane>
@@ -131,31 +137,36 @@
       </div>
       <!-- 底部导航栏 -->
       <div style="display: flex; justify-content: space-around; padding: 15px 0; background: #fff; border-top: 1px solid #f0f0f0;">
-        <div style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickRed">
-          <i class="el-icon-money" style="font-size: 20px;"></i>
-          <span style="font-size: 12px; margin-top: 4px;">红包配置</span>
+        <div class="top-box" style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickRed">
+          <!-- <i class="el-icon-money" style="font-size: 20px;"></i> -->
+          <img src="@/assets/image/hbpz.png" width="48"/>
+          <span style="font-size: 12px; margin-top: 10px;">红包配置</span>
         </div>
-        <div style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickLottery">
-          <i class="el-icon-present" style="font-size: 20px;"></i>
-          <span style="font-size: 12px; margin-top: 4px;">抽奖配置</span>
+        <div class="top-box" style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickLottery">
+          <!-- <i class="el-icon-present" style="font-size: 20px;"></i> -->
+          <img src="@/assets/image/cjpz.png" width="48"/>
+          <span style="font-size: 12px; margin-top: 10px;">抽奖配置</span>
         </div>
-        <div style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickGoods">
-          <i class="el-icon-goods" style="font-size: 20px;"></i>
-          <span style="font-size: 12px; margin-top: 4px;">商品</span>
+        <div class="top-box" style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickGoods">
+          <!-- <i class="el-icon-goods" style="font-size: 20px;"></i> -->
+          <img src="@/assets/image/sp.png" width="48"/>
+          <span style="font-size: 12px; margin-top: 10px;">商品</span>
         </div>
-        <div style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickOrder">
-          <i class="el-icon-goods" style="font-size: 20px;"></i>
-          <span style="font-size: 12px; margin-top: 4px;">直播订单</span>
+        <div class="top-box" style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickOrder">
+          <!-- <i class="el-icon-goods" style="font-size: 20px;"></i> -->
+          <img src="@/assets/image/zbdd.png" width="48"/>
+          <span style="font-size: 12px;margin-top: 10px;">直播订单</span>
         </div>
-        <div style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickCoupon">
-          <i class="el-icon-goods" style="font-size: 20px;"></i>
-          <span style="font-size: 12px; margin-top: 4px;">直播优惠券</span>
+        <div class="top-box" style="display: flex; flex-direction: column; align-items: center; cursor: pointer;" @click="handleClickCoupon">
+          <!-- <i class="el-icon-goods" style="font-size: 20px;"></i> -->
+          <img src="@/assets/image/zbyhq.png" width="48"/>
+          <span style="font-size: 12px; margin-top: 10px;">直播优惠券</span>
         </div>
       </div>
-      <el-radio-group v-model="tableRadio" >
+     <!-- <el-radio-group v-model="tableRadio" >
         <el-radio-button label="订单数">订单数</el-radio-button>
-      </el-radio-group>
-      <div  style="position: relative;width: 100%; height: 300px;">
+      </el-radio-group> -->
+      <div  style="position: relative;width: 100%; height: 270px;margin-top: 30px;">
         <div ref="chartContainer" style="width: 100%; height: 100%;"></div>
         <div style="position: absolute; top: 10px; right: 10px; background: #fff; padding: 5px; z-index: 1;">
           <el-select v-model="searchQuery.timeOptions" placeholder="请选择" style="width: 150px"  @change="timeChange">
@@ -183,9 +194,9 @@
     <!-- 用户列表 start -->
     <el-col class="live-console-col" :span="6">
       <el-tabs class="live-console-tab-right" v-model="tabLeft.activeName" @tab-click="handleClick" :stretch="true">
-        <el-tab-pane :label="onlineLabel" name="online">
-          <el-scrollbar ref="manageLeftRef_online" style="height: 800px; width: 100%;">
-            <el-row style="margin-top: 10px" type="flex" align="middle" v-for="u in onlineDisplayList" :key="u.userId">
+        <el-tab-pane :label="onlineLabel" name="online" style="height: 100%;">
+          <el-scrollbar ref="manageLeftRef_online" style="height:100%; width: 100%;padding: 10px;">
+            <el-row  class="row-box" style="margin-bottom:10px" type="flex" align="middle" v-for="u in onlineDisplayList" :key="u.userId">
               <el-col :span="20">
                 <el-row type="flex" align="middle">
                   <el-col :span="4" style="padding-left: 10px;"><el-avatar :src="u.avatar"></el-avatar></el-col>
@@ -205,9 +216,9 @@
             </el-row>
           </el-scrollbar>
         </el-tab-pane>
-        <el-tab-pane :label="offlineLabel" name="offline">
-          <el-scrollbar ref="manageLeftRef_offline" style="height: 800px; width: 100%;">
-            <el-row style="margin-top: 10px" type="flex" align="middle" v-for="u in offlineDisplayList" :key="u.userId">
+        <el-tab-pane :label="offlineLabel" name="offline" style="height: 100%;">
+          <el-scrollbar ref="manageLeftRef_offline" style="height:100%; width: 100%;padding: 10px;">
+            <el-row  class="row-box" style="margin-bottom:10px" type="flex" align="middle" v-for="u in offlineDisplayList" :key="u.userId">
               <el-col :span="20">
                 <el-row type="flex" align="middle">
                   <el-col :span="4" style="padding-left: 10px;"><el-avatar :src="u.avatar"></el-avatar></el-col>
@@ -227,9 +238,9 @@
             </el-row>
           </el-scrollbar>
         </el-tab-pane>
-        <el-tab-pane :label="silencedUserLabel" name="silenced">
-          <el-scrollbar ref="manageLeftRef_silenced" style="height: 800px; width: 100%;">
-            <el-row style="margin-top: 10px" type="flex" align="middle" v-for="u in silencedDisplayList" :key="u.userId">
+        <el-tab-pane :label="silencedUserLabel" name="silenced" style="height: 100%;">
+          <el-scrollbar ref="manageLeftRef_silenced" style="height: 800px; width: 100%;padding: 10px;">
+            <el-row class="row-box" style="margin-bottom:10px" type="flex" align="middle" v-for="u in silencedDisplayList" :key="u.userId">
               <el-col :span="20">
                 <el-row type="flex" align="middle">
                   <el-col :span="4" style="padding-left: 10px;"><el-avatar :src="u.avatar"></el-avatar></el-col>
@@ -1237,6 +1248,62 @@ export default {
 }
 </script>
 
+<style lang="stylus" scoped>
+  .top-box{
+    justify-content: center;
+    width: 140px;
+    height: 110px;
+    background: #FFFFFF;
+    border-radius: 16px 16px 16px 16px;
+    border: 1px solid #EBF0F9;
+  }
+  .row-box{
+    padding: 10px 16px;
+   background: #FAFBFD;
+   border-radius: 8px 8px 8px 8px;
+  }
+  .msg-box{
+   word-break: break-all;
+       word-wrap: break-word;
+       white-space: pre-wrap;
+     background-color: #F7F8FA;
+     padding: 10px;
+     border-radius: 0px 12px 12px 12px;
+     font-size: 14px;
+    display: inline-block;
+  }
+  .msg-box-right{
+    margin-right: 50px;
+   word-break: break-all;
+       word-wrap: break-word;
+       white-space: pre-wrap;
+     background-color:#13C2C2;
+     padding: 10px;
+     color: #fff;
+     border-radius: 12px 0px 12px 12px;
+     font-size: 14px;
+    display: inline-block;
+  }
+  .shuru ::v-deep.el-textarea__inner{
+    background-color: #F7F8FA !important;
+    border-radius: 12px;
+  }
+  .el-icon-more{
+    color:#D9D9D9
+  }
+  .live-console-tab-right{
+    height: 100%;
+  }
+ .live-console-tab-right .el-scrollbar__view{
+    padding: 10px;
+  }
+  .live-console-tab-right .el-col-offset-1{
+    color:#666
+  }
+ .live-console-tab-right ::v-deep.el-tabs__content{
+    height: 90%;
+  }
+</style>
 <style scoped>
 .talk-list{
   display: flex;
@@ -1283,5 +1350,4 @@ export default {
     border: none !important;
     box-shadow: none !important;
   }
-
 </style>

src/views/live/liveOrder/index.vue

@@ -12,7 +12,7 @@
         </el-select>
       </el-form-item>
 
-      <el-form-item>
+      <el-form-item label="所属部门" prop="deptId">
         <treeselect style="width: 220px" :clearable="false" v-model="queryParams.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
       </el-form-item>
       <el-form-item label="订单号" prop="orderCode">
@@ -78,16 +78,43 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="物流编号" prop="deliveryCode">
-        <el-input
+      <el-form-item style="margin-left: 20px;">
+        <el-button type="text"  :icon="isCollapsed ? 'el-icon-arrow-down' : 'el-icon-arrow-up'"  @click="upDown">{{ isCollapsed ? '展开' : '收起' }} </el-button>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+      <div v-if="!isCollapsed">
+      <el-form-item label="物流信息" prop="searchKey">
+                    <el-input
+                     v-model.trim="searchKey"
+                      :placeholder="searchType=='deliveryCode'?'请输入物流编号':searchType=='deliveryName'?'请输入物流名称':searchType=='deliverySn'?'请输入物流单号':''"
+                      clearable
+                      size="small"
+                      @keyup.enter.native="handleQuery"
+                      clearable
+                    >
+                    <el-select
+                    slot="prepend"
+                      v-model="searchType"
+                      placeholder="请选择"
+                      clearable
+                       @change="handleTypeChange"
+                       class="select-box"
+                    >
+                      <el-option label="物流编号" value="deliveryCode" />
+                      <el-option label="物流名称" value="deliveryName" />
+                      <el-option label="物流单号" value="deliverySn" />
+                    </el-select>
+                    </el-input>
+                   </el-form-item>
+        <!-- <el-input
           v-model="queryParams.deliveryCode"
           placeholder="请输入物流编号"
           clearable
           size="small"
           @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="物流名称" prop="deliveryName">
+        /> -->
+    <!-- <el-form-item label="物流名称" prop="deliveryName">
         <el-input
           v-model="queryParams.deliveryName"
           placeholder="请输入物流名称"
@@ -104,40 +131,25 @@
           size="small"
           @keyup.enter.native="handleQuery"
         />
-      </el-form-item>
-
-      <!-- 修改支付时间为范围选择 -->
-      <el-form-item label="支付时间" prop="payTimeRange">
-        <el-date-picker
-          v-model="payTimeRange"
-          type="daterange"
-          range-separator="至"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          value-format="yyyy-MM-dd"
-          size="small"
-          @change="handlePayTimeChange"
-        />
-      </el-form-item>
+      </el-form-item> -->
 
-      <!-- 修改完成时间为范围选择 -->
-      <el-form-item label="完成时间" prop="finishTimeRange">
-        <el-date-picker
-          v-model="finishTimeRange"
-          type="daterange"
-          range-separator="至"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          value-format="yyyy-MM-dd"
-          size="small"
-          @change="handleFinishTimeChange"
-        />
-      </el-form-item>
-
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
+    <el-form-item label="支付时间" prop="payTime">
+      <el-date-picker clearable size="small"
+        v-model="queryParams.payTime"
+        type="date"
+        value-format="yyyy-MM-dd"
+        placeholder="选择支付时间">
+      </el-date-picker>
+    </el-form-item>
+    <el-form-item label="完成时间" prop="finishTime">
+      <el-date-picker clearable size="small"
+        v-model="queryParams.finishTime"
+        type="date"
+        value-format="yyyy-MM-dd"
+        placeholder="选择完成时间">
+      </el-date-picker>
+    </el-form-item>
+      </div>
     </el-form>
 
     <el-row :gutter="10" class="mb8">
@@ -239,6 +251,9 @@ export default {
   components: {Treeselect, liveOrderDetails },
   data() {
     return {
+      searchType:'',
+      searchKey:'',
+      isCollapsed:false,
       // 字典
       orderStatusOptions: [],
       // 遮罩层
@@ -293,6 +308,7 @@ export default {
         title: "订单详情",
         open: false,
       },
+
     };
   },
   created() {
@@ -369,15 +385,25 @@ export default {
         this.liveOrderList = response.rows;
         this.total = response.total;
         this.loading = false;
+        delete this.queryParams[this.searchType];
       });
     },
 
     orderStatusFormatter(row, column) {
       return this.selectDictLabel(this.orderStatusOptions, row.status);
     },
-
+     upDown() {
+          this.isCollapsed = !this.isCollapsed;
+        },
+    handleTypeChange(newType){
+      this.searchKey='';
+      this.searchType=newType
+    },
     /** 搜索按钮操作 */
     handleQuery() {
+      if(this.searchKey!=='' && this.searchType!==''){
+       this.queryParams[this.searchType]=this.searchKey
+      }
       this.queryParams.pageNum = 1;
       this.getList();
     },
@@ -388,6 +414,8 @@ export default {
       // 同时清空范围选择器的值
       this.payTimeRange = [];
       this.finishTimeRange = [];
+      this.searchKey= '';
+      this.queryParams[this.searchType]=null;
       // 清空时间范围参数
       this.queryParams.payStartTime = null;
       this.queryParams.payEndTime = null;
@@ -441,3 +469,20 @@ export default {
   }
 };
 </script>
+<style scoped>
+   ::v-deep .el-input-group__prepend{
+      background-color: #fff !important;
+      width: 100px;
+
+  }
+  ::v-deep .el-input-group--prepend{
+     vertical-align: middle;
+  }
+  ::v-deep .vue-treeselect__control{
+    height: 30px !important;
+    line-height: 30px;
+  }
+  ::v-deep .vue-treeselect__placeholder{
+    line-height: 32px;
+  }
+</style>