elink-star
/
ShibeiWorkPlatform_Frontend
11
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fsfds2

shibei_master
dai 3 years ago
parent
37b02efa9b
commit
6a5daf8c6a
2 changed files with 215 additions and 157 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 370
      src/views/modules/communityService/dqfwzx/cpts/edit.vue
  2. 2
      src/views/modules/communityService/dqfwzx/index.vue

370
src/views/modules/communityService/dqfwzx/cpts/edit.vue
View File

@ -1,227 +1,282 @@
<template> <template>
<div> <div>
<div class="dialog-h-content scroll-h"> <div class="dialog-h-content scroll-h">
<el-form ref="ref_form" <el-form
:inline="true" ref="ref_form"
:model="dataForm" :inline="true"
:rules="dataRule" :model="dataForm"
:disabled="formType === 'detail'" :rules="dataRule"
class="form"> :disabled="formType === 'detail'"
<el-form-item label="中心名称 " class="form"
prop="centerName" >
label-width="150px" <el-form-item
style="display: block"> label="中心名称 "
<el-input class="item_width_1" prop="centerName"
maxlength="50" label-width="150px"
show-word-limit style="display: block"
placeholder="请输入中心名称 " >
v-model="dataForm.centerName"> <el-input
class="item_width_1"
maxlength="50"
show-word-limit
placeholder="请输入中心名称 "
v-model="dataForm.centerName"
>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="办公电话" <el-form-item
prop="workPhone" label="办公电话"
label-width="150px" prop="workPhone"
style="display: block"> label-width="150px"
<el-input class="item_width_1" style="display: block"
maxlength="50" >
show-word-limit <el-input
placeholder="请输入办公电话" class="item_width_1"
v-model="dataForm.workPhone"> maxlength="50"
show-word-limit
placeholder="请输入办公电话"
v-model="dataForm.workPhone"
>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="社区地址" <el-form-item
prop="address" label="社区地址"
label-width="150px" prop="address"
style="display: block"> label-width="150px"
<el-input class="item_width_1" style="display: block"
maxlength="50" >
show-word-limit <el-input
placeholder="请输入社区地址 " class="item_width_1"
v-model="dataForm.address"> maxlength="50"
show-word-limit
placeholder="请输入社区地址 "
v-model="dataForm.address"
>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="办公时间" <el-form-item
prop="amStartTime" label="办公时间"
label-width="150px" prop="amStartTime"
style="display: block"> label-width="150px"
style="display: block"
>
<div class="row"> <div class="row">
<span>上午</span> <span>上午</span>
<el-time-select style="margin-left: 10px" <el-time-select
v-model="dataForm.amStartTime" style="margin-left: 10px"
:picker-options="{ v-model="dataForm.amStartTime"
:picker-options="{
start: '00:00', start: '00:00',
step: '00:30', step: '00:30',
end: '12:00', end: '12:00',
}" }"
placeholder="开始时间"> placeholder="开始时间"
>
</el-time-select> </el-time-select>
<span style="margin: 0 5px">至</span> <span style="margin: 0 5px">至</span>
<el-time-select v-model="dataForm.amEndTime" <el-time-select
:picker-options="{ v-model="dataForm.amEndTime"
:picker-options="{
start: '00:00', start: '00:00',
step: '00:30', step: '00:30',
end: '12:00', end: '12:00',
minTime: dataForm.amStartTime, minTime: dataForm.amStartTime,
}" }"
placeholder="结束时间"> placeholder="结束时间"
>
</el-time-select> </el-time-select>
</div> </div>
<div class="row" <div class="row" style="margin-top: 5px">
style="margin-top: 5px">
<span>下午</span> <span>下午</span>
<el-time-select style="margin-left: 10px" <el-time-select
v-model="dataForm.pmStartTime" style="margin-left: 10px"
:picker-options="{ v-model="dataForm.pmStartTime"
:picker-options="{
start: '12:00', start: '12:00',
step: '00:30', step: '00:30',
end: '24:00', end: '24:00',
}" }"
placeholder="开始时间"> placeholder="开始时间"
>
</el-time-select> </el-time-select>
<span style="margin: 0 5px">至</span> <span style="margin: 0 5px">至</span>
<el-time-select v-model="dataForm.pmEndTime" <el-time-select
:picker-options="{ v-model="dataForm.pmEndTime"
:picker-options="{
start: '12:00', start: '12:00',
step: '00:30', step: '00:30',
end: '24:00', end: '24:00',
minTime: dataForm.pmStartTime, minTime: dataForm.pmStartTime,
}" }"
placeholder="结束时间"> placeholder="结束时间"
>
</el-time-select> </el-time-select>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="位置坐标" <el-form-item
prop="longitude" label="位置坐标"
label-width="150px" prop="longitude"
style="display: block"> label-width="150px"
style="display: block"
>
<div style="width: 500px"> <div style="width: 500px">
<el-input class="item_width_4" <el-input
maxlength="50" class="item_width_4"
placeholder="请输入关键字" maxlength="50"
v-model="dataForm.locationAddress"> placeholder="请输入关键字"
v-model="dataForm.locationAddress"
>
</el-input> </el-input>
<el-button style="margin-left: 10px" <el-button
type="primary" style="margin-left: 10px"
size="small" type="primary"
@click="handleSearchMap">查询</el-button> size="small"
<div id="app" @click="handleSearchMap"
class="div_map"></div> >查询</el-button
>
<div id="app" class="div_map"></div>
<div style="margin-top: 10px"> <div style="margin-top: 10px">
<span>经度</span> <span>经度</span>
<el-input class="item_width_3" <el-input
maxlength="50" class="item_width_3"
placeholder="请输入经度" maxlength="50"
v-model="dataForm.longitude"> placeholder="请输入经度"
v-model="dataForm.longitude"
>
</el-input> </el-input>
<span style="margin-left: 20px">纬度</span> <span style="margin-left: 20px">纬度</span>
<el-input class="item_width_3" <el-input
maxlength="50" class="item_width_3"
placeholder="请输入纬度" maxlength="50"
v-model="dataForm.latitude"> placeholder="请输入纬度"
v-model="dataForm.latitude"
>
</el-input> </el-input>
</div> </div>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="可预约事项" <el-form-item
prop="matterList" label="可预约事项"
label-width="150px" prop="matterList"
style="display: block"> label-width="150px"
style="display: block"
>
<div class="m-staffs"> <div class="m-staffs">
<div class="item" <div
:key="'staff' + index" class="item"
v-for="(item, index) in dataForm.matterList"> :key="'staff' + index"
v-for="(item, index) in dataForm.matterList"
>
<div class="item-info"> <div class="item-info">
<el-input class="item_width_1" <el-input
maxlength="50" class="item_width_1"
show-word-limit maxlength="50"
placeholder="事项名" show-word-limit
v-model="item.matterName" placeholder="事项名"
:disabled="item.matterId != undefined" /> v-model="item.matterName"
:disabled="item.matterId != undefined"
<el-select style="margin-left: 10px" />
v-model="item.appointmentType"
filterable <el-select
placeholder="预约类型" style="margin-left: 10px"
:disabled="item.matterId != undefined"> v-model="item.appointmentType"
<el-option v-for="item in appointmentTypeOptions" filterable
:key="item.value" placeholder="预约类型"
:label="item.label" :disabled="item.matterId != undefined"
:value="item.value"> >
<el-option
v-for="item in appointmentTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option> </el-option>
</el-select> </el-select>
<el-time-select style="margin-left: 10px" <el-time-select
v-model="item.startTime" style="margin-left: 10px"
:picker-options="{ v-model="item.startTime"
:picker-options="{
start: '00:00', start: '00:00',
step: '00:30', step: '00:30',
end: '24:00', end: '24:00',
}" }"
placeholder="开始时间" placeholder="开始时间"
:disabled="item.matterId != undefined"> :disabled="item.matterId != undefined"
>
</el-time-select> </el-time-select>
<span style="margin: 0 5px">至</span> <span style="margin: 0 5px">至</span>
<el-time-select v-model="item.endTime" <el-time-select
:picker-options="{ v-model="item.endTime"
:picker-options="{
start: '00:00', start: '00:00',
step: '00:30', step: '00:30',
end: '24:00', end: '24:00',
minTime: item.startTime, minTime: item.startTime,
}" }"
placeholder="结束时间" placeholder="结束时间"
:disabled="item.matterId != undefined"> :disabled="item.matterId != undefined"
>
</el-time-select> </el-time-select>
</div> </div>
<div class="item-pic"> <div class="item-pic">
<el-upload :disabled="item.matterId != undefined" <el-upload
class="avatar-uploader" :disabled="item.matterId != undefined"
:action="uploadUlr" class="avatar-uploader"
:data="{ customerId: customerId }" :action="uploadUlr"
:show-file-list="false" :data="{ customerId: customerId }"
:on-success=" :show-file-list="false"
:on-success="
(response, file, fileList) => (response, file, fileList) =>
handleImgSuccess(index, response, file, fileList) handleImgSuccess(index, response, file, fileList)
" "
:before-upload="beforeImgUpload"> :before-upload="beforeImgUpload"
<img v-if="item.matterImg" >
:src="item.matterImg" <img
style="width: 50px; height: 50px" v-if="item.matterImg"
class="function-icon" /> :src="item.matterImg"
<i v-else style="width: 50px; height: 50px"
class="el-icon-plus avatar-uploader-icon"></i> class="function-icon"
/>
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload> </el-upload>
<div class="hint">（事项封面，图片小于1M）</div> <div class="hint">（事项封面，图片小于1M）</div>
<el-button style="margin-left: auto" <el-button
size="small" style="margin-left: auto"
@click="handleDelStaff(index)">删除</el-button> size="small"
@click="handleDelStaff(index)"
>删除</el-button
>
</div> </div>
</div> </div>
<div class="item-add"> <div class="item-add">
<el-button size="small" <el-button size="small" type="warning" @click="handleAddStaff"
type="warning" >添加</el-button
@click="handleAddStaff">添加</el-button> >
</div> </div>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
<div class="div_btn"> <div class="div_btn">
<el-button size="small" <el-button size="small" @click="handleCancle">取 消</el-button>
@click="handleCancle">取 消</el-button> <el-button
<el-button size="small" size="small"
v-if="formType != 'detail'" v-if="formType != 'detail'"
type="primary" type="primary"
:disabled="btnDisable" :disabled="btnDisable"
@click="handleComfirm">确 定</el-button> @click="handleComfirm"
>确 定</el-button
>
</div> </div>
</div> </div>
</template> </template>
@ -238,7 +293,7 @@ var infoWindowList;
let loading; // 加载动画 let loading; // 加载动画
export default { export default {
data () { data() {
return { return {
uploadUlr: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadqrcodeV2", uploadUlr: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadqrcodeV2",
customerId: "", customerId: "",
@ -282,7 +337,7 @@ export default {
}, },
components: {}, components: {},
computed: { computed: {
dataRule () { dataRule() {
return { return {
centerName: [ centerName: [
{ required: true, message: "中心名称 不能为空", trigger: "blur" }, { required: true, message: "中心名称 不能为空", trigger: "blur" },
@ -318,13 +373,13 @@ export default {
props: {}, props: {},
watch: {}, watch: {},
async mounted () { async mounted() {
this.customerId = localStorage.getItem("customerId"); this.customerId = localStorage.getItem("customerId");
this.initMap(); this.initMap();
}, },
methods: { methods: {
handleImgSuccess (index, res, file) { handleImgSuccess(index, res, file) {
if (res.code === 0 && res.msg === "success") { if (res.code === 0 && res.msg === "success") {
console.log("res.data.url", res.data.url); console.log("res.data.url", res.data.url);
this.dataForm.matterList[index].matterImg = res.data.url; this.dataForm.matterList[index].matterImg = res.data.url;
@ -333,7 +388,7 @@ export default {
} }
}, },
beforeImgUpload (file) { beforeImgUpload(file) {
const isLt1M = file.size / 1024 / 1024 < 1; const isLt1M = file.size / 1024 / 1024 < 1;
if (!isLt1M) { if (!isLt1M) {
@ -342,7 +397,7 @@ export default {
return isLt1M; return isLt1M;
}, },
handleAddStaff () { handleAddStaff() {
this.dataForm.matterList = [ this.dataForm.matterList = [
...this.dataForm.matterList, ...this.dataForm.matterList,
{ {
@ -354,7 +409,7 @@ export default {
}, },
]; ];
}, },
async handleDelStaff (index) { async handleDelStaff(index) {
const { matterList } = this.dataForm; const { matterList } = this.dataForm;
let list = [...matterList]; let list = [...matterList];
let delItem = list.splice(index, 1); let delItem = list.splice(index, 1);
@ -371,7 +426,7 @@ export default {
this.dataForm.matterList = list; this.dataForm.matterList = list;
}, },
async delStaff (matterId) { async delStaff(matterId) {
const { data, code, msg } = await requestPost( const { data, code, msg } = await requestPost(
"/gov/org/icpartyservicecenter/delmatter", "/gov/org/icpartyservicecenter/delmatter",
{ {
@ -381,7 +436,7 @@ export default {
return code === 0; return code === 0;
}, },
// 地图初始化函数，本例取名为init，开发者可根据实际情况定义 // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
initMap () { initMap() {
// 定义地图中心点坐标 // 定义地图中心点坐标
var center = new window.TMap.LatLng(36.0722275, 120.38945519); var center = new window.TMap.LatLng(36.0722275, 120.38945519);
// 定义map变量，调用 TMap.Map() 构造函数创建地图 // 定义map变量，调用 TMap.Map() 构造函数创建地图
@ -407,7 +462,7 @@ export default {
this.handleMoveCenter(); this.handleMoveCenter();
}, },
setMarker (lat, lng) { setMarker(lat, lng) {
markers.setGeometries([]); markers.setGeometries([]);
markers.add([ markers.add([
{ {
@ -421,7 +476,7 @@ export default {
]); ]);
}, },
handleSearchMap () { handleSearchMap() {
infoWindowList.forEach((infoWindow) => { infoWindowList.forEach((infoWindow) => {
infoWindow.close(); infoWindow.close();
}); });
@ -449,7 +504,7 @@ export default {
}); });
}, },
handleMoveCenter () { handleMoveCenter() {
//修改地图中心点 //修改地图中心点
const center = map.getCenter(); const center = map.getCenter();
const lat = center.getLat(); const lat = center.getLat();
@ -459,7 +514,7 @@ export default {
this.setMarker(lat, lng); this.setMarker(lat, lng);
}, },
async initForm (type, row) { async initForm(type, row) {
this.$refs.ref_form.resetFields(); this.$refs.ref_form.resetFields();
this.formType = type; this.formType = type;
@ -471,7 +526,7 @@ export default {
} }
}, },
async handleComfirm () { async handleComfirm() {
this.btnDisable = true; this.btnDisable = true;
setTimeout(() => { setTimeout(() => {
this.btnDisable = false; this.btnDisable = false;
@ -486,7 +541,7 @@ export default {
}); });
}, },
async submit () { async submit() {
let url = ""; let url = "";
if (this.formType === "add") { if (this.formType === "add") {
url = "/gov/org/icpartyservicecenter/addpartyservicecenter"; url = "/gov/org/icpartyservicecenter/addpartyservicecenter";
@ -535,11 +590,11 @@ export default {
} }
}, },
handleCancle () { handleCancle() {
this.resetData(); this.resetData();
this.$emit("dialogCancle"); this.$emit("dialogCancle");
}, },
resetData () { resetData() {
this.partyServiceCenterId = ""; this.partyServiceCenterId = "";
this.dataForm = { this.dataForm = {
centerName: "", centerName: "",
@ -557,7 +612,7 @@ export default {
}; };
}, },
// 开启加载动画 // 开启加载动画
startLoading () { startLoading() {
loading = Loading.service({ loading = Loading.service({
lock: true, // 是否锁定 lock: true, // 是否锁定
text: "正在加载……", // 加载中需要显示的文字 text: "正在加载……", // 加载中需要显示的文字
@ -565,7 +620,7 @@ export default {
}); });
}, },
// 结束加载动画 // 结束加载动画
endLoading () { endLoading() {
// clearTimeout(timer); // clearTimeout(timer);
if (loading) { if (loading) {
loading.close(); loading.close();
@ -575,23 +630,28 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped > <style lang="scss" scoped>
@import "@/assets/scss/modules/visual/communityManageForm.scss"; @import "@/assets/scss/modules/visual/communityManageForm.scss";
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
.m-staffs { .m-staffs {
margin-left: auto; margin-left: auto;
width: 650px; width: 950px;
.item { .item {
display: flex;
.item-info { .item-info {
display: flex; display: flex;
margin: 0 20px;
width: 65%;
justify-content: space-around; justify-content: space-around;
align-items: center;
margin-bottom: 7px; margin-bottom: 7px;
} }
.item-pic { .item-pic {
display: flex; display: flex;
width: 35%;
align-items: center; align-items: center;
.hint { .hint {
font-size: 14px; font-size: 14px;
@ -630,5 +690,3 @@ export default {
} }
} }
</style> </style>

2
src/views/modules/communityService/dqfwzx/index.vue
View File

@ -106,7 +106,7 @@
:close-on-click-modal="false" :close-on-click-modal="false"
:close-on-press-escape="false" :close-on-press-escape="false"
:title="formTitle" :title="formTitle"
width="850px" width="1150px"
top="5vh" top="5vh"
class="dialog-h" class="dialog-h"
@closed="handleClose" @closed="handleClose"

Write Preview
Loading…
Cancel
Save