elink-star
/
epmet-work-pc-chengyang
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

增加查看页面。

feature
是小王呀\24601 1 year ago
parent
fef638b4c0
commit
80f38fba0e
9 changed files with 994 additions and 28 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 19
      src/views/modules/volunteer/SiteManagement/add.vue
  2. 18
      src/views/modules/volunteer/SiteManagement/index.vue
  3. 482
      src/views/modules/volunteer/SiteManagement/info.vue
  4. 4
      src/views/modules/volunteer/Venuemanagement/index.vue
  5. 482
      src/views/modules/volunteer/Venuemanagement/info.vue
  6. 4
      src/views/modules/volunteer/VoluntaryOrganization/info.vue
  7. 6
      src/views/modules/volunteer/VolunteerProjects/add.vue
  8. 4
      src/views/modules/volunteer/VolunteerProjects/edit.vue
  9. 3
      src/views/modules/volunteer/activityArchive/index.vue

19
src/views/modules/volunteer/SiteManagement/add.vue
View File

@ -5,16 +5,16 @@
<el-form ref="ref_form" :inline="true" :model="formData" :rules="dataRule" class="form">
<el-row>
<el-col :span="12">
<!-- <el-col :span="12">
<el-form-item label="所属组织" prop="agencyName" label-width="100px">
<el-input v-model.trim="formData.agencyName" size="small" clearable placeholder="请输入组织名称"
:disabled="true" class="u-item-width-normal"></el-input>
</el-form-item>
</el-col>
</el-col> -->
<el-col :span="12">
<el-form-item label="类型" prop="type" label-width="100px">
<el-select :disabled="showdisabled" v-model="formData.type" placeholder="请选择" clearable class="u-item-width-normal">
<el-option :disabled="showdisabled" class="u-item-width-normal" v-for="item in formData.optionstype" :key="item.value" :label="item.label"
<el-option :disabled="showdisabled" class="u-item-width-normal" v-for="item in optionstype" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select>
@ -114,6 +114,12 @@
export default {
data() {
return {
optionstype: [
{ value: 0, label: "实践站" },
{ value: 1, label: "实践点" },
{ value: 2, label: "其它" },
],
formData:
{
agencyName:"",
@ -125,12 +131,7 @@
attrs: [],
type: "",
name: "",
optionstype: [
{ value: 0, label: "实践站" },
{ value: 1, label: "实践点" },
{ value: 2, label: "其它" },
],
address: "",//地址
longitude: this.$store.state.user.longitude, //经度
latitude: this.$store.state.user.latitude,//纬度

18
src/views/modules/volunteer/SiteManagement/index.vue
View File

@ -87,15 +87,11 @@
width="850px" top="10vh" class="dialog-h" @closed="showAddClose">
<add ref="ref_form" v-if="showAdd" @showAddClose="showAddClose" />
</el-dialog>
<el-dialog :visible.sync="showInfo" :close-on-click-modal="false" :close-on-press-escape="false" title="查看"
<el-dialog x :visible.sync="showInfo" :close-on-click-modal="false" :close-on-press-escape="false" title="查看"
width="850px" top="10vh" class="dialog-h" @closed="showInfoClose">
<info v-if="showInfo" :VolunteerList="fmData" @showInfoClose="showInfoClose" />
<info v-if="showInfo" :VolunteerList="fmData" ref="ref_form" @showInfoClose="showInfoClose" />
</el-dialog>
<el-dialog :visible.sync="showEdit" :close-on-click-modal="false" :close-on-press-escape="false" title="修改"
width="850px" top="10vh" class="dialog-h" @closed="showEditClose">
<edit v-if="showEdit" :VolunteerList="EditList" @showEditClose="showEditClose" />
</el-dialog>
</div>
</div>
</template>
@ -105,7 +101,7 @@ import { requestPost, requestGet } from "@/js/dai/request";
import nextTick from "dai-js/tools/nextTick";
import { mapGetters } from "vuex";
import add from "./add.vue"
// import info from "./info.vue"
import info from "./info.vue"
// import edit from "./edit.vue"
// import MemberManagement from "./MemberManagement.vue"
// import process from "./process.vue"
@ -115,7 +111,7 @@ import add from "./add.vue"
import axios from "axios";
export default {
components: { add},
components: { add,info},
data() {
return {
@ -223,9 +219,7 @@ export default {
},
//打开查看
handleDetail(row){
// console.log(row,"row");
// this.showInfo=true
this.showAdd=true
this.showInfo=true
this.formTitle="查看"
this.$nextTick(() => {
this.$refs.ref_form.initForm("info", row.id);

482
src/views/modules/volunteer/SiteManagement/info.vue
View File

@ -0,0 +1,482 @@
<template>
<div>
<div class="dialog-h-content scroll-h">
<el-form ref="ref_form" :model="formData" :rules="dataRule" class="form">
<!-- <el-col :span="12">
<el-form-item label="所属组织" prop="agencyName" label-width="100px">
<el-input v-model.trim="formData.agencyName" size="small" clearable placeholder="请输入组织名称"
:disabled="true" class="u-item-width-normal"></el-input>
</el-form-item>
-->
<el-form-item label="类型" prop="type" label-width="100px">
<!-- <el-select :disabled="showdisabled" v-model="formData.type" placeholder="请选择" clearable class="u-item-width-normal">
<el-option :disabled="showdisabled" class="u-item-width-normal" v-for="item in formData.optionstype" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select> -->
</el-form-item>
<el-form-item label="名称" label-width="100px" prop="name">
<!-- <el-input v-model.trim="formData.name" size="small" clearable placeholder="请输入名称"
:disabled="showdisabled" class="u-item-width-normal"></el-input> -->
<div>{{ formData.name }}</div>
</el-form-item>
<el-form-item label="联系人" prop="linkman" label-width="100px">
<div>{{ formData.linkman }}</div>
</el-form-item>
<el-form-item label="联系电话" prop="linkPhone" label-width="100px">
<div>{{ formData.linkPhone }}</div>
</el-form-item>
<el-form-item label="办公时间" prop="workTime" label-width="100px">
<div>{{ formData.workTime }}</div>
</el-form-item>
<el-form-item label="图片" label-width="100px" prop="attrs">
<template>
<img v-for="(item, index) in this.formData.attrs" :key="index" :src="item.url" style="width: 100px; height: 100px;">
</template>
</el-form-item>
<el-form-item label="阵地简介" prop="content" label-width="100px" style="display: block">
<div>{{ formData.content }}</div>
</el-form-item>
<el-form-item label="位置" prop="address" label-width="100px" style="display: block">
<div style="width: 300px">
<div>{{ formData.address }}</div>
<div id="app_activity" class="div_map"></div>
</div>
</el-form-item>
</el-form>
</div>
<!-- <div class="div_btn">
<el-button size="small" @click="handleCancle">取 消</el-button>
<el-button size="small" v-if="formType != 'detail'" type="primary"
@click="handleComfirm">确
定</el-button>
</div> -->
</div>
</template>
<script>
import { mapGetters } from 'vuex'
// import { Loading } from 'element-ui' // 引入Loading服务
import { requestPost,requestGet } from '@/js/dai/request'
import Tinymce from '@c/tinymce2/index.vue'
import daiMap from "@/utils/dai-map";
import util from '@js/util.js';
// import UploadImage from './upload-image.vue'
import UploadImage from '@/views/modules/plugins/rent/upload-image.vue'
var map
var search
var markers
var infoWindowList
var geocoder // 新建一个正逆地址解析类
export default {
data() {
return {
formData:
{
agencyName:"",
agencyId: "",
linkman: "",
linkPhone: "",
content: "",
workTime: "",
attrs: [],
type: "",
name: "",
optionstype: [
{ value: 0, label: "实践站" },
{ value: 1, label: "实践点" },
{ value: 2, label: "其它" },
],
address: "",//地址
longitude: this.$store.state.user.longitude, //经度
latitude: this.$store.state.user.latitude,//纬度
},
showdisabled:false,
uploadUrl: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadqrcodeV2',
customerId: localStorage.getItem('customerId'),
}
},
components: { Tinymce, UploadImage },
mounted() {
this.formData.agencyId=this.$store.state.user.agencyId
this.formData.agencyName=this.$store.state.user.agencyName
let { latitude, longitude } = this.$store.state.user;
if (!latitude || latitude == "" || latitude == "0") {
latitude = 39.9088810666821;
longitude = 116.39743841556731;
}
this.formData.latitude = latitude;
this.formData.longitude = longitude;
this.activityType()
this.listServerOrg()
},
methods: {
//父组件传的
async initForm(type, unitId) {
this.getTableDetail(unitId)
},
//获取详情
getTableDetail(id) {
console.log(id,"dskljfksdljf");
let url = `/voluntary/position/edit/${id}`;
console.log(url,"url");
requestGet(url).then((res) => {
console.log(res);
if (res.code == 0) {
this.formData = res.data
this.fileList=[{fileUrl:res.data.attrs[0].url}]
console.log(this.formData,"this.formData");
} else {
this.$message.error(res.msg)
}
})
},
//添加标签
addDomain() {
if (this.formData.sponsors.length < 4) {
console.log("jshdfdsjdfkl");
console.log(this.formData.sponsors,this.tableDate,);
this.formData.sponsors.push(this.tableDate);
console.log(this.formData.sponsors,this.tableDate,);
}else{
this.$message.error("最多添加4个标签");
}
},
//删除动态
removeDomain(item) {
console.log(item);
var index = this.formData.sponsors.indexOf(item)
if (index !== -1) {
this.formData.sponsors.splice(index, 1)
this.tableDate = {}
}
},
validateContent() {
// 使用正则表达式去除HTML标签后检查内容
const textContent = this.stripHtml(this.formData.sumUp);
if (textContent.trim() === '') {
this.formData.sumUp = null;
}
},
stripHtml(html) {
const div = document.createElement('div');
div.innerHTML = html;
return div.textContent || div.innerText || '';
},
async activityType() {
this.$nextTick(() => {
if (!map) {
this.initMap(this.formData.latitude, this.formData.longitude);
console.log("map", map,this.formData.latitude, this.formData.longitude)
} else {
map.setCenter(this.formData.latitude, this.formData.longitude);
map.setMarker(this.formData.latitude, this.formData.longitude);
console.log("mapmapmap", map)
}
})
},
onChangeFileList(e) {
console.log(e, 'sssssb');
this.fileList = e.length > 0 ? e.map(item => ({
fileType: '0',
type:'image',
fileType: '0',
name:item.response.data.fileName,
fileUrl: item.response.data.url,
format: item.response.data.fileName.split('.').pop(),
url: item.response.data.url
})) : []; // 当e为空时清空fileList
if (e.length > 0) {
console.log(this.fileList,"this.fileList");
this.formData.attrs=this.fileList;
console.log(this.formData.attrs,"this.fileList");
} else {
this.formData.coverPic = '';
}
},
removedImg() {
this.formData.coverPic = ''
},
onChangeImgs(e, rowIndex = 0) {
console.log('onChangeFileList', e)
if (e.length > 0) {
this.activityImgs = []
e.forEach(item => {
let ob = {
fileType: '0',
fileUrl: item.response.data.url
}
this.activityImgs.push(ob)
})
}
},
async handleComfirm() {
console.log(this.formData," this.formData");
// if (this.formData.type!==1&&!this.formData.type!=2&&!this.formData.type!=0) {
// this.$message.error('请选择类型');
// return;
// }
if (!this.formData.linkPhone) {
this.$message.error('请输入电话');
return;
}
if (!this.formData.linkman) {
this.$message.error('请输入姓名');
return;
}
if (!this.formData.address) {
this.$message.error('请选择位置');
return;
}
if (!this.formData.workTime) {
this.$message.error('请输入办公时间');
return;
}
console.log(this.formData,"this.formData");
this.addActivity()
},
//增加
async addActivity() {
let url = '/voluntary/position/saveOrUpdate'
console.log();
const { data, code, msg } = await requestPost(url, this.formData)
if (code === 0) {
this.$message({
type: 'success',
message: '操作成功'
})
// this.resetData()
this.$emit('showAddClose')
} else {
this.$message.error(msg)
}
},
handleCancle() {
console.log("sdlkfjklsdf ");
this.$emit('showAddClose')
},
// 地图初始化函数，本例取名为init，开发者可根据实际情况定义
initMap(latitude, longitude) {
console.log(latitude, longitude,"564564568");
map = new daiMap(
document.getElementById("app_activity"),
{ latitude, longitude },
{
zoom: 16.2, // 设置地图缩放级别
pitch: 43.5, // 设置俯仰角
rotation: 45, // 设置地图旋转角度
}
);
// 监听地图平移结束
/* map.on("dragend", (e) => {
this.handleMoveCenter(e);
});*/
map.on("click", (e) => {
this.handleMoveCenter(e);
});
map.setCenter(latitude, longitude);
map.setMarker(latitude, longitude);
},
async handleMoveCenter(e) {
//修改地图中心点
// const { lat, lng } = map.getCenter();
const { lat, lng } = e.latLng;
this.formData.latitude = lat;
this.formData.longitude = lng;
map.setMarker(lat, lng);
let { msg, data } = await map.getAddress(lat, lng);
if (msg == "success") {
this.formData.address = data.address;
// this.searchValue=data.address
console.log(this.formData.address," this.formData.address ");
this.searchValue = data.address
this.searchOptions = []
// console.log('data,this.searchValue ', this.searchValue)
}
},
async remoteMethod(query) {
console.log(query, "sfsvsdv");
if (query !== '') {
const { msg, data } = await map.searchNearby(query);
this.resultList = []
if (msg == "success" && data.resultList && data.resultList.length > 0) {
if (data.resultList && data.resultList.length > 0) {
this.resultList = data.resultList
console.log(this.resultList, "this.resultList");
this.searchOptions = this.resultList.map(item => {
return { value: `${item.id}`, label: `${item.address + item.title}` };
});
console.log(this.searchOptions, "this.searchOptions");
}
} else {
this.searchOptions = [
{
value: '0',
label: '未检索到结果'
}
]
}
} else {
this.searchOptions = [];
}
},
handleClickKey(index) {
let selPosition = this.resultList[index]
let lonlat = selPosition.lonlat.split(" ")
map.setCenter(lonlat[1], lonlat[0]);
map.setMarker(lonlat[1], lonlat[0]);
this.formData.latitude = lonlat[1];
this.formData.longitude = lonlat[0];
this.searchValue = selPosition.address + selPosition.name
},
},
computed: {
dataRule() {
return {
type: [
{ required: true, message: '请选择类型', trigger: 'blur' }
],
name: [
{ required: true, message: '请选择名称', trigger: 'blur' }
],
linkman: [
{ required: true, message: '请输入联系人', trigger: 'blur' },
],
linkPhone: [
{ required: true, message: '请填写电话', trigger: 'blur' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码', trigger: 'blur' }
],
content: [
{ required: true, message: '请输入阵地介绍', trigger: 'blur' }
],
attrs: [
{ required: true, message: '请选择封面图片', trigger: 'blur' }
],
address: [
{ required: true, message: '请选择位置', trigger: 'blur' }
],
workTime: [
{ required: true, message: '请输入办公时间', trigger: 'blur' }
]
}
},
},
props: {
},
destroyed () {
map = null
}
}
</script>
<style lang="scss" scoped>
@import "@/assets/scss/modules/visual/communityManageForm.scss";
</style>
<style lang="scss" scoped>
.item_width_1 {
width: 634px;
/deep/.tox .tox-dialog {
z-index: 20000;
}
}
.u-item-width-normal{
width: 222px;
}
.tinymce_view {
::v-deep .tox .tox-dialog {
z-index: 2000000000;
}
}
.div_map {
position: relative;
}
.div_searchmap {
z-index: 5000;
position: absolute;
top: 5px;
left: 5px;
}
.tinymce_view {
height: 400px;
overflow: auto;
}
.text_p {
margin: 0;
padding: 0 10px;
border: 1px solid #d9d9d9;
border-radius: 5px;
>p {
margin: 0;
}
}
</style>

4
src/views/modules/volunteer/Venuemanagement/index.vue
View File

@ -91,7 +91,7 @@ import { requestPost, requestGet } from "@/js/dai/request";
import nextTick from "dai-js/tools/nextTick";
import { mapGetters } from "vuex";
import add from "./add.vue"
// import info from "./info.vue"
import info from "./info.vue"
// import edit from "./edit.vue"
// import MemberManagement from "./MemberManagement.vue"
// import process from "./process.vue"
@ -101,7 +101,7 @@ import add from "./add.vue"
import axios from "axios";
export default {
components: { add},
components: { add,info},
data() {
return {

482
src/views/modules/volunteer/Venuemanagement/info.vue
View File

@ -0,0 +1,482 @@
<template>
<div>
<div class="dialog-h-content scroll-h">
<el-form ref="ref_form" :model="formData" :rules="dataRule" class="form">
<!-- <el-col :span="12">
<el-form-item label="所属组织" prop="agencyName" label-width="100px">
<el-input v-model.trim="formData.agencyName" size="small" clearable placeholder="请输入组织名称"
:disabled="true" class="u-item-width-normal"></el-input>
</el-form-item>
-->
<el-form-item label="类型" prop="type" label-width="100px">
<!-- <el-select :disabled="showdisabled" v-model="formData.type" placeholder="请选择" clearable class="u-item-width-normal">
<el-option :disabled="showdisabled" class="u-item-width-normal" v-for="item in formData.optionstype" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select> -->
</el-form-item>
<el-form-item label="名称" label-width="100px" prop="name">
<!-- <el-input v-model.trim="formData.name" size="small" clearable placeholder="请输入名称"
:disabled="showdisabled" class="u-item-width-normal"></el-input> -->
<div>{{ formData.name }}</div>
</el-form-item>
<el-form-item label="联系人" prop="linkman" label-width="100px">
<div>{{ formData.linkman }}</div>
</el-form-item>
<el-form-item label="联系电话" prop="linkPhone" label-width="100px">
<div>{{ formData.linkPhone }}</div>
</el-form-item>
<el-form-item label="办公时间" prop="workTime" label-width="100px">
<div>{{ formData.workTime }}</div>
</el-form-item>
<el-form-item label="图片" label-width="100px" prop="attrs">
<template>
<img v-for="(item, index) in this.formData.attrs" :key="index" :src="item.url" style="width: 100px; height: 100px;">
</template>
</el-form-item>
<el-form-item label="阵地简介" prop="content" label-width="100px" style="display: block">
<div>{{ formData.content }}</div>
</el-form-item>
<el-form-item label="位置" prop="address" label-width="100px" style="display: block">
<div style="width: 300px">
<div>{{ formData.address }}</div>
<div id="app_activity" class="div_map"></div>
</div>
</el-form-item>
</el-form>
</div>
<!-- <div class="div_btn">
<el-button size="small" @click="handleCancle">取 消</el-button>
<el-button size="small" v-if="formType != 'detail'" type="primary"
@click="handleComfirm">确
定</el-button>
</div> -->
</div>
</template>
<script>
import { mapGetters } from 'vuex'
// import { Loading } from 'element-ui' // 引入Loading服务
import { requestPost,requestGet } from '@/js/dai/request'
import Tinymce from '@c/tinymce2/index.vue'
import daiMap from "@/utils/dai-map";
import util from '@js/util.js';
// import UploadImage from './upload-image.vue'
import UploadImage from '@/views/modules/plugins/rent/upload-image.vue'
var map
var search
var markers
var infoWindowList
var geocoder // 新建一个正逆地址解析类
export default {
data() {
return {
formData:
{
agencyName:"",
agencyId: "",
linkman: "",
linkPhone: "",
content: "",
workTime: "",
attrs: [],
type: "",
name: "",
optionstype: [
{ value: 0, label: "实践站" },
{ value: 1, label: "实践点" },
{ value: 2, label: "其它" },
],
address: "",//地址
longitude: this.$store.state.user.longitude, //经度
latitude: this.$store.state.user.latitude,//纬度
},
showdisabled:false,
uploadUrl: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadqrcodeV2',
customerId: localStorage.getItem('customerId'),
}
},
components: { Tinymce, UploadImage },
mounted() {
this.formData.agencyId=this.$store.state.user.agencyId
this.formData.agencyName=this.$store.state.user.agencyName
let { latitude, longitude } = this.$store.state.user;
if (!latitude || latitude == "" || latitude == "0") {
latitude = 39.9088810666821;
longitude = 116.39743841556731;
}
this.formData.latitude = latitude;
this.formData.longitude = longitude;
this.activityType()
this.listServerOrg()
},
methods: {
//父组件传的
async initForm(type, unitId) {
this.getTableDetail(unitId)
},
//获取详情
getTableDetail(id) {
console.log(id,"dskljfksdljf");
let url = `/voluntary/position/edit/${id}`;
console.log(url,"url");
requestGet(url).then((res) => {
console.log(res);
if (res.code == 0) {
this.formData = res.data
this.fileList=[{fileUrl:res.data.attrs[0].url}]
console.log(this.formData,"this.formData");
} else {
this.$message.error(res.msg)
}
})
},
//添加标签
addDomain() {
if (this.formData.sponsors.length < 4) {
console.log("jshdfdsjdfkl");
console.log(this.formData.sponsors,this.tableDate,);
this.formData.sponsors.push(this.tableDate);
console.log(this.formData.sponsors,this.tableDate,);
}else{
this.$message.error("最多添加4个标签");
}
},
//删除动态
removeDomain(item) {
console.log(item);
var index = this.formData.sponsors.indexOf(item)
if (index !== -1) {
this.formData.sponsors.splice(index, 1)
this.tableDate = {}
}
},
validateContent() {
// 使用正则表达式去除HTML标签后检查内容
const textContent = this.stripHtml(this.formData.sumUp);
if (textContent.trim() === '') {
this.formData.sumUp = null;
}
},
stripHtml(html) {
const div = document.createElement('div');
div.innerHTML = html;
return div.textContent || div.innerText || '';
},
async activityType() {
this.$nextTick(() => {
if (!map) {
this.initMap(this.formData.latitude, this.formData.longitude);
console.log("map", map,this.formData.latitude, this.formData.longitude)
} else {
map.setCenter(this.formData.latitude, this.formData.longitude);
map.setMarker(this.formData.latitude, this.formData.longitude);
console.log("mapmapmap", map)
}
})
},
onChangeFileList(e) {
console.log(e, 'sssssb');
this.fileList = e.length > 0 ? e.map(item => ({
fileType: '0',
type:'image',
fileType: '0',
name:item.response.data.fileName,
fileUrl: item.response.data.url,
format: item.response.data.fileName.split('.').pop(),
url: item.response.data.url
})) : []; // 当e为空时清空fileList
if (e.length > 0) {
console.log(this.fileList,"this.fileList");
this.formData.attrs=this.fileList;
console.log(this.formData.attrs,"this.fileList");
} else {
this.formData.coverPic = '';
}
},
removedImg() {
this.formData.coverPic = ''
},
onChangeImgs(e, rowIndex = 0) {
console.log('onChangeFileList', e)
if (e.length > 0) {
this.activityImgs = []
e.forEach(item => {
let ob = {
fileType: '0',
fileUrl: item.response.data.url
}
this.activityImgs.push(ob)
})
}
},
async handleComfirm() {
console.log(this.formData," this.formData");
// if (this.formData.type!==1&&!this.formData.type!=2&&!this.formData.type!=0) {
// this.$message.error('请选择类型');
// return;
// }
if (!this.formData.linkPhone) {
this.$message.error('请输入电话');
return;
}
if (!this.formData.linkman) {
this.$message.error('请输入姓名');
return;
}
if (!this.formData.address) {
this.$message.error('请选择位置');
return;
}
if (!this.formData.workTime) {
this.$message.error('请输入办公时间');
return;
}
console.log(this.formData,"this.formData");
this.addActivity()
},
//增加
async addActivity() {
let url = '/voluntary/position/saveOrUpdate'
console.log();
const { data, code, msg } = await requestPost(url, this.formData)
if (code === 0) {
this.$message({
type: 'success',
message: '操作成功'
})
// this.resetData()
this.$emit('showAddClose')
} else {
this.$message.error(msg)
}
},
handleCancle() {
console.log("sdlkfjklsdf ");
this.$emit('showAddClose')
},
// 地图初始化函数，本例取名为init，开发者可根据实际情况定义
initMap(latitude, longitude) {
console.log(latitude, longitude,"564564568");
map = new daiMap(
document.getElementById("app_activity"),
{ latitude, longitude },
{
zoom: 16.2, // 设置地图缩放级别
pitch: 43.5, // 设置俯仰角
rotation: 45, // 设置地图旋转角度
}
);
// 监听地图平移结束
/* map.on("dragend", (e) => {
this.handleMoveCenter(e);
});*/
map.on("click", (e) => {
this.handleMoveCenter(e);
});
map.setCenter(latitude, longitude);
map.setMarker(latitude, longitude);
},
async handleMoveCenter(e) {
//修改地图中心点
// const { lat, lng } = map.getCenter();
const { lat, lng } = e.latLng;
this.formData.latitude = lat;
this.formData.longitude = lng;
map.setMarker(lat, lng);
let { msg, data } = await map.getAddress(lat, lng);
if (msg == "success") {
this.formData.address = data.address;
// this.searchValue=data.address
console.log(this.formData.address," this.formData.address ");
this.searchValue = data.address
this.searchOptions = []
// console.log('data,this.searchValue ', this.searchValue)
}
},
async remoteMethod(query) {
console.log(query, "sfsvsdv");
if (query !== '') {
const { msg, data } = await map.searchNearby(query);
this.resultList = []
if (msg == "success" && data.resultList && data.resultList.length > 0) {
if (data.resultList && data.resultList.length > 0) {
this.resultList = data.resultList
console.log(this.resultList, "this.resultList");
this.searchOptions = this.resultList.map(item => {
return { value: `${item.id}`, label: `${item.address + item.title}` };
});
console.log(this.searchOptions, "this.searchOptions");
}
} else {
this.searchOptions = [
{
value: '0',
label: '未检索到结果'
}
]
}
} else {
this.searchOptions = [];
}
},
handleClickKey(index) {
let selPosition = this.resultList[index]
let lonlat = selPosition.lonlat.split(" ")
map.setCenter(lonlat[1], lonlat[0]);
map.setMarker(lonlat[1], lonlat[0]);
this.formData.latitude = lonlat[1];
this.formData.longitude = lonlat[0];
this.searchValue = selPosition.address + selPosition.name
},
},
computed: {
dataRule() {
return {
type: [
{ required: true, message: '请选择类型', trigger: 'blur' }
],
name: [
{ required: true, message: '请选择名称', trigger: 'blur' }
],
linkman: [
{ required: true, message: '请输入联系人', trigger: 'blur' },
],
linkPhone: [
{ required: true, message: '请填写电话', trigger: 'blur' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码', trigger: 'blur' }
],
content: [
{ required: true, message: '请输入阵地介绍', trigger: 'blur' }
],
attrs: [
{ required: true, message: '请选择封面图片', trigger: 'blur' }
],
address: [
{ required: true, message: '请选择位置', trigger: 'blur' }
],
workTime: [
{ required: true, message: '请输入办公时间', trigger: 'blur' }
]
}
},
},
props: {
},
destroyed () {
map = null
}
}
</script>
<style lang="scss" scoped>
@import "@/assets/scss/modules/visual/communityManageForm.scss";
</style>
<style lang="scss" scoped>
.item_width_1 {
width: 634px;
/deep/.tox .tox-dialog {
z-index: 20000;
}
}
.u-item-width-normal{
width: 222px;
}
.tinymce_view {
::v-deep .tox .tox-dialog {
z-index: 2000000000;
}
}
.div_map {
position: relative;
}
.div_searchmap {
z-index: 5000;
position: absolute;
top: 5px;
left: 5px;
}
.tinymce_view {
height: 400px;
overflow: auto;
}
.text_p {
margin: 0;
padding: 0 10px;
border: 1px solid #d9d9d9;
border-radius: 5px;
>p {
margin: 0;
}
}
</style>

4
src/views/modules/volunteer/VoluntaryOrganization/info.vue
View File

@ -70,8 +70,8 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="组织封面图" label-width="150px" prop="fileList">
<template>
<el-form-item label="组织封面图" label-width="150px" prop="fileList" >
<template v-if="formData.orgImage">
<!-- <upload-image :defaultFileList="fileList" :limit="1" @change="onChangeFileList" :file-list="formData.fileList"
@file-removed="removedImg"></upload-image> -->
<div class="demo-image__preview">

6
src/views/modules/volunteer/VolunteerProjects/add.vue
View File

@ -49,7 +49,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="服务类型" label-width="150px" prop="serviceClasses">
<el-select multiple-limit=1 class="u-item-width-normal" v-model.trim="formData.serviceClasses" placeholder="请选择" clearable multiple>
<el-select multiple-limit=1 class="u-item-width-normal" placeholder="请选择" clearable @click="getServiceTypeList" v-model="formData.serviceClasses" >
<el-option v-for="item in ServicetypeListName" :key="item.value" :label="item.label" :value="item.value" >
</el-option>
</el-select>
@ -186,6 +186,10 @@
},
methods: {
// 获取志愿组织服务类型
getServiceTypeList(){
},
//控制活动时间
actcontrolTime() {
console.log("dislfj");

4
src/views/modules/volunteer/VolunteerProjects/edit.vue
View File

@ -49,11 +49,13 @@
</el-col>
<el-col :span="12">
<el-form-item label="服务类型" label-width="150px" prop="serviceClasses">
<el-select multiple-limit=4 class="u-item-width-normal" v-model.trim="formData.serviceClasses" placeholder="请选择" clearable multiple>
<el-form-item label="服务类型" label-width="150px" prop="serviceClasses">
<el-select multiple-limit=1 class="u-item-width-normal" v-model.trim="formData.serviceClasses" placeholder="请选择" clearable multiple>
<el-option v-for="item in ServicetypeListName" :key="item.value" :label="item.label" :value="item.value" >
</el-option>
</el-select>
</el-form-item>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="招募截止时间" label-width="150px" prop="recruitDeadline">

3
src/views/modules/volunteer/activityArchive/index.vue
View File

@ -4,7 +4,7 @@
<el-form :inline="true" ref="ref_searchform" :label-width="'100px'">
<div>
<el-form-item label="活动标题">
<el-input v-model.trim="formData.content" class="item_width_1" clearable placeholder="请输入">
<el-input v-model.trim="formData.title" class="item_width_1" clearable placeholder="请输入">
</el-input>
</el-form-item>
<el-form-item label="活动时间">
@ -269,6 +269,7 @@
statusType:this.formData.statusType,
endTime:this.formData.endTime,
online:this.formData.online,
title:this.formData.title,
// district: this.$store.state.user.agencyId,
}
requestPost(url, params).then((res) => {

Write Preview
Loading…
Cancel
Save