|
|
@@ -40,38 +40,23 @@
|
|
|
@row-dblclick="click_row"
|
|
|
style="width: 100%;"
|
|
|
>
|
|
|
- <el-table-column prop="name" label="用户名"></el-table-column>
|
|
|
- <el-table-column prop="time" label="留言时间" width="180"></el-table-column>
|
|
|
+ <el-table-column prop="name" width="140" label="用户名"></el-table-column>
|
|
|
+ <el-table-column prop="add_time" label="留言时间" ></el-table-column>
|
|
|
<el-table-column prop="content" label="留言内容"></el-table-column>
|
|
|
<el-table-column prop="phone" label="手机"></el-table-column>
|
|
|
<el-table-column prop="email" label="邮箱"></el-table-column>
|
|
|
- <el-table-column prop="endTime" label="当前状态">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span
|
|
|
- style="color:#FF6600"
|
|
|
- v-if="scope.row.currentState === '未回复'"
|
|
|
- >{{scope.row.currentState}}</span>
|
|
|
- <span v-if="scope.row.currentState === '已回复'">{{scope.row.currentState}}</span>
|
|
|
+ <el-table-column prop="message_status" label="当前状态">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span style="color:#FF6600" v-if="scope.row.message_status == '0'"> 未回复</span>
|
|
|
+ <!-- {{scope.row.currentState}} -->
|
|
|
+ <span v-if="scope.row.message_status == '1'">已回复</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <!-- <el-table-column
|
|
|
- prop="currentState"
|
|
|
- label="当前状态"
|
|
|
- width="100"
|
|
|
- :filters="[{ text: '未回复', value: '未回复' }, { text: '已回复', value: '已回复' }]"
|
|
|
- :filter-method="filterTag"
|
|
|
- filter-placement="bottom-end">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-tag
|
|
|
- :type="scope.row.currentState === '未回复' ? 'primary' : 'success'"
|
|
|
- disable-transitions>{{scope.row.currentState}}</el-tag>
|
|
|
- </template>
|
|
|
- </el-table-column>-->
|
|
|
- <el-table-column prop="satisfaction" label="处理人"></el-table-column>
|
|
|
+ <el-table-column prop="user_name" label="处理人"></el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div v-show="pages >9" style=" padding: 10px;">
|
|
|
- <el-pagination background layout="prev, pager, next" :total="pages" @prev-click='upData'
|
|
|
+ <el-pagination background layout="prev, pager, next" prev-text='上一页' next-text='下一页' :total="pages" @prev-click='upData'
|
|
|
@next-click="downData" @current-change="current_page"></el-pagination>
|
|
|
</div>
|
|
|
<div class="right_box" v-show="isShow">
|
|
|
@@ -102,42 +87,68 @@
|
|
|
<!-- 内容展示 -->
|
|
|
<el-row id="main">
|
|
|
<el-col class="user">
|
|
|
+ <span style="color: #999999;">用户<span style="color:#666;">{{userInfo.account_name}}</span>留言</span>
|
|
|
<div class="text">{{getUserItem.content}}</div>
|
|
|
- <div class="img" v-for="item in getUserItem.image">
|
|
|
- <img :src="img_http +item" alt="">
|
|
|
+ <div class="img block " v-for="item in getUserItem.image">
|
|
|
+ <el-image
|
|
|
+ style="width: 100px; height: 100px"
|
|
|
+ :src="img_http +item"
|
|
|
+ :fit="fit"
|
|
|
+ :preview-src-list="[img_http +item]">
|
|
|
+ </el-image>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
|
|
|
- <el-col class="serive">
|
|
|
- <el-input class="text" resize="none" type="textarea"
|
|
|
- @blur="widthCheck($event.target, 100)" placeholder="请回复用户留言"
|
|
|
- v-model="leaveInfor"></el-input>
|
|
|
- </el-col>
|
|
|
- <el-col>
|
|
|
- <el-upload style="margin:10px;"
|
|
|
- action="/api/index/upload/uploadImg"
|
|
|
- :before-upload="beforeAvatarUpload"
|
|
|
-
|
|
|
- :on-change='uploadChange'
|
|
|
- :on-success='uploadSuccess'
|
|
|
- :on-error="uploadError"
|
|
|
- :on-remove="handleRemove"
|
|
|
- :auto-upload="false"
|
|
|
- list-type="picture-card"
|
|
|
- ref="upload"
|
|
|
- :limit="4"
|
|
|
- :on-exceed="handleExceed"
|
|
|
- >
|
|
|
- <i slot="default" class="el-icon-plus"></i>
|
|
|
- </el-upload>
|
|
|
-
|
|
|
- <el-dialog>
|
|
|
- <img width="100%" :src="dialogImageUrl" alt="">
|
|
|
- </el-dialog>
|
|
|
- </el-col>
|
|
|
+
|
|
|
+ <div v-if="getUserItem.message_status == 0">
|
|
|
+ <el-col class="serive">
|
|
|
+ <el-input class="text" resize="none" type="textarea"
|
|
|
+ @blur="widthCheck($event.target, 100)" placeholder="请回复用户留言"
|
|
|
+ v-model="leaveInfor"></el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col>
|
|
|
+ <el-upload style="margin:10px;"
|
|
|
+ action="/api/index/upload/uploadImg"
|
|
|
+ :before-upload="beforeAvatarUpload"
|
|
|
+ :on-change='uploadChange'
|
|
|
+ :on-success='uploadSuccess'
|
|
|
+ :on-error="uploadError"
|
|
|
+ :on-remove="handleRemove"
|
|
|
+ :auto-upload="false"
|
|
|
+ list-type="picture-card"
|
|
|
+ ref="upload"
|
|
|
+ :limit="4"
|
|
|
+ :on-exceed="handleExceed"
|
|
|
+ >
|
|
|
+ <i slot="default" class="el-icon-plus"></i>
|
|
|
+ </el-upload>
|
|
|
+
|
|
|
+ <el-dialog>
|
|
|
+ <img width="100%" :src="dialogImageUrl" alt="">
|
|
|
+ </el-dialog>
|
|
|
+ </el-col>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <el-col class="serive">
|
|
|
+ <span style="color: #999999;">客服<span style="color: #5399f5">{{getUserItem.user_name}}</span>回复用户<span style="color:#666;">{{userInfo.account_name}}</span>留言</span>
|
|
|
+ <div class="text">{{getUserItem.reply_content}}</div>
|
|
|
+ <div style="padding: 10px 15px;">
|
|
|
+ <div class="img block" v-for="item in getUserItem.images">
|
|
|
+ <el-image
|
|
|
+ style="width: 100px; height: 100px"
|
|
|
+ :src="img_http +item"
|
|
|
+ :fit="fit"
|
|
|
+ :preview-src-list="[img_http +item]">
|
|
|
+ </el-image>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
</el-row>
|
|
|
|
|
|
- <el-row class="chatting">
|
|
|
+ <el-row v-if="getUserItem.message_status == 0" class="chatting">
|
|
|
<el-button class="send" type="primary" @click="sendMessage">提交</el-button>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
@@ -222,7 +233,9 @@
|
|
|
// img_http: 'http://192.168.2.187:8090',//图片路径域
|
|
|
uploadImg:[],
|
|
|
imgUrl:'',
|
|
|
- users:[]
|
|
|
+ users:[],
|
|
|
+ fit:'contain',
|
|
|
+ isSendMessage:false,//是否提交
|
|
|
};
|
|
|
},
|
|
|
components: {
|
|
|
@@ -234,7 +247,7 @@
|
|
|
mounted() {
|
|
|
this.frceArr = frce.frce;
|
|
|
this.value = this.options[2].value;
|
|
|
- this.getSessionList(1)
|
|
|
+ // this.getSessionList(1)
|
|
|
this.get_vuex_info();
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -282,12 +295,7 @@
|
|
|
},
|
|
|
// 上传成功时的回调
|
|
|
uploadSuccess(res, file, fileList) {
|
|
|
- console.log(res.data.src)
|
|
|
this.imgUrl = this.imgUrl ? this.imgUrl + "," + res.data.src :res.data.src;
|
|
|
- console.log(this.imgUrl)
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
},
|
|
|
// 发送中
|
|
|
onProgress() {
|
|
|
@@ -299,23 +307,22 @@
|
|
|
},
|
|
|
//删除回掉
|
|
|
handleRemove(file, fileList,) {
|
|
|
- this.uploadImg = fileList
|
|
|
+ this.uploadImg = fileList;
|
|
|
},
|
|
|
// 每次改变图片状态返回的回调
|
|
|
uploadChange(file, fileList) {
|
|
|
- console.log(file, fileList)
|
|
|
-
|
|
|
+ // console.log(file, fileList)
|
|
|
// this.uploadImg.push(file);
|
|
|
},
|
|
|
handleExceed(files, fileList) {
|
|
|
this.$message.error(`图片上传数量最多4张`);
|
|
|
},
|
|
|
+ //提交留言
|
|
|
sendMessage() {
|
|
|
- console.log(this.uploadImg);
|
|
|
+ if(!this.isSendMessage) return false;
|
|
|
this.$refs.upload.submit();
|
|
|
-
|
|
|
+ this.isSendMessage = false;
|
|
|
setTimeout(()=>{
|
|
|
- console.log(this.imgUrl,"上传的图片")
|
|
|
let parmas = {
|
|
|
"user_id":this.users.id,
|
|
|
"message_id":this.uid,
|
|
|
@@ -323,8 +330,10 @@
|
|
|
"images":this.imgUrl,
|
|
|
}
|
|
|
this.post('/api/service/Message/dealmessage', parmas).then(res => {
|
|
|
- console.log(res);
|
|
|
+
|
|
|
this.$message.success(res.data.msg);
|
|
|
+ this.drawer = false;
|
|
|
+ this.getStartEndAjaxTime(this.value)
|
|
|
})
|
|
|
},1500)
|
|
|
},
|
|
|
@@ -350,8 +359,6 @@
|
|
|
this.users = this.$store.getters.get_user_info
|
|
|
},
|
|
|
|
|
|
-
|
|
|
-
|
|
|
widthCheck(str, len) {
|
|
|
var temp = 0
|
|
|
for (var i = 0; i < str.value.length; i++) {
|
|
|
@@ -385,41 +392,54 @@
|
|
|
this.startTime = getDate(time2.getFullYear(), time2.getMonth(), time2.getDate())
|
|
|
this.getSessionList(1)
|
|
|
},
|
|
|
+
|
|
|
+
|
|
|
// 获取列表数据
|
|
|
- getSessionList(page, size = 10) {
|
|
|
+ getSessionList(page, size = 10 ) {
|
|
|
+ let searchText =this.input3
|
|
|
let str = "index" + "customer-service" + "Message" + this.time + "service";
|
|
|
let obj = {
|
|
|
headers: {
|
|
|
- "Content-Type": "application/x-www-form-urlencoded",
|
|
|
apiToken: this.$md5(str),
|
|
|
userToken: this.token
|
|
|
}
|
|
|
};
|
|
|
- this.post(
|
|
|
- "api/service/Message/index", {
|
|
|
+ this.post("api/service/Message/index", {
|
|
|
start_time: this.startTime,
|
|
|
end_time: this.endTime,
|
|
|
pageSize: size,
|
|
|
- pageNumber: page
|
|
|
+ pageNumber: page,
|
|
|
+ searchText:searchText,
|
|
|
},
|
|
|
- obj,
|
|
|
- str
|
|
|
+ obj
|
|
|
).then(res => {
|
|
|
- if (res.data.data) {
|
|
|
- this.tableData = res.data.data;
|
|
|
- this.pages = res.data.data.length;
|
|
|
- console.log(this.pages)
|
|
|
+ if (res.data.status == 1) {
|
|
|
+ this.tableData = res.data.data.list;
|
|
|
+ //this.pages = res.data.data.length;
|
|
|
+ this.pages = res.data.data.total;
|
|
|
+ // console.log(res.data.data)
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+
|
|
|
+ //获取留言列表数据（行）
|
|
|
click_row(row, column, event) {
|
|
|
// console.log(this.value);
|
|
|
console.log(row)
|
|
|
this.uid = row.message_id;
|
|
|
this.drawer = true;
|
|
|
- // this.isShow = true;
|
|
|
+ this.isSendMessage = true;
|
|
|
this.getUserItem = row;
|
|
|
- console.log(this.getUserItem)
|
|
|
+ if(this.getUserItem.image.includes(',')){
|
|
|
+ this.getUserItem.image = this.getUserItem.image.split(',');
|
|
|
+ }else{
|
|
|
+ this.getUserItem.image =[this.getUserItem.image]
|
|
|
+ }
|
|
|
+ if(this.getUserItem.images.includes(',')){
|
|
|
+ this.getUserItem.images = this.getUserItem.images.split(',');
|
|
|
+ }else{
|
|
|
+ this.getUserItem.images = [this.getUserItem.images]
|
|
|
+ }
|
|
|
this.get_user(row.message_id)
|
|
|
},
|
|
|
childValue(e) {
|
|
|
@@ -496,6 +516,16 @@
|
|
|
.content_box {
|
|
|
.chat_user {
|
|
|
border-top: 1px solid #D5E5FF;
|
|
|
+ .block{
|
|
|
+ // padding: 10px 0;
|
|
|
+ text-align: center;
|
|
|
+ border: 1px solid #eff2f6;
|
|
|
+ display: inline-block;
|
|
|
+ width: 20%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ vertical-align: top;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|
