Browse Source

爱心活动

V1.0
jiangyy 3 years ago
parent
commit
6b9e0f7957
  1. 1
      src/views/modules/communityParty/heart/heartDetail.vue
  2. 920
      src/views/modules/communityParty/heart/heartForm.vue
  3. 525
      src/views/modules/communityService/dqfwzx/cpts/edit.vue

1
src/views/modules/communityParty/heart/heartDetail.vue

@ -183,6 +183,7 @@
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { Loading } from 'element-ui' // Loading import { Loading } from 'element-ui' // Loading
import { requestPost } from '@/js/dai/request' import { requestPost } from '@/js/dai/request'
import daiMap from "@/utils/dai-map";
let loading // let loading //

920
src/views/modules/communityParty/heart/heartForm.vue

File diff suppressed because it is too large

525
src/views/modules/communityService/dqfwzx/cpts/edit.vue

@ -1,283 +1,232 @@
<template> <template>
<div> <div>
<div class="dialog-h-content scroll-h"> <div class="dialog-h-content scroll-h">
<el-form <el-form ref="ref_form"
ref="ref_form" :inline="true"
:inline="true" :model="dataForm"
:model="dataForm" :rules="dataRule"
:rules="dataRule" :disabled="formType === 'detail'"
:disabled="formType === 'detail'" class="form">
class="form" <el-form-item label="中心名称 "
> prop="centerName"
<el-form-item label-width="150px"
label="中心名称 " style="display: block">
prop="centerName" <el-input class="item_width_1"
label-width="150px" maxlength="50"
style="display: block" show-word-limit
> placeholder="请输入中心名称 "
<el-input v-model="dataForm.centerName">
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 <el-form-item label="办公电话"
label="办公电话" prop="workPhone"
prop="workPhone" label-width="150px"
label-width="150px" style="display: block">
style="display: block" <el-input class="item_width_1"
> maxlength="50"
<el-input show-word-limit
class="item_width_1" placeholder="请输入办公电话"
maxlength="50" v-model="dataForm.workPhone">
show-word-limit
placeholder="请输入办公电话"
v-model="dataForm.workPhone"
>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item <el-form-item label="社区地址"
label="社区地址" prop="address"
prop="address" label-width="150px"
label-width="150px" style="display: block">
style="display: block" <el-input class="item_width_1"
> maxlength="50"
<el-input show-word-limit
class="item_width_1" placeholder="请输入社区地址 "
maxlength="50" v-model="dataForm.address">
show-word-limit
placeholder="请输入社区地址 "
v-model="dataForm.address"
>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item <el-form-item label="办公时间"
label="办公时间" prop="amStartTime"
prop="amStartTime" label-width="150px"
label-width="150px" style="display: block">
style="display: block"
>
<div class="row"> <div class="row">
<span>上午</span> <span>上午</span>
<el-time-select <el-time-select style="margin-left: 10px"
style="margin-left: 10px" v-model="dataForm.amStartTime"
v-model="dataForm.amStartTime" :picker-options="{
: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 <el-time-select v-model="dataForm.amEndTime"
v-model="dataForm.amEndTime" :picker-options="{
: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" style="margin-top: 5px"> <div class="row"
style="margin-top: 5px">
<span>下午</span> <span>下午</span>
<el-time-select <el-time-select style="margin-left: 10px"
style="margin-left: 10px" v-model="dataForm.pmStartTime"
v-model="dataForm.pmStartTime" :picker-options="{
: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 <el-time-select v-model="dataForm.pmEndTime"
v-model="dataForm.pmEndTime" :picker-options="{
: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 <el-form-item label="地图位置"
label="位置坐标" prop="longitude"
prop="longitude" label-width="150px"
label-width="150px" style="display: block">
style="display: block"
>
<div style="width: 500px"> <div style="width: 500px">
<el-input <el-select v-model="searchValue"
class="item_width_4" filterable
maxlength="50" style="width: 500px"
placeholder="请输入关键字" remote
v-model="dataForm.locationAddress" :reserve-keyword="true"
> placeholder="请输入关键词"
</el-input> :remote-method="remoteMethod"
<el-button :loading="loading">
style="margin-left: 10px" <el-option v-for="(item,index) in searchOptions"
type="primary" @click.native="handleClickKey(index)"
size="small" :key="item.value"
@click="handleSearchMap" :label="item.label"
>查询</el-button :value="item.value">
> </el-option>
<div id="app" class="div_map"></div> </el-select>
<div style="margin-top: 10px" v-show="false"> <div id="app_dqfwzx"
<span>经度</span> class="div_map"></div>
<el-input
class="item_width_3"
maxlength="50"
placeholder="请输入经度"
v-model="dataForm.longitude"
>
</el-input>
<span style="margin-left: 20px">纬度</span>
<el-input
class="item_width_3"
maxlength="50"
placeholder="请输入纬度"
v-model="dataForm.latitude"
>
</el-input>
</div>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="详细地址 "
prop="address"
label-width="150px"
style="display: block">
<el-input class="item_width_1"
maxlength="50"
show-word-limit
placeholder="请输入位置 "
v-model="formData.address">
</el-input>
</el-form-item>
<el-form-item <el-form-item label="可预约事项"
label="可预约事项" prop="matterList"
prop="matterList" label-width="150px"
label-width="150px" style="display: block">
style="display: block"
>
<div class="m-staffs"> <div class="m-staffs">
<div <div class="item"
class="item" :key="'staff' + index"
:key="'staff' + index" v-for="(item, index) in dataForm.matterList">
v-for="(item, index) in dataForm.matterList"
>
<div class="item-info"> <div class="item-info">
<el-input <el-input class="item_width_1"
class="item_width_1" style="width: 150px"
style="width: 150px" maxlength="50"
maxlength="50" show-word-limit
show-word-limit placeholder="事项名"
placeholder="事项名" v-model="item.matterName"
v-model="item.matterName" :disabled="item.matterId != undefined" />
:disabled="item.matterId != undefined" <el-upload :headers="$getElUploadHeaders()"
/> :disabled="item.matterId != undefined"
<el-upload :headers="$getElUploadHeaders()" 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"
<img :src="item.matterImg"
v-if="item.matterImg" style="width: 36px; height: 36px"
:src="item.matterImg" class="function-icon" />
style="width: 36px; height: 36px" <i v-else
class="function-icon" class="el-icon-plus avatar-uploader-icon"></i>
/>
<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>
</div> </div>
<div class="item-pic"> <div class="item-pic">
<el-select <el-select style="width: 150px; margin-left: 0"
style="width: 150px; margin-left: 0" v-model="item.appointmentType"
v-model="item.appointmentType" filterable
filterable placeholder="预约类型"
placeholder="预约类型" :disabled="item.matterId != undefined">
:disabled="item.matterId != undefined" <el-option v-for="item in appointmentTypeOptions"
> :key="item.value"
<el-option :label="item.label"
v-for="item in appointmentTypeOptions" :value="item.value">
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option> </el-option>
</el-select> </el-select>
<el-time-select <el-time-select style="width: 120px; margin-left: 20px"
style="width: 120px; margin-left: 20px" v-model="item.startTime"
v-model="item.startTime" :picker-options="{
: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 <el-time-select style="width: 120px"
style="width: 120px" v-model="item.endTime"
v-model="item.endTime" :picker-options="{
: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>
<el-button <el-button style="margin-left: 20px"
style="margin-left: 20px" size="small"
size="small" @click="handleDelStaff(index)">删除</el-button>
@click="handleDelStaff(index)"
>删除</el-button
>
</div> </div>
</div> </div>
<div class="item-add"> <div class="item-add">
<el-button size="small" type="warning" @click="handleAddStaff" <el-button size="small"
>添加</el-button type="warning"
> @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" @click="handleCancle"> </el-button> <el-button size="small"
<el-button @click="handleCancle"> </el-button>
size="small" <el-button size="small"
v-if="formType != 'detail'" v-if="formType != 'detail'"
type="primary" type="primary"
:disabled="btnDisable" :disabled="btnDisable"
@click="handleComfirm" @click="handleComfirm"> </el-button>
> </el-button
>
</div> </div>
</div> </div>
</template> </template>
@ -286,6 +235,7 @@
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
import { Loading } from "element-ui"; // Loading import { Loading } from "element-ui"; // Loading
import { requestPost } from "@/js/dai/request"; import { requestPost } from "@/js/dai/request";
import daiMap from "@/utils/dai-map";
var map; var map;
var search; var search;
@ -295,12 +245,15 @@ let loading; // 加载动画
var geocoder; // var geocoder; //
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: "",
formType: "add", // addeditdetail formType: "add", // addeditdetail
searchOptions: [],
searchValue: '',
resultList: [],
btnDisable: false, btnDisable: false,
@ -339,7 +292,7 @@ export default {
}, },
components: {}, components: {},
computed: { computed: {
dataRule() { dataRule () {
return { return {
centerName: [ centerName: [
{ required: true, message: "中心名称 不能为空", trigger: "blur" }, { required: true, message: "中心名称 不能为空", trigger: "blur" },
@ -375,13 +328,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;
@ -390,7 +343,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) {
@ -399,7 +352,7 @@ export default {
return isLt1M; return isLt1M;
}, },
handleAddStaff() { handleAddStaff () {
this.dataForm.matterList = [ this.dataForm.matterList = [
...this.dataForm.matterList, ...this.dataForm.matterList,
{ {
@ -411,7 +364,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);
@ -428,7 +381,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",
{ {
@ -438,104 +391,90 @@ export default {
return code === 0; return code === 0;
}, },
// init // init
initMap() { initMap (latitude, longitude) {
let { latitude, longitude } = this.$store.state.user;
if (!latitude || latitude == "" || latitude == "0") {
latitude = 39.9088810666821;
longitude = 116.39743841556731;
}
//
var center = new window.TMap.LatLng(latitude, longitude);
// map TMap.Map()
map = new window.TMap.Map(document.getElementById("app"), {
center: center, //
zoom: 16.2, //
pitch: 43.5, //
rotation: 45, //
});
search = new window.TMap.service.Search({ pageSize: 10 });
//
markers = new TMap.MultiMarker({
map: map,
geometries: [],
});
infoWindowList = Array(10);
geocoder = new TMap.service.Geocoder(); // map = new daiMap(
document.getElementById("app_ggfw"),
{ latitude, longitude },
{
zoom: 16.2, //
pitch: 43.5, //
rotation: 45, //
}
);
// //
map.on("panend", (e) => { map.on("dragend", (e) => {
this.handleMoveCenter(e); this.handleMoveCenter(e);
}); });
// this.handleMoveCenter();
map.setCenter(latitude, longitude);
map.setMarker(latitude, longitude);
}, },
setMarker(lat, lng) {
markers.setGeometries([]); async handleMoveCenter () {
markers.add([ //
{ const { lat, lng } = map.getCenter();
id: "4", this.formData.latitude = lat;
styleId: "marker", this.formData.longitude = lng;
position: new TMap.LatLng(lat, lng), map.setMarker(lat, lng);
properties: {
title: "marker4", let { msg, data } = await map.getAddress(lat, lng);
}, if (msg == "success") {
}, this.formData.address = data.address
]); this.searchValue = data.address
this.searchOptions = []
}
}, },
handleSearchMap() { async remoteMethod (query) {
infoWindowList.forEach((infoWindow) => {
infoWindow.close(); if (query !== '') {
}); this.loading = true;
infoWindowList.length = 0;
markers.setGeometries([]); const { msg, data } = await map.searchNearby(query);
// this.loading = false;
search this.resultList = []
.searchNearby({
keyword: this.dataForm.locationAddress, if (msg == "success" && data.resultList && data.resultList.length > 0) {
radius: 1000,
autoExtend: true, if (data.resultList && data.resultList.length > 0) {
center: map.getCenter(), this.resultList = data.resultList
}) this.searchOptions = this.resultList.map(item => {
.then((result) => { return { value: `${item.hotPointID}`, label: `${item.address + item.name}` };
let { data } = result;
if (Array.isArray(data) && data.length > 0) { });
const {
location: { lat, lng },
} = data[0];
map.setCenter(new TMap.LatLng(lat, lng));
this.setMarker(lat, lng);
this.dataForm.latitude = lat;
this.dataForm.longitude = lng;
} else {
this.$message.error("未检索到相关位置坐标");
} }
}); } else {
this.searchOptions = [
{
value: '0',
label: '未检索到结果'
}
]
}
} else {
this.searchOptions = [];
}
}, },
handleMoveCenter(e) { handleClickKey (index) {
// let selPosition = this.resultList[index]
const center = map.getCenter(); let lonlat = selPosition.lonlat.split(" ")
const lat = center.getLat(); map.setCenter(lonlat[1], lonlat[0]);
const lng = center.getLng(); map.setMarker(lonlat[1], lonlat[0]);
this.dataForm.latitude = lat; this.formData.latitude = lonlat[1];
this.dataForm.longitude = lng; this.formData.longitude = lonlat[0];
this.setMarker(lat, lng); this.formData.address = selPosition.address + selPosition.name
if (e && e.originalEvent) {
geocoder
.getAddress({ location: new TMap.LatLng(lat, lng) }) //
.then((result) => {
this.dataForm.locationAddress = result.result.address;
});
}
}, },
async initForm(type, row) {
this.$refs.ref_form.resetFields();
async initForm (type, row) {
this.$refs.ref_form.resetFields();
let { latitude, longitude } = this.$store.state.user;
this.formType = type; this.formType = type;
console.log(row); console.log(row);
if (row) { if (row) {
@ -545,7 +484,7 @@ export default {
} }
}, },
async handleComfirm() { async handleComfirm () {
this.btnDisable = true; this.btnDisable = true;
setTimeout(() => { setTimeout(() => {
this.btnDisable = false; this.btnDisable = false;
@ -560,7 +499,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";
@ -609,11 +548,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: "",
@ -631,7 +570,7 @@ export default {
}; };
}, },
// //
startLoading() { startLoading () {
loading = Loading.service({ loading = Loading.service({
lock: true, // lock: true, //
text: "正在加载……", // text: "正在加载……", //
@ -639,7 +578,7 @@ export default {
}); });
}, },
// //
endLoading() { endLoading () {
// clearTimeout(timer); // clearTimeout(timer);
if (loading) { if (loading) {
loading.close(); loading.close();

Loading…
Cancel
Save