<template>
|
<div class="setting-container">
|
<el-form
|
:model="form"
|
:rules="rules"
|
label-position="right"
|
ref="ruleForm"
|
label-width="120px"
|
class="demo-ruleForm"
|
>
|
<el-form-item label="活动说明">
|
<el-input
|
type="textarea"
|
class="textarea-width"
|
:rows="5"
|
resize="none"
|
placeholder="请输入活动说明"
|
maxlength="300"
|
v-model="form.warehouseExplain"
|
>
|
</el-input>
|
</el-form-item>
|
<el-form-item label="工作时间">
|
<el-input
|
class="textarea-width"
|
placeholder="请输入工作时间"
|
size="small"
|
v-model.trim="form.warehouseWorkTime"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="联系电话" prop="warehouseContact">
|
<el-input
|
class="input-width"
|
placeholder="请输入联系电话"
|
size="small"
|
v-model.trim="form.warehouseContact"
|
maxlength="11"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="物品接收地点">
|
<div class="map-content">
|
<MapBox ref="mapContent" @setLocation="setLocation" />
|
</div>
|
<div class="mr-t-10">{{ form.receivePosition }}</div>
|
</el-form-item>
|
<el-form-item label="">
|
<el-button type="primary" :loading="btnLoading" @click="submitHandle"
|
>保 存</el-button
|
>
|
</el-form-item>
|
</el-form>
|
<div style="height: 40px"></div>
|
</div>
|
</template>
|
|
<script>
|
import MapBox from "../../components/map/map.vue";
|
import { objCopyPro } from "../../utils/common";
|
export default {
|
data() {
|
return {
|
form: {
|
warehouseExplain: "",
|
latitude: "",
|
longitude: "",
|
receivePosition: "",
|
warehouseContact: "",
|
warehouseWorkTime: "",
|
},
|
btnLoading: false,
|
rules: {
|
warehouseContact: [
|
{
|
required: true,
|
message: "请输入联系电话",
|
trigger: "blur",
|
},
|
],
|
}, // 表单验证
|
};
|
},
|
components: {
|
MapBox,
|
},
|
mounted() {
|
this.$nextTick(() => {
|
this.$refs.mapContent.getLocation({
|
val: this.form.activityAddr,
|
l: this.form.lat,
|
r: this.form.lng,
|
});
|
});
|
this.getInfo();
|
},
|
methods: {
|
setLocation(data) {
|
this.form.latitude = data.lng;
|
this.form.longitude = data.lat;
|
this.form.receivePosition = data.addr;
|
},
|
getInfo() {
|
this.$api.get("comActWarehouseBase", {}, (e) => {
|
if (e) {
|
this.form = objCopyPro(this.form, e);
|
this.form.warehouseExplain =
|
this.form.warehouseExplain ||
|
"创造和谐美好的社会环境，帮助孤寡老人、残疾人、留守儿童等，以社区为单位将长期开展“爱心义仓”活动，实现“重塑邻里关系，推动社区互助”。“爱心义仓”依托在地社区资源，以形塑互助社区文化为核心，以培育居民自组织为路径，以营运社区公共空间为场景，通过社区中人的动员和行动，搭建参与式社区互助体系，协力推动邻里之间有序自治并提供及时、便捷、有温度的补充性公共服务，最终建设成为“睦邻友好，守望相助”的善治社区";
|
this.form.warehouseWorkTime =
|
this.form.warehouseWorkTime ||
|
"周一至周五，节假日除外，9:00—18:00。";
|
this.$refs.mapContent.getLocation({
|
val: e.receivePosition,
|
l: e.latitude,
|
r: e.longitude,
|
});
|
} else {
|
this.$api.post("communitymanager/detailcommunity", {}, (e) => {
|
this.form.receivePosition = e.address;
|
this.form.latitude = e.lat;
|
this.form.longitude = e.lng;
|
this.form.warehouseContact = e.contactsPhone;
|
this.form.warehouseExplain =
|
this.form.warehouseExplain ||
|
"创造和谐美好的社会环境，帮助孤寡老人、残疾人、留守儿童等，以社区为单位将长期开展“爱心义仓”活动，实现“重塑邻里关系，推动社区互助”。“爱心义仓”依托在地社区资源，以形塑互助社区文化为核心，以培育居民自组织为路径，以营运社区公共空间为场景，通过社区中人的动员和行动，搭建参与式社区互助体系，协力推动邻里之间有序自治并提供及时、便捷、有温度的补充性公共服务，最终建设成为“睦邻友好，守望相助”的善治社区";
|
this.form.warehouseWorkTime =
|
this.form.warehouseWorkTime ||
|
"周一至周五，节假日除外，9:00—18:00。";
|
this.$refs.mapContent.getLocation({
|
val: e.address,
|
l: e.lng,
|
r: e.lat,
|
});
|
});
|
}
|
});
|
},
|
submitHandle() {
|
this.$refs["ruleForm"].validate((valid) => {
|
if (valid) {
|
this.$api.post("comActWarehouseBase", this.form, (e) => {
|
if (e == true) {
|
demo.toast("保存成功");
|
} else {
|
demo.toast(e.msg);
|
}
|
});
|
}
|
});
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.map-content {
|
width: 700px;
|
}
|
.textarea-width {
|
width: 400px;
|
}
|
.input-width {
|
width: 250px;
|
}
|
.setting-container {
|
overflow-y: scroll;
|
padding-top: 40px;
|
}
|
</style>
|
