|
|
@@ -59,6 +59,7 @@
|
|
59
|
59
|
<div class="selectCustom">已择{{selectTotal}}个客户</div>
|
|
60
|
60
|
</div>
|
|
61
|
61
|
<div class="flex">
|
|
|
62
|
+ <el-button type="primary" plain size="mini" @click="customerCountStat()">客服客户数统计</el-button>
|
|
62
|
63
|
<el-button type="primary" plain size="mini" @click="setCustomerTag(1)">批量打标签</el-button>
|
|
63
|
64
|
<el-button type="primary" plain size="mini" @click="setCustomerTag(2)">批量移除标签</el-button>
|
|
64
|
65
|
<el-button type="primary" plain size="mini" @click="init(1,'export')">导出Excel</el-button>
|
|
|
@@ -188,6 +189,26 @@
|
|
188
|
189
|
<el-dialog :title="tagType==1?'批量打标签':'批量移除标签'" :visible.sync="tagVisible" width="600px" center top="15vh">
|
|
189
|
190
|
<tag-dialog @closeTagDialog="closeTagDialog" :tagType='tagType' :userLength='multipleArr.length'></tag-dialog>
|
|
190
|
191
|
</el-dialog>
|
|
|
192
|
+ <!-- 客服客户数统计 -->
|
|
|
193
|
+ <el-drawer :size="statDrawerSize" :visible.sync="customerCountStatDrawer" :with-header="false">
|
|
|
194
|
+ <div class="con">
|
|
|
195
|
+ <div class="flex">
|
|
|
196
|
+ <el-button type="primary" plain size="mini" @click="customerCountStatExport()">导出Excel</el-button>
|
|
|
197
|
+ </div>
|
|
|
198
|
+ <div class="theads">
|
|
|
199
|
+ <div class="thead_item" v-for="(t_h,thidx) in theadList" :key="thidx">{{t_h.name}}</div>
|
|
|
200
|
+ </div>
|
|
|
201
|
+ <div v-if="customerCountStatList&&customerCountStatList.length>0" v-loading="loading">
|
|
|
202
|
+ <div class="tbodys">
|
|
|
203
|
+ <div class="tbody_item" v-for="l in customerCountStatList" :key="l.user_id">
|
|
|
204
|
+ <div>{{l.user_name ? l.user_name : '-'}}</div>
|
|
|
205
|
+ <div>{{l.count ? l.count : '0'}}</div>
|
|
|
206
|
+ </div>
|
|
|
207
|
+ </div>
|
|
|
208
|
+ </div>
|
|
|
209
|
+ <noData v-else></noData>
|
|
|
210
|
+ </div>
|
|
|
211
|
+ </el-drawer>
|
|
191
|
212
|
</div>
|
|
192
|
213
|
</template>
|
|
193
|
214
|
<script>
|
|
|
@@ -204,13 +225,17 @@ import screenPay from '@/components/assembly/screen/pay.vue'
|
|
204
|
225
|
import shieldingUser from '@/components/assembly/shieldingUser.vue'
|
|
205
|
226
|
import tagDialog from '@/components/assembly/tagDialog.vue'
|
|
206
|
227
|
import detial from '@/components/detials/index.vue'
|
|
|
228
|
+import noData from "../assembly/noData";
|
|
207
|
229
|
|
|
208
|
230
|
export default {
|
|
209
|
|
- components: { tagDialog, detial, selfInput, selfCustomerservice, enterpriseTag, datePicker, selfChannel, selfChannelMultiple, selfChannelV2, selfGender, lossBody, screenPay, shieldingUser },
|
|
|
231
|
+ components: { tagDialog, detial, selfInput, selfCustomerservice, enterpriseTag, datePicker, selfChannel, selfChannelMultiple, selfChannelV2, selfGender, lossBody, screenPay, shieldingUser, noData },
|
|
210
|
232
|
data () {
|
|
211
|
233
|
return {
|
|
212
|
234
|
drawerSize: '60%',
|
|
213
|
235
|
detialDrawer: false,
|
|
|
236
|
+ statDrawerSize: '40%',
|
|
|
237
|
+ customerCountStatDrawer: false,
|
|
|
238
|
+ customerCountStatList: [],
|
|
214
|
239
|
rowPro: {},//去详情的此条对象
|
|
215
|
240
|
loading: false,
|
|
216
|
241
|
page: 1,
|
|
|
@@ -257,6 +282,10 @@ export default {
|
|
257
|
282
|
gender: '',
|
|
258
|
283
|
height: '',
|
|
259
|
284
|
tips: '',
|
|
|
285
|
+ theadList:[
|
|
|
286
|
+ {name:'客服', width:'50%'},
|
|
|
287
|
+ {name:'客户数'},
|
|
|
288
|
+ ],
|
|
260
|
289
|
}
|
|
261
|
290
|
},
|
|
262
|
291
|
created () {
|
|
|
@@ -712,6 +741,66 @@ export default {
|
|
712
|
741
|
}
|
|
713
|
742
|
]
|
|
714
|
743
|
this.$exportOrder({ excelDatas, name: `客户管理（导出时间：${this.$getDay(0)}）` })
|
|
|
744
|
+ },
|
|
|
745
|
+ customerCountStat() {// 客服客户数统计弹窗
|
|
|
746
|
+ this.customerCountStatDrawer = true
|
|
|
747
|
+ this.$nextTick(() => {
|
|
|
748
|
+ this.getCustomerCountStat()
|
|
|
749
|
+ })
|
|
|
750
|
+ },
|
|
|
751
|
+ getCustomerCountStat() {// 客服客户数统计数据获取
|
|
|
752
|
+ this.loading = true
|
|
|
753
|
+ this.$axios.get(this.URL.BASEURL + this.URL.customerCountStat, {
|
|
|
754
|
+ params: {
|
|
|
755
|
+ user_id_list: this.user_id_list,
|
|
|
756
|
+ customer_name: this.input_keyword,
|
|
|
757
|
+ add_date_start: this.add_date_start,
|
|
|
758
|
+ add_date_end: this.add_date_end,
|
|
|
759
|
+ last_pay_time_start: this.last_pay_time_start,
|
|
|
760
|
+ last_pay_time_end: this.last_pay_time_end,
|
|
|
761
|
+ loss_time_start: this.loss_time_start,
|
|
|
762
|
+ loss_time_end: this.loss_time_end,
|
|
|
763
|
+ add_way: this.add_way,
|
|
|
764
|
+ is_new_customer_no_loss: this.is_new_customer_no_loss,
|
|
|
765
|
+ can_receive: this.can_receive,
|
|
|
766
|
+ retained_status: this.retained_status,
|
|
|
767
|
+ pay_status: this.pay_status,
|
|
|
768
|
+ pay_num_min: this.pay_num_min,
|
|
|
769
|
+ pay_num_max: this.pay_num_max,
|
|
|
770
|
+ tag_type: this.tag_type,
|
|
|
771
|
+ tag_id_list: this.tag_id_list,
|
|
|
772
|
+ loss_status: this.loss_status,
|
|
|
773
|
+ source: 1,
|
|
|
774
|
+ gender: this.gender
|
|
|
775
|
+ }
|
|
|
776
|
+ }).then((res) => {
|
|
|
777
|
+ var res = res.data
|
|
|
778
|
+ this.loading = false
|
|
|
779
|
+ if (res && res.errno == 0) {
|
|
|
780
|
+ this.customerCountStatList = res.rst;
|
|
|
781
|
+ } else if (res.errno != 4002) {
|
|
|
782
|
+ this.$message({
|
|
|
783
|
+ message: res.err,
|
|
|
784
|
+ type: "warning"
|
|
|
785
|
+ })
|
|
|
786
|
+ }
|
|
|
787
|
+ }).catch((err) => {
|
|
|
788
|
+ this.loading = false
|
|
|
789
|
+ });
|
|
|
790
|
+ },
|
|
|
791
|
+ customerCountStatExport() {
|
|
|
792
|
+ let list = this.customerCountStatList;
|
|
|
793
|
+ let tHeader = ['客服', '客户数']
|
|
|
794
|
+ let filterVal = ['user_name', 'count']
|
|
|
795
|
+ let excelDatas = [
|
|
|
796
|
+ {
|
|
|
797
|
+ tHeader: tHeader, // sheet表一头部
|
|
|
798
|
+ filterVal: filterVal, // 表一的数据字段
|
|
|
799
|
+ tableDatas: list, // 表一的整体json数据
|
|
|
800
|
+ sheetName: ''// 表一的sheet名字
|
|
|
801
|
+ }
|
|
|
802
|
+ ]
|
|
|
803
|
+ this.$exportOrder({ excelDatas, name: `客服客户数（导出时间：${this.$getDay(0)}）` })
|
|
715
|
804
|
}
|
|
716
|
805
|
}
|
|
717
|
806
|
}
|
|
|
@@ -735,4 +824,53 @@ export default {
|
|
735
|
824
|
margin-top: 1px;
|
|
736
|
825
|
}
|
|
737
|
826
|
}
|
|
|
827
|
+.con{
|
|
|
828
|
+ position: relative;
|
|
|
829
|
+ .flex{
|
|
|
830
|
+ display: flex;
|
|
|
831
|
+ position: sticky;
|
|
|
832
|
+ top: 0px;
|
|
|
833
|
+ margin-left: 10px;
|
|
|
834
|
+ height: 60px;
|
|
|
835
|
+ background-color: white;
|
|
|
836
|
+ }
|
|
|
837
|
+ .theads{
|
|
|
838
|
+ background: #FBFBFB;
|
|
|
839
|
+ border: 1px solid #EBEEF5;
|
|
|
840
|
+ font-size: 14px;
|
|
|
841
|
+ color: #666;
|
|
|
842
|
+ display: flex;
|
|
|
843
|
+ align-items: center;
|
|
|
844
|
+ position: sticky;
|
|
|
845
|
+ top: 60px;
|
|
|
846
|
+ .thead_item{
|
|
|
847
|
+ // width: 20%;
|
|
|
848
|
+ flex: 1;
|
|
|
849
|
+ padding: 16px;
|
|
|
850
|
+ color: #666;
|
|
|
851
|
+ background-color: #fbfbfb;
|
|
|
852
|
+ border-right: 1px solid #EBEEF5;
|
|
|
853
|
+ }
|
|
|
854
|
+ }
|
|
|
855
|
+ .tbodys{
|
|
|
856
|
+ .tbody_item{
|
|
|
857
|
+ display: flex;
|
|
|
858
|
+ align-items: center;
|
|
|
859
|
+ color: #333;
|
|
|
860
|
+ font-size: 13px;
|
|
|
861
|
+ border: 1px solid #EBEEF5;
|
|
|
862
|
+ border-top: none;
|
|
|
863
|
+ div{
|
|
|
864
|
+ // width: 20%;
|
|
|
865
|
+ flex: 1;
|
|
|
866
|
+ word-break:break-all;
|
|
|
867
|
+ border-right: 1px solid #EBEEF5;
|
|
|
868
|
+ padding: 16px;
|
|
|
869
|
+ }
|
|
|
870
|
+ .c-00B38A{
|
|
|
871
|
+ color: #00B38A;
|
|
|
872
|
+ }
|
|
|
873
|
+ }
|
|
|
874
|
+ }
|
|
|
875
|
+}
|
|
738
|
876
|
</style>
|
