Skip to content

G
gassafety
Commit 52021878 authored by yaqizhang's avatar yaqizhang
Browse files
Options

详情反馈信息点击显示隐藏

parent cb779535
Hide whitespace changes
Inline Side-by-side
Showing with 129 additions and 57 deletions
gassafety-web/src/views/workOrder/basicsInfo/detail.vue
View file @ 52021878
......@@ -3,7 +3,7 @@
<!-- 工单信息 -->
<div style="padding-top: 10px;background: #fff;height: 100%;">
<div>
<div style="width: 5%;height: 50px;margin-left: 20px;" @click="$router.go(-1)">
<div style="width: 5%;height: 45px;margin-left: 20px;" @click="$router.go(-1)">
<el-button
size="medium"
type="text"
......@@ -20,9 +20,9 @@
</el-steps>
</div>
<div style="width: 100%;height: 280px;">
<div style="width: 100%;height: 265px;">
<el-divider></el-divider>
<div style="color: #31EAEA;width: 30%;height: 40px;">
<div style="color: #31EAEA;width: 30%;height: 30px;">
<ul><li>详细信息</li></ul>
</div>
<el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="float: left;margin-left: 50px;">
......@@ -101,65 +101,69 @@
</el-form-item>
</el-form>
</div>
<el-divider></el-divider>
<!-- 反馈信息 -->
<!-- <div style="width: 100%;font-weight: 600;height: 200px;" v-if="form.dealStatus != '' && form.dealStatus != null"> -->
<div style="width: 100%;font-weight: 600;">
<el-divider></el-divider>
<!-- <div style="width: 100%;font-weight: 600;" v-if="activity.deviceType != '' && activity.deviceType != null"> -->
<div style="width: 100%;font-weight: 600;">
<div style="color: #31EAEA;width: 100%;height: 40px;">
<ul><li>反馈信息</li></ul>
</div>
<div class="block" style="width: 95%;margin-left: 2%;">
<el-timeline>
<el-timeline-item v-for="(activity, index) in form.feedbackList" :key="index" :timestamp="activity.feedbackTime">
<el-card>
<div style="width: 600px;float: left;">
<div style=" width: 600px;">
<div style="float: left;margin-left: 50px; width: 250px;">
<p>设备类型：
<span v-if="activity.deviceType == 0">管道</span>
<span v-if="activity.deviceType == 1">调压箱</span>
<span v-if="activity.deviceType == 2">阀门井</span>
<span v-if="activity.deviceType == 3">流量计</span>
<span v-if="activity.deviceType == 4">压力表</span>
</p>
<p>设备名称：{{activity.deviceName}}</p>
<p>是否有隐患：
<span v-if="activity.isHiddenDanger == 1">是</span>
<span v-if="activity.isHiddenDanger == 2">否</span>
</p>
<div style="width: 600px;">
<p>反馈信息：
<span>{{activity.contents}}</span>
</p>
<div class="block" style="width: 95%;margin-left: 2%;">
<el-timeline ref="timeline">
<el-timeline-item v-for="(activity, index) in form.feedbackList" v-show='index>2?false:true' :key="index" :timestamp="activity.feedbackTime">
<el-card>
<div style="width: 600px;float: left;">
<div style=" width: 600px;">
<div style="float: left;margin-left: 50px; width: 250px;">
<p>设备类型：
<span v-if="activity.deviceType == 0">管道</span>
<span v-if="activity.deviceType == 1">调压箱</span>
<span v-if="activity.deviceType == 2">阀门井</span>
<span v-if="activity.deviceType == 3">流量计</span>
<span v-if="activity.deviceType == 4">压力表</span>
</p>
<p>是否有隐患：
<span v-if="activity.isHiddenDanger == 1">是</span>
<span v-if="activity.isHiddenDanger == 2">否</span>
</p>
<p v-if="activity.isHiddenDanger == 1">处理状态：
<span v-if="activity.dealStatus == 1">不需要处理</span>
<span v-if="activity.dealStatus == 2">已处理完成</span>
<span v-if="activity.dealStatus == 3">未处理完成</span>
</p>
<div style="width: 600px;">
<p>反馈信息：
<span>{{activity.contents}}</span>
</p>
</div>
</div>
<div style="float: left;margin-left: 50px; width: 250px;">
<p>设备名称：{{activity.deviceName}}</p>
<p>反馈时间：{{activity.feedbackTime}}</p>
</div>
</div>
</div>
<div style="float: left;margin-left: 50px; width: 250px;">
<p v-if="activity.dealStatus == 3">是否解决：未解决</p>
<p v-if="activity.dealStatus != 3">是否解决：已解决</p>
<p>反馈时间：{{activity.feedbackTime}}</p>
<p v-if="activity.isHiddenDanger == 1">处理状态：
<span v-if="activity.dealStatus == 1">不需要处理</span>
<span v-if="activity.dealStatus == 2">已处理完成</span>
<span v-if="activity.dealStatus == 3">未处理完成</span>
</p>
</div>
</div>
</div>
<div class="feedbackTime-div">
<div class="feedbackTime">
<el-image :src="activity.pictureUrl1" :preview-src-list="[activity.pictureUrl1]" v-if="activity.pictureUrl1 != null && activity.pictureUrl1 != ''" style="width: 90px;"></el-image>
</div>
<div class="feedbackTime">
<el-image :src="activity.pictureUrl2" :preview-src-list="[activity.pictureUrl2]" v-if="activity.pictureUrl2 != null && activity.pictureUrl2 != ''" style="width: 9s0px;"></el-image>
</div>
<div class="feedbackTime">
<el-image :src="activity.pictureUrl3" :preview-src-list="[activity.pictureUrl3]" v-if="activity.pictureUrl3 != null && activity.pictureUrl3 != ''" style="width: 90px;"></el-image>
</div>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
<div class="feedbackTime-div">
<div class="feedbackTime">
<el-image :src="activity.pictureUrl1" :preview-src-list="[activity.pictureUrl1]" v-if="activity.pictureUrl1 != null && activity.pictureUrl1 != ''" style="width: 90px;"></el-image>
</div>
<div class="feedbackTime">
<el-image :src="activity.pictureUrl2" :preview-src-list="[activity.pictureUrl2]" v-if="activity.pictureUrl2 != null && activity.pictureUrl2 != ''" style="width: 90px;"></el-image>
</div>
<div class="feedbackTime">
<el-image :src="activity.pictureUrl3" :preview-src-list="[activity.pictureUrl3]" v-if="activity.pictureUrl3 != null && activity.pictureUrl3 != ''" style="width: 90px;"></el-image>
</div>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
<el-button type="danger" icon="el-icon-info" @click="changeDisplay(scope)">
<span v-if="isDisplay==false">点击展开</span>
<span v-else>点击隐藏</span>
</el-button>
</div>
<!-- 返回按钮 -->
......@@ -182,6 +186,7 @@ export default {
},
data() {
return {
isDisplay:false,
dialogImageUrl: '',
dialogVisible: false,
disabled: false,
......@@ -238,13 +243,46 @@ export default {
},
// 表单参数
form: {},
activity: {},
// 表单校验
rules: {
},
active : 0,
orderId : ""
orderId : "",
showAndHide : false
};
},
// mocData() {
// for (var i = 0; i < activity.length; i++) {
// let item = {title: lists[i], name: activity[i]}
// this.detailList.push(activity)
// }
// console.log(this.detailList)
// },
// computed: {
// feedbackList: {
// get: function () {
// if (this.brandFold) {
// if (this.detailList.length < 7) {
// return this.detailList
// }
// let newArr = []
// for (var i = 0; i < 6; i++) {
// let item = this.detailList[i]
// newArr.push(activity)
// }
// return newArr
// }
// return this.detailList
// },
// set: function (val) {
// this.form.feedbackList = val
// }
// }
// },
// changeFoldState() {
// this.brandFold = !this.brandFold
// },
created() {
// 如果是跳转来的，则接受初始化参数
// this.user_id = this.$route.query.id; //详细信息页接收参数
......@@ -264,6 +302,31 @@ export default {
this.getBasicsInfo();
},
methods: {
// 点击按钮显示隐藏
changeDisplay(e){
this.isDisplay = !this.isDisplay
let $timeline = this.$refs.timeline;
if(!this.showAndHide){
for(let i = 0; i< $timeline.$children.length; i++){
if(i>3){
$timeline.$children[i].$el.style.display = "block";
}
}
this.showAndHide = true;
}else{
for(let i = 0; i< $timeline.$children.length; i++){
if(i>3){
$timeline.$children[i].$el.style.display = "none";
}
}
this.showAndHide = false;
}
//$timeline.toggleRowExpansion(row,true)
},
handleRemove(file) {
console.log(file);
},
......@@ -421,6 +484,15 @@ export default {
}
</script>
<style>
.el-tree-node__content{
width: 150px;
}
.el-divider--horizontal {
display: block;
height: 1px;
width: 100%;
margin: 20px 0;
}
.feedbackTime-div{
float: left;margin-left: 150px;margin-top: 10px;
}
......
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