<template>
<div class="consultList">
<template v-if="!isShowInfo">
<div class="head-title">
咨询管理
</div>
<div class="content">
<div>
<div class="searchInput" style="width:250px">
<el-input @keyup.enter.native="msg.pageIndex=1,getList()" @clear="msg.pageIndex=1,getList()"
style="display:inline-block;width:225px;height:30px" placeholder="请输入公司名称" v-model="msg.CompanyName"
size="small" clearable>
</el-input>
<span @click="msg.pageIndex=1,getList()" class="el-icon-search"
style="color:#979dad;font-size:14px;position:relative;top:1px"></span>
</div>
</div>
<el-table :data="tableData" v-loading="loading" border style="width: 100%;margin:20px 0">
<el-table-column prop="Id" label="编号" width="100">
</el-table-column>
<el-table-column prop="CompanyName" label="公司名称">
</el-table-column>
<el-table-column prop="FatCode" label="海关编码">
</el-table-column>
<el-table-column prop="FatTitle" label="咨询标题">
</el-table-column>
<el-table-column prop="FatQuestion" label="咨询问题">
</el-table-column>
<el-table-column prop="Principal" width="150" label="联系人">
</el-table-column>
<el-table-column prop="Mobile" width="150" label="联系电话">
</el-table-column>
<el-table-column prop="EMail" width="150" label="邮箱">
</el-table-column>
<el-table-column prop="AskStatusStr" width="150" label="咨询状态">
</el-table-column>
<el-table-column prop="address" width="200" label="操作">
<template slot-scope="scope">
<el-tooltip class="item" effect="dark" content="查看" placement="top">
<img @click="getInfo(scope.row,0)" src="../../assets/img/userman/icon-show.png" alt="">
</el-tooltip>
<el-tooltip class="item" effect="dark" content="回复" placement="top" v-if="scope.row.AskStatus==0">
<img @click="getInfo(scope.row,1)" src="../../assets/img/userman/reply.png" alt="">
</el-tooltip>
</template>
</el-table-column>
</el-table>
<el-pagination style="text-align:right" background @current-change="handleCurrentChange"
:page-size="msg.pageSize" :current-page.sync="msg.pageIndex" layout="total,prev, pager, next" :total="total">
</el-pagination>
</div>
</template>
<template v-else>
<div class="head-title">
<span @click="isShowInfo=false" style="color:rgb(64, 158, 255);cursor:pointer;">咨询管理</span><span
style="margin:0 9px;color:#C0C4CC">/</span><span>咨询详情</span>
</div>
<div class="content">
<el-form label-width="120px">
<el-form-item label="公司名称">
<el-input type="text" v-model="addMsg.CompanyName" class="w400" disabled></el-input>
</el-form-item>
<el-form-item label="海关编码">
<el-input type="text" v-model="addMsg.FatCode" class="w400" disabled></el-input>
</el-form-item>
<el-form-item label="咨询标题">
<el-input type="text" v-model="addMsg.FatTitle" class="w400" disabled></el-input>
</el-form-item>
<el-form-item label="咨询问题">
<el-input type="text" v-model="addMsg.FatQuestion" class="w400" disabled></el-input>
</el-form-item>
<el-form-item label="联系人">
<el-input type="text" v-model="addMsg.Principal" class="w400" disabled></el-input>
</el-form-item>
<el-form-item label="联系电话">
<el-input type="text" v-model="addMsg.Mobile" class="w400" disabled></el-input>
</el-form-item>
<el-form-item label="E-Mail">
<el-input type="text" v-model="addMsg.EMail" class="w400" disabled></el-input>
</el-form-item>
<el-form-item label="回复内容" v-if="addMsg.AskStatus==1">
<el-input type="textarea" v-model="addMsg.FatContent" class="w400" disabled></el-input>
</el-form-item>
</el-form>
<template v-if="showType==0">
<el-button size="small" style="margin-top:20px;padding:9px 25px;" type="primary" @click="isShowInfo=false">返回
</el-button>
</template>
<template v-if="showType==1">
<el-form label-width="120px">
<el-form-item label="回复内容">
<el-input type="textarea" v-model="replyMsg.FatContent" class="w400"></el-input>
</el-form-item>
</el-form>
<el-button size="small" style="margin-top:20px;padding:9px 25px;" type="primary" @click="saveReply()">回复
</el-button>
</template>
</div>
</template>
</div>
</template>
<script>
export default {
data() {
return {
msg: {
pageIndex: 1,
pageSize: 15,
CompanyName: '',
Type: 2,
},
total: 0,
tableData: [], //数据列表
isShowInfo: false, //是否显示详情,
addMsg: {},
showType: 0, //0-详情，1-回复
replyMsg: {
Id: 0,
AskStatus: 1,
FatContent: "", //回复内容
}
};
},
created() {
this.getList();
},
methods: {
getList() {
this.loading = true;
this.apipost("/api/Trade/GetCommerceAskPage", this.msg, res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.total = res.data.data.count;
let pageData = res.data.data.pageData;
this.tableData = pageData;
}
})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
//获取详情
getInfo(item, type) {
this.showType = type;
this.apipost("/api/Trade/GetCommerceAskInfo", {
Id: item.Id
}, res => {
if (res.data.resultCode == 1) {
this.isShowInfo = true;
this.replyMsg.Id = res.data.data.Id;
this.addMsg = res.data.data;
}
})
},
//咨询回复
saveReply() {
this.apipost("/api/Trade/ReplyCommerceAsk", this.replyMsg, res => {
if (res.data.resultCode == 1) {
this.Success(res.data.message);
this.isShowInfo = false;
this.getList();
} else {
this.Error(res.data.message);
}
})
}
},
mounted() {}
};
</script>
<style>
.consultList .remark_name {
color: #888888;
font-size: 12px;
margin-left: 10px;
float: right;
}
.consultList .app-image {
background-position: center center;
width: 50px;
height: 50px;
border-radius: 0%;
float: left;
margin-right: 8px;
}
.consultList .blue {
color: #409EFF;
}
.consultList .content .searchInput {
border: 1px solid #DCDFE6;
border-radius: 4px;
}
.consultList .content .searchInput .el-input__inner {
border: none;
outline: none;
height: 30px;
line-height: 30px;
}
.consultList .content .searchInput {
line-height: normal;
display: inline-table;
width: 100%;
border-collapse: separate;
border-spacing: 0;
width: 250px;
margin-right: 20px;
}
.consultList .content {
background: #fff;
margin-top: 10px;
padding: 20px;
box-sizing: border-box;
}
</style>