350 lines
12 KiB
Plaintext
350 lines
12 KiB
Plaintext
<script setup lang="ts">
|
||
import AppBlock from "@/components/AppBlock.vue";
|
||
import HomeHead from "@/views/home/components/HomeHead.vue";
|
||
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
||
import { useMessage, NModal } from "naive-ui";
|
||
import { useUserStore } from "@/stores/modules/user";
|
||
import { trendsPage, faqPage,demandPage,reply,faqDetail } from "@/api/daikin/base";
|
||
const message = useMessage();
|
||
const store = useUserStore();
|
||
const { push } = useRouter();
|
||
const header = { token: store.user.token };
|
||
|
||
const dataA = ref([]);
|
||
const dataB = ref([]);
|
||
const dataC = ref([]);
|
||
const editA = ref();
|
||
const dataInfo = reactive({
|
||
treeSource: 2,
|
||
type: 0,
|
||
pageSize: 100
|
||
});
|
||
|
||
async function boardMsg(page: number) {
|
||
const pageNum = page;
|
||
const { treeSource, type, pageSize } = dataInfo;
|
||
if (treeSource === 1) {
|
||
const { rows } = await trendsPage({ pageNum, pageSize });
|
||
if(rows&&rows!=null&&rows.length>0){
|
||
dataA.value = rows.map((item: { content: string; }) => {
|
||
const mergedItem = Object.assign({}, item, {
|
||
content: unescapeHTML(item.content)
|
||
});
|
||
return mergedItem;
|
||
});
|
||
}
|
||
|
||
|
||
console.log(dataA.value)
|
||
}
|
||
else if (treeSource == 2) {
|
||
const { rows } = await faqPage({ pageNum, pageSize });
|
||
|
||
dataB.value = rows;
|
||
|
||
|
||
}
|
||
else {
|
||
const { rows } = await demandPage({ pageNum, pageSize });
|
||
|
||
dataC.value = rows;
|
||
|
||
|
||
}
|
||
}
|
||
const lazyState = computed(() => [dataInfo.treeSource]);
|
||
watch(
|
||
() => unref(lazyState),
|
||
async (v) => {
|
||
boardMsg(1);
|
||
},
|
||
{ immediate: true, deep: true }
|
||
);
|
||
|
||
onMounted(async () => {
|
||
boardMsg(1)
|
||
});
|
||
|
||
const handleEditA = (index: number, row: any) => {
|
||
push({ name: "InfosEdit", query: { id: row.id } });
|
||
};
|
||
|
||
const handleDeleteA = (index: any, row: any) => {
|
||
|
||
};
|
||
|
||
const activeName = ref('2')
|
||
const handleClick=(e: { props: { name: number; }; })=>{
|
||
console.log(e.props.name)
|
||
dataInfo.treeSource =e.props.name
|
||
}
|
||
|
||
function unescapeHTML(html: string) {
|
||
const doc = new DOMParser().parseFromString(html, 'text/html');
|
||
return doc.documentElement.textContent;
|
||
}
|
||
const shormB = ref(false)
|
||
const editData = ref()
|
||
const toReply=(obj)=>{
|
||
editData.value = obj
|
||
shormB.value = true
|
||
}
|
||
|
||
const replyFor=async ()=>{
|
||
const {id} = editData.value
|
||
if(!id||!shut.value) return
|
||
const {code,msg} = await reply({id,source:dataInfo.treeSource,content:shut.value})
|
||
if(code===200){
|
||
message.info("操作成功！")
|
||
shormB.value = false
|
||
}
|
||
else{
|
||
message.error(msg)
|
||
}
|
||
}
|
||
const shut = ref()
|
||
const shormA = ref(false)
|
||
const Info = ref()
|
||
const detilInfo=async (obj)=>{
|
||
const {id} = obj
|
||
if(!id) return
|
||
const {data} = await faqDetail({id})
|
||
Info.value = data
|
||
shormA.value = true
|
||
console.log(obj)
|
||
}
|
||
</script>
|
||
<template>
|
||
<HomeHead class="top">
|
||
<template #content>
|
||
<!-- <HomeHeadSearch /> -->
|
||
</template>
|
||
</HomeHead>
|
||
<AppBlock class="w-full h950px p30px text-#000">
|
||
<div class="font-600 flex items-center" style="margin-bottom: 20px">
|
||
<!-- <img src="./images/logo.svg" class="h56px mr21px" /> -->
|
||
<div class="text-36px text-#000">留言板列表</div>
|
||
</div>
|
||
<el-tabs v-model="activeName" class="demo-tabs text-20px" @tab-click="handleClick">
|
||
<el-tab-pane v-if="false" label="供方动态" name="1" class=" text-25px">
|
||
|
||
<div class="cont relative w100% h800px overflow-y-auto">
|
||
<el-table :data="dataA" style="width: 95%" :header-cell-style="{
|
||
background: '#2A7BF7',
|
||
color: '#fff',
|
||
height: '60px',
|
||
textAlign: 'center',
|
||
'font-size': '24px',
|
||
}" :cell-style="{ 'text-align': 'center' }">
|
||
|
||
<el-table-column label="标题" prop="title" />
|
||
<el-table-column label="内容" prop="content">
|
||
<template #default="scope">
|
||
<div class="container" v-html="scope.row.content"></div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" width="200px">
|
||
<template #default="scope">
|
||
<!-- <el-button size="small" @click="handleEditA(scope.$index, scope.row)">编辑</el-button>
|
||
<el-button size="small" type="danger" @click="handleDeleteA(scope.$index, scope.row)">删除</el-button> -->
|
||
<el-button size="small" @click="toReply(scope.row)">回复</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
|
||
</el-tab-pane>
|
||
<el-tab-pane label="供应商留言" name="2" class=" text-25px">
|
||
|
||
<div class="cont relative w100% h800px overflow-y-auto">
|
||
<el-table :data="dataB" style="width: 95%" :header-cell-style="{
|
||
background: '#2A7BF7',
|
||
color: '#fff',
|
||
height: '60px',
|
||
textAlign: 'center',
|
||
'font-size': '24px',
|
||
}" :cell-style="{ 'text-align': 'center' }">
|
||
<el-table-column label="供方名称" prop="userName" />
|
||
<el-table-column label="留言编号" prop="number">
|
||
|
||
<template #default="scope">
|
||
<span @click="detilInfo(scope.row)">{{scope.row.number}}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" width="200px">
|
||
<template #default="scope">
|
||
<!-- <el-button size="small" @click="handleEditA(scope.$index, scope.row)">编辑</el-button>
|
||
<el-button size="small" type="danger" @click="handleDeleteA(scope.$index, scope.row)">删除</el-button> -->
|
||
<el-button size="small" @click="toReply(scope.row)">回复</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
|
||
</el-tab-pane>
|
||
<el-tab-pane label="空调需求依赖" name="3" class=" text-25px">
|
||
<div class="cont relative w100% h800px overflow-y-auto">
|
||
<el-table :data="dataC" style="width: 95%" :header-cell-style="{
|
||
background: '#2A7BF7',
|
||
color: '#fff',
|
||
height: '60px',
|
||
textAlign: 'center',
|
||
'font-size': '24px',
|
||
}" :cell-style="{ 'text-align': 'center' }">
|
||
<el-table-column label="供方名称" prop="userName" />
|
||
<el-table-column label="适用对象" prop="usdObj" />
|
||
<el-table-column label="需求依赖" prop="demand" />
|
||
<el-table-column label="安装位置" prop="location" />
|
||
<el-table-column label="采购时间" prop="procureTime" />
|
||
<el-table-column label="备注信息" prop="remark" />
|
||
|
||
<el-table-column label="操作" width="200px">
|
||
<template #default="scope">
|
||
<!-- <el-button size="small" @click="handleEditA(scope.$index, scope.row)">编辑</el-button>
|
||
<el-button size="small" type="danger" @click="handleDeleteA(scope.$index, scope.row)">删除</el-button> -->
|
||
<el-button size="small" @click="toReply(scope.row)">回复</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
</el-tab-pane>
|
||
|
||
</el-tabs>
|
||
</AppBlock>
|
||
<NModal v-model:show="shormB">
|
||
<div class="w-400px bg-#fff rd-20px p30px">
|
||
<el-form :model="editA" label-width="120px" :inline="true">
|
||
<el-form-item label="回复内容">
|
||
<el-input v-model="shut" />
|
||
</el-form-item>
|
||
</el-form>
|
||
<el-button type="primary" @click="replyFor" class="ml-43%">确认</el-button>
|
||
</div>
|
||
</NModal>
|
||
<NModal v-model:show="shormA" v-if="Info&&Info.faqList.length>0">
|
||
<div class="w-1000px bg-#fff rd-10px p30px">
|
||
<div style="
|
||
width: 100%;
|
||
padding-top: 38px;
|
||
padding-left: 38px;
|
||
">
|
||
<span style="
|
||
font-weight: 600;
|
||
width: 853px;
|
||
height: 19px;
|
||
font-size: 18px;
|
||
text-align: left;
|
||
color: #142142 100%;
|
||
">为更好地构筑与各供应商的合作伙伴关系，各司可随时通过本平台进行留言，我们将及时跟进并反馈给贵司。</span>
|
||
<div style="
|
||
font-weight: 400;
|
||
height: 18px;
|
||
font-size: 18px;
|
||
text-align: left;
|
||
color: #142142 100%;
|
||
margin-top: 30px;
|
||
margin-bottom: 20px;
|
||
">
|
||
1.贵司短期或中长期是否有国内外建厂（事务所）计划？
|
||
</div>
|
||
<div style="
|
||
margin-top: 20px;
|
||
width: 838px;
|
||
height: 36px;
|
||
border-radius: 5px 5px 5px 5px;
|
||
background: #ffffff;
|
||
">
|
||
<span style="height: 36px" class="text-#2A7BF7 ml-15px" v-if="Info.faqList[0]">{{Info.faqList[0].replyTxt}}</span>
|
||
|
||
</div>
|
||
<div style="
|
||
font-weight: 400;
|
||
height: 18px;
|
||
font-size: 18px;
|
||
text-align: left;
|
||
color: #142142 100%;
|
||
margin-top: 30px;
|
||
margin-bottom: 20px;
|
||
">
|
||
2.贵司近期是否有开发新产品/新领域的项目？（若有，请进行简单的介绍。）
|
||
</div>
|
||
<div style="
|
||
margin-top: 20px;
|
||
width: 838px;
|
||
height: 36px;
|
||
border-radius: 5px 5px 5px 5px;
|
||
background: #ffffff;
|
||
">
|
||
<el-form-item>
|
||
<span style="height: 36px" class="text-#2A7BF7 ml-15px" v-if="Info.faqList[1]">{{Info.faqList[1].replyTxt}}</span>
|
||
</el-form-item>
|
||
</div>
|
||
<div style="
|
||
font-weight: 400;
|
||
height: 18px;
|
||
font-size: 18px;
|
||
text-align: left;
|
||
color: #142142 100%;
|
||
margin-top: 30px;
|
||
margin-bottom: 20px;
|
||
">
|
||
3.目前在使用大金的线上化系统中，是否有不便、希望改善之处？（含HOMEPAGE、明道云线上调查表等）
|
||
</div>
|
||
<div style="
|
||
margin-top: 20px;
|
||
width: 838px;
|
||
height: 36px;
|
||
border-radius: 5px 5px 5px 5px;
|
||
background: #ffffff;
|
||
">
|
||
<el-form-item>
|
||
<span style="height: 36px" class="text-#2A7BF7 ml-15px" v-if="Info.faqList[2]">{{Info.faqList[2].replyTxt}}</span>
|
||
</el-form-item>
|
||
</div>
|
||
<div style="
|
||
font-weight: 400;
|
||
height: 18px;
|
||
font-size: 18px;
|
||
text-align: left;
|
||
color: #142142 100%;
|
||
margin-top: 30px;
|
||
margin-bottom: 20px;
|
||
">
|
||
4.在与我们的合作中，是否有其他愿景或建议？
|
||
</div>
|
||
<div style="
|
||
margin-top: 20px;
|
||
width: 838px;
|
||
height: 36px;
|
||
border-radius: 5px 5px 5px 5px;
|
||
background: #ffffff;
|
||
">
|
||
<el-form-item>
|
||
<span style="height: 36px" class="text-#2A7BF7 ml-15px" v-if="Info.faqList[3]">{{Info.faqList[3].replyTxt}}</span>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</NModal>
|
||
</template>
|
||
|
||
<style lang="less">
|
||
.demo-tabs>.el-tabs__content {
|
||
color: #6b778c;
|
||
font-size: 32px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.top {
|
||
position: absolute;
|
||
right: 30px;
|
||
top: -92px;
|
||
}
|
||
|
||
.flex-center {
|
||
display: flex;
|
||
justify-content: center;
|
||
margin: 0 auto;
|
||
}
|
||
</style> |