| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport"
- content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no, viewport-fit=cover" />
- <title>投诉客户列表</title>
- <!--引入 element-ui 的样式,-->
- <link rel="stylesheet"
- href="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742018383195/element-ui.css">
- <!-- 必须先引入vue, 后使用element-ui -->
- <script
- src="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742017957144/vue.js"></script>
- <!-- 引入element 的组件库-->
- <script
- src="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742017747738/element-ui.js"></script>
- <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
- <script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script>
- <!-- <script src="js/vconsole.min.js"></script>
- <script>
- var vConsole = new window.VConsole();
- </script> -->
- </head>
- <style>
- body {
- margin: 0;
- padding: 0;
- }
- .box {
- width: 100vw;
- height: 100vh;
- box-sizing: border-box;
- background: #FAFAFA;
- }
- .page4 {
- width: 100vw;
- height: 100vh;
- box-sizing: border-box;
- }
- .client_list {
- padding: 15px 10px;
- height: 100%;
- overflow: auto;
- box-sizing: border-box;
- }
- .client_item {
- width: 100%;
- background: #FFFFFF;
- border-radius: 10px;
- padding: 10px;
- box-sizing: border-box;
- margin-bottom: 15px;
- }
- .client_head {
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 10px;
- font-weight: 500;
- font-size: 14px;
- color: #222222;
- }
- .client_status {
- font-weight: 400;
- font-size: 12px;
- }
- .client_content {
- background: #FAFAFA;
- border-radius: 10px;
- padding: 10px;
- font-weight: 400;
- font-size: 12px;
- color: #999999;
- line-height: 23px;
- text-overflow: -o-ellipsis-lastline;
- display: -webkit-box;
- -webkit-box-orient: vertical;
- -webkit-line-clamp: 2;
- overflow: hidden;
- box-sizing: border-box;
- height: 60px;
- }
- </style>
- <body>
- <div id="box" class="box">
- <!-- 数据查看 -->
- <div class="page4">
- <div class="client_list">
- <div class="client_item" v-for="(item, index) in complaintList" :key="index" @click="handleComplaint(item)">
- <div class="client_head">
- <div>{{item.clientName}}</div>
- <div class="client_status" :style="{color: item.notifyStatus === 2 ? '#CCCCCC' : '#FF4E4E'}">{{item.notifyStatus === 2 ? '已读' : '未处理'}}</div>
- </div>
- <div class="client_content">{{item.sentimentReason}}</div>
- </div>
- </div>
- </div>
- </div>
- </body>
- <script>
- new Vue({
- el: '#box',
- data() {
- return {
- httpUrl: '',
- bId: null,
- env: '',
- memberId: null,
- corpId: null,
- complaintList: [],
- }
- },
- created() {
- this.bId = this.getQueryParam('bId')
- this.env = this.getQueryParam('env')
- if (!this.env || this.env === 'prod') {
- this.httpUrl = 'https://wlapi.wefanbot.com'
- } else {
- this.httpUrl = 'http://test.wefanbot.com:18993'
- }
- if (this.getQueryParam('memberId')) {
- if (this.isUnknownType(this.getQueryParam('memberId'))) {
- this.$message({
- message: '员工未激活',
- type: 'warning'
- })
- } else {
- // 已授权
- this.memberId = this.getQueryParam('memberId')
- this.corpId = this.getQueryParam('corpId')
- this.executeDetail()
- }
- } else {
- // 授权
- this.getAuth()
- }
- },
- methods: {
- getAuth() {
- fetch(this.httpUrl + `/p/insuite/p/getRedirectUri?env=${this.env}&bId=${this.bId}`)
- .then(res => {
- return res.json()
- }).then(result => {
- let { data, code, msg } = result
- if (code === 1) {
- window.location.replace(data)
- } else {
- this.$message({
- message: msg,
- type: 'warning'
- })
- }
- })
- },
- executeDetail() {
- fetch(this.httpUrl + `/scrm/v1/wxc-sentiment-session/p/findTouSuListByPage`, {
- method: 'post',
- body: JSON.stringify({
- memberId: this.memberId,
- corpId: this.corpId,
- page: 1,
- pageCount: 1000,
- }),
- headers: {
- 'Content-Type': 'application/json'
- }
- })
- .then(res => {
- return res.json()
- }).then(result => {
- let { data, code, msg } = result
- if (code === 1) {
- this.complaintList = data.records
- } else {
- this.$message({
- message: msg,
- type: 'warning'
- })
- }
- })
- },
- handleComplaint(item) {
- const data = {
- httpUrl: this.httpUrl,
- corpId: this.corpId,
- bId: this.bId,
- id: item.id,
- externalUserid: item.externalUseridOuter,
- clientName: item.clientName,
- sentimentReason: item.sentimentReason,
- type: item.type,
- chatId: item.type ? item.chatId : '',
- notifyStatus: item.notifyStatus
- }
- window.name = JSON.stringify(data)
- window.location.href = `complaintContent.html`
- },
- // 截取url中的数据
- getQueryParam(paramName) {
- // 获取当前URL的查询字符串部分
- const queryString = window.location.search;
- // 创建一个URLSearchParams对象
- const urlParams = new URLSearchParams(queryString);
- // 返回指定参数的值,如果不存在则返回null
- return urlParams.get(paramName);
- },
- isUnknownType(value) {
- // 1. 先检查是否为字符串类型
- // 2. 再检查是否以"unknown"开头(区分大小写)
- return typeof value === 'string' && value.startsWith('unknown');
- }
- }
- })
- </script>
- </html>
|