2 Commits
prod ... test

Author SHA1 Message Date
6535b6f580 增加激活码列表页面,修复进件部分问题 2026-01-16 13:43:23 +08:00
6bbe3b2d09 调整银行回显问题 2026-01-13 17:42:09 +08:00
29 changed files with 3584 additions and 129 deletions

View File

@@ -0,0 +1,59 @@
<template>
<view>
<view class="u-flex date-filter-box " @click="show">
<view>
<text class="color-999" v-if="!startDate">开始日期</text>
<text class="" v-else>
{{ showDate(startDate)}}
</text>
</view>
<text></text>
<view>
<text class="color-999" v-if="!endDate">结束日期</text>
<text class="" v-else>
{{ showDate(endDate)}}
</text>
</view>
</view>
<my-date-pickerview mode="date" @confirm="datePickerConfirm" ref="datePicker"
style="z-index: 999"></my-date-pickerview>
</view>
</template>
<script setup>
import {
ref
} from 'vue';
import dayjs from 'dayjs';
const startDate = defineModel('start')
const endDate = defineModel('end')
const datePicker = ref(null)
function show() {
datePicker.value.open()
}
function datePickerConfirm(e) {
console.log(e);
startDate.value = e.start
endDate.value = e.end
}
function showDate(str){
if(str){
return str.split(' ')[0]
}
return ''
}
</script>
<style lang="scss">
.date-filter-box {
border: 1px solid #eee;
padding: 10rpx 32rpx;
justify-content: space-between;
border-radius: 12rpx;
}
</style>

28
activationCode/data.js Normal file
View File

@@ -0,0 +1,28 @@
export const shopTypes = {
'only': '单店',
'chain': '连锁店',
'join': '加盟店',
}
export const registerTypes = {
'before': '快餐版',
'after': '餐饮版',
}
export const profiless = {
probation: '试用',
release: '正式',
}
export const statuss = {
1: '开启',
0: '关闭'
}
export const tubeTypes = {
1: '直接管理',
0: '不可直接管理'
}
export const channels = {
'poly': '聚合支付',
'native': '支付进件',
}

View File

@@ -0,0 +1,395 @@
<template>
<view class="min-page bg-f7 u-font-28 color-333">
<up-sticky>
<view class="top u-flex gap-20">
<!-- <up-select :options="types" @select="typesSelect">
<template #text>
<text v-if="query.type!==''">{{returnTypesLabel(query.type)}}</text>
<text v-else>类型</text>
</template>
</up-select> -->
<up-select :options="statusList" @select="statusListSelect">
<template #text>
<text v-if="query.state!==''">{{returnStatusLabel(query.state)}}</text>
<text v-else>状态</text>
</template>
</up-select>
<view class="u-flex-1">
<datePickerSelect v-model:start="query.startTime" v-model:end="query.endTime">
</datePickerSelect>
</view>
</view>
</up-sticky>
<view class="box">
<view class="container" v-for="(item,index) in list" :key="index">
<view class="u-flex u-row-between">
<view>
<text class="color-666">创建时间</text>
<text class="font-bold">{{item.createTime}}</text>
</view>
<view class="status" :class="returnStatusClass(item.status)">{{item.status?'已使用':'未使用'}}</view>
</view>
<view class="u-flex u-row-between u-m-t-24">
<view>
<text class="color-666">激活时长()</text>
<text class="font-bold">{{item.periodMonth}}个月</text>
</view>
</view>
<view class="u-flex u-m-t-32" v-if="item.shopName">
<view>
<text class="color-666">使用店铺名称</text>
<text class="font-bold">{{item.shopName}}</text>
<text class="u-m-l-10">({{item.registerType=='before'?'快餐版':'餐饮版'}})</text>
</view>
</view>
<view class="u-m-t-32">
<view class="u-m-t-24 u-flex u-col-center">
<text class="color-666">激活码</text>
<view class="status success u-font-24">{{item.registerCode}}</view>
</view>
<view class="u-flex u-m-t-32 u-row-right gap-20">
<view style="min-width: 160rpx;">
<my-button @click="oncopy(item.registerCode)">复制激活码</my-button>
</view>
</view>
</view>
</view>
<template v-if="query.shopName">
<up-empty v-if="list.length<=0" text="未搜索到相关信息"></up-empty>
<up-loadmore :status="isEnd?'nomore':'loading'" v-else></up-loadmore>
</template>
<template v-else>
<up-empty v-if="list.length<=0" text="未搜索到相关信息"></up-empty>
<up-loadmore v-else :status="isEnd?'nomore':'loading'"></up-loadmore>
</template>
</view>
<view style="height: 140rpx;"></view>
<view class="bottom">
<my-button @click="toAdd()">添加激活码</my-button>
</view>
<up-popup :show="addShow" mode="center"
@close="addShow=false" round="16rpx" :close-on-click-overlay="true">
<view class="add-box">
<view class="font-bold u-font-32 text-center">生成激活码</view>
<view class="u-p-l-20 u-p-r-20 u-m-r-32">
<up-form label-width="auto">
<up-form-item label="激活时长" required>
<up-number-box input-width="200rpx" v-model="form.periodMonth" :integer="true" :step="1" ></up-number-box>
</up-form-item>
</up-form>
<up-form label-width="auto">
<up-form-item label="生产数量" required>
<up-number-box input-width="200rpx" v-model="form.num" :integer="true" :step="1" ></up-number-box>
</up-form-item>
</up-form>
</view>
<view class="u-flex gap-20 u-m-t-42">
<view class="u-flex-1">
<my-button type="default" @click="addShow=false">取消</my-button>
</view>
<view class="u-flex-1">
<my-button @click="submit">生产激活码</my-button>
</view>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import {
reactive,
ref,
watch
} from 'vue';
import {
onReachBottom,
onShow
} from '@dcloudio/uni-app'
import * as Api from '@/http/api/account/merchantRegister.js'
import datePickerSelect from '../components/date-picker-select.vue'
const code = ref('')
const addShow = ref(false)
const form =reactive({
periodMonth:1,
num:1,
})
watch(()=>addShow.value,(newval)=>{
if(!newval){
form.periodMonth=1;
form.num=1;
}
})
const codeType = ref('')
const datePicker = ref(null)
function datePickerConfirm(e) {
}
function submit(){
Api.addMerchantRegister(form).then(res=>{
if(res){
uni.$u.toast('添加成功')
addShow.value=false
search()
}
})
}
const statusList = [{
value: 1,
name: '已激活',
},
{
value: 0,
name: '待激活',
},
]
const types = [{
value: 'before',
name: '快餐版',
},
{
value: 'after',
name: '餐饮版',
},
]
function oncopy(code) {
uni.setClipboardData({
data: code
})
}
function statusListSelect(e) {
query.state = e.value
}
function typesSelect(e) {
query.type = e.value
}
const statusLabelJson = {
'REJECTED': '已拒绝'
}
const statusClassJson = {
'REJECTED': 'error'
}
function returnStatusLabel(state) {
const item = statusList.find(v => v.value == state)
if (item) {
return item.name
}
return ''
}
function returnTypesLabel(state) {
const item = types.find(v => v.value == state)
if (item) {
return item.name
}
return ''
}
function returnStatusClass(state) {
if (state == 1) {
return 'success'
}
return 'gray'
}
function showCode(item, type) {
if (type == 'wx') {
code.value = item.wechatSignUrl
}
if (type == 'aliPay') {
code.value = item.alipaySignUrl
}
codeType.value = type
addShow.value = true
}
const showShopSelect = ref(false)
const query = reactive({
page: 1,
size: 10,
state: '',
type: '',
startTime:'',
endTime:'',
})
watch(() => query.state, (newval) => {
search()
})
watch(() => query.startTime, (newval) => {
search()
})
watch(() => query.endTime, (newval) => {
search()
})
watch(() => query.type, (newval) => {
search()
})
const isEnd = ref(false)
const list = ref([])
function search() {
isEnd.value = false
query.page = 1
getData()
}
function toAdd(shop) {
addShow.value = true
}
function toEdit(shop) {
console.log(shop)
uni.navigateTo({
url: '/pagesShops/add/add?id=' + shop.id
})
}
let isAjaxIng=ref(false)
function getData() {
if(isAjaxIng.value){
return
}
isAjaxIng.value=true
Api.getMerchantRegister({
...query,
startTime:'',
endTime:'',
createdAt:query.startTime&&query.endTime?( [query.startTime,query.endTime]):''
}).then(res => {
isAjaxIng.value=false
isEnd.value = query.page >= res.totalPage * 1
if (query.page == 1) {
list.value = res.records
} else {
list.value.push(...res.records)
}
})
}
function queryStatus(item) {
queryEntry({
licenceNo: item.licenceNo,
shopId: item.shopId
}).then(res => {
isEnd.value = false
query.page = 1;
getData()
})
}
onReachBottom(() => {
if (!isEnd.value) {
query.page++
getData()
}
})
onShow(getData)
</script>
<style lang="scss" scoped>
.min-page {
.box {
padding: 32rpx 28rpx;
}
}
.container {
padding: 32rpx 28rpx;
border-radius: 16rpx;
margin-bottom: 32rpx;
background-color: #fff;
}
.bottom {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
z-index: 100;
padding: 32rpx 28rpx;
padding-bottom: 40rpx;
}
.types {}
.status {
padding: 8rpx 18rpx;
border-radius: 8rpx;
border: 2rpx solid #333;
&.success {
border-color: rgba(123, 209, 54, 1);
color: rgba(123, 209, 54, 1);
background: rgba(123, 209, 54, 0.12);
}
&.warning {
border-color: rgba(255, 141, 40, 1);
color: rgba(255, 141, 40, 1);
background: rgba(255, 141, 40, 0.12);
}
&.error {
border-color: #FF1C1C;
color: #FF1C1C;
background: rgba(255, 28, 28, 0.18);
}
&.gray {
color: #bbb;
background-color: #f7f7f7;
border-color: #bbb;
}
}
.top {
padding: 32rpx 28rpx;
background-color: #fff;
}
.add-box {
background-color: #fff;
width: 690rpx;
background-color: #fff;
padding: 32rpx 28rpx;
border-radius: 16rpx;
}
</style>

View File

@@ -0,0 +1,73 @@
export const userTypes = {
'0': '个体商户',
'1': '企业商户',
}
export const contactPersonTypes = {
'LEGAL': '经营者/法定代表人',
'SUPER': '经办人',
}
export const certTypes = {
'0': '身份证'
}
export const companyChildTypes = {
'1': '普通企业',
'2': '事业单位',
'3': '政府机关',
'4': '社会组织',
}
export const sexs = {
'0': '男',
'1': '女'
}
export const settlementTypes = {
'0': '非法人结算',
'1': '法人结算'
}
export const settlementCardTypes = {
'11': '对私借记卡',
'21': '对公借记卡',
}
// WAIT 待提交
// INIT 待处理
// AUDIT 待审核
// SIGN 待签约
// FINISH 已完成
// REJECTED 失败
export const statusList = [{
value: 'WAIT',
name: '待提交',
class: 'gray'
},
{
value: 'INIT',
name: '待处理',
class: 'warning'
},
{
value: 'AUDIT',
name: '待审核',
class: 'warning'
},
{
value: 'SIGN',
name: '待签约',
class: 'warning'
},
{
value: 'FINISH',
name: '已完成',
class: 'success'
},
{
value: 'REJECTED',
name: '失败',
class: 'error'
},
]

View File

@@ -0,0 +1,254 @@
<template>
<up-popup :show="modelValue" mode="bottom" :popup="false"
:mask="true" :closeable="true" :safe-area-inset-bottom="true"
close-icon-color="#ffffff" :z-index="uZIndex"
:maskCloseAble="maskCloseAble" @close="close">
<up-tabs v-if="modelValue" :list="genTabsList"
:scrollable="true" :current="tabsIndex" @change="tabsChange" ref="tabs"></up-tabs>
<view class="area-box">
<view class="u-flex" :class="{ 'change':isChange }">
<view class="area-item">
<view class="u-padding-10 u-bg-gray" style="height: 100%;">
<scroll-view :scroll-y="true" style="height: 100%">
<up-cell-group>
<up-cell v-for="(item,index) in provinces"
:title="item.regionName" :arrow="false"
:index="index" :key="index"
@click="provinceChange(index)">
<template v-slot:right-icon>
<up-icon v-if="isChooseP&&province===index"
size="17" name="checkbox-mark"></up-icon>
</template>
</up-cell>
</up-cell-group>
</scroll-view>
</view>
</view>
<view class="area-item">
<view class="u-padding-10 u-bg-gray" style="height: 100%;">
<scroll-view :scroll-y="true" style="height: 100%">
<up-cell-group v-if="isChooseP">
<up-cell v-for="(item,index) in citys"
:title="item.regionName" :arrow="false"
:index="index" :key="index"
@click="cityChange(index)">
<template v-slot:right-icon>
<up-icon v-if="isChooseC&&city===index"
size="17" name="checkbox-mark"></up-icon>
</template>
</up-cell>
</up-cell-group>
</scroll-view>
</view>
</view>
<view class="area-item">
<view class="u-padding-10 u-bg-gray" style="height: 100%;">
<scroll-view :scroll-y="true" style="height: 100%">
<up-cell-group v-if="isChooseC">
<up-cell v-for="(item,index) in areas"
:title="item.regionName" :arrow="false"
:index="index" :key="index"
@click="areaChange(index)">
<template v-slot:right-icon>
<up-icon v-if="isChooseA&&area===index"
size="17" name="checkbox-mark"></up-icon>
</template>
</up-cell>
</up-cell-group>
</scroll-view>
</view>
</view>
</view>
</view>
</up-popup>
</template>
<script>
import {region} from '@/http/api/system/region.js'
/**
* city-select 省市区级联选择器
* @property {String Number} z-index 弹出时的z-index值默认1075
* @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭Picker默认true
* @property {String} default-region 默认选中的地区,中文形式
* @property {String} default-code 默认选中的地区,编号形式
*/
export default {
name: 'my-address-select',
props: {
// 通过双向绑定控制组件的弹出与收起
modelValue: {
type: Boolean,
default: false
},
// 默认显示的地区,可传类似["河北省", "秦皇岛市", "北戴河区"]
defaultRegion: {
type: Array,
default () {
return [];
}
},
// 默认显示地区的编码defaultRegion和areaCode同时存在areaCode优先可传类似["13", "1303", "130304"]
areaCode: {
type: Array,
default () {
return [];
}
},
// 是否允许通过点击遮罩关闭Picker
maskCloseAble: {
type: Boolean,
default: true
},
// 弹出的z-index值
zIndex: {
type: [String, Number],
default: 0
}
},
data() {
return {
cityValue: "",
isChooseP: false, //是否已经选择了省
province: 0, //省级下标
provinces: [],
isChooseC: false, //是否已经选择了市
city: 0, //市级下标
citys: [],
isChooseA: false, //是否已经选择了区
area: 0, //区级下标
areas: [],
tabsIndex: 0,
list:[]
}
},
async mounted() {
await this.getRegon()
this.init();
},
computed: {
isChange() {
return this.tabsIndex > 1;
},
genTabsList() {
let tabsList = [{
name: "请选择"
}];
if (this.isChooseP) {
console.log(this.province)
tabsList[0]['name'] = this.provinces[this.province]['regionName'];
tabsList[1] = {
name: "请选择"
};
}
if (this.isChooseC) {
tabsList[1]['name'] = this.citys[this.city]['regionName'];
tabsList[2] = {
name: "请选择"
};
}
if (this.isChooseA) {
tabsList[2]['name'] = this.areas[this.area]['regionName'];
}
return tabsList;
},
uZIndex() {
// 如果用户有传递z-index值优先使用
return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
}
},
emits: ['city-change'],
methods: {
async getRegon(){
const res=await region()
this.provinces=res||[]
},
init() {
if (this.areaCode.length == 3) {
this.setProvince("", this.areaCode[0]);
this.setCity("", this.areaCode[1]);
this.setArea("", this.areaCode[2]);
} else if (this.defaultRegion.length == 3) {
this.setProvince(this.defaultRegion[0], "");
this.setCity(this.defaultRegion[1], "");
this.setArea(this.defaultRegion[2], "");
};
},
setProvince(regionName = "", value = "") {
this.provinces.map((v, k) => {
if (value ? v.value == value : v.regionName == regionName) {
this.provinceChange(k);
}
})
},
setCity(regionName = "", value = "") {
this.citys.map((v, k) => {
if (value ? v.value == value : v.regionName == regionName) {
this.cityChange(k);
}
})
},
setArea(regionName = "", value = "") {
this.areas.map((v, k) => {
if (value ? v.value == value : v.regionName == regionName) {
this.isChooseA = true;
this.area = k;
}
})
},
close() {
this.$emit('update:modelValue', false);
},
tabsChange(index) {
this.tabsIndex = index;
},
provinceChange(index) {
this.isChooseP = true;
this.isChooseC = false;
this.isChooseA = false;
this.province = index;
this.citys =this.provinces[index].children
this.tabsIndex = 1;
},
cityChange(index) {
this.isChooseC = true;
this.isChooseA = false;
this.city = index;
this.areas =this.provinces[this.province].children[index].children
this.tabsIndex = 2;
},
areaChange(index) {
this.isChooseA = true;
this.area = index;
let result = {};
result.province = this.provinces[this.province];
result.city = this.citys[this.city];
result.area = this.areas[this.area];
this.$emit('city-change', result);
this.close();
}
}
}
</script>
<style lang="scss">
.area-box {
width: 100%;
overflow: hidden;
height: 800rpx;
>view {
width: 150%;
transition: transform 0.3s ease-in-out 0s;
transform: translateX(0);
&.change {
transform: translateX(-33.3333333%);
}
}
.area-item {
width: 33.3333333%;
height: 800rpx;
}
}
</style>

View File

@@ -6,16 +6,17 @@
class="fixed-bottom u-flex gap-20" class="fixed-bottom u-flex gap-20"
:class="[direction == 'column' ? 'u-flex-column' : '']" :class="[direction == 'column' ? 'u-flex-column' : '']"
> >
<view class="u-flex-1">
<my-button type="primary" @click="save" shape="circle">
保存
</my-button>
</view>
<view class="u-flex-1"> <view class="u-flex-1">
<my-button bgColor="#fff" type="default" @click="cancel" shape="circle"> <my-button bgColor="#fff" type="default" @click="cancel" shape="circle">
取消 取消
</my-button> </my-button>
</view> </view>
<view class="u-flex-1">
<my-button type="primary" @click="save" shape="circle">
保存
</my-button>
</view>
</view> </view>
</view> </view>
</template> </template>

View File

@@ -0,0 +1,35 @@
<template>
<view class="min-page u-flex u-col-center u-row-center">
<view class="loader">
</view>
</view>
</template>
<script>
</script>
<style lang="scss">
/* HTML: <div class="loader"></div> */
.loader {
width: 50px;
--b: 8px;
aspect-ratio: 1;
border-radius: 50%;
padding: 1px;
background: conic-gradient(#0000 10%, #f03355) content-box;
-webkit-mask:
repeating-conic-gradient(#0000 0deg, #000 1deg 20deg, #0000 21deg 36deg),
radial-gradient(farthest-side, #0000 calc(100% - var(--b) - 1px), #000 calc(100% - var(--b)));
-webkit-mask-composite: destination-in;
mask-composite: intersect;
animation: l4 1s infinite steps(10);
}
@keyframes l4 {
to {
transform: rotate(1turn)
}
}
</style>

View File

@@ -63,14 +63,13 @@
const bankAliasCode=defineModel('bankAliasCode') const bankAliasCode=defineModel('bankAliasCode')
const wxProvinceCode=defineModel('wxProvinceCode')
const selid = ref('') const selid = ref('')
function returnLabel() { function returnLabel() {
const findShop = list.value.find(v => v.bankAlias == modelValue.value) const findShop = list.value.find(v => v.bankAlias == modelValue.value)
return findShop ? findShop.bankAlias : '' return findShop ? findShop.bankAlias : modelValue.value
} }
const selItem = ref(null) const selItem = ref(null)
@@ -95,7 +94,6 @@
show.value = false; show.value = false;
} }
function search() { function search() {
isEnd.value = false isEnd.value = false
query.page = 1 query.page = 1
@@ -111,7 +109,6 @@
selItem.value = findShop selItem.value = findShop
bankInstId.value = findShop.bankCode bankInstId.value = findShop.bankCode
bankAliasCode.value = findShop.bankAliasCode bankAliasCode.value = findShop.bankAliasCode
wxProvinceCode.value=findShop.wxProvinceCode
} }
} }

View File

@@ -19,13 +19,13 @@
<scroll-view scroll-with-animation :scroll-into-view="selid" class="scroll-view u-m-t-30" <scroll-view scroll-with-animation :scroll-into-view="selid" class="scroll-view u-m-t-30"
scroll-y="true" style="max-height :60vh;"> scroll-y="true" style="max-height :60vh;">
<template v-if="list.length"> <template v-if="list.length">
<view class="u-m-b-10 u-flex item" v-for="item in list" :key="item.bankCode" <view class="u-m-b-10 u-flex item" v-for="item in list" :key="item.bank_branch_id"
@click="itemClick(item)" :id="'shop_'+item.bankCode" @click="itemClick(item)" :id="'shop_'+item.bank_branch_id"
:class="{active:selItem&&selItem.bankCode==item.bankCode}"> :class="{active:selItem&&selItem.bank_branch_id==item.bank_branch_id}">
<view class="checkbox"> <view class="checkbox">
<up-icon name="checkbox-mark" color="#fff"></up-icon> <up-icon name="checkbox-mark" color="#fff"></up-icon>
</view> </view>
<view class="u-flex-1">{{item.branchName}}</view> <view class="u-flex-1">{{item.bank_branch_name}}</view>
</view> </view>
<view class="u-p-20 u-flex u-row-center"> <view class="u-p-20 u-flex u-row-center">
<up-loadmore status="nomore"></up-loadmore> <up-loadmore status="nomore"></up-loadmore>
@@ -71,15 +71,15 @@
const show = ref(false); const show = ref(false);
const modelValue = defineModel(); const modelValue = defineModel();
const bankBranchName = defineModel('bankBranchName', { const bankbank_branch_name = defineModel('bankbank_branch_name', {
default: '', default: '',
}); });
const selid = ref('') const selid = ref('')
function returnLabel() { function returnLabel() {
const findShop = list.value.find(v => v.bankCode == modelValue.value) const findShop = list.value.find(v => v.bank_branch_id == modelValue.value)
return findShop ? findShop.branchName : '' return findShop ? findShop.bank_branch_name : ''
} }
const selItem = ref(null) const selItem = ref(null)
@@ -87,9 +87,9 @@
selItem.value = data selItem.value = data
} }
function returnbranchName(bankCode) { function returnbank_branch_name(bank_branch_id) {
const item = list.value.find((v) => v.bankCode == bankCode); const item = list.value.find((v) => v.bank_branch_id == bank_branch_id);
return item?.branchName || ''; return item?.bank_branch_name || '';
} }
function close() { function close() {
@@ -97,8 +97,8 @@
} }
function submit() { function submit() {
modelValue.value = selItem.value.bankCode modelValue.value = selItem.value.bank_branch_id
bankBranchName.value = selItem.value.branchName bankbank_branch_name.value = selItem.value.bank_branch_name
show.value = false; show.value = false;
} }
@@ -165,9 +165,11 @@
const list = ref([]); const list = ref([]);
function openPopup() { async function openPopup() {
await init()
selid.value = 'shop_' + modelValue.value selid.value = 'shop_' + modelValue.value
const findShop = list.value.find(v => v.bankCode == modelValue.value) console.log('list.value',list.value);
const findShop = list.value.find(v => v.bank_branch_id == modelValue.value)
selItem.value = findShop ? findShop : null selItem.value = findShop ? findShop : null
show.value = true; show.value = true;
@@ -208,23 +210,20 @@
query: { query: {
type: Object, type: Object,
default: () => ({ default: () => ({
province: '', bankAliceCode: '',
city: '', cityCode: ''
instId: '',
}) })
} }
}) })
watch(() => show.value, (newval) => {
init()
})
let allList = [] let allList = []
async function init() { async function init() {
const res = await bankBranchList(props.query); const res = await bankBranchList(props.query);
list.value = res list.value = res.data
allList = res allList = res.data
} }
</script> </script>
<style lang="scss"> <style lang="scss">

View File

@@ -14,7 +14,7 @@
</up-radio-group> </up-radio-group>
</view> </view>
<view class="form-item required"> <view class="form-item required" v-if="form.userType=='1'">
<view class="title">企业类型</view> <view class="title">企业类型</view>
<up-radio-group v-model="form.companyChildType"> <up-radio-group v-model="form.companyChildType">
<up-radio v-for="(value,key) in companyChildTypes" :label="value" :name="key"> <up-radio v-for="(value,key) in companyChildTypes" :label="value" :name="key">

View File

@@ -13,7 +13,7 @@
></my-upload-img> ></my-upload-img>
</view> </view>
<view class="form-item required"> <view class="form-item required">
<view class="title"> 身份证反面国徽</view> <view class="title"> 身份证反面人像</view>
<my-upload-img v-model="form.idCardBackPic.url" :size="200" :maxSize="maxSize" <my-upload-img v-model="form.idCardBackPic.url" :size="200" :maxSize="maxSize"
@uploadSuccess="uploadSuccess($event,'IdCard','idCardBackPic')" @uploadSuccess="uploadSuccess($event,'IdCard','idCardBackPic')"
></my-upload-img> ></my-upload-img>

View File

@@ -71,7 +71,7 @@
<view class="form-item required"> <view class="form-item required">
<view class="title"> </view> <view class="title"> 开户行省市</view>
<view class="input-box u-flex u-row-between u-col-center" @click="showCitySelect=true"> <view class="input-box u-flex u-row-between u-col-center" @click="showCitySelect=true">
<text class="color-999" v-if="!pro_city_area">请选择</text> <text class="color-999" v-if="!pro_city_area">请选择</text>
<text class="color-333" v-else>{{pro_city_area}}</text> <text class="color-333" v-else>{{pro_city_area}}</text>
@@ -79,11 +79,9 @@
</view> </view>
</view> </view>
<view class="form-item required"> <view class="form-item required">
<view class="title"> </view> <view class="title"> 开户</view>
<bankSelect v-model="form.bankName" v-model:bankInstId="form.bankInstId" <bankSelect v-model="form.bankName" v-model:bankInstId="form.bankInstId"
v-model:wxProvinceCode="wxProvinceCode" v-model:bankAliasCode="form.bankType"></bankSelect>
v-model:bankAliasCode="form.bankType"
></bankSelect>
</view> </view>
<view class="form-item " v-if="pro_city_area&&form.bankName"> <view class="form-item " v-if="pro_city_area&&form.bankName">
<view class="title"> 支行</view> <view class="title"> 支行</view>
@@ -91,13 +89,13 @@
v-model:bankBranchCode="form.bankBranchCode"></bankBranchList> v-model:bankBranchCode="form.bankBranchCode"></bankBranchList>
</view> </view>
<view class="form-item required"> <view class="form-item required">
<view class="title"> 结算账户卡号</view> <view class="title"> 结算卡号</view>
<up-input placeholder="结算账户卡号" :placeholder-class="placeholderClass" <up-input placeholder="结算卡号" :placeholder-class="placeholderClass"
v-model="form.settlementCardNo"></up-input> v-model="form.settlementCardNo"></up-input>
</view> </view>
<view class="form-item required"> <view class="form-item required">
<view class="title"> 结算账户户名</view> <view class="title"> 户名</view>
<up-input placeholder="结算账户户名" :placeholder-class="placeholderClass" <up-input placeholder="户名" :placeholder-class="placeholderClass"
v-model="form.settlementName"></up-input> v-model="form.settlementName"></up-input>
</view> </view>
<view class="form-item required"> <view class="form-item required">
@@ -154,7 +152,7 @@
</view> </view>
<citySelect v-model="showCitySelect" @city-change="cityChange"></citySelect> <citySelect v-model="showCitySelect" @city-change="cityChange" @init="getRegionData"></citySelect>
</view> </view>
@@ -165,7 +163,8 @@
computed, computed,
reactive, reactive,
watch, watch,
ref ref,
watchEffect
} from 'vue'; } from 'vue';
import shopSelect from './shop-select.vue' import shopSelect from './shop-select.vue'
import citySelect from '../../components/u-city-select.vue' import citySelect from '../../components/u-city-select.vue'
@@ -183,6 +182,14 @@
import { import {
getInfoByImg getInfoByImg
} from '@/http/api/order/entryManager.js' } from '@/http/api/order/entryManager.js'
import list from 'uview-plus/components/u-list/list';
const regions = ref([])
function getRegionData(arr = []) {
regions.value = arr
}
const showCitySelect = ref(false) const showCitySelect = ref(false)
const showBankSelect = ref(true) const showBankSelect = ref(true)
@@ -213,7 +220,7 @@
form.openAccProvince = e.province.regionName; form.openAccProvince = e.province.regionName;
form.openAccCity = e.city.regionName; form.openAccCity = e.city.regionName;
form.openAccArea = e.area.regionName; form.openAccArea = e.area.regionName;
wxProvinceCode.value = e.city.wxProvinceCode;
form.openAccProvinceId = e.province.regionId; form.openAccProvinceId = e.province.regionId;
form.openAccCityId = e.city.regionId; form.openAccCityId = e.city.regionId;
form.openAccAreaId = e.area.regionId; form.openAccAreaId = e.area.regionId;
@@ -288,9 +295,8 @@
const isRequired = ref('required') const isRequired = ref('required')
const bankBranchListQuery = computed(() => { const bankBranchListQuery = computed(() => {
return { return {
province: form.openAccProvince, bankAliceCode: form.bankType,
city: form.openAccCity, cityCode: wxProvinceCode.value
instId: form.bankInstId,
} }
}) })
@@ -303,7 +309,17 @@
} }
}) })
watchEffect(() => {
if (regions.value.length && form.openAccCityId) {
if (!wxProvinceCode.value) {
const findPItem= regions.value.find(v=>v.regionId==form.openAccProvinceId)
const cityIyem=findPItem?(findPItem.children.find(v=>v.regionId==form.openAccCityId)):null
if(cityIyem){
wxProvinceCode.value =cityIyem.wxProvinceCode
}
}
}
})
watch(() => props.data, (newval) => { watch(() => props.data, (newval) => {
console.log('watch 变', newval); console.log('watch 变', newval);

View File

@@ -143,47 +143,47 @@ export const rules = {
}, },
openAccProvinceId: { openAccProvinceId: {
required: true, required: true,
errorMsg: '请选择区', errorMsg: '请选择开户行省市区',
}, },
openAccCityId: { openAccCityId: {
required: true, required: true,
errorMsg: '请选择区', errorMsg: '请选择开户行省市区',
}, },
openAccAreaId: { openAccAreaId: {
required: true, required: true,
errorMsg: '请选择区', errorMsg: '请选择开户行省市区',
}, },
openAccProvince: { openAccProvince: {
required: true, required: true,
errorMsg: '请选择区', errorMsg: '请选择开户行省市区',
}, },
openAccCity: { openAccCity: {
required: true, required: true,
errorMsg: '请选择区', errorMsg: '请选择开户行省市区',
}, },
openAccArea: { openAccArea: {
required: true, required: true,
errorMsg: '请选择区', errorMsg: '请选择开户行省市区',
}, },
bankType: { bankType: {
required: true, required: true,
errorMsg: '请选择行', errorMsg: '请选择开户行',
}, },
bankInstId: { bankInstId: {
required: true, required: true,
errorMsg: '请选择行', errorMsg: '请选择开户行',
}, },
bankName: { bankName: {
required: true, required: true,
errorMsg: '请选择行', errorMsg: '请选择开户行',
}, },
settlementCardNo: { settlementCardNo: {
required: true, required: true,
errorMsg: '请填写结算账户卡号', errorMsg: '请填写结算卡号',
}, },
settlementName: { settlementName: {
required: true, required: true,
errorMsg: '请填写结算账户户名', errorMsg: '请填写户名',
}, },
bankMobile: { bankMobile: {
required: true, required: true,

View File

@@ -159,11 +159,12 @@
return this.zIndex ? this.zIndex : this.$u.zIndex.popup; return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
} }
}, },
emits: ['city-change'], emits: ['city-change','init'],
methods: { methods: {
async getRegon(){ async getRegon(){
const res=await region() const res=await region()
this.provinces=res||[] this.provinces=res||[]
this.emits('init',res)
}, },
init() { init() {
if (this.areaCode.length == 3) { if (this.areaCode.length == 3) {

View File

@@ -33,3 +33,41 @@ export const settlementCardTypes={
'11': '对私借记卡', '11': '对私借记卡',
'21': '对公借记卡', '21': '对公借记卡',
} }
// WAIT 待提交
// INIT 待处理
// AUDIT 待审核
// SIGN 待签约
// FINISH 已完成
// REJECTED 失败
export const statusList = [{
value: 'WAIT',
name: '待提交',
class: 'gray'
},
{
value: 'INIT',
name: '待处理',
class: 'warning'
},
{
value: 'AUDIT',
name: '待审核',
class: 'warning'
},
{
value: 'SIGN',
name: '待签约',
class: 'warning'
},
{
value: 'FINISH',
name: '已完成',
class: 'success'
},
{
value: 'REJECTED',
name: '失败',
class: 'error'
},
]

View File

@@ -117,7 +117,7 @@
<script setup> <script setup>
import { import {
userTypes userTypes,statusList
} from '../data.js' } from '../data.js'
const code = ref('') const code = ref('')
@@ -145,43 +145,7 @@
queryEntry queryEntry
} from '@/http/api/order/entryManager.js' } from '@/http/api/order/entryManager.js'
// WAIT 待提交
// INIT 待处理
// AUDIT 待审核
// SIGN 待签约
// FINISH 已完成
// REJECTED 失败
const statusList = [{
value: 'WAIT',
name: '待提交',
class: 'gray'
},
{
value: 'INIT',
name: '待处理',
class: 'warning'
},
{
value: 'AUDIT',
name: '待审核',
class: 'warning'
},
{
value: 'SIGN',
name: '待签约',
class: 'warning'
},
{
value: 'FINISH',
name: '已完成',
class: 'success'
},
{
value: 'REJECTED',
name: '失败',
class: 'error'
},
]
function statusListSelect(e) { function statusListSelect(e) {
query.status = e.value query.status = e.value
@@ -280,6 +244,7 @@
onReachBottom(() => { onReachBottom(() => {
if (!isEnd.value) { if (!isEnd.value) {
query.page++ query.page++
getData()
} }
}) })

View File

@@ -0,0 +1,23 @@
import http from "@/http/http.js";
const request = http.request;
const urlType = "account";
export function getMerchantRegister(data) {
return request({
url: `${urlType}/admin/merchantRegister`,
method: "GET",
data: {
...data,
},
});
}
export function addMerchantRegister(data) {
return request({
url: `${urlType}/admin/merchantRegister`,
method: "POST",
data: {
...data,
},
});
}

View File

@@ -0,0 +1,50 @@
import http from "@/http/http.js";
const request = http.request;
const urlType = "account";
export function allShopList(data) {
return request({
url: `${urlType}/admin/shopInfo`,
method: "GET",
data: {
...data,
},
});
}
export function addShop(data) {
return request({
url: `${urlType}/admin/shopInfo`,
method: "post",
data: {
...data,
},
});
}
export function editShop(data) {
return request({
url: `${urlType}/admin/shopInfo`,
method: "put",
data: {
...data,
},
});
}
export function getShopDetail(data) {
return request({
url: `${urlType}/admin/shopInfo/detail`,
method: "get",
data: {
...data,
},
});
}
export function delShop(data) {
return request({
url: `${urlType}/admin/shopInfo`,
method: "DELETE",
data: {
...data,
},
});
}

View File

@@ -0,0 +1,33 @@
import http from "@/http/http.js";
const request = http.request;
const urlType = "order";
export function shopMerchant(data) {
return request({
url: `${urlType}/admin/shopMerchant`,
method: "GET",
data: {
...data,
},
});
}
export function editShopMerchant(data) {
return request({
url: `${urlType}/admin/shopMerchant`,
method: "PUT",
data: {
...data,
},
});
}
//获取当前店铺的主店进件信息
export function getMainMerchant(data) {
return request({
url: `${urlType}/admin/shopMerchant/getMainMerchant`,
method: "GET",
data: {
...data,
},
});
}

View File

@@ -928,6 +928,41 @@
} }
} }
]
},
{
"root": "pagesShops",
"pages": [
{
"path": "index/index",
"style": {
"navigationBarTitleText": "店铺管理"
}
},
{
"path": "add/add",
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "pay-config/pay-config",
"style": {
"navigationBarTitleText": "支付配置"
}
}
]
},
{
"root": "activationCode",
"pages": [
{
"path": "index/index",
"style": {
"navigationBarTitleText": "激活码列表"
}
}
] ]
} }
// , // ,

351
pagesShops/add/add.vue Normal file
View File

@@ -0,0 +1,351 @@
<template>
<view class="min-page u-font-28 color-333 bg-f7">
<view class="container">
<up-form labelPosition="top" :model="form" :rules="rules" ref="refForm" label-width="700rpx"
errorType="toast" :label-style="labelStyle">
<up-form-item prop="shopName" label="店铺名称" :required="returnIsRequired('shopName')">
<up-input v-model="form.shopName" placeholder="请输入店铺名称"></up-input>
</up-form-item>
<up-form-item prop="shopType" label="店铺类型" :required="returnIsRequired('shopType')">
<up-radio-group v-model="form.shopType" :disabled="isDisabledEdit()">
<up-radio v-for="(value,key) in shopTypes" :label="value" :name="key"></up-radio>
</up-radio-group>
</up-form-item>
<up-form-item prop="isHeadShop" label="是否为主店" :required="returnIsRequired('isHeadShop')"
v-if="form.shopType != 'only'">
<up-switch v-model="form.isHeadShop" :size="20" :disabled="isDisabledEdit()" :inactive-value="0"
:active-value="1"></up-switch>
</up-form-item>
<template v-if="form.isHeadShop == 0 && form.shopType != 'only'">
<up-form-item label="选择主店" prop="mainId" :required="returnIsRequired('mainId')">
<headShopSelect v-model="form.mainId" :disabled="isDisabledEdit('mainId')"></headShopSelect>
</up-form-item>
</template>
<up-form-item prop="chainName" label="连锁店扩展店名" :required="returnIsRequired('chainName')">
<up-input v-model="form.chainName" placeholder="连锁店扩展店名"></up-input>
</up-form-item>
<up-form-item prop="logo" label="门店logo" :required="returnIsRequired('logo')">
<my-upload-img v-model="form.logo" :size="200"></my-upload-img>
</up-form-item>
<up-form-item prop="frontImg" label="门店照片" :required="returnIsRequired('frontImg')">
<my-upload-img v-model="form.frontImg" :size="200"></my-upload-img>
</up-form-item>
<up-form-item prop="registerType" label="经营模式" :required="returnIsRequired('registerType')">
<up-radio-group v-model="form.registerType">
<up-radio v-for="(value,key) in registerTypes" :label="value" :name="key"></up-radio>
</up-radio-group>
<up-alert description="请谨慎修改" type="warning" :show-icon="true"></up-alert>
</up-form-item>
<up-form-item prop="tubeType" label="管理方式" :required="returnIsRequired('tubeType')"
v-if="form.shopType != 'only'">
<up-radio-group v-model="form.tubeType">
<up-radio v-for="(value,key) in tubeTypes" :label="value" :name="key*1"></up-radio>
</up-radio-group>
<up-alert description="请谨慎修改" type="warning" :show-icon="true"></up-alert>
</up-form-item>
<up-form-item prop="profiles" label="试用/正式" :required="returnIsRequired('profiles')">
<up-radio-group v-model="form.profiles">
<up-radio v-for="(value,key) in profiless" :label="value" :name="key"></up-radio>
</up-radio-group>
</up-form-item>
<up-form-item prop="activateCode" label="激活码" :required="returnIsRequired('activateCode')">
<view>
<up-input v-model="form.activateCode" placeholder="激活码"></up-input>
<view class="u-font-24 u-m-t-14 color-666">
输入有效激活码表示添加的同时直接激活该店铺
</view>
</view>
</up-form-item>
<up-form-item prop="accountName" label="登录账号" :required="returnIsRequired('accountName')">
<up-input v-model="form.accountName" placeholder="登录账号"></up-input>
</up-form-item>
<up-form-item prop="accountPwd" label="登录密码" :required="returnIsRequired('accountPwd')">
<up-input v-model="form.accountPwd" placeholder="登录密码"></up-input>
</up-form-item>
<up-form-item prop="phone" label="联系电话" :required="returnIsRequired('phone')">
<up-input v-model="form.phone" placeholder="联系电话"></up-input>
</up-form-item>
<up-form-item prop="supportDeviceNumber" label="设备数量"
:required="returnIsRequired('supportDeviceNumber')">
<up-number-box v-model="form.supportDeviceNumber" input-width="100"></up-number-box>
</up-form-item>
<up-form-item prop="districts" label="店铺地址" :required="returnIsRequired('districts')">
<view class="u-relative w-full">
<up-input :modelValue="address" placeholder="店铺地址"></up-input>
<view class="u-absolute position-all" style="z-index: 10;" @click="showAddressSelect=true">
</view>
</view>
</up-form-item>
<up-form-item prop="lng" label="店铺经度" :required="returnIsRequired('lng')">
<view class="u-flex u-col-center gap-20">
<up-input v-model="form.lng" placeholder="经度" disabled></up-input>
<up-input v-model="form.lat" placeholder="维度" disabled></up-input>
<my-button @click="chooseLng">选择坐标</my-button>
</view>
</up-form-item>
<up-form-item prop="address" label="店铺详细地址" :required="returnIsRequired('address')">
<up-input v-model="form.address" placeholder="店铺详细地址"></up-input>
</up-form-item>
<up-form-item prop="detail" label="店铺简介" :required="returnIsRequired('detail')">
<up-textarea v-model="form.detail" placeholder="店铺简介"></up-textarea>
</up-form-item>
<up-form-item prop="status" label="状态" :required="returnIsRequired('status')">
<up-radio-group v-model="form.status">
<up-radio v-for="(value,key) in statuss" :label="value" :name="key*1"></up-radio>
</up-radio-group>
</up-form-item>
</up-form>
</view>
<my-address-select v-model="showAddressSelect" @city-change="cityChange"></my-address-select>
<my-bottom-btn-group @cancel="uni.navigateBack()" @save="submit"></my-bottom-btn-group>
</view>
</template>
<script setup>
import {
onLoad
} from '@dcloudio/uni-app'
import {
computed,
reactive,
ref,
watch,
watchEffect
} from 'vue';
import {
statuss,
shopTypes,
profiless,
registerTypes,
tubeTypes
} from '../data.js'
import headShopSelect from './components/head-shop-select.vue'
import * as shopInfoApi from '@/http/api/account/shopInfo.js'
function chooseLng() {
uni.chooseLocation({
keyword: address.value,
success(res) {
console.log('res', res);
form.lat = '' + res.latitude
form.lng = '' + res.longitude
}
})
}
function cityChange(e) {
console.log(e);
form.provinces = e.province.regionName
form.cities = e.city.regionName
form.districts = e.area.regionName
}
const showAddressSelect = ref(false)
const labelStyle = {
fontWeight: "700"
}
const refForm = ref(null)
const form = reactive({
id: null,
shopName: "",
mainId: "",
shopType: "only",
tubeType: 0,
registerType: "before",
profiles: "release",
activateCode: "",
accountName: "",
accountPwd: "",
phone: "",
supportDeviceNumber: 1,
lat: "",
lng: "",
address: "",
detail: "",
status: 1,
logo: "",
frontImg: "",
provinces: "",
cities: "",
districts: "",
chainName: "",
isHeadShop: 0,
})
watch(() => form.isHeadShop, (newval) => {
form.mainId = ''
})
function isDisabledEdit(key) {
if(options.type==='addBranch'){
return true
}
if (form.id) {
return true
} else {
false
}
}
const address = computed(() => {
if (form.provinces && form.cities && form.districts) {
return form.provinces + '-' + form.cities + '-' + form.districts
}
})
const rules = reactive({
'shopName': {
type: 'string',
max: 30,
required: true,
message: '请输入店铺名称',
trigger: ['blur', 'change'],
},
'logo': {
type: 'string',
required: true,
message: '请上传门店logo',
trigger: ['blur', 'change'],
},
accountName: {
max: 30,
required: true,
message: '请输入登录账号',
trigger: ['blur', 'change'],
},
phone: {
max: 30,
required: true,
message: '请输入联系电话',
trigger: ['blur', 'change'],
},
districts: {
max: 30,
required: true,
message: '请选择店铺地址',
trigger: ['blur', 'change'],
},
lng: {
max: 30,
required: true,
message: '请选择店铺坐标',
trigger: ['blur', 'change'],
// 自定义验证函数,见上说明
// validator: (rule, value, callback) => {
// return !form.lng?false:true;
// },
},
tubeType: {
type: 'number',
max: 30,
required: true,
message: '请选择管理方式',
trigger: ['blur', 'change'],
},
mainId: {
max: 30,
required: true,
message: '请选择主店铺',
trigger: ['blur', 'change'],
}
})
function returnIsRequired(key) {
if (rules[key] && rules[key].required) {
return true
}
return false
}
function submit() {
refForm.value.validate().then(valid => {
console.log('valid', valid);
if (valid) {
// uni.$u.toast('校验通过')
save()
} else {}
}).catch(() => {
// 处理验证错误
});
}
async function save() {
const res = (form.id) ? await shopInfoApi.editShop(form) : await shopInfoApi.addShop(form)
if (res) {
uni.$u.toast(form.id ? '修改成功' : '添加成功')
setTimeout(() => {
uni.navigateBack()
}, 1000)
}
}
const options=reactive({})
onLoad(async (opt) => {
Object.assign(options,opt)
if(opt.type=='addBranch'){
// 添加分店
const res = await await shopInfoApi.getShopDetail({
id: opt.id
})
form.isHeadShop=0
form.mainId=res.id
form.shopType=res.shopType
uni.setNavigationBarTitle({
title: '添加店铺'
})
return
}else{
if (opt.id) {
rules.accountName.required = false
const res = await await shopInfoApi.getShopDetail({
id: opt.id
})
for (let key in form) {
form[key] = res[key]
}
uni.setNavigationBarTitle({
title: '编辑店铺'
})
} else {
uni.setNavigationBarTitle({
title: '添加店铺'
})
}
}
})
watchEffect(()=>{
console.log(form.shopType)
if(form.shopType!='only'&&!form.isHeadShop){
rules.mainId.required=true
}
})
</script>
<style lang="scss" scoped>
.min-page {
padding: 32rpx 28rpx;
}
.container {
background-color: #fff;
padding: 12rpx 28rpx;
border-radius: 16rpx;
}
:deep(.input-placeholder) {
font-size: 28rpx;
}
</style>

View File

@@ -0,0 +1,73 @@
<template>
<view class="w-full">
<view class="box u-flex u-row-between" @click="showPop" :class="{disabled:disabled}">
<text class="color-999 " v-if="!modelValue">请选择</text>
<text v-else class="u-m-r-30">{{shopName}}</text>
<up-icon name="arrow-down"></up-icon>
</view>
<popupHeadShop v-model="show" @confirm="confirm"></popupHeadShop>
</view>
</template>
<script setup>
import {
computed,
onMounted,
ref
} from 'vue';
import popupHeadShop from './popup-head-shop.vue'
import * as shopInfoApi from '@/http/api/account/shopInfo.js'
const props = defineProps({
disabled: {
type: Boolean,
default: false
}
})
const show = ref(false)
function showPop() {
if (props.disabled) {
return
}
show.value = true
}
const modelValue = defineModel()
function confirm(e) {
console.log(e);
modelValue.value = e.shopId
selShopInfo.value = e
}
const selShopInfo = ref(null)
const shopName = computed(() => {
if (selShopInfo.value) {
return selShopInfo.value.shopName
}
return ''
})
onMounted(async () => {
if (modelValue.value) {
const res = await shopInfoApi.getShopDetail({
id: modelValue.value
})
if (res) {
selShopInfo.value = res
}
}
})
</script>
<style lang="scss" scoped>
.box {
padding: 9px 9px;
border: 1px solid #dadbde;
display: flex;
border-radius: 4px;
&.disabled {
background-color: rgb(245, 247, 250);
}
}
</style>

View File

@@ -0,0 +1,209 @@
<template>
<view>
<up-popup :show="show" placement="bottom" round="18rpx" closeOnClickOverlay @close="close">
<view class="u-p-30">
<view class="font-bold color-333 u-font-32">选择门店</view>
<view class="u-m-t-24">
<up-search v-model="query.shopName" @search="search" @clear="search" @custom="search"></up-search>
</view>
<scroll-view @scrolltolower="scrolltolower" scroll-with-animation :scroll-into-view="selShopId"
class="scroll-view u-m-t-30" scroll-y="true" style="max-height :60vh;">
<view class="u-m-b-10 u-flex item" v-for="item in list" :key="item.shopId" @click="itemClick(item)"
:id="'shop_'+item.shopId" :class="{active:selShop==item.shopId}">
<view class="checkbox">
<up-icon name="checkbox-mark" color="#fff"></up-icon>
</view>
<view class="u-flex-1">{{item.shopName}}</view>
</view>
<template v-if="query.shopName!==''">
<up-empty v-if="list.length==0" text="未搜索到相关店铺"></up-empty>
<up-loadmore v-else :status="isEnd?'nomor':'loading'"></up-loadmore>
</template>
<template v-else>
<up-loadmore :status="isEnd?'nomor':'loading'"></up-loadmore>
</template>
</scroll-view>
<view class="u-flex gap-20 u-m-t-30">
<view class="u-flex-1">
<my-button type="default" @click="close">取消</my-button>
</view>
<view class="u-flex-1">
<my-button type="primary" @click="submit">确定</my-button>
</view>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import {
computed,
onMounted,
reactive,
ref,
watch
} from 'vue';
import {
adminShopList
} from '@/http/api/shop.js';
const customStyle = ref({
marginRight: '20px'
});
const show = defineModel(false)
let selShop = defineModel('selShop', {
default: '',
});
watch(() => show.value, (newval) => {
if (newval) {
init()
}
})
const selShopId = ref('')
function returnLabel() {
const findShop = list.value.find(v => v.shopId == selShop.value)
return findShop ? findShop.shopName : ''
}
function itemClick(shop) {
selShop.value = shop.shopId
}
function returnShopName(shopId) {
const item = list.value.find((v) => v.shopId == shopId);
return item?.shopName || '';
}
function close() {
show.value = false;
}
const emits = defineEmits(['confirm'])
function submit() {
show.value = false;
if (!selShop.value) {
return uni.showToast({
title: '请选择门店',
icon: 'none'
})
}
const findShop = list.value.find(v => v.shopId == selShop.value)
emits('confirm', findShop)
}
const list = ref([]);
function openPopup() {
selShopId.value = 'shop_' + selShop.value
show.value = true;
}
const query = reactive({
page: 1,
size: 10,
shopName: '',
type: 'only',
isHeadShop: 1
})
const isEnd = ref(false)
function scrolltolower() {
if (!isEnd.value) {
query.page++
init()
}
}
function search() {
selShop.value = '';
query.page = 1;
isEnd.value = false
init()
}
async function init() {
const res = await adminShopList(query);
if (res) {
const arr = res.records.map((item) => ({
shopId: item.id,
shopName: item.shopName,
}));
isEnd.value = query.page >= res.totalPage * 1
if (query.page == 1) {
list.value = arr
} else {
list.value.push(...arr)
}
}
}
</script>
<style lang="scss">
.box {
border-radius: 8upx;
display: flex;
flex-direction: row;
align-items: top;
flex-wrap: wrap;
padding: 10rpx 24rpx;
border: 2rpx solid #e5e5e5;
position: relative;
.icon {
position: absolute;
top: 50%;
right: 24rpx;
transform: translateY(-50%);
}
}
.shop-item {
padding: 4rpx 8rpx 4rpx 16rpx;
border-radius: 4rpx;
border: 2rpx solid #f0f0f0;
background-color: #f5f5f5;
margin-bottom: 16rpx;
margin-left: 16rpx;
}
.scroll-view {
.item {
border: 1px solid #eee;
padding: 20rpx;
border-radius: 12rpx;
&.active {
border-color: $my-main-color;
}
}
}
.checkbox {
margin-right: 10rpx;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
border-radius: 6rpx;
border: 1px solid #999;
}
.item {
&.active {
.checkbox {
background-color: $my-main-color;
border-color: $my-main-color;
}
}
}
</style>

View File

@@ -0,0 +1,302 @@
<template>
<view>
<view class="box" @click.stop="openPopup">
<text class="u-font-28 color-999 u-p-r-16" v-if="selArr[0]===null||selArr[1]===null">请选择</text>
<text class="u-font-28 color-333 u-p-r-16" v-else>{{returnLabel()}}</text>
<view class="icon">
<up-icon name="arrow-down" size="14" color="#999"></up-icon>
</view>
</view>
<up-popup :show="show" placement="bottom" round="18rpx" closeOnClickOverlay @close="close">
<view class="u-p-30">
<view class="font-bold color-333 u-font-32">选择行业类目</view>
<view class="u-m-t-24">
<up-search v-model="query.bankName" @search="search" @change="bankNameChange" @custom="search"
@clear="search"></up-search>
</view>
<view class="u-flex u-m-t-30 gap-20 u-col-top">
<view class="u-flex-1">
<view class="u-p-b-24 font-bold text-center">一级类目</view>
<scroll-view @scrolltolower="scrolltolower" scroll-with-animation :scroll-into-view="oneSelId"
class="scroll-view " scroll-y="true" style="max-height :60vh;">
<view class="u-m-b-10 u-flex item" v-for="(item,index) in list" :key="item.id"
@click="oneCategoryClick(index)" :id="'cateOne_'+index"
:class="{active:selArr[0]===index}">
<view class="checkbox">
<up-icon name="checkbox-mark" color="#fff"></up-icon>
</view>
<view class="u-flex-1">{{item.firstCategory}}</view>
</view>
<up-empty v-if="list.length==0" text="暂无相关分类"></up-empty>
</scroll-view>
</view>
<view class="u-flex-1">
<view class="u-p-b-24 font-bold text-center">二级类目</view>
<scroll-view @scrolltolower="scrolltolower" scroll-with-animation :scroll-into-view="twoSelId"
class="scroll-view " scroll-y="true" style="max-height :60vh;">
<view class="u-m-b-10 u-flex item" v-for="(item,index) in sendList" :key="item.id"
@click="selArr[1]=index" :id="'cateTwo_'+index" :class="{active:selArr[1]==index}">
<view class="checkbox">
<up-icon name="checkbox-mark" color="#fff"></up-icon>
</view>
<view class="u-flex-1">{{item.secondCategory}}</view>
</view>
<up-empty v-if="list.length==0" text="暂无相关分类"></up-empty>
</scroll-view>
</view>
</view>
<view class="u-flex gap-20 u-m-t-30">
<view class="u-flex-1">
<my-button type="default" @click="close">取消</my-button>
</view>
<view class="u-flex-1">
<my-button type="primary" @click="submit">确定</my-button>
</view>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import {
computed,
nextTick,
onMounted,
reactive,
ref,
watch
} from 'vue';
import {
mccCategory
} from '@/http/api/system/common.js';
const customStyle = ref({
marginRight: '20px'
});
const show = ref(false);
const modelValue = defineModel();
const oneSelId = ref('')
const twoSelId = ref('')
const allCategoryArr = computed(() => {
return list.value.reduce((prve, cur) => {
prve.push(...cur.child)
return prve
}, [])
})
function returnLabel() {
const [index1, index2] = selArr.value
console.log('selArr', selArr.value);
if (index1 !== null && index2 !== null) {
return list.value[index1].firstCategory + '/' + list.value[index1].child[index2].secondCategory
}
return ''
}
function oneCategoryClick(index) {
selArr.value[0] = index
selArr.value[1] = null
}
const selItem = ref(null)
function itemClick(bank) {
selItem.value = bank;
}
function close() {
show.value = false;
}
function submit() {
if (selArr.value[0] === null || selArr.value[1] === null) {
return uni.showToast({
title: '请选择行业类目',
icon: 'none'
})
}
const [oneIndex, twoIndex] = selArr.value
const item = list.value[oneIndex].child[twoIndex]
modelValue.value = item.firstCategoryCode + '_' + item.secondCategoryCode
show.value = false;
}
function search() {
init()
}
const list = ref([]);
function openPopup() {
show.value = true;
}
// --------------- 核心新增:节流函数实现 ---------------
/**
* 节流函数:限制函数在指定时间内只触发一次
* @param {Function} fn - 要节流的函数
* @param {number} delay - 节流延迟时间(毫秒)
* @returns {Function} 节流后的函数
*/
function throttle(fn, delay = 300) {
let timer = null; // 定时器标识
return function(...args) {
// 如果已有定时器,直接返回(未到触发时间)
if (timer) return;
// 执行函数并设置新定时器
fn.apply(this, args);
timer = setTimeout(() => {
clearTimeout(timer);
timer = null;
}, delay);
};
}
// --------------- 核心修改创建节流后的search方法 ---------------
// 300ms内只触发一次search可根据需求调整delay值如500ms
const throttledSearch = throttle(search, 300);
// --------------- 改造bankNameChange调用节流后的搜索 ---------------
function bankNameChange() {
// 输入变化时,调用节流后的搜索方法
throttledSearch();
}
const query = reactive({
bankName: ''
})
const isEnd = ref(false)
function scrolltolower() {
}
async function init() {
const res = await mccCategory(query);
if (res) {
list.value = res.map(v => {
return {
...v,
firstCategoryCode: v.child[0].firstCategoryCode
}
})
startWatch()
}
}
const selArr = ref([null, null])
const sendList = computed(() => {
if (selArr.value[0] !== null) {
return list.value[selArr.value[0]].child
}
})
function startWatch() {
watch(() => modelValue.value, (newval) => {
if (newval) {
const arr = modelValue.value.split('_')
const [oneCode, twoCode] = arr
console.log('oneCode',oneCode);
console.log('twoCode',twoCode);
const oneIndex = list.value.findIndex(v => v.firstCategoryCode == oneCode)
if (oneIndex != -1) {
selArr.value[0] = oneIndex
oneSelId.value = 'cateOne_' + oneIndex
const twoIndex = list.value[oneIndex].child.findIndex(v => v.secondCategoryCode==twoCode)
if (twoIndex != -1) {
selArr.value[1] = twoIndex
twoSelId.value = 'cateTwo_' + twoIndex
}
}
console.log('watch selArr',selArr.value);
} else {
selArr.value = [null, null]
}
}, {
immediate: true
})
}
onMounted(init);
</script>
<style lang="scss">
.box {
border-radius: 8upx;
display: flex;
flex-direction: row;
align-items: top;
flex-wrap: wrap;
padding: 20rpx 24rpx;
border: 2rpx solid #e5e5e5;
position: relative;
.icon {
position: absolute;
top: 50%;
right: 24rpx;
transform: translateY(-50%);
}
}
.shop-item {
padding: 4rpx 8rpx 4rpx 16rpx;
border-radius: 4rpx;
border: 2rpx solid #f0f0f0;
background-color: #f5f5f5;
margin-bottom: 16rpx;
margin-left: 16rpx;
}
.scroll-view {
.item {
border: 1px solid #eee;
padding: 20rpx;
border-radius: 12rpx;
&.active {
border-color: $my-main-color;
}
}
}
.checkbox {
margin-right: 10rpx;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
border-radius: 6rpx;
border: 1px solid #999;
}
.item {
&.active {
.checkbox {
background-color: $my-main-color;
border-color: $my-main-color;
}
}
}
</style>

View File

@@ -0,0 +1,203 @@
<template>
<view>
<up-popup :show="show" placement="bottom" round="18rpx" closeOnClickOverlay @close="close">
<view class="u-p-30">
<view class="font-bold color-333 u-font-32">选择门店</view>
<view class="u-m-t-24">
<up-search v-model="query.shopName" @search="search" @clear="search" @custom="search"></up-search>
</view>
<scroll-view @scrolltolower="scrolltolower" scroll-with-animation :scroll-into-view="selShopId"
class="scroll-view u-m-t-30" scroll-y="true" style="max-height :60vh;">
<view class="u-m-b-10 u-flex item" v-for="item in list" :key="item.shopId" @click="itemClick(item)"
:id="'shop_'+item.shopId" :class="{active:selShop==item.shopId}">
<view class="checkbox">
<up-icon name="checkbox-mark" color="#fff"></up-icon>
</view>
<view class="u-flex-1">{{item.shopName}}</view>
</view>
<template v-if="query.shopName!==''">
<up-empty v-if="list.length==0" text="未搜索到相关店铺"></up-empty>
<up-loadmore v-else :status="isEnd?'nomor':'loading'"></up-loadmore>
</template>
<template v-else>
<up-loadmore :status="isEnd?'nomor':'loading'"></up-loadmore>
</template>
</scroll-view>
<view class="u-flex gap-20 u-m-t-30">
<view class="u-flex-1">
<my-button type="default" @click="close">取消</my-button>
</view>
<view class="u-flex-1">
<my-button type="primary" @click="submit">确定</my-button>
</view>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import {
computed,
onMounted,
reactive,
ref,
watch
} from 'vue';
import {
adminShopList
} from '@/http/api/shop.js';
const customStyle = ref({
marginRight: '20px'
});
const show = defineModel(false)
let selShop = defineModel('selShop', {
default: '',
});
const selShopId = ref('')
function returnLabel() {
const findShop = list.value.find(v => v.shopId == selShop.value)
return findShop ? findShop.shopName : ''
}
function itemClick(shop) {
selShop.value = shop.shopId
}
function returnShopName(shopId) {
const item = list.value.find((v) => v.shopId == shopId);
return item?.shopName || '';
}
function close() {
show.value = false;
}
const emits=defineEmits(['confirm'])
function submit() {
show.value = false;
if(!selShop.value){
return uni.showToast({
title:'请选择门店',
icon:'none'
})
}
const findShop = list.value.find(v => v.shopId == selShop.value)
emits('confirm',findShop)
}
const list = ref([]);
function openPopup() {
selShopId.value = 'shop_' + selShop.value
show.value = true;
}
const query = reactive({
page: 1,
size: 10,
shopName: '',
})
const isEnd = ref(false)
function scrolltolower() {
if (!isEnd.value) {
query.page++
init()
}
}
function search() {
selShop.value = '';
query.page = 1;
isEnd.value = false
init()
}
async function init() {
const res = await adminShopList(query);
if (res) {
const arr = res.records.map((item) => ({
shopId: item.id,
shopName: item.shopName,
}));
isEnd.value = query.page >= res.totalPage * 1
if (query.page == 1) {
list.value = arr
} else {
list.value.push(...arr)
}
}
}
onMounted(init);
</script>
<style lang="scss">
.box {
border-radius: 8upx;
display: flex;
flex-direction: row;
align-items: top;
flex-wrap: wrap;
padding: 10rpx 24rpx;
border: 2rpx solid #e5e5e5;
position: relative;
.icon {
position: absolute;
top: 50%;
right: 24rpx;
transform: translateY(-50%);
}
}
.shop-item {
padding: 4rpx 8rpx 4rpx 16rpx;
border-radius: 4rpx;
border: 2rpx solid #f0f0f0;
background-color: #f5f5f5;
margin-bottom: 16rpx;
margin-left: 16rpx;
}
.scroll-view {
.item {
border: 1px solid #eee;
padding: 20rpx;
border-radius: 12rpx;
&.active {
border-color: $my-main-color;
}
}
}
.checkbox {
margin-right: 10rpx;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
border-radius: 6rpx;
border: 1px solid #999;
}
.item {
&.active {
.checkbox {
background-color: $my-main-color;
border-color: $my-main-color;
}
}
}
</style>

View File

@@ -0,0 +1,257 @@
<template>
<up-popup :show="modelValue" mode="bottom" :popup="false"
:mask="true" :closeable="true" :safe-area-inset-bottom="true"
close-icon-color="#ffffff" :z-index="uZIndex"
:maskCloseAble="maskCloseAble" @close="close">
<up-tabs v-if="modelValue" :list="genTabsList"
:scrollable="true" :current="tabsIndex" @change="tabsChange" ref="tabs"></up-tabs>
<view class="area-box">
<view class="u-flex" :class="{ 'change':isChange }">
<view class="area-item">
<view class="u-padding-10 u-bg-gray" style="height: 100%;">
<scroll-view :scroll-y="true" style="height: 100%">
<up-cell-group>
<up-cell v-for="(item,index) in provinces"
:title="item.regionName" :arrow="false"
:index="index" :key="index"
@click="provinceChange(index)">
<template v-slot:right-icon>
<up-icon v-if="isChooseP&&province===index"
size="17" name="checkbox-mark"></up-icon>
</template>
</up-cell>
</up-cell-group>
</scroll-view>
</view>
</view>
<view class="area-item">
<view class="u-padding-10 u-bg-gray" style="height: 100%;">
<scroll-view :scroll-y="true" style="height: 100%">
<up-cell-group v-if="isChooseP">
<up-cell v-for="(item,index) in citys"
:title="item.regionName" :arrow="false"
:index="index" :key="index"
@click="cityChange(index)">
<template v-slot:right-icon>
<up-icon v-if="isChooseC&&city===index"
size="17" name="checkbox-mark"></up-icon>
</template>
</up-cell>
</up-cell-group>
</scroll-view>
</view>
</view>
<view class="area-item">
<view class="u-padding-10 u-bg-gray" style="height: 100%;">
<scroll-view :scroll-y="true" style="height: 100%">
<up-cell-group v-if="isChooseC">
<up-cell v-for="(item,index) in areas"
:title="item.regionName" :arrow="false"
:index="index" :key="index"
@click="areaChange(index)">
<template v-slot:right-icon>
<up-icon v-if="isChooseA&&area===index"
size="17" name="checkbox-mark"></up-icon>
</template>
</up-cell>
</up-cell-group>
</scroll-view>
</view>
</view>
</view>
</view>
</up-popup>
</template>
<script>
import {region} from '@/http/api/system/region.js'
import provinces from "../common/province.js";
import citys from "../common/city.js";
import areas from "../common/area.js";
/**
* city-select 省市区级联选择器
* @property {String Number} z-index 弹出时的z-index值默认1075
* @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭Picker默认true
* @property {String} default-region 默认选中的地区,中文形式
* @property {String} default-code 默认选中的地区,编号形式
*/
export default {
name: 'u-city-select',
props: {
// 通过双向绑定控制组件的弹出与收起
modelValue: {
type: Boolean,
default: false
},
// 默认显示的地区,可传类似["河北省", "秦皇岛市", "北戴河区"]
defaultRegion: {
type: Array,
default () {
return [];
}
},
// 默认显示地区的编码defaultRegion和areaCode同时存在areaCode优先可传类似["13", "1303", "130304"]
areaCode: {
type: Array,
default () {
return [];
}
},
// 是否允许通过点击遮罩关闭Picker
maskCloseAble: {
type: Boolean,
default: true
},
// 弹出的z-index值
zIndex: {
type: [String, Number],
default: 0
}
},
data() {
return {
cityValue: "",
isChooseP: false, //是否已经选择了省
province: 0, //省级下标
provinces: [],
isChooseC: false, //是否已经选择了市
city: 0, //市级下标
citys: citys[0],
isChooseA: false, //是否已经选择了区
area: 0, //区级下标
areas: areas[0][0],
tabsIndex: 0,
list:[]
}
},
async mounted() {
await this.getRegon()
this.init();
},
computed: {
isChange() {
return this.tabsIndex > 1;
},
genTabsList() {
let tabsList = [{
name: "请选择"
}];
if (this.isChooseP) {
console.log(this.province)
tabsList[0]['name'] = this.provinces[this.province]['regionName'];
tabsList[1] = {
name: "请选择"
};
}
if (this.isChooseC) {
tabsList[1]['name'] = this.citys[this.city]['regionName'];
tabsList[2] = {
name: "请选择"
};
}
if (this.isChooseA) {
tabsList[2]['name'] = this.areas[this.area]['regionName'];
}
return tabsList;
},
uZIndex() {
// 如果用户有传递z-index值优先使用
return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
}
},
emits: ['city-change'],
methods: {
async getRegon(){
const res=await region()
this.provinces=res||[]
},
init() {
if (this.areaCode.length == 3) {
this.setProvince("", this.areaCode[0]);
this.setCity("", this.areaCode[1]);
this.setArea("", this.areaCode[2]);
} else if (this.defaultRegion.length == 3) {
this.setProvince(this.defaultRegion[0], "");
this.setCity(this.defaultRegion[1], "");
this.setArea(this.defaultRegion[2], "");
};
},
setProvince(regionName = "", value = "") {
this.provinces.map((v, k) => {
if (value ? v.value == value : v.regionName == regionName) {
this.provinceChange(k);
}
})
},
setCity(regionName = "", value = "") {
this.citys.map((v, k) => {
if (value ? v.value == value : v.regionName == regionName) {
this.cityChange(k);
}
})
},
setArea(regionName = "", value = "") {
this.areas.map((v, k) => {
if (value ? v.value == value : v.regionName == regionName) {
this.isChooseA = true;
this.area = k;
}
})
},
close() {
this.$emit('update:modelValue', false);
},
tabsChange(index) {
this.tabsIndex = index;
},
provinceChange(index) {
this.isChooseP = true;
this.isChooseC = false;
this.isChooseA = false;
this.province = index;
this.citys =this.provinces[index].children
this.tabsIndex = 1;
},
cityChange(index) {
this.isChooseC = true;
this.isChooseA = false;
this.city = index;
this.areas =this.provinces[this.province].children[index].children
this.tabsIndex = 2;
},
areaChange(index) {
this.isChooseA = true;
this.area = index;
let result = {};
result.province = this.provinces[this.province];
result.city = this.citys[this.city];
result.area = this.areas[this.area];
this.$emit('city-change', result);
this.close();
}
}
}
</script>
<style lang="scss">
.area-box {
width: 100%;
overflow: hidden;
height: 800rpx;
>view {
width: 150%;
transition: transform 0.3s ease-in-out 0s;
transform: translateX(0);
&.change {
transform: translateX(-33.3333333%);
}
}
.area-item {
width: 33.3333333%;
height: 800rpx;
}
}
</style>

28
pagesShops/data.js Normal file
View File

@@ -0,0 +1,28 @@
export const shopTypes = {
'only': '单店',
'chain': '连锁店',
'join': '加盟店',
}
export const registerTypes = {
'before': '快餐版',
'after': '餐饮版',
}
export const profiless = {
probation: '试用',
release: '正式',
}
export const statuss = {
1: '开启',
0: '关闭'
}
export const tubeTypes = {
1: '直接管理',
0: '不可直接管理'
}
export const channels = {
'poly': '聚合支付',
'native': '支付进件',
}

415
pagesShops/index/index.vue Normal file
View File

@@ -0,0 +1,415 @@
<template>
<view class="min-page bg-f7 u-font-28 color-333">
<up-sticky>
<view class="top u-flex">
<up-select :options="statusList" @select="statusListSelect">
<template #text>
<text v-if="query.status">{{returnStatusLabel(query.status)}}</text>
<text v-else>状态</text>
</template>
</up-select>
<view class="u-flex-1 u-p-l-32">
<up-search placeholder="店铺名称" v-model="query.shopName" @search="search" @clear="search"
@custom="search"></up-search>
</view>
</view>
</up-sticky>
<view class="box">
<view class="container" v-for="(item,index) in list" :key="index">
<view class="u-flex u-row-between">
<view>
<text class="color-666">到期时间</text>
<text class="font-bold">{{item.expireTime}}</text>
</view>
<view class="status" :class="returnStatusClass(item.status)">{{item.status?'正式':'试用'}}</view>
</view>
<view class="u-flex u-m-t-10">
<up-avatar :src="item.logo" size="120rpx" shape="square"></up-avatar>
<view class="u-flex-1 u-p-l-32">
<view class="font-bold u-line-1">{{item.shopName}}</view>
<view class="u-m-t-10">{{item.provinces}}-{{item.cities}}-{{item.districts}} {{item.address}}
</view>
</view>
</view>
<view class="u-m-t-32">
<view class="">
<text class="color-666">经营模式</text>
<text class="font-bold">{{returnRegisterType(item.registerType) }}</text>
</view>
<view class="u-m-t-24">
<text class="color-666">店铺类型</text>
<text class="font-bold">{{returnShopType(item.shopType) }}</text>
<text class="font-bold"
v-if="item.shopType!='only'&&item.isHeadShop==0">(主店{{item.headShopName}})</text>
</view>
<view class="u-m-t-24 u-flex">
<text class="color-666">店铺状态</text>
<up-switch disabled v-model="item.status" :active-value="1" :inactive-value="0"
size="20"></up-switch>
</view>
<view class="u-m-t-24 u-flex u-col-center">
<text class="color-666">创建时间</text>
<view class=" font-bold">{{item.createTime}}</view>
</view>
<view class="u-flex u-m-t-32 u-row-right gap-20">
<view style="min-width: 160rpx;">
<my-button @click="toEdit(item)">编辑</my-button>
</view>
<view style="min-width: 160rpx;">
<my-button @click="showaAtivationCode(item)">激活</my-button>
</view>
<view style="min-width: 160rpx;">
<my-button @click="showMore(item)">
<text class="u-m-r-10">更多</text>
<up-icon name="arrow-down" color="#fff"></up-icon>
</my-button>
</view>
</view>
</view>
</view>
<template v-if="query.shopName">
<up-empty v-if="list.length<=0" text="未搜索到相关信息"></up-empty>
<up-loadmore :status="isEnd?'nomore':'loading'" v-else></up-loadmore>
</template>
<template v-else>
<up-empty v-if="list.length<=0" text="未搜索到相关信息"></up-empty>
<up-loadmore v-else :status="isEnd?'nomore':'loading'"></up-loadmore>
</template>
</view>
<view style="height: 140rpx;"></view>
<view class="bottom">
<my-button @click="toAdd()">添加店铺</my-button>
</view>
<shopSelect v-model="showShopSelect" @confirm="toAdd"></shopSelect>
<up-popup :show="codeShow" mode="center" @close="codeShow=false" round="16rpx" :close-on-click-overlay="true">
<view style="border-radius: 16rpx;overflow: hidden;" class="u-p-b-30">
<up-image width="200" height="200" :src="code"></up-image>
<view class="u-m-t-0 text-center" v-if="codeType=='wx'">请打开微信扫码</view>
<view class="u-m-t-0 text-center" v-if="codeType=='aliPay'">请打开支付宝扫码</view>
</view>
</up-popup>
<up-popup :show="activationCode.show" mode="center" @close="activationCode.show=false" round="16rpx"
:close-on-click-overlay="true">
<view class="popup-box">
<view class="font-bold u-font-32 text-center">生成激活码</view>
<view class="u-p-l-20 u-p-r-20 u-m-r-32">
<up-form label-width="auto">
<up-form-item label="激活码" required>
<up-input v-model="activationCode.form.activateCode"></up-input>
</up-form-item>
</up-form>
</view>
<view class="u-flex gap-20 u-m-t-42">
<view class="u-flex-1">
<my-button type="default" @click="activationCode.show=false">取消</my-button>
</view>
<view class="u-flex-1">
<my-button @click="activationCodeSubmit">确认</my-button>
</view>
</view>
</view>
</up-popup>
<up-action-sheet :actions="moreMenus.list" round="16rpx" @select="moreMenusSelect" @close="moreMenus.show=false"
cancelText="取消" :show="moreMenus.show"></up-action-sheet>
</view>
</template>
<script setup>
import {
shopTypes,
registerTypes
} from '../data.js'
const code = ref('')
const codeShow = ref(false)
const codeType = ref('')
import {
reactive,
ref,
watch
} from 'vue';
import shopSelect from '../components/shop-select.vue'
import {
onReachBottom,
onShow
} from '@dcloudio/uni-app'
import * as shopInfoApi from '@/http/api/account/shopInfo.js'
const activationCode = reactive({
show: false,
form: {
activateCode: '',
id: '',
},
})
async function activationCodeSubmit(){
if (!activationCode.form.activateCode) {
return uni.$u.toast('请填写激活码')
}
const res = await shopInfoApi.editShop(activationCode.form)
if (res) {
uni.$u.toast('激活成功')
search()
}
}
function showaAtivationCode(item) {
activationCode.form.id = item.id
activationCode.show=true
}
const statusList = [{
value: 1,
name: '开启',
},
{
value: 0,
name: '关闭',
},
]
const moreMenusList = [{
name: '添加分店',
},
{
name: '支付配置',
},
// {
// name: '续费记录',
// },
// {
// name: '重置密码',
// },
// {
// name: '删除',
// color: '#FF1C1C'
// },
]
const moreMenus = reactive({
list: moreMenusList,
selItem: null,
show: false
})
function moreMenusSelect(e) {
console.log(e);
if (e.name == '支付配置') {
uni.navigateTo({
url: '/pagesShops/pay-config/pay-config?shopId=' + moreMenus.selItem.id + '&licenceNo=' + moreMenus
.selItem.licenceNo
})
}
if (e.name == '添加分店') {
uni.navigateTo({
url: '/pagesShops/add/add?id=' + moreMenus.selItem.id + '&type=addBranch'
})
}
}
function showMore(item) {
if (item.shopType != 'only' && item.isHeadShop) {
moreMenus.list = moreMenusList
} else {
moreMenus.list = moreMenusList.filter(v => v.name != '添加分店')
}
moreMenus.selItem = item
moreMenus.show = true
}
function returnRegisterType(registerTyp) {
return registerTypes[registerTyp] ? registerTypes[registerTyp] : ''
}
function returnShopType(shopType) {
return shopTypes[shopType] ? shopTypes[shopType] : ''
}
function statusListSelect(e) {
query.status = e.value
}
const statusLabelJson = {
'REJECTED': '已拒绝'
}
const statusClassJson = {
'REJECTED': 'error'
}
function returnStatusLabel(state) {
const item = statusList.find(v => v.value == state)
if (item) {
return item.name
}
return ''
}
function returnStatusClass(state) {
if (state == 1) {
return 'success'
}
return 'warning'
}
function showCode(item, type) {
if (type == 'wx') {
code.value = item.wechatSignUrl
}
if (type == 'aliPay') {
code.value = item.alipaySignUrl
}
codeType.value = type
codeShow.value = true
}
const showShopSelect = ref(false)
const query = reactive({
page: 1,
size: 10,
shopName: '',
status: ''
})
watch(() => query.status, (newval) => {
search()
})
const isEnd = ref(false)
const list = ref([])
function search() {
isEnd.value = false
query.page = 1
getData()
}
function toAdd(shop) {
console.log(shop)
uni.navigateTo({
url: '/pagesShops/add/add'
})
}
function toEdit(shop) {
console.log(shop)
uni.navigateTo({
url: '/pagesShops/add/add?id=' + shop.id
})
}
function getData() {
shopInfoApi.allShopList(query).then(res => {
isEnd.value = query.page >= res.totalPage * 1
if (query.page == 1) {
list.value = res.records
} else {
list.value.push(...res.records)
}
})
}
function queryStatus(item) {
queryEntry({
licenceNo: item.licenceNo,
shopId: item.shopId
}).then(res => {
isEnd.value = false
query.page = 1;
getData()
})
}
onReachBottom(() => {
if (!isEnd.value) {
query.page++
getData()
}
})
onShow(getData)
</script>
<style lang="scss" scoped>
.min-page {
.box {
padding: 32rpx 28rpx;
}
}
.container {
padding: 32rpx 28rpx;
border-radius: 16rpx;
margin-bottom: 32rpx;
background-color: #fff;
}
.bottom {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
z-index: 100;
padding: 32rpx 28rpx;
padding-bottom: 40rpx;
}
.types {}
.status {
padding: 8rpx 18rpx;
border-radius: 8rpx;
border: 2rpx solid #333;
&.success {
border-color: rgba(123, 209, 54, 1);
color: rgba(123, 209, 54, 1);
background: rgba(123, 209, 54, 0.12);
}
&.warning {
border-color: rgba(255, 141, 40, 1);
color: rgba(255, 141, 40, 1);
background: rgba(255, 141, 40, 0.12);
}
&.error {
border-color: #FF1C1C;
color: #FF1C1C;
background: rgba(255, 28, 28, 0.18);
}
&.gray {
color: #bbb;
background-color: #f7f7f7;
border-color: #bbb;
}
}
.top {
padding: 32rpx 28rpx;
background-color: #fff;
}
.popup-box {
background-color: #fff;
width: 690rpx;
background-color: #fff;
padding: 32rpx 28rpx;
border-radius: 16rpx;
}
</style>

View File

@@ -0,0 +1,615 @@
<template>
<view class="min-page bg-f7 u-font-28">
<template v-if="loadingFinish">
<up-form :model="form" :rules="rules" ref="refForm" label-width="auto" label-position="top"
errorType="toast" :label-style="labelStyle">
<view class="container">
<up-form-item label="当前模式">
<up-radio-group v-model="form.channel">
<up-radio v-for="(value,key) in channels" :key="key" :name="key" :label="value"></up-radio>
</up-radio-group>
</up-form-item>
<template v-if="form.channel=='native'">
<up-form-item label="使用信息"
v-if="shopInfo.shopType!='only'&& !shopInfo.isHeadShop && mainEntryManagerRes">
<up-radio-group v-model="useInfo">
<up-radio v-for="(value,key) in useInfos" :key="key" :name="key*1"
:label="value"></up-radio>
</up-radio-group>
</up-form-item>
</template>
</view>
<template v-if="form.channel=='poly'">
<view class="container">
<up-form-item label="店铺id" prop="polyMerchantDTO.storeId"
:required="returnIsRequired('polyMerchantDTO.storeId')">
<up-input v-model="form.polyMerchantDTO.storeId"></up-input>
</up-form-item>
<up-form-item label="商户名称" prop="polyMerchantDTO.merchantName"
:required="returnIsRequired('polyMerchantDTO.merchantName')">
<up-input v-model="form.polyMerchantDTO.merchantName"></up-input>
</up-form-item>
<up-form-item label="商户应用id" prop="polyMerchantDTO.appId"
:required="returnIsRequired('polyMerchantDTO.appId')">
<up-input v-model="form.polyMerchantDTO.appId"></up-input>
</up-form-item>
<up-form-item label="商户密钥" prop="polyMerchantDTO.appSecret"
:required="returnIsRequired('polyMerchantDTO.appSecret')">
<up-input v-model="form.polyMerchantDTO.appSecret"></up-input>
</up-form-item>
<!-- <up-form-item label="支付密码" prop="polyMerchantDTO.payPassword"
:required="returnIsRequired('polyMerchantDTO.payPassword')">
<up-input v-model="form.polyMerchantDTO.payPassword"></up-input>
</up-form-item> -->
</view>
</template>
<template v-else>
<template v-if="useInfo==0">
<template v-if="entryManagerRes">
<view class="container container1">
<view class="u-flex u-row-between">
<text class="font-bold">商户号</text>
<text class="">{{entryManagerRes.merchantCode}}</text>
</view>
<view class="u-flex u-row-between u-m-t-24">
<text class="font-bold">商户类型</text>
<text class="">{{returnType(entryManagerRes.userType)}}</text>
</view>
<view class="status">
<view class="u-flex u-row-between ">
<text class="font-bold">支付宝进件状态</text>
<view class="state" :class="returnStatusClass(entryManagerRes.alipayStatus)">
{{returnStatusLabel(entryManagerRes.alipayStatus)}}
</view>
</view>
<view v-if="entryManagerRes.alipayStatus==='SIGN'" class="u-m-t-16">
<my-button @click="showCode(entryManagerRes,'aliPay')">查看签约码</my-button>
</view>
<view class="u-m-t-14" v-if="entryManagerRes.alipayErrorMsg">
<up-alert title="拒绝原因" type="error"
:description="entryManagerRes.alipayErrorMsg"></up-alert>
</view>
</view>
<view class="status">
<view class="">
<view class="u-flex u-row-between">
<text class="font-bold">微信进件状态</text>
<view class="state"
:class="returnStatusClass(entryManagerRes.wechatStatus)">
{{returnStatusLabel(entryManagerRes.wechatStatus)}}
</view>
</view>
<view v-if="entryManagerRes.wechatStatus==='SIGN'" class="u-m-t-16">
<my-button @click="showCode(entryManagerRes,'wx')">查看签约码</my-button>
</view>
</view>
<view class="u-m-t-14" v-if="entryManagerRes.wechatErrorMsg">
<up-alert title="拒绝原因" type="error"
:description="entryManagerRes.wechatErrorMsg"></up-alert>
</view>
</view>
<view class="u-flex u-row-between u-m-t-24">
<text class="font-bold">最后提交时间</text>
<text class="">{{entryManagerRes.updateTime}}</text>
</view>
<view class="u-flex u-row-between u-m-t-24">
<text class="font-bold">创建时间</text>
<text class="">{{entryManagerRes.createTime}}</text>
</view>
<view class="u-flex u-row-right gap-20 u-m-t-32">
<my-button @click="toEdit(entryManagerRes)">查看详情</my-button>
<my-button @click="toEdit(entryManagerRes)">修改</my-button>
</view>
</view>
</template>
<view class="container container1" v-if="!entryManagerRes">
<view class="color-red font-bold text-center">您还未申请进件</view>
<view class="u-m-t-32">
<my-button @click="toEdit()">去申请</my-button>
</view>
</view>
</template>
<template v-if="useInfo==1">
<view class="container container1">
<view class="u-flex u-row-between u-m-b-24">
<text class="font-bold">复用信息</text>
<up-tag type="primary" plain text="复用主店信息"></up-tag>
</view>
<view class="u-flex u-row-between">
<text class="font-bold">商户号</text>
<text class="">{{form.shopDirectMerchant.merchantCode}}</text>
</view>
<view class="u-flex u-row-between u-m-t-24">
<text class="font-bold">商户类型</text>
<text class="">{{returnType(form.shopDirectMerchant.userType)}}</text>
</view>
<view class="status">
<view class="u-flex u-row-between ">
<text class="font-bold">支付宝进件状态</text>
<view class="state"
:class="returnStatusClass(form.shopDirectMerchant.alipayStatus)">
{{returnStatusLabel(form.shopDirectMerchant.alipayStatus)}}
</view>
</view>
<view v-if="form.shopDirectMerchant.alipayStatus==='SIGN'" class="u-m-t-16">
<my-button @click="showCode(form.shopDirectMerchant,'aliPay')">查看签约码</my-button>
</view>
<view class="u-m-t-14" v-if="form.shopDirectMerchant.alipayErrorMsg">
<up-alert title="拒绝原因" type="error"
:description="form.shopDirectMerchant.alipayErrorMsg"></up-alert>
</view>
</view>
<view class="status">
<view class="">
<view class="u-flex u-row-between">
<text class="font-bold">微信进件状态</text>
<view class="state"
:class="returnStatusClass(form.shopDirectMerchant.wechatStatus)">
{{returnStatusLabel(form.shopDirectMerchant.wechatStatus)}}
</view>
</view>
<view v-if="form.shopDirectMerchant.wechatStatus==='SIGN'" class="u-m-t-16">
<my-button @click="showCode(form.shopDirectMerchant,'wx')">查看签约码</my-button>
</view>
</view>
<view class="u-m-t-14" v-if="form.shopDirectMerchant.wechatErrorMsg">
<up-alert title="拒绝原因" type="error"
:description="form.shopDirectMerchant.wechatErrorMsg"></up-alert>
</view>
</view>
<view class="u-flex u-row-between u-m-t-24">
<text class="font-bold">最后提交时间</text>
<text class="">{{form.shopDirectMerchant.updateTime}}</text>
</view>
<view class="u-flex u-row-between u-m-t-24">
<text class="font-bold">创建时间</text>
<text class="">{{form.shopDirectMerchant.createTime}}</text>
</view>
</view>
</template>
</template>
<!-- <up-form-item label="微信appid" prop="polyMerchantDTO.wechatSmallAppid"
:required="returnIsRequired('polyMerchantDTO.wechatSmallAppid')">
<up-input v-model="form.polyMerchantDTO.wechatSmallAppid"></up-input>
</up-form-item>
<up-form-item label="微信支付宝appid" prop="polyMerchantDTO.alipaySmallAppid"
:required="returnIsRequired('polyMerchantDTO.alipaySmallAppid')">
<up-input v-model="form.polyMerchantDTO.alipaySmallAppid"></up-input>
</up-form-item> -->
</up-form>
<up-popup :show="codeShow" mode="center" @close="codeShow=false" round="16rpx"
:close-on-click-overlay="true">
<view style="border-radius: 16rpx;overflow: hidden;" class="u-p-b-30">
<up-image width="200" height="200" :src="code"></up-image>
<view class="u-m-t-0 text-center" v-if="codeType=='wx'">请打开微信扫码</view>
<view class="u-m-t-0 text-center" v-if="codeType=='aliPay'">请打开支付宝扫码</view>
</view>
</up-popup>
<my-bottom-btn-group @cancel="uni.navigateBack()" @save="submit"></my-bottom-btn-group>
</template>
<my-page-loading v-else></my-page-loading>
</view>
</template>
<script setup>
import {
reactive,
ref,
watch
} from 'vue'
import {
companyChildTypes,
userTypes,
statusList
} from '@/commons/data/entryManager.js'
import * as shopMerchantApi from '@/http/api/order/shopMerchant.js'
import {
getEntryManager
} from '@/http/api/order/entryManager.js'
import {
channels
} from '../data.js'
import {
onLoad
} from '@dcloudio/uni-app'
import * as shopInfoApi from '@/http/api/account/shopInfo.js'
const useInfo = ref(0)
const useInfos = {
0: '当前店铺',
1: '主店'
}
function toEdit(shop) {
console.log(shop)
if (shop) {
uni.navigateTo({
url: '/entryManager/add/add?shopId=' + shop.shopId + '&licenceNo=' + shop.businessLicenceInfo
.licenceNo
})
} else {
return uni.navigateTo({
url: '/entryManager/add/add?shopId=' + query.shopId
})
// if (mainEntryManagerRes.value) {
// uni.showModal({
// title: '提示',
// content: '是否复用主店信息',
// showCancel: true,
// cancelText: '复用主店信息',
// confirmText: '继续进件',
// success(res) {
// if (res.confirm) {
// uni.navigateTo({
// url: '/entryManager/add/add?shopId=' + query.shopId
// })
// } else {
// form.shopDirectMerchant = mainEntryManagerRes.value
// }
// }
// })
// return
// } else {
// uni.navigateTo({
// url: '/entryManager/add/add?shopId=' + query.shopId
// })
// }
}
}
const code = ref('')
const codeShow = ref(false)
const codeType = ref('')
function returnStatusLabel(state) {
const item = statusList.find(v => v.value == state)
if (item) {
return item.name
}
return ''
}
function returnIsRequired(key) {
if (rules[key] && rules[key].required) {
return true
}
return false
}
function returnType(type) {
if (userTypes[type]) {
return userTypes[type]
}
return ''
}
function showCode(item, type) {
if (type == 'wx') {
code.value = item.wechatSignUrl
}
if (type == 'aliPay') {
code.value = item.alipaySignUrl
}
codeType.value = type
codeShow.value = true
}
function returnStatusClass(state) {
const item = statusList.find(v => v.value == state)
if (item) {
return item.class
}
return ''
}
const labelStyle = {
fontWeight: "700"
}
const query = reactive({
shopId: ''
})
const rules = reactive({
"polyMerchantDTO.merchantName": {
type: 'string',
required: true,
message: '请输入商户名称',
trigger: ['blur', 'change'],
},
"polyMerchantDTO.storeId": {
type: 'string',
required: true,
message: '请输入店铺id',
trigger: ['blur', 'change'],
},
"polyMerchantDTO.appId": {
type: 'string',
required: true,
message: '请输入商户应用id',
trigger: ['blur', 'change'],
},
"polyMerchantDTO.appSecret": {
type: 'string',
required: true,
message: '请输入商户密钥',
trigger: ['blur', 'change'],
},
// "polyMerchantDTO.payPassword": {
// type: 'string',
// required: true,
// message: '请输入支付密钥',
// trigger: ['blur', 'change'],
// },
// "polyMerchantDTO.wechatSmallAppid": {
// type: 'string',
// required: true,
// message: '请输入微信小程序appid',
// trigger: ['blur', 'change'],
// },
// "polyMerchantDTO.alipaySmallAppid": {
// type: 'string',
// required: true,
// message: '请输入支付宝小程序appid',
// trigger: ['blur', 'change'],
// }
})
const form = reactive({
shopId: 0,
channel: "native",
relatedLicenceNo: "",
nativeMerchantDTO: {
wechatMerchantId: "",
alipayMerchantId: "",
alipayAuthInfo: {
user_id: "",
open_id: "",
auth_app_id: "",
app_auth_token: "",
expires_in: "",
app_refresh_token: "",
re_expires_in: "",
order_no: "",
},
},
polyMerchantDTO: {
storeId: "",
merchantName: "",
appId: "",
appSecret: "",
payPassword: "",
wechatSmallAppid: "",
alipaySmallAppid: "",
},
shopDirectMerchant: {
shopId: 0,
shopName: "",
licenceNo: "",
alipayAccount: "",
merchantCode: "",
userType: "",
shortName: "",
merchantBaseInfo: "",
legalPersonInfo: "",
businessLicenceInfo: "",
storeInfo: "",
settlementInfo: "",
createTime: "",
updateTime: "",
errorMsg: "",
wechatApplyId: "",
wechatStatus: "",
wechatErrorMsg: "",
wechatSignUrl: "",
alipayOrderId: "",
alipayStatus: "",
alipayErrorMsg: "",
alipaySignUrl: "",
alipayAuthInfo: "",
wechatMerchantId: "",
alipayMerchantId: "",
},
});
const refForm = ref(null)
const entryManagerRes = ref(null)
const mainEntryManagerRes = ref(null)
const shopInfo = ref(null)
const shopMerchant=ref(null)
async function init() {
const shopInfoRes = await shopInfoApi.getShopDetail({
id: query.shopId
})
shopInfo.value = shopInfoRes
//不是单店且不是主店
if (shopInfoRes && shopInfo.shopType != 'only' && !shopInfoRes.isHeadShop) {
const res = await shopMerchantApi.getMainMerchant({
shopId: query.shopId
})
mainEntryManagerRes.value = res
}
const res = await getEntryManager({
shopId: query.shopId
})
entryManagerRes.value = res
shopMerchantApi.shopMerchant({
shopId: query.shopId
}).then(res => {
if(res){
if (res.shopDirectMerchant) {
useInfo.value = 1
} else {
useInfo.value = 0
}
shopMerchant.value=res
Object.assign(form, res)
}
loadingFinish.value=true
})
}
const loadingFinish=ref(false)
onLoad((opt) => {
query.shopId = opt.shopId
form.shopId = opt.shopId
init()
})
async function save() {
let res = null
if (form.channel == 'poly') {
res = await shopMerchantApi.editShopMerchant({
shopId: form.shopId,
channel: form.channel,
polyMerchantDTO: {
storeId: form.polyMerchantDTO.storeId,
merchantName: form.polyMerchantDTO.merchantName,
appId: form.polyMerchantDTO.appId,
appSecret: form.polyMerchantDTO.appSecret,
}
})
} else {
res = await shopMerchantApi.editShopMerchant({
shopId: form.shopId,
channel: form.channel,
relatedLicenceNo: form.relatedLicenceNo,
nativeMerchantDTO: {
wechatMerchantId: form.nativeMerchantDTO.wechatMerchantId,
alipayMerchantId: form.nativeMerchantDTO.alipayMerchantId,
alipayAuthInfo: {
user_id: form.nativeMerchantDTO.alipayAuthInfo.user_id,
open_id: form.nativeMerchantDTO.alipayAuthInfo.open_id,
auth_app_id: form.nativeMerchantDTO.alipayAuthInfo.auth_app_id,
app_auth_token: form.nativeMerchantDTO.alipayAuthInfo.app_auth_token,
expires_in: form.nativeMerchantDTO.alipayAuthInfo.expires_in,
app_refresh_token: form.nativeMerchantDTO.alipayAuthInfo.app_refresh_token,
re_expires_in: form.nativeMerchantDTO.alipayAuthInfo.re_expires_in,
order_no: form.nativeMerchantDTO.alipayAuthInfo.order_no,
}
}
})
}
if (res) {
uni.$u.toast('保存成功')
setTimeout(() => {
uni.navigateBack()
}, 1000)
}
}
function submit() {
if (form.channel == 'native' && !entryManagerRes.value) {
return uni.$u.toast('您还未申请进件,清先申请进件')
}
refForm.value.validate().then(valid => {
console.log('valid', valid);
if (valid) {
// uni.$u.toast('校验通过')
save()
} else {}
}).catch(() => {
// 处理验证错误
});
}
watch(() => form.channel, (newval) => {
for (let key in rules) {
console.log('key', key)
rules[key].required = newval == 'poly' ? true : false;
}
})
watch(() => useInfo.value, (newval) => {
console.log('newval',newval);
if (newval) {
form.shopDirectMerchant = mainEntryManagerRes.value||(shopMerchant.value?(shopMerchant.value.shopDirectMerchant):null )
form.nativeMerchantDTO = null
} else {
form.shopDirectMerchant = null
form.nativeMerchantDTO = entryManagerRes.value
}
})
</script>
<style lang="scss" scoped>
.min-page {
padding: 32rpx 28rpx;
}
.container {
background-color: #fff;
padding: 12rpx 28rpx;
border-radius: 16rpx;
margin-bottom: 32rpx;
&.container1 {
padding: 32rpx 28rpx;
}
}
:deep(.input-placeholder) {
font-size: 28rpx;
}
:deep(.u-form-item__body) {
padding: 10px 0 0 0;
}
.status {
margin-top: 24rpx;
background-color: #f7f7f7;
padding: 24rpx 28rpx;
border-radius: 4rpx;
.state {
padding: 8rpx 18rpx;
border-radius: 8rpx;
border: 2rpx solid #333;
&.success {
border-color: rgba(123, 209, 54, 1);
color: rgba(123, 209, 54, 1);
background: rgba(123, 209, 54, 0.12);
}
&.warning {
border-color: rgba(255, 141, 40, 1);
color: rgba(255, 141, 40, 1);
background: rgba(255, 141, 40, 0.12);
}
&.error {
border-color: #FF1C1C;
color: #FF1C1C;
background: rgba(255, 28, 28, 0.18);
}
&.gray {
color: #bbb;
background-color: #f7f7f7;
border-color: #bbb;
}
}
}
</style>