|
@@ -0,0 +1,243 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <view class="page" :style="{height:height}">
|
|
|
|
|
+ <view class="flex-row justify-between outView" :style="{marginTop:'24rpx'}">
|
|
|
|
|
+ <view class="roleName">
|
|
|
|
|
+ <text>角色</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row" @click="selectRole">
|
|
|
|
|
+ <text class="roleName">简德兴</text>
|
|
|
|
|
+ <u-icon name="arrow-right" color="#666" size="18"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view>
|
|
|
|
|
+ <scroll-view scroll-y class="scroll-Y">
|
|
|
|
|
+ <view class="flex-col outView">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="title">规则标题</text>
|
|
|
|
|
+ <u-icon name="trash" color="#666" size="24"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row justify-between awardView">
|
|
|
|
|
+ <text>注册:</text>
|
|
|
|
|
+ <view class="flex-row award ">
|
|
|
|
|
+ <text class="awardItem">现金:12元</text>
|
|
|
|
|
+ <text class="awardItem">比例:10%</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="flex-col outView">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="title">规则标题</text>
|
|
|
|
|
+ <u-icon name="trash" color="#666" size="24"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row justify-between awardView">
|
|
|
|
|
+ <text>注册:</text>
|
|
|
|
|
+ <view class="flex-row award ">
|
|
|
|
|
+ <text class="awardItem">现金:12元</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="flex-col outView">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="title">规则标题</text>
|
|
|
|
|
+ <u-icon name="trash" color="#666" size="24"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row justify-between awardView">
|
|
|
|
|
+ <text>优惠券:</text>
|
|
|
|
|
+ <view class="flex-col award ">
|
|
|
|
|
+ <text>数量:100张</text>
|
|
|
|
|
+ <text>有效期:2024-01-01 至 2024-01-30</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-col outView">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="title">规则标题</text>
|
|
|
|
|
+ <u-icon name="trash" color="#666" size="24"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row justify-between awardView">
|
|
|
|
|
+ <text>优惠券:</text>
|
|
|
|
|
+ <view class="flex-col award ">
|
|
|
|
|
+ <text>数量:100张</text>
|
|
|
|
|
+ <text>有效期:2024-01-01 至 2024-01-30</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-col outView">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="title">规则标题</text>
|
|
|
|
|
+ <u-icon name="trash" color="#666" size="24"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row justify-between awardView">
|
|
|
|
|
+ <text>优惠券:</text>
|
|
|
|
|
+ <view class="flex-col award ">
|
|
|
|
|
+ <text>数量:100张</text>
|
|
|
|
|
+ <text>有效期:2024-01-01 至 2024-01-30</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-col outView">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="title">规则标题</text>
|
|
|
|
|
+ <u-icon name="trash" color="#666" size="24"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row justify-between awardView">
|
|
|
|
|
+ <text>优惠券:</text>
|
|
|
|
|
+ <view class="flex-col award ">
|
|
|
|
|
+ <text>数量:100张</text>
|
|
|
|
|
+ <text>有效期:2024-01-01 至 2024-01-30</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </scroll-view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ <view class="addButton" @click="addRule">
|
|
|
|
|
+ <text>+添加规则</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="confirmButton" @click="createQrCode">
|
|
|
|
|
+ <text>生成二维码</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ <uni-popup ref="createQrCodePopup" type="center">
|
|
|
|
|
+ <view class="createQrCodePopup">
|
|
|
|
|
+ <view class="flex-row justify-center">
|
|
|
|
|
+ <text class="popupTitle">邀请专员二维码</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="xoIcon" @click="closePopup">
|
|
|
|
|
+ <u-icon name="close-circle" color="#666" size="24"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flex-row justify-center">
|
|
|
|
|
+ <uv-qrcode ref="qrcode" size="540rpx" :value="qrcodeUrl" :options="options"></uv-qrcode>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </uni-popup>
|
|
|
|
|
+
|
|
|
|
|
+ <uni-popup ref="rulePopup" type="bottom">
|
|
|
|
|
+ <view class="rulePopup">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="popupTitle">选择规则</text>
|
|
|
|
|
+ <u-icon name="close-circle" color="#666" size="24" @click="closePopup"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <scroll-view scroll-y class="scroll-Y1">
|
|
|
|
|
+ <checkbox-group @change="checkboxChange">
|
|
|
|
|
+ <view class="flex-row justify-between label" v-for="item in 10" :key="item.value">
|
|
|
|
|
+ <view>规则名称规则名称</view>
|
|
|
|
|
+ <view>
|
|
|
|
|
+ <checkbox :value="item.value" :checked="item.checked" />
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </checkbox-group>
|
|
|
|
|
+ </scroll-view>
|
|
|
|
|
+ <view class="confirmButton" @click="addRule">
|
|
|
|
|
+ <text>确定</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </uni-popup>
|
|
|
|
|
+
|
|
|
|
|
+ <uni-popup ref="rolePopup" type="bottom">
|
|
|
|
|
+ <view class="rolePopup">
|
|
|
|
|
+ <view class="flex-row justify-between">
|
|
|
|
|
+ <text class="popupTitle">选择角色</text>
|
|
|
|
|
+ <u-icon name="close-circle" color="#666" size="24" @click="closePopup"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <scroll-view scroll-y class="scroll-Y2">
|
|
|
|
|
+ <view class="roleName1" :class="{selectRoleName1:i===5}" v-for="i in 10">
|
|
|
|
|
+ <text>拓客专员</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </scroll-view>
|
|
|
|
|
+ <view class="confirmButton">
|
|
|
|
|
+ <text>确定</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </uni-popup>
|
|
|
|
|
+
|
|
|
|
|
+ </view>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script>
|
|
|
|
|
+ export default {
|
|
|
|
|
+ props:{
|
|
|
|
|
+ height: {
|
|
|
|
|
+ type: String,
|
|
|
|
|
+ default () {
|
|
|
|
|
+ return ''
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ data() {
|
|
|
|
|
+ return {
|
|
|
|
|
+ ruleList:[],
|
|
|
|
|
+ roleList:[],
|
|
|
|
|
+ roleBindRuleParam:{},
|
|
|
|
|
+ value: 1,
|
|
|
|
|
+ qrcodeUrl:'https://jje.admin.xinyuekj.com.cn/recharge/recharge?storeId={promotionStoreId}&techNo={techNo}',
|
|
|
|
|
+ options: {
|
|
|
|
|
+ // 指定二维码前景,一般可在中间放logo
|
|
|
|
|
+ foregroundImagePadding:2,
|
|
|
|
|
+ foregroundImageBorderRadius:5,
|
|
|
|
|
+ foregroundImageSrc: '/static/logo.png'
|
|
|
|
|
+ },
|
|
|
|
|
+ range: [
|
|
|
|
|
+ { value: 0, text: "篮球篮球篮球篮球篮球篮" },
|
|
|
|
|
+ { value: 1, text: "足球" },
|
|
|
|
|
+ { value: 2, text: "游泳" },
|
|
|
|
|
+ ],
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ onLoad() {
|
|
|
|
|
+ // this.getRuleList()
|
|
|
|
|
+ // this.getRoleList()
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ closePopup(){
|
|
|
|
|
+ this.$refs.rolePopup.close()
|
|
|
|
|
+ this.$refs.createQrCodePopup.close()
|
|
|
|
|
+ this.$refs.rulePopup.close()
|
|
|
|
|
+ },
|
|
|
|
|
+ selectRole(){
|
|
|
|
|
+ this.$refs.rolePopup.open()
|
|
|
|
|
+ },
|
|
|
|
|
+ createQrCode(){
|
|
|
|
|
+ this.$refs.createQrCodePopup.open()
|
|
|
|
|
+ },
|
|
|
|
|
+ addRule(){
|
|
|
|
|
+ this.$refs.rulePopup.open()
|
|
|
|
|
+ },
|
|
|
|
|
+ change(e) {
|
|
|
|
|
+ console.log("e:", e);
|
|
|
|
|
+ },
|
|
|
|
|
+ //查询规则
|
|
|
|
|
+ getRuleList(){
|
|
|
|
|
+ this.$api.service.getRuleList().then(res=>{
|
|
|
|
|
+ console.log(res)
|
|
|
|
|
+ this.ruleList = res.data.data
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ //查询角色
|
|
|
|
|
+ getRoleList(){
|
|
|
|
|
+ this.$api.service.getRoleList().then(res=>{
|
|
|
|
|
+ console.log(res)
|
|
|
|
|
+ this.roleList = res.data.data
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ //角色绑定规则
|
|
|
|
|
+ roleBindRule(){
|
|
|
|
|
+ this.$api.service.roleBindRule(this.roleBindRuleParam).then(res=>{
|
|
|
|
|
+ this.getRuleList()
|
|
|
|
|
+ this.getRoleList()
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<style scoped lang="scss">
|
|
|
|
|
+ @import './index.rpx.css';
|
|
|
|
|
+</style>
|