|
|
@@ -106,7 +106,7 @@
|
|
|
</el-popover>
|
|
|
</div>
|
|
|
<div class="emoji-item" @click="showQuick">
|
|
|
- <el-popover placement="top" :width="400" trigger="click">
|
|
|
+ <el-popover placement="top" :width="400" trigger="click" @show="getQuick">
|
|
|
<template #reference>
|
|
|
<div class="item-btn">
|
|
|
<el-image style="width:25px;height:25px;" src="https://jymini.oss-cn-guangzhou.aliyuncs.com/pc/quick.svg"></el-image>
|
|
|
@@ -122,11 +122,11 @@
|
|
|
<div class="search-btn-txt"><el-button type="primary" @click="addQuick">添加</el-button></div>
|
|
|
</div>
|
|
|
<div class="quick-table-body">
|
|
|
- <el-table :data="quickData.list" style="width: 100%" max-height="250" border>
|
|
|
+ <el-table :data="quickData.list" style="width: 100%" height="300" border>
|
|
|
<el-table-column prop="content" label="内容"></el-table-column>
|
|
|
<el-table-column prop="content" label="操作" width="80">
|
|
|
<template #default="scope">
|
|
|
- <el-button size="small" @click="table_view(scope.row)">发送</el-button>
|
|
|
+ <el-button size="small" @click="sendQuick(scope.row.content)">发送</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
@@ -137,6 +137,7 @@
|
|
|
background
|
|
|
layout="prev, pager, next"
|
|
|
:total="quickData.total"
|
|
|
+ @size-change="quickPageChange" @current-change="quickPageChange"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -191,19 +192,76 @@
|
|
|
</div>
|
|
|
</el-container>
|
|
|
<el-aside width="400px" v-if="chatItem">
|
|
|
- <el-container>
|
|
|
- <el-main>
|
|
|
- <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handleClick">
|
|
|
- <el-tab-pane label="用户信息" name="user">
|
|
|
-
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="团购订单" name="order">
|
|
|
-
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="差价订单" name="price">
|
|
|
-
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
+ <el-container class="flex-column">
|
|
|
+ <div class="aside-tabs">
|
|
|
+ <div :class="orderData.tab=='user'?'aside-tab-items active':'aside-tab-items'" @click="handleClick('user')">用户信息</div>
|
|
|
+ <div :class="orderData.tab=='order'?'aside-tab-items active':'aside-tab-items'" @click="handleClick('order')">团购订单</div>
|
|
|
+ <div :class="orderData.tab=='price'?'aside-tab-items active':'aside-tab-items'" @click="handleClick('price')">差价订单</div>
|
|
|
+ </div>
|
|
|
+ <el-main class="nopadding">
|
|
|
+ <template v-if="orderData.tab == 'price'">
|
|
|
+ <el-container>
|
|
|
+ <el-header>
|
|
|
+ <div class="order-search-input">
|
|
|
+ <el-input v-model="orderData.order" placeholder="搜索订单编号..." style="width: 100%;" />
|
|
|
+ <el-button>搜索</el-button>
|
|
|
+ </div>
|
|
|
+ </el-header>
|
|
|
+ <el-main>
|
|
|
+ </el-main>
|
|
|
+ <el-footer style="text-align: right;">
|
|
|
+ <div class="order-page">
|
|
|
+ <el-pagination small background :default-page-size="priceData.size" layout="prev, pager, next" @size-change="orderPageChange" @current-change="orderPageChange" :total="priceData.total" />
|
|
|
+ </div>
|
|
|
+ </el-footer>
|
|
|
+ </el-container>
|
|
|
+ </template>
|
|
|
+ <template v-if="orderData.tab == 'order'">
|
|
|
+ <el-container v-loading="orderData.loading">
|
|
|
+ <el-header>
|
|
|
+ <div class="order-search-input">
|
|
|
+ <el-input v-model="orderData.order" placeholder="搜索订单编号..." style="width: 100%;" />
|
|
|
+ <el-button>搜索</el-button>
|
|
|
+ </div>
|
|
|
+ </el-header>
|
|
|
+ <el-main>
|
|
|
+ <div class="order-list-chat" v-if="orderData.list.length > 0">
|
|
|
+ <div class="m-order-s" v-for="(item,index) in orderData.list" :key="index">
|
|
|
+ <div class="m-order-item">
|
|
|
+ <div class="order-img"><el-image style="width: 80px;height: 80px;" :src="item.img" fit="fit"></el-image></div>
|
|
|
+ <div class="order-info">
|
|
|
+ <div class="title">{{item.product.product_name}}</div>
|
|
|
+ <div class="desc">{{item.order_sn}}</div>
|
|
|
+ <div class="price">{{this.$TOOL.money(item.price)}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="order-status-btn">
|
|
|
+ <div class="status info" v-if="item.status=='0'">未支付</div>
|
|
|
+ <div class="status primary" v-if="item.status=='1'">待使用</div>
|
|
|
+ <div class="status success" v-if="item.status=='2'">已完成</div>
|
|
|
+ <div class="status danger" v-if="item.status=='3'">已退款</div>
|
|
|
+ <div class="status warn" v-if="item.status=='4'">退款中</div>
|
|
|
+ <div class="status warn" v-if="item.status=='5'">已关闭</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="order-btn-group">
|
|
|
+ <div class="status info cus" @click="viewOrder(item)">查看详情</div>
|
|
|
+ <div class="status primary cus" @click="sendAddress(item)">收集地址</div>
|
|
|
+ <div class="status warn cus" v-if="item.product.product_type==11" @click="submitPrice(item)">补差价</div>
|
|
|
+ <div class="status danger cus" @click="sendOrder(item)">发送订单</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="order-list-chat" v-else>
|
|
|
+ <el-empty description="没有订单" />
|
|
|
+ </div>
|
|
|
+ </el-main>
|
|
|
+ <el-footer style="text-align: right;">
|
|
|
+ <div class="order-page">
|
|
|
+ <el-pagination small background :default-page-size="orderData.size" layout="prev, pager, next" @size-change="orderPageChange" @current-change="orderPageChange" :total="orderData.total" />
|
|
|
+ </div>
|
|
|
+ </el-footer>
|
|
|
+ </el-container>
|
|
|
+ </template>
|
|
|
</el-main>
|
|
|
</el-container>
|
|
|
</el-aside>
|
|
|
@@ -263,10 +321,6 @@ export default {
|
|
|
allLoaded: false
|
|
|
},
|
|
|
msgLoad:false,
|
|
|
- orderList:[],
|
|
|
- orderLoad:false,
|
|
|
- orderTotal:0,
|
|
|
- orderPage:1,
|
|
|
emojiUrl,
|
|
|
loading:false,
|
|
|
visible: false, // 聊天窗口可见性
|
|
|
@@ -297,6 +351,21 @@ export default {
|
|
|
list:[],
|
|
|
popState:false,
|
|
|
total:0
|
|
|
+ },
|
|
|
+ orderData:{
|
|
|
+ page:1,
|
|
|
+ size:10,
|
|
|
+ list:[],
|
|
|
+ loading:false,
|
|
|
+ total:0,
|
|
|
+ tab:"user"
|
|
|
+ },
|
|
|
+ priceData:{
|
|
|
+ page:1,
|
|
|
+ size:10,
|
|
|
+ list:[],
|
|
|
+ loading:false,
|
|
|
+ total:0,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
@@ -342,17 +411,46 @@ export default {
|
|
|
this.$refs.messageListRef.removeEventListener('scroll', this.handleScroll)
|
|
|
},
|
|
|
methods: {
|
|
|
+ handleClick(event){
|
|
|
+ this.orderData.tab = event;
|
|
|
+ switch (event) {
|
|
|
+ case "user":
|
|
|
+ break;
|
|
|
+ case "order":
|
|
|
+ this.orderData.page = 1;
|
|
|
+ this.orderData.list = [];
|
|
|
+ this.getOrderList();
|
|
|
+ break;
|
|
|
+ case "price":
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ viewOrder(data){
|
|
|
+ data.order = data.out_order_no;
|
|
|
+ this.$refs.orderDetail.open("add").setData(data)
|
|
|
+ },
|
|
|
+ quickPageChange(e){
|
|
|
+ this.quickData.page = e;
|
|
|
+ this.getQuick()
|
|
|
+ },
|
|
|
+ async getQuick(){
|
|
|
+ var resp = await this.$API.merQuick.list.get({"page":this.quickData.page,"pageSize":this.quickData.size});
|
|
|
+ if (resp.code == 0) {
|
|
|
+ return this.$message.error(resp.msg)
|
|
|
+ }
|
|
|
+ this.quickData.total = resp.data.total;
|
|
|
+ this.quickData.list = resp.data.rows;
|
|
|
+ },
|
|
|
addQuick(){
|
|
|
this.$nextTick(() => {
|
|
|
this.$refs.quickTxt.open("add")
|
|
|
})
|
|
|
},
|
|
|
- handleClick(event){
|
|
|
- this.activeName = event;
|
|
|
- // this.getConfig();
|
|
|
+ sendQuick(text){
|
|
|
+ this.inputMessage = text;
|
|
|
+ this.sendMessage()
|
|
|
},
|
|
|
orderSuccess(type,data){
|
|
|
- console.log(data)
|
|
|
switch(type) {
|
|
|
case "address":
|
|
|
this.sendAddress(data)
|
|
|
@@ -381,7 +479,7 @@ export default {
|
|
|
this.uploadImg = "";
|
|
|
},
|
|
|
orderPageChange(e){
|
|
|
- this.orderPage = e;
|
|
|
+ this.orderData.page = e;
|
|
|
this.getOrderList()
|
|
|
},
|
|
|
hideWindow(){
|
|
|
@@ -389,15 +487,13 @@ export default {
|
|
|
this.msgPage = 1;
|
|
|
this.unreadCount = 0;
|
|
|
this.checkChat = null;
|
|
|
- this.orderList = [];
|
|
|
- this.orderPage = 1;
|
|
|
this.visible = false;
|
|
|
},
|
|
|
handleScroll(e){
|
|
|
const { scrollTop, clientHeight, scrollHeight } = e.target
|
|
|
const isBottom = scrollTop + clientHeight >= scrollHeight - 5 // 5px 缓冲区
|
|
|
const isTop = scrollTop <= 5
|
|
|
- console.log("滚动",this.history.allLoaded)
|
|
|
+ // console.log("滚动",this.history.allLoaded)
|
|
|
if (isBottom && !this.history.allLoaded) {
|
|
|
console.log('到达底部')
|
|
|
// 加载更多等操作
|
|
|
@@ -764,14 +860,14 @@ export default {
|
|
|
return true;
|
|
|
},
|
|
|
async getOrderList(){
|
|
|
- this.orderLoad = true;
|
|
|
- var resp = await this.$API.order.list.get({"page":this.orderPage,"pageSize":this.orderSize,"openid":this.chatItem.openid});
|
|
|
- this.orderLoad = false;
|
|
|
+ this.orderData.loading = true;
|
|
|
+ var resp = await this.$API.order.list.get({"page":this.orderData.page,"pageSize":this.orderData.size,"openid":this.chatItem.openid});
|
|
|
+ this.orderData.loading = false;
|
|
|
if (resp.code == 0) {
|
|
|
return ;
|
|
|
}
|
|
|
- this.orderList = resp.data.rows;
|
|
|
- this.orderTotal = resp.data.total;
|
|
|
+ this.orderData.list = resp.data.rows;
|
|
|
+ this.orderData.total = resp.data.total;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -779,17 +875,25 @@ export default {
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
@import '@/style/index.scss';
|
|
|
-.quick-search{display: flex;align-items: center;justify-content: space-between;gap: 10px;}
|
|
|
+.aside-tabs{display: flex;height: 65px;align-items: center;gap: 10px;border-bottom: 1px solid var(--el-border-color-light);padding: 13px 15px;}
|
|
|
+.aside-tabs .aside-tab-items{font-size: 14px;cursor: pointer;padding: 0 20px;}
|
|
|
+.aside-tabs .aside-tab-items.active{color: var(--el-color-primary);}
|
|
|
+.quick-search{display: flex;align-items: center;justify-content: space-between;}
|
|
|
.quick-search .search-input{flex: 1;display: flex;align-items: center;gap: 5px;}
|
|
|
.quick-search .search-btn-txt{font-size: 14px;color: #409eff;cursor: pointer;}
|
|
|
.quick-table .quick-table-body{margin: 10px 0;}
|
|
|
.border-none{border: 0;}
|
|
|
.msg-title{font-size: 18px;font-weight: bold;}
|
|
|
.loading-text{background-color: #f8f8f8;text-align: center;font-size: 12px;}
|
|
|
-.m-order-s{background-color: #f8f8f8;border-radius: 5px;display: flex;font-size: 14px;position: relative;margin-bottom: 10px;}
|
|
|
-.m-order-s .order-img image{width: 60px;height: 60px;}
|
|
|
-.m-order-s .order-info {padding: 10px;}
|
|
|
-.m-order-s .order-info .title{font-size: 14px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
|
|
|
+.order-list-chat{height: 100%;flex-direction: column;flex: 1;display: flex;}
|
|
|
+.m-order-s{background-color: #fff;border-radius: 5px;margin-bottom: 10px;border: 1px solid #f8f8f8;}
|
|
|
+.m-order-s .m-order-item{display: flex;font-size: 14px;position: relative;background-color: #f8f8f8;}
|
|
|
+.m-order-s .order-btn-group{display: flex;align-items: center;padding: 10px;gap: 10px;}
|
|
|
+.order-search-input{display: flex;align-items: center;gap: 10px;flex: 1;}
|
|
|
+.m-order-s .order-img{display: flex;}
|
|
|
+.m-order-s .order-img image{width: 80px;height: 80px;}
|
|
|
+.m-order-s .order-info {padding: 5px 10px 10px;flex: 1;}
|
|
|
+.m-order-s .order-info .title{font-size: 14px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
|
|
|
.m-order-s .order-info .desc{font-size: 12px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;color: #999;}
|
|
|
.m-order-s .order-info .price{font-size: 14px;color: #f00;}
|
|
|
.m-order-s .order-status-btn{position: absolute;right: 0;bottom: 0;display: flex;align-items: center;gap: 5px;}
|
Zory