Skip to content

S
SuperMan
Commit f3c0086a authored by youjie's avatar youjie
Browse files
Options

评价信息

parent 04b9be38
Hide whitespace changes
Inline Side-by-side
Showing with 369 additions and 2 deletions
src/components/dmc/manager/dmcTotalTable.vue
View file @ f3c0086a
......@@ -386,6 +386,178 @@
<span style="color: #4BCA81;" v-if="item.PriceCommentFinishStatus==2">√</span>
<span class="colorE95252" v-else>{{item.PriceCommentFinishStatus==0?"x":"O"}}</span>
</div>
<el-popover width="1100" trigger="click" popper-class="DMC_HotelPop">
<div v-if="tcnDatas">
<div class="tcnDatasBox">
<div class="tcnDatasText">
<div>地接团号</div>
<div>{{ tcnDatas.DMCNum }}</div>
</div>
<div class="tcnDatasText">
<div>系列</div>
<div>{{ inforDatas.LtName }}</div>
</div>
<div class="tcnDatasText">
<div>线路</div>
<div>{{ inforDatas.LineName }} <span>（{{ inforDatas.StartDate }}出团）</span></div>
</div>
<div class="tcnDatasText">
<div>领队</div>
<div>{{ inforDatas.LeaderName }}</div>
</div>
<div class="tcnDatasText">
<div>导游</div>
<div>{{ inforDatas.GuideName }}</div>
</div>
<div class="tcnDatasText">
<div>人数</div>
<div>{{ inforDatas.OrderNum }}</div>
</div>
<div class="tcnDatasText">
<div>团号</div>
<div>({{ inforDatas.TCID }}){{inforDatas.TCNUM }}</div>
</div>
<div class="tcnDatasText">
<div>出团公司</div>
<div>{{ inforDatas.OutBranchName }}</div>
</div>
<div class="tcnDatasText">
<div>集合时间</div>
<div>{{ inforDatas.GatherTime }}</div>
</div>
<div class="tcnDatasText">
<div>航班信息</div>
<div>{{ flightInfor.Flight_number }}-{{flightInfor.AlName}}</div>
</div>
<div class="tcnDatasText">
<div>航班时间</div>
<div>{{flightInfor.FlightDate}} {{ flightInfor.Departure_time }}</div>
</div>
</div>
<div class="daysTitle-box">
<div class="daysTitle"
:class="[current==item.Id?'active':'']"
v-for="(item, index) in days"
:key="index"
@click="getDay(item.Id,index)">
<span>{{ item.Name }}</span>
</div>
</div>
<div class="daysInforBox">
<div class="daysInforFor" v-for="(item,index) in daysInfor" :key="index">
<div class="daysInforTitle">{{item.CommentName}}</div>
<div class="daysInforCenter">
<div class="daysInforCBox" v-for="(child,childIndex) in item.SourceList" :key="childIndex">
<div class="daysInforCBox-left">
<el-image
:src="child.CommentImg"
:preview-src-list="[child.CommentImg]">
</el-image>
</div>
<div class="daysInforCBox-right">
<div class="daysInforCBox-r-title">资源名：{{ child.SourceName?child.SourceName:'-' }}</div>
<div class="daysInforCBox-r-addr">地址：{{ child.Address?child.Address:'-' }}</div>
<div v-if="child.Score" class="daysInforCBox-r-score">
<span class="daysInforCBox-r-scoret">评分：</span>
<el-rate
v-model="child.Score"
disabled
text-color="#ff9900">
</el-rate>
<span style="color: #ff9900;">{{child.Score}}.0</span>
</div>
</div>
<div class="daysInforCBox-right">
<div class="daysInforCBox-r-info">评价：{{ child.Info?child.Info:'-' }}</div>
<div class="ImgListBox">
<div v-for="(items,indexs) in child.ImgList" :key="indexs">
<el-image v-if="checkFileType(items)==1"
style="width: 50px; height: 50px"
:src="items"
:preview-src-list="[items]">
</el-image>
<video v-else
style="width: 50px; height: 50px" :id="`myVideo_${indexs}`"
:src="items"
:controls="true"
:show-fullscreen-btn="true"></video>
</div>
</div>
</div>
</div>
</div>
<!-- <el-table
:data="item.SourceList"
style="width: 100%">
<el-table-column
fixed
label="封面"
width="60">
<template slot-scope="scope">
<el-image
style="width:30px; height: 30px"
:src="scope.row.CommentImg"
:preview-src-list="[scope.row.CommentImg]">
</el-image>
</template>
</el-table-column>
<el-table-column
fixed
prop=""
label="类型"
width="80">
<template slot-scope="scope">
{{item.CommentName}}
</template>
</el-table-column>
<el-table-column
label="资源名称" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.SourceName }}
</template>
</el-table-column>
<el-table-column
label="地址" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.Address }}
</template>
</el-table-column>
<el-table-column
label="评价" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.Info }}
</template>
</el-table-column>
<el-table-column
label="评分"
width="60">
<template slot-scope="scope">
<span v-if="scope.row.Score" style="color: red">{{ scope.row.Score }}.0</span>
</template>
</el-table-column>
<el-table-column
label="图">
<template slot-scope="scope">
<div class="ImgListBox">
<div v-for="(items,indexs) in scope.row.ImgList" :key="indexs">
<el-image
style="width: 30px; height: 30px"
:src="checkFileType(items)?items:''"
:preview-src-list="[checkFileType(items)?items:'']">
</el-image>
</div>
</div>
</template>
</el-table-column>
</el-table> -->
</div>
</div>
</div>
<span slot="reference" class="price"
style="cursor:pointer;text-decoration:underline;"
@click="getData(item)">评价信息</span>
</el-popover>
</td>
<td>
<div class="fz16 fbold linkspan" @click="goUrlYongKuan('leaderReimbursement',item,outItem,'用款计划')">
......@@ -789,7 +961,25 @@
StartDate: "", //开始日期
EndDate: "", //结束日期
EmployeeID: 0,
}
},
tcnLoading: false,
tcnDatas: null,
inforDatas: null,
flightInfor: null,
days: [],
daysInfor: [],
tcnIndex: 0,
current: 1,
types:{
CommentType: 1,
CommentName: '酒店',
CoverImg: null,
DayNum: null,
DayStr: null,
SourceList: [
]
},
}
},
components: {
......@@ -800,6 +990,89 @@
DateLimit
},
methods: {
checkFileType(url) {
// 提取扩展名（去除查询参数）
const path = url.split('?')[0]; // 去掉 ? 后的参数
const extension = path.split('.').pop().toLowerCase();
// 图片扩展名列表
const imageExts = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg'];
// 视频扩展名列表
const videoExts = ['mp4', 'webm', 'ogg', 'mov', 'avi', 'mkv', 'flv'];
let fileType = 0;
if (imageExts.includes(extension)) {
fileType = 1;
} else if (videoExts.includes(extension)) {
fileType = 2;
} else {
fileType = '未知类型';
}
return fileType
},
getDay(e,index){
this.current = e
this.tcnIndex = index
this.daysInfor = []
this.AssemblyData(index)
},
AssemblyData(index){
let DayList = this.inforDatas.DayList[index]
for (let i = 0; i < DayList.SourceList.length; i++) {
let Source = DayList.SourceList[i]
let findIndex = this.daysInfor.findIndex(item=>{return item.CommentType == Source.CommentType})
if(findIndex==-1){
let types = JSON.parse(JSON.stringify(this.types))
if(Source.CommentType==1){
types.CommentType = 1
types.CommentName = '酒店'
}else if(Source.CommentType==2){
types.CommentType = 2
types.CommentName = '餐'
}else if(Source.CommentType==3){
types.CommentType = 3
types.CommentName = '景点'
}else if(Source.CommentType==4){
types.CommentType = 4
types.CommentName = '车'
}
types.CoverImg = DayList.CoverImg
types.DayNum = DayList.DayNum
types.SourceList.push(Source)
this.daysInfor.push(types)
}else{
this.daysInfor[findIndex].SourceList.push(Source)
}
}
},
getData(item) {
let msg = {
TCIDs: item.TCID
}
this.current = 1
this.tcnIndex = 0
this.days = []
this.daysInfor = []
this.tcnLoading = true
this.apipost("survey_post_GetPriceCommentInfo", msg,(res) => {
if(res.data.resultCode == 1 ) {
this.tcnLoading = false
this.tcnDatas= res.data.data
this.inforDatas = res.data.data.priceList[0]
this.AssemblyData(this.tcnIndex)
this.flightInfor = this.inforDatas.flightList[0]
for (let i = 0; i < this.inforDatas.DayNum; i++) {
let name = i + 1>9? i + 1: "0" + (i + 1)
this.days.push({
Name: name,
Id: i+1,
})
}
console.log(this.days,'---daysInfor')
}
},(err)=>{
this.tcnLoading = false
})
},
GoCompanyAlipay(obj) {
let routeData = this.$router.resolve({
name: 'AlipayManagementDetail',
......@@ -1652,5 +1925,99 @@
border-top: 25px solid #ff0000;
border-right: 50px solid transparent;
} */
.tcnDatasBox,.tcnDatasText,.daysTitle-box,.ImgListBox{
display: flex;
flex-direction: row;
}
.tcnDatasBox,.tcnDatasText{
flex-wrap: wrap;
}
.tcnDatasText{
width: 25%;
}
.tcnDatasText div:first-child{
margin-right: 5px;
font-weight: bold;
}
.daysTitle-box{
flex-wrap: nowrap;
padding: 10px 0 10px 0;
}
.daysTitle{
font-weight: bold;
font-size: 14px;
border-radius: 29px;
line-height: 25px;
padding: 0 20px;
color: #757776;
border: 1px solid #F0F0F0;
background: #F0F0F0;
margin-right: 10px;
cursor: pointer;
}
.daysTitle.active{
color: #33B3FF;
border: 1px solid #33B3FF;
background: #fff;
}
.ImgListBox .el-image{
margin-right: 10px;
}
.daysInforBox{
height: 200px;
overflow: auto;
}
/deep/.daysInforBox .el-table .el-table__cell{
padding: 3px 0;
}
/deep/.daysInforBox .el-table tr th{
background: #f6f6f6;
}
.daysInforFor{
border-bottom: 1px solid #ccc;
margin-top: 10px;
margin-bottom: 10px;
}
.daysInforTitle{
font-size: 16px;
font-weight: bold;
margin-bottom: 10px;
}
.daysInforCBox{
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 10px;
}
.daysInforCBox-left{
width: 70px;
height: 70px;
background: #eee;
}
.daysInforCBox-left .el-image {
width: 100%;
height: 100%;
}
.daysInforCBox-right{
flex: 1;
margin-left: 10px;
}
.daysInforCBox-r-title{
font-size: 14px;
font-weight: bold;
}
.daysInforCBox-r-addr,.daysInforCBox-r-info{
font-size: 13px;
color: #757776;
}
.daysInforCBox-r-score{
display: flex;
}
.ImgListBox{
margin-top: 10px;
}
.daysInforCBox-r-scoret{
font-size: 13px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment