需求修改
This commit is contained in:
wlikett
parent
ea5cc974cf
commit
52186bd619
|
|
@ -195,6 +195,17 @@ const routes: Array<RouteRecordRaw> = [
|
|||
isLogin:true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'business',
|
||||
name: 'business',
|
||||
component: () => import('views/user/business/index.vue'),
|
||||
meta: {
|
||||
title: '业务开通',
|
||||
keepAlive: true,
|
||||
AuthFlag: false,
|
||||
isLogin:true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'orderManagementCz',
|
||||
name: 'orderManagementCz',
|
||||
|
|
|
|||
|
|
@ -8,7 +8,8 @@ export const useStore = defineStore('myUser', {
|
|||
menuList: [
|
||||
{ title: '基础信息', name: 'baseInfo' },
|
||||
{ title: '订单管理', name: 'orderManagement' },
|
||||
{ title: '子账号管理', name: 'subAccount' }
|
||||
{ title: '子账号管理', name: 'subAccount' },
|
||||
{ title: '业务开通', name: 'business' },
|
||||
],
|
||||
provinceList: [], // 省份信息
|
||||
marketList: [], // 市级信息
|
||||
|
|
|
|||
|
|
@ -173,9 +173,9 @@
|
|||
type="password"
|
||||
show-password />
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码" class="get-code" prop="code">
|
||||
<el-row justify="space-between">
|
||||
<el-col :span="8">
|
||||
<el-row>
|
||||
<el-form-item label="验证码" class="get-code" prop="code">
|
||||
<el-col :span="16">
|
||||
<div>
|
||||
<el-input
|
||||
v-model.trime="registerForm.code"
|
||||
|
|
@ -184,27 +184,21 @@
|
|||
type="text" />
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="8">
|
||||
<div
|
||||
style="text-align: right; width: 100%"
|
||||
:style="{ color: getCodeBtnDisabled ? '#747272' : '' }">
|
||||
<span v-if="getCodeBtnDisabled">
|
||||
{{ residuSeconds }} 秒后重新发送
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div style="text-align: right">
|
||||
<div style="width: 100%">
|
||||
<el-button
|
||||
style="width: 100%;"
|
||||
type="primary"
|
||||
@click="getCodeInfo"
|
||||
:disabled="getCodeBtnDisabled">
|
||||
获取验证码
|
||||
{{ getCodeBtnDisabled ? `${residuSeconds}秒后重新发送` : '获取验证码' }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handlerRegisterNow" style="width: 100%">
|
||||
立 即 注 册
|
||||
|
|
@ -294,9 +288,9 @@
|
|||
}
|
||||
}
|
||||
|
||||
// .get-code {
|
||||
// display: flex;
|
||||
// }
|
||||
.get-code {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,206 @@
|
|||
<template>
|
||||
<div class="business">
|
||||
<div class="pageTitle">
|
||||
<div class="default">
|
||||
开通业务
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="list">
|
||||
<div class="item" v-for="(v,i) in businessList" :key="i">
|
||||
<div class="info">
|
||||
{{ v.name }}
|
||||
</div>
|
||||
<div class="btn" :class="v.state && 'noPointer'" @click="openDialog(v.state)">
|
||||
{{ v.state ? '' : '开通' }}
|
||||
</div>
|
||||
|
||||
<div class="open tag" v-if="v.state">
|
||||
<span>已开通</span>
|
||||
</div>
|
||||
<div class="noOpen tag" v-else>
|
||||
<span>未开通</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog v-model="dialogFormVisible" width="80%">
|
||||
|
||||
<div class="content">
|
||||
<div class="card name">
|
||||
开通业务：租赁
|
||||
</div>
|
||||
<div class="tip card">
|
||||
<div class="border">
|
||||
业务开通注意事项
|
||||
</div>
|
||||
<div class="tipList">
|
||||
<div class="item" v-for="(v,i) in tipList" :key="i">
|
||||
{{ i + 1 }}、{{ v }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<EnterpriseCertification class="EnterpriseCertification card" />
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="dialogFormVisible = false">
|
||||
提交
|
||||
</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import EnterpriseCertification from 'views/EnterpriseCertification.vue'
|
||||
|
||||
import {ref} from "vue";
|
||||
|
||||
const businessList = ref([
|
||||
{
|
||||
name:'登录业务',
|
||||
fn:'',
|
||||
state:1
|
||||
},{
|
||||
name:'租赁业务',
|
||||
fn:'',
|
||||
state:0
|
||||
}
|
||||
])
|
||||
|
||||
const dialogFormVisible = ref(false)
|
||||
|
||||
const tipList = ref([
|
||||
'开通供应商权限时，需上传入驻资质，格式为JPG/PNG，大小在2M以下，请保证图片内容清晰、完整。',
|
||||
'开通供应商权限后，需办理南网支付方可开店。'
|
||||
])
|
||||
|
||||
const openDialog = (state) => {
|
||||
if(state){
|
||||
return
|
||||
}
|
||||
|
||||
dialogFormVisible.value = true
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.business{
|
||||
:deep(.el-dialog){
|
||||
min-width: 900px !important;
|
||||
.el-dialog__body{
|
||||
padding-top: 10px !important;
|
||||
}
|
||||
}
|
||||
.pageTitle{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.default{
|
||||
font-size: 16px;
|
||||
//font-weight: 600;
|
||||
}
|
||||
}
|
||||
.list{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
user-select: none;
|
||||
.item{
|
||||
width: calc((100% - 80px) / 3);
|
||||
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
|
||||
margin-right: 40px;
|
||||
margin-top: 20px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
&:nth-child(3n){
|
||||
margin-right: 0;
|
||||
}
|
||||
.info{
|
||||
height: 90px;
|
||||
width: 100%;
|
||||
line-height: 90px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
.btn{
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
color: #1b7eff;
|
||||
}
|
||||
.noPointer{
|
||||
cursor: default;
|
||||
}
|
||||
.tag{
|
||||
position: absolute;
|
||||
top: -17px;
|
||||
right: -18px;
|
||||
color: white;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
font-size: 11px;
|
||||
transform: rotate(25deg);
|
||||
span {
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
right: 21px;
|
||||
transform: rotate(-25deg);
|
||||
}
|
||||
}
|
||||
.open{
|
||||
background: #1abc9c;
|
||||
}
|
||||
.noOpen{
|
||||
background: #e5662d;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content{
|
||||
.card{
|
||||
padding: 10px 15px;
|
||||
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.name{
|
||||
font-size: 16px;
|
||||
}
|
||||
.tip{
|
||||
margin-top: 20px;
|
||||
.border{
|
||||
font-size: 17px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.tipList{
|
||||
margin-top: 15px;
|
||||
.item{
|
||||
font-size: 13px;
|
||||
margin-bottom:10px ;
|
||||
&:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.EnterpriseCertification{
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
|
@ -14,7 +14,8 @@
|
|||
store.editcurrentMenuList([
|
||||
{ title: '基础信息', name: 'baseInfo' },
|
||||
{ title: '订单管理', name: 'orderManagement' },
|
||||
{ title: '子账号管理', name: 'subAccount' }
|
||||
{ title: '子账号管理', name: 'subAccount' },
|
||||
{ title: '业务开通', name: 'business' },
|
||||
])
|
||||
router.push({ name: 'baseInfo' })
|
||||
}
|
||||
|
|
@ -54,7 +55,8 @@
|
|||
store.editcurrentMenuList([
|
||||
{ title: '基础信息', name: 'baseInfo' },
|
||||
{ title: '订单管理', name: 'orderManagement' },
|
||||
{ title: '子账号管理', name: 'subAccount' }
|
||||
{ title: '子账号管理', name: 'subAccount' },
|
||||
{ title: '业务开通', name: 'business' },
|
||||
])
|
||||
}
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue