报名功能

This commit is contained in:
13405411873 2025-04-09 15:42:01 +08:00
parent 0d6e10033e
commit 6ee0c121b2
3 changed files with 248 additions and 55 deletions

View File

@ -2,7 +2,7 @@
<view :class="['my-card-box',ifChoose?'has-footer':'']"> <view :class="['my-card-box',ifChoose?'has-footer':'']">
<navigation-bar-vue title="我的名片" style="width: 100%;" background-color="#ffffff" <navigation-bar-vue title="我的名片" style="width: 100%;" background-color="#ffffff"
title-color="#000000"></navigation-bar-vue> title-color="#000000"></navigation-bar-vue>
<view class="opt-box" v-if="!ifChoose"> <view class="opt-box">
<view v-if="!ifEdit" class="item-dom" @click="manager(true)"><uni-icons type="bars" color="#FC1F3E" <view v-if="!ifEdit" class="item-dom" @click="manager(true)"><uni-icons type="bars" color="#FC1F3E"
size="16"></uni-icons><text></text></view> size="16"></uni-icons><text></text></view>
<view v-if="!ifEdit" class="item-dom" @click="addCard()"> <view v-if="!ifEdit" class="item-dom" @click="addCard()">
@ -19,7 +19,7 @@
<view class="card-dom " v-for="item in busiCardList"> <view class="card-dom " v-for="item in busiCardList">
<!-- 多选框--管理状态或者选择名片时使用 --> <!-- 多选框--管理状态或者选择名片时使用 -->
<view class="choose-dom" v-if="ifChoose"> <view class="choose-dom" v-if="ifChoose">
<uni-data-checkbox v-model="item.choosed" :disabled="1!=item.approvalStatus" multiple <uni-data-checkbox v-model="item.choosed" :disabled="item.canUse=='0'" multiple
:localdata="checkboxArray" /> :localdata="checkboxArray" />
</view> </view>
<view :class="['right-content',item.choosed.length>0?'click':'']"> <view :class="['right-content',item.choosed.length>0?'click':'']">
@ -62,7 +62,7 @@
</view> </view>
<view class="right-button"> <view class="right-button">
<text>已选择{{getChooseNum}}</text> <text>已选择{{getChooseNum}}</text>
<view class="button-dom">保存</view> <view class="button-dom" @click="chooseOk">保存</view>
</view> </view>
</view> </view>
</view> </view>
@ -77,12 +77,20 @@
getUserBusiCard, getUserBusiCard,
removeBusiCard removeBusiCard
} from '@/api/business/member.js' } from '@/api/business/member.js'
import {
getSignCard
} from '@/api/business/signCard.js'
import {
hasRights
} from '@/utils/common.js'
import rightsCode from '@/utils/rightsCode.js'
export default { export default {
components: { components: {
navigationBarVue navigationBarVue
}, },
data() { data() {
return { return {
noticeId: null,
// //
ifEdit: false, ifEdit: false,
//(false) //(false)
@ -106,7 +114,29 @@
onShow() { onShow() {
this.initData(); this.initData();
}, },
onLoad(param) {
if (param.ifChoose) {
this.ifChoose = param.ifChoose
}
if (param.noticeId) {
this.noticeId = param.noticeId
}
},
methods: { methods: {
chooseOk() {
let info = hasRights(rightsCode.manyCardReport)
if (!info && this.busiCardList.length > 1) {
//
uni.showToast({
title: '未开通会员不可添加多个',
icon: 'none'
})
return
}
uni.$emit('updateCard', this.busiCardList)
uni.navigateBack()
},
/** /**
* 数值单位转换 * 数值单位转换
* @param {Object} number * @param {Object} number
@ -117,20 +147,40 @@
// //
initData() { initData() {
this.busiCardList = [] this.busiCardList = []
getUserBusiCard().then(res => { if (!this.ifChoose) {
if (res.data.length > 0) { getUserBusiCard().then(res => {
res.data.map((item) => { if (res.data.length > 0) {
item.choosed = [] res.data.map((item) => {
this.busiCardList.push(item) item.choosed = []
}) this.busiCardList.push(item)
} })
}).catch((e) => { }
uni.showToast({ }).catch((e) => {
icon: 'error', uni.showToast({
duration: 2000, icon: 'error',
title: e duration: 2000,
}); title: e
}) });
})
} else {
getSignCard({
noticeId: this.noticeId
}).then(res => {
if (res.data.list.length > 0) {
res.data.list.map((item) => {
item.choosed = []
this.busiCardList.push(item)
})
}
}).catch((e) => {
uni.showToast({
icon: 'error',
duration: 2000,
title: e
});
})
}
}, },
/**删除名片*/ /**删除名片*/
remove(id) { remove(id) {
@ -159,13 +209,13 @@
chooseAllFun(e) { chooseAllFun(e) {
if (e.detail.value.length > 0) { if (e.detail.value.length > 0) {
this.busiCardList.map((item) => { this.busiCardList.map((item) => {
if ("1" == item.approvalStatus) { if ("1" == item.canUse) {
item.choosed = [true] item.choosed = [true]
} }
}) })
} else { } else {
this.busiCardList.map((item) => { this.busiCardList.map((item) => {
if ("1" == item.approvalStatus) { if ("1" == item.canUse) {
item.choosed = [] item.choosed = []
} }
}) })
@ -424,4 +474,4 @@
} }
} }
} }
</style> </style>

View File

@ -435,6 +435,7 @@
}, },
dialogConfirm() { dialogConfirm() {
console.log('点击确认') console.log('点击确认')
this.$tab.navigateTo('/pages/mine/card/my-card')
}, },
dialogClose() { dialogClose() {
console.log('点击关闭') console.log('点击关闭')
@ -454,7 +455,7 @@
}).then(res => { }).then(res => {
if (res.code == 200) { if (res.code == 200) {
if (res.data.canUserNum > 0) { if (res.data.canUserNum > 0) {
this.$tab.navigateTo('/pages/notice/report') this.$tab.navigateTo('/pages/notice/report?noticeId=' + this.noticeId)
} else { } else {
this.$refs.alertDialog.open() this.$refs.alertDialog.open()
} }

View File

@ -4,16 +4,17 @@
title-color="#3D3D3D"></navigation-bar-vue> title-color="#3D3D3D"></navigation-bar-vue>
<view class="notice-detail-last-box"> <view class="notice-detail-last-box">
<view class="dl-notice-title"> <view class="dl-notice-title">
<image class="dl-image" src="/static/platform/xiaohongshu.png" mode="aspectFit"></image> <image class="dl-image" :src="'/static/platform/'+noticeDetail.platformCode+'.png'" mode="aspectFit">
<view class="dl-text">找小红书达人种草蓝月亮洗衣液</view> </image>
<view class="dl-text">{{noticeDetail.title||''}}</view>
</view> </view>
<view class="end-date-box"> <view class="end-date-box">
<view class="end-date">截止日期2024-03-04</view> <view class="end-date">截止日期{{noticeDetail.endDate||''}}</view>
</view> </view>
<!-- 主体内容区域 --> <!-- 主体内容区域 -->
<view class="main-content"> <view class="main-content">
<!-- 会员开通 --> <!-- 会员开通 -->
<view class="dl-member-box" @click="goMemberCard()"> <view class="dl-member-box" @click="goMemberCard()" v-if="!rightInfo.manyCardReport">
<view class="dl-left"> <view class="dl-left">
<image class="dl-icon" src="@/static/index/zuanshi.png" mode="aspectFit"></image> <image class="dl-icon" src="@/static/index/zuanshi.png" mode="aspectFit"></image>
<text>开通会员 添加更多名片</text> <text>开通会员 添加更多名片</text>
@ -23,7 +24,7 @@
</view> </view>
</view> </view>
<!-- 添加更多名片 --> <!-- 添加更多名片 -->
<view class="add-more-card" @click="goMemberCard()"> <view class="add-more-card" @click="goSignCard()" v-else>
<view class="dl-left"> <view class="dl-left">
<image class="dl-icon" src="@/static/detail/card.png" mode="aspectFit"></image> <image class="dl-icon" src="@/static/detail/card.png" mode="aspectFit"></image>
<text>添加更多名片</text> <text>添加更多名片</text>
@ -36,23 +37,23 @@
<view class="member-card-box" v-for="(item,index) in cardList"> <view class="member-card-box" v-for="(item,index) in cardList">
<view class="card-title"> <view class="card-title">
<!-- 需要根据平台code取对应的图片 TODO --> <!-- 需要根据平台code取对应的图片 TODO -->
<image src="@/static/platform/xiaohongshu.png" mode="aspectFit"></image> <image :src="'/static/platform/'+item.platformCode+'.png'" mode="aspectFit"></image>
<text>小红书博主</text> <text>{{item.platformName+'博主'}}</text>
</view> </view>
<view class="card-content"> <view class="card-content">
<view class="card-person-info"> <view class="card-person-info">
<view class="card-name"> <view class="card-name">
<view>小王同学</view> <view>{{item.accountName}}</view>
</view> </view>
</view> </view>
</view> </view>
<view class="card-bottom"> <view class="card-bottom">
<view class="fans-dom"> <view class="fans-dom">
粉丝 {{ formatNumberWithUnits(100000) }} 粉丝 {{ formatNumberWithUnits(item.fansNum) }}
</view> </view>
<view class="change-dom-bg"> <view class="change-dom-bg">
</view> </view>
<view class="change-dom"> <view class="change-dom" @click="goMyCard()">
切换 切换
</view> </view>
</view> </view>
@ -65,12 +66,10 @@
<text>注意为了您的信息安全平台不建议填写您的银行卡号身份证号密码等隐私信息</text> <text>注意为了您的信息安全平台不建议填写您的银行卡号身份证号密码等隐私信息</text>
</view> </view>
<view class="field-form-box"> <view class="field-form-box">
<uni-forms ref="baseForm" :modelValue="baseFormData"> <uni-forms>
<uni-forms-item label="姓名" required> <uni-forms-item v-for="(it,idx) in signFormData.customForm" :label="it.label" required
<uni-easyinput type="text" v-model="baseFormData.name" placeholder="请输入姓名" /> labelWidth="100">
</uni-forms-item> <uni-easyinput v-model="signFormData.customForm[idx].value" placeholder="请输入" />
<uni-forms-item label="年龄" required>
<uni-easyinput type="number" v-model="baseFormData.age" placeholder="请输入年龄" />
</uni-forms-item> </uni-forms-item>
</uni-forms> </uni-forms>
</view> </view>
@ -78,21 +77,21 @@
<!-- 联系方式 --> <!-- 联系方式 -->
<view class="custom-form-box" style="padding: 0 25rpx;"> <view class="custom-form-box" style="padding: 0 25rpx;">
<view class="field-form-box"> <view class="field-form-box">
<uni-forms ref="telForm" :modelValue="telFormData"> <uni-forms ref="signForm" :modelValue="signFormData" :rules="signRules">
<uni-forms-item label="联系方式" required labelWidth="100"> <uni-forms-item label="联系方式" required labelWidth="100" name="tel">
<uni-easyinput type="number" v-model="baseFormData.name" placeholder="请输入姓名" /> <uni-easyinput type="number" v-model="signFormData.tel" placeholder="请输入微信/手机号" />
</uni-forms-item> </uni-forms-item>
</uni-forms> </uni-forms>
</view> </view>
</view> </view>
<!-- 收件地址 --> <!-- 收件地址 -->
<view class="custom-addr-box"> <view class="custom-addr-box" v-if="userAddr">
<view class="left-text">收件地址</view> <view class="left-text">收件地址</view>
<view class="right-text"> <view class="right-text">
<text>中国 山东省 济南市 历城区</text> <text>{{userAddr.cityName}}</text>
<text>财富中心1007A</text> <text>{{userAddr.detail}}</text>
<text>朱春运</text> <text>{{userAddr.name}}</text>
<text>17862909999</text> <text>{{userAddr.tel}}</text>
</view> </view>
<view class="change-addr-dom">切换</view> <view class="change-addr-dom">切换</view>
</view> </view>
@ -116,22 +115,69 @@
formatNumberWithUnits formatNumberWithUnits
} from '@/utils/common.js' } from '@/utils/common.js'
import navigationBarVue from '@/components/navigation/navigationBar.vue'; import navigationBarVue from '@/components/navigation/navigationBar.vue';
import {
getSignCard
} from '@/api/business/signCard.js'
import {
getNoticeDetail
} from '@/api/business/notice';
import {
hasRights
} from '@/utils/common.js'
import rightsCode from '@/utils/rightsCode.js'
import {
getUserAddress
} from '@/api/business/member.js'
export default { export default {
components: { components: {
navigationBarVue navigationBarVue
}, },
data() { data() {
return { return {
//使 signRules: {
cardList: ['', ''], //
// tel: {
baseFormData: { // tel
name: '', rules: [
age: '' // tel
{
required: true,
errorMessage: '请填写联系方式',
}
]
}
}, },
noticeId: null,
//使
cardList: [],
//
// //
telFormData: { signFormData: {
tel: "" tel: null,
customForm: []
},
//
noticeDetail: {
id: "",
title: "",
endDate: null,
feeDown: null,
feeUp: null,
needNum: null,
userId: null,
brand: null,
fansDown: null,
fansUp: null,
city: null,
bloggerTypes: null,
updateTime: null,
approvalStatus: '0',
viewNum: 0,
detail: null,
platformCode: "",
platformName: "",
//
imageArray: []
}, },
// //
rules: { rules: {
@ -151,9 +197,47 @@
}] }]
} }
}, },
rightInfo: {
manyCardReport: false,
superReport: false
},
userAddr: null
} }
}, },
onShow() {
this.getRightsCode()
},
onLoad(params) {
this.noticeId = params.noticeId
if (this.noticeId) {
this.getDetail()
}
this.getCard()
this.userAddress()
let that = this
uni.$on('updateCard', function(data) {
that.updateCard(data)
})
},
methods: { methods: {
userAddress() {
getUserAddress().then(res => {
if (res.data && res.data.length > 0) {
this.userAddr = res.data[0]
}
})
},
updateCard(data) {
console.log(data, 211);
this.cardList = data
},
/**
* 跳转名片列表
*/
goMyCard() {
this.$tab.navigateTo('/pages/mine/card/my-card?ifChoose=true&noticeId=' + this.noticeId)
},
/** /**
* 数值单位转换 * 数值单位转换
* @param {Object} number * @param {Object} number
@ -161,8 +245,66 @@
formatNumberWithUnits(number) { formatNumberWithUnits(number) {
return formatNumberWithUnits(number) return formatNumberWithUnits(number)
}, },
getRightsCode() {
let info = hasRights(rightsCode.manyCardReport)
if (!info) {
this.rightInfo.manyCardReport = false
} else {
this.rightInfo.manyCardReport = true
}
},
goSignCard() {
this.$tab.navigateTo('/pages/mine/card/my-card')
},
goMemberCard() {
this.$tab.navigateTo('/pages/mine/member/member-card')
},
getDetail() {
getNoticeDetail({
noticeId: this.noticeId
}).then(res => {
if (res.code == 200) {
this.noticeDetail = res.data.noticeDetail
if (this.noticeDetail.customForm.length > 0) {
this.noticeDetail.customForm.forEach(it => {
this.signFormData.customForm.push({
label: it,
value: ''
})
})
}
}
console.log(this.signFormData, 269);
}).catch((e) => {
this.isTriggered = false
uni.showToast({
icon: 'error',
duration: 2000,
title: e
});
})
},
/**
* 报名
*/
getCard() {
getSignCard({
noticeId: this.noticeId
}).then(res => {
if (this.cardList.length == 0) {
this.cardList.push(res.data.list[0])
}
}).catch((e) => {
uni.showToast({
icon: 'error',
duration: 2000,
title: e
});
})
},
submit() { submit() {
this.$refs.baseForm.validate().then(res => { this.$refs.signForm.validate().then(res => {
console.log('success', res); console.log('success', res);
uni.showToast({ uni.showToast({
title: `校验通过` title: `校验通过`
@ -613,4 +755,4 @@
} }
} }
} }
</style> </style>