Commit 48a83927 authored by 王晓倩's avatar 王晓倩

详情页改为弹窗模式

parent 101b3348
......@@ -118,65 +118,107 @@
<!-- 添加或修改用户加装安全装置台账对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body @cancel="cancel">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<el-col :span="11">
<el-form-item label="用户名称" prop="userName">
<el-input v-model="form.userName" placeholder="请输入用户名称"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="用户编号" prop="userNo">
<el-input v-model="form.userNo" placeholder="请输入用户编号"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" placeholder="请输入身份证号" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系电话" prop="linkMobile">
<el-input v-model="form.linkMobile" placeholder="请输入联系电话" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="详细地址" prop="userAddress">
<el-input type="textarea" v-model="form.userAddress" placeholder="请输入详细地址"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="品牌名称" prop="brandName">
<el-input v-model="form.brandName" placeholder="请输入品牌名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="安装时间" prop="installTime">
<el-date-picker clearable size="small"
v-model="form.installTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择安装时间"
style="width: 100%">
</el-date-picker>
<div v-if="title != '用户加装安全装置台账详情'">
<el-row>
<el-col :span="11">
<el-form-item label="用户名称" prop="userName">
<el-input v-model="form.userName" placeholder="请输入用户名称"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="用户编号" prop="userNo">
<el-input v-model="form.userNo" placeholder="请输入用户编号"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" placeholder="请输入身份证号" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系电话" prop="linkMobile">
<el-input v-model="form.linkMobile" placeholder="请输入联系电话" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="详细地址" prop="userAddress">
<el-input type="textarea" v-model="form.userAddress" placeholder="请输入详细地址"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="品牌名称" prop="brandName">
<el-input v-model="form.brandName" placeholder="请输入品牌名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="安装时间" prop="installTime">
<el-date-picker clearable size="small"
v-model="form.installTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择安装时间"
style="width: 100%">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="备注信息" prop="remarks">
<el-input type="textarea" v-model="form.remarks" placeholder="请输入备注信息" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-else>
<el-row>
<el-col :span="11">
<el-form-item label="用户名称:">
<font>{{form.userName}}</font>
</el-form-item>
<el-form-item label="身份证号:">
<font>{{form.idCard}}</font>
</el-form-item>
<el-form-item label="品牌名称:">
<font v-if="form.brandName != '' && form.brandName != null">{{form.brandName}}</font>
<font v-else> - </font>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="用户编号:">
<font v-if="form.userNo != '' && form.userNo != null">{{form.userNo}}</font>
<font v-else> - </font>
</el-form-item>
<el-form-item label="联系电话:">
<font>{{form.linkMobile}}</font>
</el-form-item>
<el-form-item label="安装时间:">
<font>{{form.installTime}}</font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="详细地址:">
<font>{{form.userAddress}}</font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="备注信息" prop="remarks">
<el-input type="textarea" v-model="form.remarks" placeholder="请输入备注信息" />
</el-row>
<el-row>
<el-form-item label="备注信息:">
<font v-if="form.remarks != '' && form.remarks != null">{{form.remarks}}</font>
<font v-else> - </font>
</el-form-item>
</el-col>
</el-row>
</el-row>
</div>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button v-if="title != '用户加装安全装置台账详情'" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
......@@ -362,12 +404,13 @@ export default {
},
/** 详细信息跳转 */
showDetail(row) {
this.$router.push({
path: '/standingBook/equipmentDetail',
query: {
safeEquipmentId: row.safeEquipmentId
}
})
this.reset();
getEquipment(row.safeEquipmentId).then(response => {
console.log("data",response.data);
this.form = response.data;
this.open = true;
this.title = "用户加装安全装置台账详情";
});
},
}
};
......
<template>
<div class="app-container">
<!--<el-row>
<el-col :span="24" style="padding-left: 15px;margin-bottom: -10px;">
<div style="height: 45px;" @click="$router.go(-1)">
<el-button size="medium" type="text" style="font-size: 18px; color: rgb(7, 63, 112);float: left;">返回
</el-button>
</div>
</el-col>
</el-row>-->
<el-row style="width: 100%;height: 40px;">
<el-col :span="24">
<div style="">
<ul>
<li style="list-style: none;font-weight: 900;font-size: 20px;color: #053b6a;">燃气用户加装安全装置台账详情</li>
</ul>
</div>
</el-col>
</el-row>
<el-row style="width: 100%;padding: 20px;">
<el-form ref="form" v-model="form" label-width="100px" style="width: 100%;">
<el-row>
<el-col :span="6">
<el-form-item label="用户名称:" prop="userName">
<font>{{form.userName}}</font>
</el-form-item>
<el-form-item label="身份证号:" prop="idCard">
<font>{{form.idCard}}</font>
</el-form-item>
<el-form-item label="品牌名称:" prop="brandName">
<font v-if="form.brandName != '' && form.brandName != null">{{form.brandName}}</font>
<font v-else> - </font>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="用户编号:" prop="userNo">
<font v-if="form.userNo != '' && form.userNo != null">{{form.userNo}}</font>
<font v-else> - </font>
</el-form-item>
<el-form-item label="联系电话:" prop="linkMobile">
<font>{{form.linkMobile}}</font>
</el-form-item>
<el-form-item label="安装时间:" prop="installTime">
<font>{{form.installTime}}</font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="详细地址:" prop="userAddress">
<font>{{form.userAddress}}</font>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="备注信息:" prop="remarks">
<font v-if="form.remarks != '' && form.remarks != null">{{form.remarks}}</font>
<font v-else> - </font>
</el-form-item>
</el-row>
</el-form>
</el-row>
</div>
</template>
<script>
import { getEquipment } from "@/api/standingBook/equipment";
export default {
name: "equipmentDetail",
components: {
},
data() {
return {
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 表单参数
form: {},
// 表单校验
rules: {
}
};
},
created() {
// 如果是跳转来的,则接受初始化参数
this.safeEquipmentId = this.$route.query.safeEquipmentId;
},
mounted() {
this.getDetail();
},
methods: {
getDetail() {
getEquipment(this.safeEquipmentId).then(response => {
this.form = response.data;
console.log(this.form, "this.form")
const obj =this.form;
});
},
}
}
</script>
<template>
<div class="app-container">
<!--<el-row>
<el-col :span="24" style="padding-left: 15px;margin-bottom: -10px;">
<div style="height: 45px;" @click="$router.go(-1)">
<el-button size="medium" type="text" style="font-size: 18px; color: rgb(7, 63, 112);float: left;">返回
</el-button>
</div>
</el-col>
</el-row>-->
<el-row style="width: 100%;height: 40px;">
<el-col :span="24">
<div style="">
<ul>
<li style="list-style: none;font-weight: 900;font-size: 20px;color: #053b6a;">隐患整治台账详情</li>
</ul>
</div>
</el-col>
</el-row>
<el-row style="width: 100%;padding: 20px;">
<el-form ref="form" v-model="form" label-width="120px" style="width: 100%;">
<el-row>
<el-col :span="6">
<el-form-item label="隐患名称:" prop="hiddenTitle">
<font>{{form.hiddenTitle}}</font>
</el-form-item>
<el-form-item label="隐患发现人员:" prop="hiddenFindPeople">
<font>{{form.hiddenFindPeople}}</font>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="隐患等级:" prop="hiddenType">
<font v-if="form.hiddenType == '1'">一级隐患</font>
<font v-if="form.hiddenType == '2'">二级隐患</font>
<font v-if="form.hiddenType == '3'">三级隐患</font>
</el-form-item>
<el-form-item label="发现时间:" prop="hiddenFindDate">
<font>{{form.hiddenFindDate}}</font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="隐患位置:" prop="hiddenLocation">
<font>{{form.hiddenLocation}}</font>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="隐患内容:" prop="hiddenContent">
<font>{{form.hiddenContent}}</font>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="整治情况:" prop="remediation">
<font v-if="form.remediation != '' && form.remediation != null">{{form.remediation}}</font>
<font v-else> - </font>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="备注信息:" prop="remarks">
<font v-if="form.remarks != '' && form.remarks != null">{{form.remarks}}</font>
<font v-else> - </font>
</el-form-item>
</el-row>
</el-form>
</el-row>
</div>
</template>
<script>
import { getHidden } from "@/api/standingBook/hidden";
export default {
name: "hiddenDetail",
components: {
},
data() {
return {
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 表单参数
form: {},
// 表单校验
rules: {
}
};
},
created() {
// 如果是跳转来的,则接受初始化参数
this.hiddenId = this.$route.query.hiddenId;
},
mounted() {
this.getDetail();
},
methods: {
getDetail() {
getHidden(this.hiddenId).then(response => {
this.form = response.data;
console.log(this.form, "this.form")
const obj =this.form;
});
},
}
}
</script>
......@@ -132,6 +132,7 @@
<!-- 添加或修改事故台账对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body @cancel="cancel">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<div v-if="title != '燃气事故台账详情'">
<el-row>
<el-col :span="11">
<el-form-item label="事故名称" prop="troubleName">
......@@ -234,10 +235,66 @@
</el-form-item>
</el-col>
</el-row>
</div>
<div v-else>
<el-row>
<el-col :span="11">
<el-form-item label="事故名称:">
<font>{{form.troubleName}}</font>
</el-form-item>
<el-form-item label="事故原因:">
<font>{{form.troubleReason}}</font>
</el-form-item>
<el-form-item label="责任单位:">
<font v-if="form.responsibleUnit != '' && form.responsibleUnit != null">{{form.responsibleUnit}}</font>
<font v-else> - </font>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="事故类型:">
<font v-if="form.troubleType == '1'">安全生产事故</font>
<font v-if="form.troubleType == '2'">非生产安全事故</font>
</el-form-item>
<el-form-item label="事故地点:">
<font>{{form.troubleLocation}}</font>
</el-form-item>
<el-form-item label="责任人员:">
<font v-if="form.responsiblePeople != '' && form.responsiblePeople != null">{{form.responsiblePeople}}</font>
<font v-else> - </font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="简要经过:">
<font v-if="form.briefProcess != '' && form.briefProcess != null">{{form.briefProcess}}</font>
<font v-else> - </font>
</el-form-item>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="是否处理:">
<font v-if="form.isDeal == '1'">已处理</font>
<font v-if="form.isDeal == '2'">未处理</font>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="处理完成时间:">
<font>{{form.dealDate}}</font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="备注信息:">
<font v-if="form.remarks != '' && form.remarks != null">{{form.remarks}}</font>
<font v-else> - </font>
</el-form-item>
</el-row>
</div>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button v-if="title != '燃气事故台账详情'" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
......@@ -316,7 +373,7 @@ export default {
{ required: true, message: "请输入事故地点", trigger: "blur" },
],
longitude: [
{ required: true, message: "请输入经纬度", trigger: "blur" },
{ required: true, message: "请输入经纬度", trigger: ["blur","change"] },
],
happenDate: [
{ required: true, message: "请输入经纬度", trigger: "blur" },
......@@ -364,6 +421,8 @@ export default {
troubleId: null,
troubleName: null,
troubleLocation: null,
longitude:null,
latitude: null,
troubleType: null,
briefProcess: null,
troubleReason: null,
......@@ -396,17 +455,16 @@ export default {
handleAdd() {
this.reset();
this.open = true;
this.title = "添加事故台账";
this.title = "添加燃气事故台账";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const troubleId = row.troubleId || this.ids
getTrouble(troubleId).then(response => {
getTrouble(row.troubleId).then(response => {
this.form = response.data;
this.devicePos = [this.form.longitude, this.form.latitude];
this.open = true;
this.title = "修改事故台账";
this.title = "修改燃气事故台账";
});
},
/** 提交按钮 */
......@@ -461,12 +519,13 @@ export default {
},
/** 详细信息跳转 */
showDetail(row) {
this.$router.push({
path: '/standingBook/troubleDetail',
query: {
troubleId: row.troubleId
}
})
this.reset();
getTrouble(row.troubleId).then(response => {
this.form = response.data;
this.devicePos = [this.form.longitude, this.form.latitude];
this.open = true;
this.title = "燃气事故台账详情";
});
},
MapdialogFun() {
this.dialogTableVisible = true;
......
<template>
<div class="app-container">
<!--<el-row>
<el-col :span="24" style="padding-left: 15px;margin-bottom: -10px;">
<div style="height: 45px;" @click="$router.go(-1)">
<el-button size="medium" type="text" style="font-size: 18px; color: rgb(7, 63, 112);float: left;">返回
</el-button>
</div>
</el-col>
</el-row>-->
<el-row style="width: 100%;height: 40px;">
<el-col :span="24">
<div style="">
<ul>
<li style="list-style: none;font-weight: 900;font-size: 20px;color: #053b6a;">燃气事故台账详情</li>
</ul>
</div>
</el-col>
</el-row>
<el-row style="width: 100%;padding: 20px;">
<el-form ref="form" v-model="form" label-width="120px" style="width: 100%;">
<el-row>
<el-col :span="6">
<el-form-item label="事故名称:" prop="troubleName">
<font>{{form.troubleName}}</font>
</el-form-item>
<el-form-item label="事故原因:" prop="troubleReason">
<font>{{form.troubleReason}}</font>
</el-form-item>
<el-form-item label="责任单位:" prop="responsibleUnit">
<font v-if="form.responsibleUnit != '' && form.responsibleUnit != null">{{form.responsibleUnit}}</font>
<font v-else> - </font>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="事故类型:" prop="troubleType">
<font v-if="form.troubleType == '1'">安全生产事故</font>
<font v-if="form.troubleType == '2'">非生产安全事故</font>
</el-form-item>
<el-form-item label="事故地点:" prop="troubleLocation">
<font>{{form.troubleLocation}}</font>
</el-form-item>
<el-form-item label="责任人员:" prop="responsiblePeople">
<font v-if="form.responsiblePeople != '' && form.responsiblePeople != null">{{form.responsiblePeople}}</font>
<font v-else> - </font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="简要经过:" prop="briefProcess">
<font v-if="form.briefProcess != '' && form.briefProcess != null">{{form.briefProcess}}</font>
<font v-else> - </font>
</el-form-item>
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="是否处理:" prop="isDeal">
<font>{{form.isDeal}}</font>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="处理完成时间:" prop="dealDate">
<font>{{form.dealDate}}</font>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="备注信息:" prop="remarks">
<font v-if="form.remarks != '' && form.remarks != null">{{form.remarks}}</font>
<font v-else> - </font>
</el-form-item>
</el-row>
</el-form>
</el-row>
</div>
</template>
<script>
import { getTrouble } from "@/api/standingBook/trouble";
export default {
name: "troubleDetail",
components: {
},
data() {
return {
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 表单参数
form: {},
// 表单校验
rules: {
}
};
},
created() {
// 如果是跳转来的,则接受初始化参数
this.troubleId = this.$route.query.troubleId;
},
mounted() {
this.getDetail();
},
methods: {
getDetail() {
getTrouble(this.troubleId).then(response => {
this.form = response.data;
console.log(this.form, "this.form")
const obj =this.form;
});
},
}
}
</script>
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