dingdong-mall/pages/my/member-approval.vue

123 lines
3.1 KiB
Vue

<template>
<view>
<!-- 顶部操作条 -->
<cu-custom :bgColor="'bg-main-color'" :isBack="true">
<block slot="backText">返回</block>
<block slot="content">审批列表</block>
</cu-custom>
<!-- 团队成员信息 -->
<view class="margin-top-sm margin-lr-sm padding bg-white name-card shadow-warp"
v-for="(member, index) in members">
<!-- 个人名片 -->
<view class="flex justify-start">
<view class="cu-avatar round"
:style="'background-image:url(' + member.customerLogoUrl + '); width: 130rpx; height: 130rpx;'">
</view>
<view class="margin-left-sm flex-column-around">
<view class="text-black text-xl">{{member.name}}</view>
<view class="">
<text class="margin-right-xs">角色:申请加入</text>
</view>
</view>
</view>
<!-- 实名及公告图标 -->
<view class="flex justify-end oper-bar">
<view class="text-center margin-right-sm text-orange" @click="makePhoneCall(member.phone)">
<view class="cuIcon-phone"></view>
</view>
</view>
<view class="solid-top margin-top-sm padding-top">
<text class="margin-right-xs">审批意见:</text>
<view class="flex">
<textarea class="radius-input remark-textarea margin-tb" @input="inputRemark($event, member)"></textarea>
</view>
<view class="flex justify-end">
<view class="cu-btn bg-main-color radius" @click="approvingMember(index, member, '同意')">同意</view>
<view class="cu-btn radius margin-left-xs" @click="approvingMember(index, member, '不同意')">不同意</view>
</view>
</view>
</view>
</view>
</template>
<script>
import horizontalNameCard from '@/components/common-card/horizontal-name-card.vue';
export default {
components: {
horizontalNameCard
},
data() {
return {
members: [],
curUserInfo: {}
}
},
onLoad(option) {
this.loadData(option);
},
methods: {
async loadData(option) {
this.curUserInfo = this.$request.getCurUserInfo();
this.loadMembers2Approve();
},
makePhoneCall(phoneNum) {
uni.makePhoneCall({
phoneNumber: phoneNum
})
},
inputRemark(e, member) {
member.remark = e.detail.value;
},
async loadMembers2Approve(params = {}) {
let res = await this.$request.getMembersWaitingApproval({
customerId: this.curUserInfo.customerId
});
if (res && res.data) {
this.members = res.data;
}
},
async approvingMember(index, member, defaultRemark) {
let remark = member.remark ? member.remark : defaultRemark;
let res = await this.$request.editCustomerPlace({
id: member.id,
remark: remark
});
if (res && res.code === 0) {
uni.showToast({
icon: 'success'
})
this.members.splice(index, 1);
} else {
uni.showToast({
icon: 'error'
})
}
}
}
}
</script>
<style scoped>
.name-card {
position: relative;
}
.name-card .oper-bar {
position: absolute;
top: 20rpx;
right: 20rpx;
font-size: 50rpx;
}
.cu-list+.cu-list {
margin-top: unset;
}
.remark-textarea {
height: 150rpx;
width: 100%;
}
</style>