1224 lines
37 KiB
Vue
1224 lines
37 KiB
Vue
<!-- +----------------------------------------------------------------------
|
||
| 麦沃德科技赋能开发者，助力商协会发展
|
||
+----------------------------------------------------------------------
|
||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||
+----------------------------------------------------------------------
|
||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||
+----------------------------------------------------------------------
|
||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||
+----------------------------------------------------------------------
|
||
| 编辑资料 开发者: 麦沃德科技-半夏
|
||
+---------------------------------------------------------------------- -->
|
||
|
||
<template>
|
||
<page-meta :page-style="'overflow:' + (pageShow ? 'hidden' : 'visible')"></page-meta>
|
||
<view class="container" :style="{'--theme-color': themeColor}">
|
||
<!-- 标题栏 -->
|
||
<title-bar :showBack="true" title="编辑资料"></title-bar>
|
||
<!-- 内容区 -->
|
||
<view class="container-main" v-if="loadEnd">
|
||
<!-- 顶部信息 -->
|
||
<view class="main-header" :style="{top: titleBarHeight + 'px'}">
|
||
<view class="header-screen" v-if="memberType != 1">
|
||
<view class="screen" :class="{active: selectScreen == 1}" v-if="memberType == 2 || memberType == 3" @click="changeScreen(1)">个人资料</view>
|
||
<view class="screen" :class="{active: selectScreen == 2}" v-if="memberType == 2" @click="changeScreen(2)">企业资料</view>
|
||
<view class="screen" :class="{active: selectScreen == 2}" v-else-if="memberType == 3" @click="changeScreen(2)">团体资料</view>
|
||
<view class="screen" :class="{active: selectScreen == 3}" v-if="memberType == 2 || memberType == 3" @click="changeScreen(3)">产品维护</view>
|
||
</view>
|
||
<view class="header-box" v-if="selectScreen != 3">
|
||
<view class="box-image" :style="{'background-image': 'url('+ iconSheet +')'}" v-if="iconSheet"></view>
|
||
<view class="box-title">
|
||
<text v-if="memberType == 1 || (memberType == 2 && selectScreen == 1) || (memberType == 3 && selectScreen == 1)">完善个人信息</text>
|
||
<text v-else-if="memberType == 2 && selectScreen == 2">完善企业信息</text>
|
||
<text v-else-if="memberType == 3 && selectScreen == 2">完善团体信息</text>
|
||
</view>
|
||
<view class="box-subtitle">完善信息后，可在会员详情显示</view>
|
||
</view>
|
||
</view>
|
||
<!-- 产品维护 -->
|
||
<view class="main-form" style="padding: 32rpx;" v-if="selectScreen == 3">
|
||
<member-product ref="memberProduct"></member-product>
|
||
</view>
|
||
<!-- 会员资料 -->
|
||
<view class="main-form" v-else>
|
||
<!-- 个人会员 -->
|
||
<block v-if="memberType == 1">
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">个人轮播图</text>
|
||
<text class="tips">（图片建议尺寸686*320）</text>
|
||
</view>
|
||
<view class="group-upload">
|
||
<view class="upload-image" v-for="(item, index) in personCarousel" :key="index" @click="previewImage(index)">
|
||
<image class="image-select" :src="item" mode="aspectFill"></image>
|
||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index)"></image>
|
||
</view>
|
||
<view class="upload-image" v-if="personCarousel.length < 9" @click="chooseImage()">
|
||
<view class="image-background"></view>
|
||
<view class="image-choose">
|
||
<view class="icon">
|
||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||
</view>
|
||
<view class="text">上传图片</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<member-apply ref="memberPerson" :show-type="1" :show-data="personInfo" :mobile-auth="mobileAuth" @changeMobileAuth="changeMobileAuth" @onChange="pageChange"></member-apply>
|
||
</block>
|
||
<!-- 企业会员 -->
|
||
<block v-else-if="memberType == 2">
|
||
<view v-show="selectScreen == 1">
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">个人轮播图</text>
|
||
<text class="tips">（图片建议尺寸686*320）</text>
|
||
</view>
|
||
<view class="group-upload">
|
||
<view class="upload-image" v-for="(item, index) in personCarousel" :key="index" @click="previewImage(index)">
|
||
<image class="image-select" :src="item" mode="aspectFill"></image>
|
||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index)"></image>
|
||
</view>
|
||
<view class="upload-image" v-if="personCarousel.length < 9" @click="chooseImage()">
|
||
<view class="image-background"></view>
|
||
<view class="image-choose">
|
||
<view class="icon">
|
||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||
</view>
|
||
<view class="text">上传图片</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<member-apply ref="memberPerson" :show-type="1" :show-data="groupInfo.person" :mobile-auth="mobileAuth" @changeMobileAuth="changeMobileAuth" @onChange="pageChange"></member-apply>
|
||
</view>
|
||
<view v-show="selectScreen == 2">
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">公司环境轮播图</text>
|
||
<text class="tips">（图片建议尺寸686*320）</text>
|
||
</view>
|
||
<view class="group-upload">
|
||
<view class="upload-image" v-for="(item, index) in groupCarousel" :key="index" @click="previewImage(index)">
|
||
<image class="image-select" :src="item" mode="aspectFill"></image>
|
||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index)"></image>
|
||
</view>
|
||
<view class="upload-image" v-if="groupCarousel.length < 9" @click="chooseImage()">
|
||
<view class="image-background"></view>
|
||
<view class="image-choose">
|
||
<view class="icon">
|
||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||
</view>
|
||
<view class="text">上传图片</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">公司电话</text>
|
||
</view>
|
||
<view class="group-input">
|
||
<input class="input" type="number" :maxlength="11" v-model="groupMobile" placeholder="请输入公司电话" placeholder-class="placeholder" />
|
||
</view>
|
||
</view>
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">公司地址</text>
|
||
</view>
|
||
<view class="group-input" @click="chooseLocation()">
|
||
<view class="input text-ellipsis" v-if="groupAddress.address">{{groupAddress.address}}</view>
|
||
<view class="input placeholder text-ellipsis" v-else>请选择公司地址</view>
|
||
<image class="icon" src="/static/del.png" mode="aspectFit" @click.stop="clearLocation()" v-if="groupAddress.address"></image>
|
||
<image class="icon" src="/static/right.png" mode="aspectFit" v-else></image>
|
||
</view>
|
||
</view>
|
||
<member-apply ref="memberGroup" :show-type="2" :show-data="groupInfo.company" @onChange="pageChange"></member-apply>
|
||
</view>
|
||
</block>
|
||
<!-- 团体会员 -->
|
||
<block v-else-if="memberType == 3">
|
||
<view v-show="selectScreen == 1">
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">个人轮播图</text>
|
||
<text class="tips">（图片建议尺寸686*320）</text>
|
||
</view>
|
||
<view class="group-upload">
|
||
<view class="upload-image" v-for="(item, index) in personCarousel" :key="index" @click="previewImage(index)">
|
||
<image class="image-select" :src="item" mode="aspectFill"></image>
|
||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index)"></image>
|
||
</view>
|
||
<view class="upload-image" v-if="personCarousel.length < 9" @click="chooseImage()">
|
||
<view class="image-background"></view>
|
||
<view class="image-choose">
|
||
<view class="icon">
|
||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||
</view>
|
||
<view class="text">上传图片</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<member-apply ref="memberPerson" :show-type="1" :show-data="groupInfo.person" :mobile-auth="mobileAuth" @changeMobileAuth="changeMobileAuth" @onChange="pageChange"></member-apply>
|
||
</view>
|
||
<view v-show="selectScreen == 2">
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">团体环境轮播图</text>
|
||
<text class="tips">（图片建议尺寸686*320）</text>
|
||
</view>
|
||
<view class="group-upload">
|
||
<view class="upload-image" v-for="(item, index) in groupCarousel" :key="index" @click="previewImage(index)">
|
||
<image class="image-select" :src="item" mode="aspectFill"></image>
|
||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index)"></image>
|
||
</view>
|
||
<view class="upload-image" v-if="groupCarousel.length < 9" @click="chooseImage()">
|
||
<view class="image-background"></view>
|
||
<view class="image-choose">
|
||
<view class="icon">
|
||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||
</view>
|
||
<view class="text">上传图片</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">团体电话</text>
|
||
</view>
|
||
<view class="group-input">
|
||
<input class="input" type="number" :maxlength="11" v-model="groupMobile" placeholder="请输入团体电话" placeholder-class="placeholder" />
|
||
</view>
|
||
</view>
|
||
<view class="form-group">
|
||
<view class="group-title">
|
||
<text class="text">团体地址</text>
|
||
</view>
|
||
<view class="group-input" @click="chooseLocation()">
|
||
<view class="input text-ellipsis" v-if="groupAddress.address">{{groupAddress.address}}</view>
|
||
<view class="input placeholder text-ellipsis" v-else>请选择团体地址</view>
|
||
<image class="icon" src="/static/right.png" mode="aspectFit"></image>
|
||
</view>
|
||
</view>
|
||
<member-apply ref="memberGroup" :show-type="3" :show-data="groupInfo.organize" @onChange="pageChange"></member-apply>
|
||
</view>
|
||
</block>
|
||
</view>
|
||
<!-- 底部按钮 -->
|
||
<view class="main-footer">
|
||
<view class="footer-btn" @click="handleAddProduct()" v-if="selectScreen == 3">添加产品</view>
|
||
<view class="footer-btn" @click="heandleSubmit()" v-else>保存信息</view>
|
||
<view class="safe-padding"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapState } from "vuex"
|
||
import memberApply from "@/pages/component/member/apply.vue"
|
||
import memberProduct from "@/pages/component/member/product.vue"
|
||
export default {
|
||
components: {
|
||
memberApply,
|
||
memberProduct,
|
||
},
|
||
data() {
|
||
return {
|
||
// 加载完成
|
||
loadEnd: false,
|
||
// 标题栏高度
|
||
titleBarHeight: 0,
|
||
// 入会类型
|
||
memberType: 1,
|
||
// 已选筛选 1.个人，2.企业/团体
|
||
selectScreen: 1,
|
||
// 个人详情
|
||
personInfo: {},
|
||
// 企业/团体详情
|
||
groupInfo: {},
|
||
// 已上传图片列表
|
||
uploadedList: [],
|
||
// 手机号对外权限
|
||
mobileAuth: 1,
|
||
// 个人轮播图
|
||
personCarousel: [],
|
||
// 企业/团体轮播图
|
||
groupCarousel: [],
|
||
// 已上传个人轮播图
|
||
personUploaded: [],
|
||
// 已上传企业/团体轮播图
|
||
groupUploaded: [],
|
||
// 企业/团体电话
|
||
groupMobile: "",
|
||
// 企业/团体地址
|
||
groupAddress: {
|
||
latitude: "",
|
||
longitude: "",
|
||
name: "",
|
||
address: "",
|
||
},
|
||
// 返回计时器
|
||
backTimer: null,
|
||
}
|
||
},
|
||
computed: {
|
||
...mapState({
|
||
themeColor: state => state.app.themeColor,
|
||
})
|
||
},
|
||
mounted() {
|
||
// #ifdef MP-WEIXIN
|
||
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight
|
||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
||
this.titleBarHeight = statusBarHeight + (menuButtonInfo.top - statusBarHeight) * 2 + menuButtonInfo.height
|
||
// #endif
|
||
},
|
||
onLoad() {
|
||
uni.showLoading({
|
||
title: "加载中"
|
||
})
|
||
this.getMemberState(() => {
|
||
this.loadEnd = true
|
||
uni.hideLoading()
|
||
})
|
||
},
|
||
onUnload() {
|
||
if (this.backTimer) clearTimeout(this.backTimer)
|
||
},
|
||
onShow() {
|
||
let pages = getCurrentPages();
|
||
if (pages[pages.length - 1].$vm.editorContent) {
|
||
const result = pages[pages.length - 1].$vm.editorContent
|
||
if (this.memberType == 1 || this.selectScreen == 1) this.$refs.memberPerson.setEditorData(result)
|
||
else if (this.selectScreen == 2) this.$refs.memberGroup.setEditorData(result)
|
||
delete pages[pages.length - 1].$vm.editorContent;
|
||
}
|
||
if (this.selectScreen == 3) {
|
||
this.$refs.memberProduct.getProductList()
|
||
}
|
||
},
|
||
methods: {
|
||
// 改变页面滚动状态
|
||
pageChange(state) {
|
||
this.pageShow = state
|
||
},
|
||
// 获取会员状态
|
||
getMemberState(fn) {
|
||
this.$util.request("member.state").then(res => {
|
||
if (res.code == 1) {
|
||
this.memberState = res.data.state
|
||
if (this.memberState.state == 6) {
|
||
this.getMemberInfo(fn)
|
||
} else if (this.memberState.state == -1) {
|
||
uni.hideLoading()
|
||
uni.showModal({
|
||
title: "系统提示",
|
||
content: "您还没有入会，请入会后操作",
|
||
cancelText: "返回",
|
||
confirmText: "去申请",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.$util.toPage({
|
||
mode: 2,
|
||
path: "/pages/member/apply/index"
|
||
})
|
||
} else {
|
||
if (getCurrentPages().length == 1) {
|
||
uni.switchTab({
|
||
url: "/pages/mine/index"
|
||
})
|
||
} else {
|
||
uni.navigateBack()
|
||
}
|
||
}
|
||
}
|
||
})
|
||
} else if (this.memberState.state == 7) {
|
||
uni.hideLoading()
|
||
uni.showModal({
|
||
title: "系统提示",
|
||
content: "您的会员已过期，请缴纳会费后操作",
|
||
cancelText: "返回",
|
||
confirmText: "去缴纳",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.$util.toPage({
|
||
mode: 2,
|
||
path: "/pages/member/fees/index"
|
||
})
|
||
} else {
|
||
if (getCurrentPages().length == 1) {
|
||
uni.switchTab({
|
||
url: "/pages/mine/index"
|
||
})
|
||
} else {
|
||
uni.navigateBack()
|
||
}
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
uni.hideLoading()
|
||
uni.showModal({
|
||
title: "系统提示",
|
||
content: "您已提交入会申请，请通过后操作",
|
||
cancelText: "返回",
|
||
confirmText: "前往查看",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
uni.switchTab({
|
||
url: "/pages/mine/index"
|
||
})
|
||
} else {
|
||
if (getCurrentPages().length == 1) {
|
||
uni.switchTab({
|
||
url: "/pages/index/index"
|
||
})
|
||
} else {
|
||
uni.navigateBack()
|
||
}
|
||
}
|
||
}
|
||
})
|
||
}
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
}
|
||
}).catch(error => {
|
||
console.error('获取会员状态 ', error)
|
||
})
|
||
},
|
||
// 获取会员信息
|
||
getMemberInfo(fn) {
|
||
this.$util.request("member.information").then(res => {
|
||
if (fn) fn()
|
||
if (res.code == 1) {
|
||
this.mobileAuth = res.data.mobile_auth || 1
|
||
this.uploadedList = []
|
||
if (res.data.personal_carousel_images) {
|
||
this.personCarousel = this.personUploaded = this.splitImages(res.data.personal_carousel_images)
|
||
} else this.personCarousel = this.personUploaded = []
|
||
if (res.data.company_carousel_images) {
|
||
this.groupCarousel = this.groupUploaded = this.splitImages(res.data.company_carousel_images)
|
||
} else this.groupCarousel = this.groupUploaded = []
|
||
if (res.data.company) {
|
||
this.memberType = 2
|
||
this.groupInfo = {
|
||
person: this.setMemberField(res.data.person, 1),
|
||
company: this.setMemberField(res.data.company, 2)
|
||
}
|
||
this.groupMobile = res.data.company_office_number
|
||
this.groupAddress = JSON.parse(res.data.address_json)
|
||
} else if (res.data.organize) {
|
||
this.memberType = 3
|
||
this.groupInfo = {
|
||
person: this.setMemberField(res.data.person, 1),
|
||
organize: this.setMemberField(res.data.organize, 3)
|
||
}
|
||
this.groupMobile = res.data.company_office_number
|
||
this.groupAddress = JSON.parse(res.data.address_json)
|
||
} else {
|
||
this.memberType = 1
|
||
this.personInfo = this.setMemberField(res.data.person, 1)
|
||
}
|
||
if (fn) fn()
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
}
|
||
}).catch(error => {
|
||
console.error('获取会员信息 ', error)
|
||
})
|
||
},
|
||
// 设置会员字段
|
||
setMemberField(data, type) {
|
||
let list = JSON.parse(JSON.stringify(data))
|
||
if (type == 1) {
|
||
list.forEach((item) => {
|
||
if (item.type == "checkbox") {
|
||
if (item.value) item.value = item.value.split(",")
|
||
else item.value = []
|
||
} else if (item.type == "text" && item.field == "address") {
|
||
if (!item.value) {
|
||
item.value = {
|
||
latitude: "",
|
||
longitude: "",
|
||
name: "",
|
||
address: ""
|
||
}
|
||
}
|
||
} else if (item.type == "image") {
|
||
if (item.field == "avatar") {
|
||
if (item.value) {
|
||
this.uploadedList.push(item.value)
|
||
} else {
|
||
item.value = ""
|
||
}
|
||
} else {
|
||
if (item.value) {
|
||
if (typeof(item.value) == "string") {
|
||
item.value = item.value.split(",")
|
||
}
|
||
this.uploadedList = [...this.uploadedList, ...item.value]
|
||
} else {
|
||
item.value = []
|
||
}
|
||
}
|
||
} else if (item.type == "cert") {
|
||
if (!item.value) {
|
||
item.value = {
|
||
name: "",
|
||
number: "",
|
||
image: "",
|
||
}
|
||
} else if (item.value.image) {
|
||
this.uploadedList.push(item.value.image)
|
||
}
|
||
} else if (item.type == "video") {
|
||
this.uploadedList.push(item.value)
|
||
}
|
||
if (item.field == "name" || item.field == "mobile" || item.field == "member_level_id") {
|
||
item.disabled = true
|
||
}
|
||
});
|
||
} else {
|
||
list.forEach((item) => {
|
||
if (item.type == "checkbox") {
|
||
if (item.value) item.value = item.value.split(",")
|
||
else item.value = []
|
||
} else if (item.type == "image") {
|
||
if ((this.memberType == 2 && item.field == 'company_logo') || (this.memberType == 3 && item.field == 'organize_logo')) {
|
||
if (item.value) {
|
||
this.uploadedList.push(item.value)
|
||
} else {
|
||
item.value = ""
|
||
}
|
||
} else {
|
||
if (item.value) {
|
||
if (typeof(item.value) == "string") {
|
||
item.value = item.value.split(",")
|
||
}
|
||
this.uploadedList = [...this.uploadedList, ...item.value]
|
||
} else {
|
||
item.value = []
|
||
}
|
||
}
|
||
} else if (item.type == "cert") {
|
||
if (!item.value) {
|
||
item.value = {
|
||
name: "",
|
||
number: "",
|
||
image: "",
|
||
}
|
||
} else if (item.value.image) {
|
||
this.uploadedList.push(item.value.image)
|
||
}
|
||
} else if (item.type == "video") {
|
||
this.uploadedList.push(item.value)
|
||
}
|
||
});
|
||
}
|
||
return list
|
||
},
|
||
// 字符串转数组格式图片
|
||
splitImages(images) {
|
||
try {
|
||
if (images) return images.split(',');
|
||
else return []
|
||
} catch (error) {
|
||
return [];
|
||
}
|
||
},
|
||
// 改变筛选
|
||
changeScreen(id) {
|
||
if (this.selectScreen == id) return
|
||
uni.pageScrollTo({
|
||
scrollTop: 0,
|
||
duration: 0
|
||
});
|
||
this.selectScreen = id
|
||
},
|
||
// 改变手机号对外状态
|
||
changeMobileAuth(value) {
|
||
this.mobileAuth = value
|
||
},
|
||
// 选择图片
|
||
chooseImage() {
|
||
// #ifdef MP-WEIXIN
|
||
uni.chooseMedia({
|
||
count: 9 - this.personCarousel.length,
|
||
mediaType: ['image'],
|
||
sourceType: ['album', 'camera'],
|
||
sizeType: ['compressed'],
|
||
success: (res) => {
|
||
let list = res.tempFiles.map(item => item.tempFilePath)
|
||
if (this.selectScreen == 1) {
|
||
this.personCarousel = [...this.personCarousel, ...list]
|
||
} else {
|
||
this.groupCarousel = [...this.groupCarousel, ...list]
|
||
}
|
||
}
|
||
})
|
||
// #endif
|
||
// #ifndef MP-WEIXIN
|
||
uni.chooseImage({
|
||
count: 9 - this.personCarousel.length,
|
||
mediaType: ['image'],
|
||
sourceType: ['album', 'camera'],
|
||
sizeType: ['compressed'],
|
||
success: (res) => {
|
||
let list = res.tempFilePaths
|
||
if (this.selectScreen == 1) {
|
||
this.personCarousel = [...this.personCarousel, ...list]
|
||
} else {
|
||
this.groupCarousel = [...this.groupCarousel, ...list]
|
||
}
|
||
}
|
||
});
|
||
// #endif
|
||
},
|
||
// 删除图片
|
||
deleteImage(index) {
|
||
if (this.selectScreen == 1) {
|
||
this.$delete(this.personCarousel, index)
|
||
} else {
|
||
this.$delete(this.groupCarousel, index)
|
||
}
|
||
},
|
||
// 预览图片
|
||
previewImage(index) {
|
||
if (this.selectScreen == 1) {
|
||
uni.previewImage({
|
||
urls: this.personCarousel,
|
||
current: index
|
||
});
|
||
} else {
|
||
uni.previewImage({
|
||
urls: this.groupCarousel,
|
||
current: index
|
||
});
|
||
}
|
||
},
|
||
// 地址选址
|
||
chooseLocation() {
|
||
uni.chooseLocation({
|
||
success: (res) => {
|
||
this.groupAddress = {
|
||
latitude: res.latitude,
|
||
longitude: res.longitude,
|
||
name: res.name,
|
||
address: res.address
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 清除地址
|
||
clearLocation() {
|
||
this.groupAddress = {
|
||
latitude: "",
|
||
longitude: "",
|
||
name: "",
|
||
address: "",
|
||
}
|
||
},
|
||
// 提交申请
|
||
heandleSubmit() {
|
||
uni.showLoading({
|
||
title: "加载中",
|
||
mask: true
|
||
})
|
||
this.$refs.memberPerson.getApplyField((data) => {
|
||
// fileList.type => 1.个人资料内图片，2.企业资料内图片，3.个人轮播图，4.企业/团体轮播图
|
||
let fileList = []
|
||
let personImages = JSON.parse(JSON.stringify(this.personCarousel || []))
|
||
let groupImages = JSON.parse(JSON.stringify(this.groupCarousel || []))
|
||
for (let i in data) {
|
||
// 判断必填项是否为空
|
||
if (data[i].required == 1) {
|
||
let isEmpty = false
|
||
if (data[i].type == "text" && data[i].field == "address") {
|
||
if (!data[i].value.address) isEmpty = true
|
||
} else if (data[i].type == "checkbox") {
|
||
if (!data[i].value.length) isEmpty = true
|
||
} else if (data[i].type == "image") {
|
||
if (data[i].field == "avatar") {
|
||
if (!data[i].value) isEmpty = true
|
||
} else {
|
||
if (!data[i].value.length) isEmpty = true
|
||
}
|
||
} else if (data[i].type == "cert") {
|
||
if (!data[i].value.name || !data[i].value.number || !data[i].value.image) isEmpty = true
|
||
} else {
|
||
if (!data[i].value && data[i].value !== 0) isEmpty = true
|
||
}
|
||
if (isEmpty) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: `${this.memberType == 1 ? "" : "个人资料的"}${data[i].label}不能为空`,
|
||
duration: 2000
|
||
})
|
||
return
|
||
}
|
||
}
|
||
// 判断手机号是否合规
|
||
if (data[i].type == "number" && data[i].field == "mobile") {
|
||
if (!this.$util.validation("phone", data[i].value)) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: "请输入正确的手机号"
|
||
})
|
||
return
|
||
}
|
||
}
|
||
// 判断证书是否合规
|
||
if (data[i].type == "cert") {
|
||
if (data[i].value.name || data[i].value.number || data[i].value.image) {
|
||
if (!data[i].value.name || !data[i].value.number || !data[i].value.image) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: data[i].label + "存在未填项"
|
||
})
|
||
return
|
||
}
|
||
}
|
||
}
|
||
// 设置字段值格式
|
||
if (data[i].type == "number") {
|
||
data[i].value = (data[i].value || data[i].value === 0) ? Number(data[i].value) : data[i].value
|
||
} else if (data[i].type == "checkbox") {
|
||
data[i].value = data[i].value.join()
|
||
} else if (data[i].type == "image") {
|
||
if (data[i].field == "avatar") {
|
||
if (data[i].value && !this.uploadedList.includes(data[i].value)) {
|
||
fileList.push({
|
||
type: 1,
|
||
index: i,
|
||
value: data[i].value
|
||
})
|
||
}
|
||
} else if (data[i].value.length) {
|
||
for (let j in data[i].value) {
|
||
if (data[i].value[j] && !this.uploadedList.includes(data[i].value[j])) {
|
||
fileList.push({
|
||
type: 1,
|
||
index: i,
|
||
number: j,
|
||
value: data[i].value[j]
|
||
})
|
||
}
|
||
}
|
||
}
|
||
} else if (data[i].type == "video") {
|
||
if (data[i].value && !this.uploadedList.includes(data[i].value)) {
|
||
fileList.push({
|
||
type: 1,
|
||
index: i,
|
||
value: data[i].value
|
||
})
|
||
}
|
||
} else if (data[i].type == "cert") {
|
||
if (data[i].value.image && !this.uploadedList.includes(data[i].value.image)) {
|
||
fileList.push({
|
||
type: 1,
|
||
index: i,
|
||
value: data[i].value.image
|
||
})
|
||
}
|
||
}
|
||
}
|
||
if (personImages.length) {
|
||
for (let index in personImages) {
|
||
if (personImages[index] && !this.personUploaded.includes(personImages[index])) {
|
||
fileList.push({
|
||
type: 3,
|
||
index: index,
|
||
value: personImages[index]
|
||
})
|
||
}
|
||
}
|
||
}
|
||
if (this.memberType == 1) {
|
||
if (fileList.length) {
|
||
this.uploadFiles(fileList, (files) => {
|
||
for (let i in fileList) {
|
||
if (fileList[i].type == 3) {
|
||
personImages[fileList[i].index] = files[i]
|
||
} else {
|
||
if (data[fileList[i].index].type == "image") {
|
||
if (data[fileList[i].index].field == "avatar") {
|
||
data[fileList[i].index].value = files[i]
|
||
} else {
|
||
data[fileList[i].index].value[fileList[i].number] = files[i]
|
||
}
|
||
} else if (data[fileList[i].index].type == "video") {
|
||
data[fileList[i].index].value = files[i]
|
||
} else if (data[fileList[i].index].type == "cert") {
|
||
data[fileList[i].index].value.image = files[i]
|
||
}
|
||
}
|
||
}
|
||
this.submitEvent({
|
||
person: data,
|
||
personImages,
|
||
})
|
||
})
|
||
} else {
|
||
this.submitEvent({
|
||
person: data,
|
||
personImages,
|
||
})
|
||
}
|
||
} else {
|
||
if (groupImages.length) {
|
||
for (var index in groupImages) {
|
||
if (groupImages[index] && !this.groupUploaded.includes(groupImages[index])) {
|
||
fileList.push({
|
||
type: 4,
|
||
index: index,
|
||
value: groupImages[index]
|
||
})
|
||
}
|
||
}
|
||
}
|
||
this.$refs.memberGroup.getApplyField((form) => {
|
||
for (let j in form) {
|
||
// 判断必填项是否为空
|
||
if (form[j].required == 1) {
|
||
let isEmpty = false
|
||
if (form[j].type == "checkbox") {
|
||
if (!form[j].value.length) isEmpty = true
|
||
} else if (form[j].type == "image") {
|
||
if ((this.memberType == 2 && form[j].field == "company_logo") || (this.memberType == 3 && form[j].field == "organize_logo")) {
|
||
if (!form[j].value) isEmpty = true
|
||
} else {
|
||
if (!form[j].value.length) isEmpty = true
|
||
}
|
||
} else if (form[j].type == "cert") {
|
||
if (!form[j].value.name || !form[j].value.number || !form[j].value.image) isEmpty = true
|
||
} else {
|
||
if (!form[j].value) isEmpty = true
|
||
}
|
||
if (isEmpty) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: `${this.memberType == 2 ? "企业资料" : "团体资料"}的${form[j].label}不能为空`,
|
||
duration: 2000
|
||
})
|
||
return
|
||
}
|
||
}
|
||
// 判断证书是否合规
|
||
if (form[j].type == "cert") {
|
||
if (form[j].value.name || form[j].value.number || form[j].value.image) {
|
||
if (!form[j].value.name || !form[j].value.number || !form[j].value.image) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: form[j].label + "存在未填项"
|
||
})
|
||
return
|
||
}
|
||
}
|
||
}
|
||
// 设置字段值格式
|
||
if (form[j].type == "number") {
|
||
form[j].value = (form[j].value || form[j].value === 0) ? Number(form[j].value) : form[j].value
|
||
} else if (form[j].type == "checkbox") {
|
||
form[j].value = form[j].value.join()
|
||
} else if (form[j].type == "image") {
|
||
if ((this.memberType == 2 && form[j].field == "company_logo") || (this.memberType == 3 && form[j].field == "organize_logo")) {
|
||
if (form[j].value && !this.uploadedList.includes(form[j].value)) {
|
||
fileList.push({
|
||
type: 2,
|
||
index: j,
|
||
value: form[j].value
|
||
})
|
||
}
|
||
} else if (form[j].value.length) {
|
||
for (let z in form[j].value) {
|
||
if (!this.uploadedList.includes(form[j].value[z])) {
|
||
fileList.push({
|
||
type: 2,
|
||
index: j,
|
||
number: z,
|
||
value: form[j].value[z]
|
||
})
|
||
}
|
||
}
|
||
}
|
||
} else if (form[j].type == "video") {
|
||
if (form[j].value && !this.uploadedList.includes(form[j].value)) {
|
||
fileList.push({
|
||
type: 2,
|
||
index: j,
|
||
value: form[j].value
|
||
})
|
||
}
|
||
} else if (form[j].type == "cert") {
|
||
if (form[j].value.image && !this.uploadedList.includes(form[j].value.image)) {
|
||
fileList.push({
|
||
type: 2,
|
||
index: j,
|
||
value: form[j].value.image
|
||
})
|
||
}
|
||
}
|
||
}
|
||
if (fileList.length) {
|
||
this.uploadFiles(fileList, (files) => {
|
||
for (let i in fileList) {
|
||
if (fileList[i].type == 1) {
|
||
if (data[fileList[i].index].type == "image") {
|
||
if (data[fileList[i].index].field == "avatar") {
|
||
data[fileList[i].index].value = files[i]
|
||
} else {
|
||
data[fileList[i].index].value[fileList[i].number] = files[i]
|
||
}
|
||
} else if (data[fileList[i].index].type == "video") {
|
||
data[fileList[i].index].value = files[i]
|
||
} else if (data[fileList[i].index].type == "cert") {
|
||
data[fileList[i].index].value.image = files[i]
|
||
}
|
||
} else if (fileList[i].type == 3) {
|
||
personImages[fileList[i].index] = files[i]
|
||
} else if (fileList[i].type == 4) {
|
||
groupImages[fileList[i].index] = files[i]
|
||
} else {
|
||
if (form[fileList[i].index].type == "image") {
|
||
if ((this.memberType == 2 && form[fileList[i].index].field == "company_logo") || (this.memberType == 3 && form[fileList[i].index].field == "organize_logo")) {
|
||
form[fileList[i].index].value = files[i]
|
||
} else {
|
||
form[fileList[i].index].value[fileList[i].number] = files[i]
|
||
}
|
||
} else if (form[fileList[i].index].type == "video") {
|
||
form[fileList[i].index].value = files[i]
|
||
} else if (form[fileList[i].index].type == "cert") {
|
||
form[fileList[i].index].value.image = files[i]
|
||
}
|
||
}
|
||
}
|
||
this.submitEvent({
|
||
person: data,
|
||
group: form,
|
||
personImages,
|
||
groupImages,
|
||
})
|
||
})
|
||
} else {
|
||
this.submitEvent({
|
||
person: data,
|
||
group: form,
|
||
personImages,
|
||
groupImages,
|
||
})
|
||
}
|
||
})
|
||
}
|
||
})
|
||
},
|
||
// 上传文件
|
||
uploadFiles(list, fn) {
|
||
this.$util.uploadFileMultiple(list.map(item => item.value)).then(result => {
|
||
fn(result)
|
||
}).catch(error => {
|
||
console.error('上传文件 ', error)
|
||
})
|
||
},
|
||
// 提交事件
|
||
submitEvent(data) {
|
||
for (let i in data.person) {
|
||
if (data.person[i].type == "image" && typeof(data.person[i].value) == "object") {
|
||
data.person[i].value = data.person[i].value.join()
|
||
}
|
||
}
|
||
for (let i in data.group) {
|
||
if (data.group[i].type == "image" && typeof(data.group[i].value) == "object") {
|
||
data.group[i].value = data.group[i].value.join()
|
||
}
|
||
}
|
||
if (data.personImages?.length) {
|
||
data.personImages = data.personImages.join()
|
||
}
|
||
if (data.groupImages?.length) {
|
||
data.groupImages = data.groupImages.join()
|
||
}
|
||
var formData = {}
|
||
if (this.memberType == 1) {
|
||
formData = data.person
|
||
} else if (this.memberType == 2) {
|
||
formData.person = data.person
|
||
formData.company = data.group
|
||
} else if (this.memberType == 3) {
|
||
formData.person = data.person
|
||
formData.organize = data.group
|
||
}
|
||
this.$util.request("member.editInformation", {
|
||
data: JSON.stringify(formData),
|
||
mobile_auth: this.mobileAuth,
|
||
personal_carousel_images: data.personImages || "",
|
||
...this.memberType != 1 ? {
|
||
company_carousel_images: data.groupImages || "",
|
||
company_office_number: this.groupMobile || "",
|
||
address_json: JSON.stringify(this.groupAddress)
|
||
} : {},
|
||
}).then(res => {
|
||
if (res.code == 1) {
|
||
uni.showToast({
|
||
mask: true,
|
||
title: "保存成功",
|
||
icon: "success",
|
||
duration: 1500
|
||
})
|
||
if (this.backTimer) clearTimeout(this.backTimer)
|
||
this.backTimer = setTimeout(() => {
|
||
this.goBack()
|
||
}, 1500);
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
}
|
||
}).catch(error => {
|
||
uni.hideLoading()
|
||
console.error('编辑资料 ', error)
|
||
})
|
||
},
|
||
// 返回上一页面
|
||
goBack() {
|
||
if (getCurrentPages().length == 1) {
|
||
uni.switchTab({
|
||
url: "/pages/mine/index"
|
||
})
|
||
} else {
|
||
uni.navigateBack()
|
||
}
|
||
},
|
||
// 添加产品
|
||
handleAddProduct() {
|
||
this.$util.toPage({
|
||
mode: 1,
|
||
path: "/pages/member/product/edit"
|
||
})
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.container {
|
||
.container-main {
|
||
padding-bottom: 112rpx;
|
||
|
||
.main-header {
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 96;
|
||
|
||
.header-screen {
|
||
display: flex;
|
||
background: #ffffff;
|
||
|
||
.screen {
|
||
width: 50%;
|
||
color: #8D929C;
|
||
font-size: 28rpx;
|
||
line-height: 40rpx;
|
||
text-align: center;
|
||
padding: 32rpx 24rpx;
|
||
|
||
&.active {
|
||
color: var(--theme-color)
|
||
}
|
||
}
|
||
}
|
||
|
||
.header-box {
|
||
position: relative;
|
||
background: linear-gradient(0deg, #F6F7FB, var(--theme-color) 316.667%);
|
||
padding: 40rpx 48rpx;
|
||
|
||
.box-image {
|
||
position: absolute;
|
||
top: 64rpx;
|
||
right: 48rpx;
|
||
width: 218rpx;
|
||
height: 198rpx;
|
||
background-size: 218rpx 198rpx;
|
||
}
|
||
|
||
.box-title {
|
||
color: var(--theme-color);
|
||
font-size: 48rpx;
|
||
font-weight: 600;
|
||
line-height: 68rpx;
|
||
position: relative;
|
||
z-index: 1;
|
||
}
|
||
|
||
.box-subtitle {
|
||
margin-top: 32rpx;
|
||
color: #999999;
|
||
font-size: 28rpx;
|
||
line-height: 40rpx;
|
||
position: relative;
|
||
z-index: 1;
|
||
}
|
||
}
|
||
}
|
||
|
||
.main-form {
|
||
padding: 22rpx 48rpx 32rpx;
|
||
|
||
.form-group {
|
||
margin-bottom: 32rpx;
|
||
|
||
.group-title {
|
||
color: #5A5B6E;
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
line-height: 44rpx;
|
||
|
||
.tips {
|
||
font-size: 28rpx;
|
||
font-weight: 400;
|
||
color: #666666;
|
||
}
|
||
}
|
||
|
||
.group-upload {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
margin-top: 32rpx;
|
||
row-gap: 24rpx;
|
||
|
||
.upload-image {
|
||
position: relative;
|
||
width: 48%;
|
||
height: 0;
|
||
padding-top: 24%;
|
||
|
||
.image-select {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
border-radius: 10rpx;
|
||
}
|
||
|
||
.image-delete {
|
||
position: absolute;
|
||
top: 8rpx;
|
||
right: 8rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.image-choose {
|
||
position: absolute;
|
||
top: 20rpx;
|
||
left: 20rpx;
|
||
right: 20rpx;
|
||
bottom: 20rpx;
|
||
z-index: 6;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
background: #FFF;
|
||
border-radius: 10rpx;
|
||
|
||
.icon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
padding: 12rpx;
|
||
background: var(--theme-color);
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.text {
|
||
margin-left: 16rpx;
|
||
color: var(--theme-color);
|
||
font-size: 28rpx;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
|
||
.image-background {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
z-index: 1;
|
||
background: var(--theme-color);
|
||
opacity: 0.08;
|
||
}
|
||
}
|
||
}
|
||
|
||
.group-input {
|
||
margin-top: 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
border-radius: 16rpx;
|
||
background: #FFF;
|
||
|
||
.input {
|
||
color: #5A5B6E;
|
||
font-size: 28rpx;
|
||
height: 104rpx;
|
||
line-height: 104rpx;
|
||
flex: 1;
|
||
padding: 0 32rpx;
|
||
}
|
||
|
||
.placeholder {
|
||
color: #ACADB7;
|
||
}
|
||
|
||
.icon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
padding-right: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.main-footer {
|
||
position: fixed;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
z-index: 96;
|
||
background: #ffffff;
|
||
border-top: 1rpx solid #F6F7FB;
|
||
padding: 12rpx 24rpx;
|
||
|
||
.footer-btn {
|
||
color: #ffffff;
|
||
font-size: 32rpx;
|
||
line-height: 44rpx;
|
||
padding: 22rpx 24rpx;
|
||
border-radius: 16rpx;
|
||
background: var(--theme-color);
|
||
text-align: center;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |