jiangyy
3 years ago
5 changed files with 374 additions and 164 deletions
@ -0,0 +1,319 @@ |
|||||
|
<template> |
||||
|
<div class="m-pop"> |
||||
|
<div class="wrap"> |
||||
|
<cpt-card> |
||||
|
<div class="title"> |
||||
|
<img src="@/assets/img/shuju/title-tip.png" /> |
||||
|
<span>企事业单位巡查详情</span> |
||||
|
</div> |
||||
|
|
||||
|
<div class="btn-close" |
||||
|
@click="handleClose"> |
||||
|
<img src="@/assets/img/shuju/people/close.png" /> |
||||
|
</div> |
||||
|
|
||||
|
<el-form ref="ref_form" |
||||
|
:inline="false" |
||||
|
:model="formData" |
||||
|
:rules="dataRule" |
||||
|
label-width="100px"> |
||||
|
<!-- <el-form-item label="事件分类" |
||||
|
label-width="150px" |
||||
|
prop="categoryId"> |
||||
|
<el-cascader class="cell-width-2" |
||||
|
ref="myCascader" |
||||
|
v-model="selCategoryArray" |
||||
|
:key="iscascaderShow" |
||||
|
:options="casOptions" |
||||
|
:props="optionProps" |
||||
|
:show-all-levels="false" |
||||
|
@change="handleChangeCate"></el-cascader> |
||||
|
</el-form-item> --> |
||||
|
<el-form-item label="服务内容" |
||||
|
label-width="150px" |
||||
|
:class="{'form-item':source==='visiual'}" |
||||
|
prop="content"> |
||||
|
<div :class="{'visiual-form':source==='visiual'}"> |
||||
|
<el-input v-model="formData.content" |
||||
|
:autosize="{ minRows: 2, maxRows: 10 }" |
||||
|
type="textarea" |
||||
|
clearable |
||||
|
class="cell-width-area" |
||||
|
placeholder="请输入内容"></el-input> |
||||
|
</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="服务类型" |
||||
|
label-width="150px" |
||||
|
:class="{'form-item':source==='visiual'}" |
||||
|
prop="categoryCode"> |
||||
|
<div :class="{'visiual-form':source==='visiual'}"> |
||||
|
|
||||
|
<el-cascader v-model="formData.categoryCode" |
||||
|
:options="demandOptions" |
||||
|
clearable |
||||
|
class="cell-width-1" |
||||
|
@change="handleCateSlect"></el-cascader> |
||||
|
</div> |
||||
|
|
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="服务时间" |
||||
|
label-width="150px" |
||||
|
:class="{'form-item':source==='visiual'}" |
||||
|
prop="wantServiceTime"> |
||||
|
<div :class="{'visiual-form':source==='visiual'}"> |
||||
|
<el-date-picker v-model="formData.wantServiceTime" |
||||
|
type="datetime" |
||||
|
class="cell-width-1" |
||||
|
clearable |
||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||
|
placeholder="选择日期时间"> |
||||
|
</el-date-picker> |
||||
|
</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="需求人" |
||||
|
label-width="150px" |
||||
|
:class="{'form-item':source==='visiual'}" |
||||
|
prop="demandUserName"> |
||||
|
<div :class="{'visiual-form':source==='visiual'}"> |
||||
|
<el-input v-model="formData.demandUserName" |
||||
|
class="cell-width-1"></el-input> |
||||
|
</div> |
||||
|
|
||||
|
</el-form-item> |
||||
|
<el-form-item label="联系电话" |
||||
|
label-width="150px" |
||||
|
:class="{'form-item':source==='visiual'}" |
||||
|
prop="demandUserMobile"> |
||||
|
<div :class="{'visiual-form':source==='visiual'}"> |
||||
|
<el-input v-model="formData.demandUserMobile" |
||||
|
class="cell-width-1"></el-input> |
||||
|
</div> |
||||
|
|
||||
|
</el-form-item> |
||||
|
<el-form-item label="服务地点" |
||||
|
prop="serviceLocation" |
||||
|
:class="{'form-item':source==='visiual'}" |
||||
|
label-width="150px" |
||||
|
style="display: block"> |
||||
|
|
||||
|
<div :class="{'visiual-form':source==='visiual'}"> |
||||
|
<el-input class="cell-width-1" |
||||
|
v-model="formData.serviceLocation"> |
||||
|
</el-input> |
||||
|
</div> |
||||
|
|
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="门牌号" |
||||
|
:class="{'form-item':source==='visiual'}" |
||||
|
label-width="150px" |
||||
|
prop="locationDetail"> |
||||
|
<div :class="{'visiual-form':source==='visiual'}"> |
||||
|
<el-input v-model="formData.locationDetail" |
||||
|
class="cell-width-1"></el-input> |
||||
|
</div> |
||||
|
|
||||
|
</el-form-item> |
||||
|
|
||||
|
</el-form> |
||||
|
</cpt-card> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import cptCard from "@/views/modules/visual/cpts/card"; |
||||
|
|
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import eventInfo from "@/views/modules/shequzhili/event/cpts/event-info"; |
||||
|
|
||||
|
function iniFmData () { |
||||
|
return { |
||||
|
operationType: '2',//处理方式[0:已回复 1:已转项目 2:已转服务] |
||||
|
icEventId: '',//事件Id |
||||
|
gridId: '',// |
||||
|
categoryCode: '',// 二级服务分类编码 |
||||
|
parentCode: '',// 父级服务分类编码 |
||||
|
content: '',// 服务内容1000字 |
||||
|
reportType: 'self_help',// 社区帮办：community；楼长帮办：building_caption;党员帮办：party;自身上报：self_help |
||||
|
reportUserName: '',// 上报人姓名 |
||||
|
reportUserMobile: '',// 自身上报时存储注册居民的手机号 |
||||
|
reportTime: '',// 上报时间 |
||||
|
demandUserId: '',// 需求人：user.id或者ic_resi_user.id |
||||
|
demandUserName: '',// 需求人姓名 |
||||
|
demandUserMobile: '',//需求人联系电话 |
||||
|
wantServiceTime: '',// 希望服务时间 |
||||
|
serviceType: '', |
||||
|
serverId: '', |
||||
|
locationDetail: '', |
||||
|
serviceLocation: '',//事件地址 |
||||
|
latitude: '',// 经度 |
||||
|
longitude: '',//维度 |
||||
|
// categoryId: '' |
||||
|
}; |
||||
|
} |
||||
|
export default { |
||||
|
name: "dialogInfo", |
||||
|
props: { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
components: { |
||||
|
cptCard, |
||||
|
eventInfo, |
||||
|
}, |
||||
|
|
||||
|
data () { |
||||
|
return { |
||||
|
loading: false, |
||||
|
|
||||
|
pageType: 'dispose', |
||||
|
eventId: '1552537796854706177', |
||||
|
eventDetailData: {}, |
||||
|
formData: iniFmData(), |
||||
|
|
||||
|
btnDisable: false, |
||||
|
customerId: localStorage.getItem("customerId"), |
||||
|
demandOptions: [], |
||||
|
serviceOptions: [ |
||||
|
], |
||||
|
serviceOptiondList: [], |
||||
|
|
||||
|
casOptions: [], |
||||
|
iscascaderShow: 0, |
||||
|
selCategoryArray: [], |
||||
|
selCateObj: {}, |
||||
|
optionProps: { |
||||
|
multiple: false, |
||||
|
value: 'id', |
||||
|
label: 'name', |
||||
|
children: 'subCategory', |
||||
|
}, |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
async mounted () { |
||||
|
this.loading = false |
||||
|
await this.handleSearch() |
||||
|
this.loading = true |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
async handleSearch () { |
||||
|
|
||||
|
const url = "/gov/project/icEvent/detail"; |
||||
|
// const url = "http://yapi.elinkservice.cn/mock/245/gov/project/icEvent/detail"; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
icEventId: this.eventId, |
||||
|
}); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
|
||||
|
this.eventDetailData = { ...data }; |
||||
|
this.pageType = "dispose"; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleClose () { |
||||
|
this.pageType = ""; |
||||
|
this.$emit("handleClose") |
||||
|
// this.eventId = "" |
||||
|
}, |
||||
|
handleOk () { |
||||
|
this.pageType = ""; |
||||
|
// this.eventId = "" |
||||
|
this.pageNo = 1 |
||||
|
}, |
||||
|
|
||||
|
handleEditSuccess () { |
||||
|
this.handleClose(); |
||||
|
|
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style |
||||
|
lang="scss" |
||||
|
src="@/assets/scss/modules/visual/people.scss" |
||||
|
scoped |
||||
|
></style> |
||||
|
<style lang="scss" scoped> |
||||
|
@import "@/assets/scss/modules/visual/a_customize.scss"; |
||||
|
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
||||
|
|
||||
|
.m-pop { |
||||
|
color: #fff; |
||||
|
.wrap { |
||||
|
.list { |
||||
|
display: block; |
||||
|
width: 60%; |
||||
|
.item { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
box-sizing: border-box; |
||||
|
margin-top: 0; |
||||
|
margin-bottom: 15px; |
||||
|
font-size: 16px; |
||||
|
cursor: pointer; |
||||
|
|
||||
|
.item-field { |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
|
||||
|
.item-filed-height { |
||||
|
line-height: 30px; |
||||
|
} |
||||
|
} |
||||
|
.item-desc { |
||||
|
font-size: 16px; |
||||
|
color: #fff; |
||||
|
margin-bottom: 10px; |
||||
|
line-height: 24px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.list-title { |
||||
|
width: 100%; |
||||
|
box-sizing: border-box; |
||||
|
padding: 20px 0 10px 62px; |
||||
|
font-size: 20px; |
||||
|
color: #fff; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
} |
||||
|
.list-wr { |
||||
|
display: flex; |
||||
|
padding: 0 32px; |
||||
|
} |
||||
|
|
||||
|
.sel-service { |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
} |
||||
|
|
||||
|
.div_btn { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
|
||||
|
.item_btn { |
||||
|
font-size: 14px; |
||||
|
padding: 8px 16px; |
||||
|
cursor: pointer; |
||||
|
|
||||
|
border: 1px dashed #0c81fe; |
||||
|
border-radius: 6px; |
||||
|
background-color: #0c81fe; |
||||
|
} |
||||
|
|
||||
|
.mgl { |
||||
|
margin-left: 20px; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue