front/website
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: front:0621e0224e2e1c377fa33a8f264850c438570f88
Branches Tags
front:main
..
compare: front:a3959baf71f7514ef8b96950f36955d5cb7417d5
Branches Tags
front:main

No commits in common. "0621e0224e2e1c377fa33a8f264850c438570f88" and "a3959baf71f7514ef8b96950f36955d5cb7417d5" have entirely different histories.
0621e0224e ... a3959baf71

11 changed files with 337 additions and 436 deletions
Show Stats Expand all files Collapse all files

1
components.d.ts vendored
View File

@ -22,7 +22,6 @@ declare module 'vue' {
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElOption: typeof import('element-plus/es')['ElOption'] ElOption: typeof import('element-plus/es')['ElOption']
ElRadio: typeof import('element-plus/es')['ElRadio'] ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup'] ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow'] ElRow: typeof import('element-plus/es')['ElRow']
ElSelect: typeof import('element-plus/es')['ElSelect'] ElSelect: typeof import('element-plus/es')['ElSelect']

4
src/api/audit.js
View File

@ -11,7 +11,7 @@ export function GetBaiduSuggestion (params = {}){
params.isFilter = true params.isFilter = true
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/mobile/shop/merch/baidu/place/v2/suggestion', url:'/shop/merch/baidu/place/v2/suggestion',
method:'get', method:'get',
data:params, data:params,
}).then(res=>{ }).then(res=>{
@ -23,7 +23,7 @@ export function GetBaiduSuggestion (params = {}){
export function GetMeritoCategory (params = {}){ export function GetMeritoCategory (params = {}){
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/mobile/shop/shop-base-store-category/list', url:'/shop/shop-base-store-category/list',
method:'post', method:'post',
data:params, data:params,
}).then(res=>{ }).then(res=>{

29
src/api/login.js
View File

@ -14,7 +14,7 @@ export function GetLogin (params){
params.isFilter = true params.isFilter = true
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/mobile/account/login/doMerchSmsRegisterAndLogin', url:'/account/login/doMerchSmsRegisterAndLogin',
method:'post', method:'post',
data:params, data:params,
}).then(res=>{ }).then(res=>{
@ -35,7 +35,7 @@ export function GetSmsCode(params){
params.isFilter = true params.isFilter = true
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/mobile/account/login/sendVerifyCode', url:'/account/login/sendVerifyCode',
method:'post', method:'post',
data:params, data:params,
}).then(res=>{ }).then(res=>{
@ -54,7 +54,7 @@ export function GetSmsCode(params){
export function GetStoreCategories() { export function GetStoreCategories() {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url: '/api/mobile/shop/store/biz-category/list', url: 'shop/store/biz-category/list',
method: 'post' method: 'post'
}).then(res => { }).then(res => {
resolve(res) resolve(res)
@ -88,7 +88,7 @@ export function GetPostion (params){
params.isFilter = true params.isFilter = true
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/mobile/shop/merch/baidu/place/v2/suggestion', url:'/shop/merch/baidu/place/v2/suggestion',
method:'get', method:'get',
params, params,
}).then(res=>{ }).then(res=>{
@ -96,14 +96,11 @@ export function GetPostion (params){
}).catch(e => reject(console.warn(e))) }).catch(e => reject(console.warn(e)))
}) })
} }
export function GetBank (){
//废弃测试接口
export function GetBank (data){
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/mobile/shop/lakala/tk/bank/search', url:'/shop/global/banks/list',
method:'post', method:'post',
data
}).then(res=>{ }).then(res=>{
resolve(res) resolve(res)
}).catch(e => reject(console.warn(e))) }).catch(e => reject(console.warn(e)))
@ -148,7 +145,7 @@ export function merchApply(params){
} }
console.log("这是数据",form); console.log("这是数据",form);
http({ http({
url:'/api/mobile/shop/merch/apply', url:'/shop/merch/apply',
method:'post', method:'post',
data:form data:form
}).then(res=>{ }).then(res=>{
@ -164,7 +161,7 @@ export function getApproval_status(){
} }
return new Promise((resolve,reject)=>{ return new Promise((resolve,reject)=>{
http({ http({
url:'/api/mobile/shop/merch/fresh/approval/status', url:'/shop/merch/fresh/approval/status',
method:'post', method:'post',
data:phone data:phone
}).then(res=>{ }).then(res=>{
@ -177,7 +174,7 @@ export function getApproval_status(){
export function re_apply(params){ export function re_apply(params){
return new Promise((resolve,reject)=>{ return new Promise((resolve,reject)=>{
http({ http({
url:'/api/mobile/shop/merch/re-apply', url:'/shop/merch/re-apply',
method:'post', method:'post',
data:params data:params
}).then(res=>{ }).then(res=>{
@ -198,7 +195,7 @@ export function re_apply(params){
export function GetAccountLogin(params){ export function GetAccountLogin(params){
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/admin/account/account-user-base/doLogin', url:'https://mall.gpxscs.cn/api/admin/account/account-user-base/doLogin',
method:'post', method:'post',
params, params,
}).then(res=>{ }).then(res=>{
@ -218,7 +215,7 @@ export function GetAccountLogin(params){
export function GetVerifyCode(params){ export function GetVerifyCode(params){
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url:'/api/admin/shop/shop-base-config/image', url:'https://mall.gpxscs.cn/api/admin/shop/shop-base-config/image',
method:'GET', method:'GET',
params, params,
}).then(res=>{ }).then(res=>{
@ -230,7 +227,7 @@ export function GetVerifyCode(params){
export function GetMerchDetail(){ export function GetMerchDetail(){
return new Promise((resolve,reject)=>{ return new Promise((resolve,reject)=>{
http({ http({
url:'/api/mobile/shop/merch/detail', url:'/shop/merch/detail',
method:'post', method:'post',
data:{mobile:localStorage.getItem('mobilePhone')} data:{mobile:localStorage.getItem('mobilePhone')}
}).then(res=>{ }).then(res=>{
@ -242,7 +239,7 @@ return new Promise((resolve,reject)=>{
export function GetAppDistrict(){ export function GetAppDistrict(){
return new Promise((resolve,reject)=>{ return new Promise((resolve,reject)=>{
http({ http({
url:'/api/mobile/shop/shop-base-district/getAppDistrict', url:'shop/shop-base-district/getAppDistrict',
method:'get' method:'get'
}).then(res=>{ }).then(res=>{
resolve(res) resolve(res)

2
src/api/upload.js
View File

@ -21,7 +21,7 @@ export function uploadFile(file, params = {}) {
} }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http({ http({
url: '/api/mobile/shop/oss/upload', url: '/shop/oss/upload',
method: 'post', method: 'post',
data: formData, data: formData,
}) })

21
src/assets/css/index.css
View File

@ -8,10 +8,6 @@
--bgcolor: #387197; --bgcolor: #387197;
} }
html{
overflow-x: hidden;
}
/* 按钮样式 */ /* 按钮样式 */
.btn { .btn {
@ -76,16 +72,16 @@ html{
width: 100%; width: 100%;
height: 70px; height: 70px;
background-color: #fff; background-color: #fff;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
z-index: 1000; z-index: 1000;
} }
.header-list .el-row{ .header-list .el-row{
width: 100%; width: 100%;
max-width: 1440px; max-width: 1200px;
margin: auto; margin: auto;
} }
.header-top { .header-top {
max-width: 1440px; max-width: 1200px;
width: 100%; width: 100%;
height: 70px; height: 70px;
margin: auto; margin: auto;
@ -101,8 +97,8 @@ html{
} }
.logo a { .logo a {
background: url("../../assets/image/xiaofa_logo.png"); background: url("../../assets/image/xiaofa_logo.png");
width: 48px; width: 60px;
height: 48px; height: 60px;
display: inline-block; display: inline-block;
background-size: contain; background-size: contain;
outline: none; outline: none;
@ -117,12 +113,12 @@ html{
} }
.header-menu { .header-menu {
display: flex; display: flex;
justify-content: center;
} }
.header-menu li { .header-menu li {
margin: 0 30px; margin: 0 30px;
list-style: none; list-style: none;
position: relative; position: relative;
color: #333;
} }
.header-menu a { .header-menu a {
@ -131,6 +127,7 @@ html{
} }
.header-menu li span { .header-menu li span {
font-size: 16px; font-size: 16px;
font-weight: 700;
} }
/* 伪元素添加下滑选中线 */ /* 伪元素添加下滑选中线 */
.header-menu li:hover span{ .header-menu li:hover span{
@ -156,7 +153,6 @@ html{
.header-right { .header-right {
display: flex; display: flex;
justify-content: flex-end;
} }
.header-right .start { .header-right .start {
@ -170,11 +166,14 @@ html{
margin-right: 20px; margin-right: 20px;
} }
.header-right .login .login-button { .header-right .login .login-button {
border-radius: 20px;
} }
.header-right .logout { .header-right .logout {
margin-right: 20px; margin-right: 20px;
} }
.header-right .logout .logout-button { .header-right .logout .logout-button {
background-color: red;
border-radius: 20px;
border: none; border: none;
} }

16
src/components/login.vue
View File

@ -65,11 +65,9 @@ const closeLoginForm = () => {
const refreshCaptcha = async () => { const refreshCaptcha = async () => {
verify_token.value = new Date().getTime(); verify_token.value = new Date().getTime();
const res = await GetVerifyCode({ verify_token: verify_token.value }); const res = await GetVerifyCode({ verify_token: verify_token.value });
if (res && res.status === 200) {
if (res) {
captchaUrl.value = `https://mall.gpxscs.cn/api/admin/shop/shop-base-config/image?verify_token=${verify_token.value}`; captchaUrl.value = `https://mall.gpxscs.cn/api/admin/shop/shop-base-config/image?verify_token=${verify_token.value}`;
} }
}; };
const initCaptcha = async () => { const initCaptcha = async () => {
@ -106,20 +104,20 @@ const handleLogin = async () => {
verify_token: verify_token.value verify_token: verify_token.value
}; };
const res = await GetAccountLogin(params); const res = await GetAccountLogin(params);
if (res && res.status === 200) { if (res && res.data.status === 200) {
console.log("登录成功", res); console.log("登录成功", res);
userStore.setToken(res.data.token); userStore.setToken(res.data.data.token);
userStore.setMobilePhone(formData.value.phoneNumber); userStore.setMobilePhone(formData.value.phoneNumber);
window.open(`https://mall.gpxscs.cn/admin/#/login?loginInfo=${JSON.parse(JSON.stringify(res.data))}`,'_self'); window.open(`https://mall.gpxscs.cn/admin/#/login?loginInfo=${JSON.parse(JSON.stringify(res.data.data))}`,'_self');
formData.value.phoneNumber = ''; formData.value.phoneNumber = '';
formData.value.password = ''; formData.value.password = '';
formData.value.captchaCode = ''; formData.value.captchaCode = '';
console.log(res.data); console.log(res.data.data);
closeLoginForm(); closeLoginForm();
} else if(res&&res.status===250&&res.data.msg=='用户名或密码错误!'){ } else if(res&&res.data.status===250&&res.data.msg=='用户名或密码错误!'){
ElMessage.error('用户名或密码错误!'); ElMessage.error('用户名或密码错误!');
console.log("操作失败", res.msg); console.log("操作失败", res.msg);
}else if(res&&res.status===250&&res.data.msg=='验证码错误'){ }else if(res&&res.data.status===250&&res.data.msg=='验证码错误'){
ElMessage.error('验证码错误'); ElMessage.error('验证码错误');
} }
} else { } else {

8
src/components/register.vue
View File

@ -120,8 +120,8 @@ const register = async () => {
verify_code: formData.value.verificationCode verify_code: formData.value.verificationCode
}; };
const res = await GetLogin(params); const res = await GetLogin(params);
if (res && res.status === 200 && res.data && res.data) { if (res && res.status === 200 && res.data && res.data.data) {
userStore.setToken(res.data.token); userStore.setToken(res.data.data.token);
userStore.setMobilePhone(formData.value.phoneNumber); userStore.setMobilePhone(formData.value.phoneNumber);
formData.value.phoneNumber = ''; formData.value.phoneNumber = '';
formData.value.verificationCode = ''; formData.value.verificationCode = '';
@ -130,7 +130,7 @@ const register = async () => {
try { try {
const approvalRes = await getApproval_status(); const approvalRes = await getApproval_status();
if (approvalRes.data.code === 0 && approvalRes.data.status === 200) { if (approvalRes.data.code === 0 && approvalRes.data.status === 200) {
const approvalStatus = approvalRes.data.approval_status; const approvalStatus = approvalRes.data.data.approval_status;
localStorage.setItem('approval_status', approvalStatus); localStorage.setItem('approval_status', approvalStatus);
if (approvalStatus == '4') { if (approvalStatus == '4') {
router.push({ name: 'start' }); router.push({ name: 'start' });
@ -142,7 +142,7 @@ const register = async () => {
console.error('获取审批状态失败:', error); console.error('获取审批状态失败:', error);
} }
} else { } else {
if (res.status === 250) { if (res.data.status === 250) {
// 使用 ElMessage 提示验证码错误 // 使用 ElMessage 提示验证码错误
ElMessage.error('验证码错误'); ElMessage.error('验证码错误');
} else { } else {

12
src/views/HeadMenu.vue
View File

@ -3,7 +3,7 @@
<div class="header-list"> <div class="header-list">
<el-row> <el-row>
<div class="header-top"> <div class="header-top">
<el-col :xs="2" :sm="2" :md="2" :lg="2" :xl="2"> <el-col :xs="4" :sm="4" :md="4" :lg="4" :xl="4">
<div class="logo"> <div class="logo">
<router-link :to="{ name: 'index' }"></router-link> <router-link :to="{ name: 'index' }"></router-link>
</div> </div>
@ -19,18 +19,18 @@
<div class="header-right"> <div class="header-right">
<!-- 免费开店按钮始终可见 --> <!-- 免费开店按钮始终可见 -->
<div class="start"> <div class="start">
<el-button @click="handleOpenStartPage"> <el-button type="primary" size="default" @click="handleOpenStartPage" class="start-button">
免费开店 免费开店
</el-button> </el-button>
</div> </div>
<!-- 根据登录状态显示不同按钮 --> <!-- 根据登录状态显示不同按钮 -->
<div class="login"> <div class="login">
<el-button type="primary" @click="openLoginForm" class="login-button"> <el-button type="primary" size="default" @click="openLoginForm" class="login-button">
商家登录 商家登录
</el-button> </el-button>
</div> </div>
<div v-if="isLoggedIn" class="logout"> <div v-if="isLoggedIn" class="logout">
<el-button type="danger" plain @click="logout" class="logout-button"> <el-button type="primary" size="default" @click="logout" class="logout-button">
退出登录 退出登录
</el-button> </el-button>
</div> </div>
@ -108,8 +108,8 @@ watch(() => userStore.isLoggedIn, (newVal) => {
isLoggedIn.value = newVal; // 确保 isLoggedIn 始终与 userStore.isLoggedIn 保持一致 isLoggedIn.value = newVal; // 确保 isLoggedIn 始终与 userStore.isLoggedIn 保持一致
if (isLoggedIn.value === null) console.log("登陆过期"); if (isLoggedIn.value === null) console.log("登陆过期");
// getApproval_status().then((res) => { // getApproval_status().then((res) => {
// if (res.code === 0 && res.status === 200) { // if (res.data.code === 0 && res.data.status === 200) {
// localStorage.setItem('approval_status', res.data.approval_status); // localStorage.setItem('approval_status', res.data.data.approval_status);
// } else { // } else {
// } // }

4
src/views/business/agreement/privacy.vue
View File

@ -21,5 +21,7 @@ getContentData()
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.container{
padding: 20px;
}
</style> </style>

672
src/views/start/start.vue
View File

@ -1,14 +1,17 @@
<template> <template>
<div class="signUp-container"> <div class="signUp-container">
<h1>免费开店</h1>
<!-- 步骤条 --> <!-- 步骤条 -->
<div class="steps-container"> <div class="steps-container" style="margin: 20px;">
<div class="tit" style="margin-bottom: 0">免费开店资料填写</div> <el-steps :active="active" finish-status="success" align-center>
<el-step title="第一步:填写店铺信息" />
<el-step title="第二步:填写资质信息" />
<el-step title="第三步:填写收款信息" />
</el-steps>
</div> </div>
<div class="form-submit"> <div class="form-submit">
<el-form :model="applyFormData" :rules="rules" ref="formRef" label-width="160px" style="max-width: 600px"> <el-form :model="applyFormData" :rules="rules" ref="formRef" label-width="120px" style="max-width: 600px">
<div class="from_box"> <div v-show="active === 1">
<div class="tit">店铺信息</div>
<!-- 第一步表单内容 --> <!-- 第一步表单内容 -->
<el-form-item label="联系人" prop="contact_name"> <el-form-item label="联系人" prop="contact_name">
<el-input v-model="applyFormData.contact_name" placeholder="请输入联系人姓名" /> <el-input v-model="applyFormData.contact_name" placeholder="请输入联系人姓名" />
@ -17,44 +20,43 @@
<el-input v-model="applyFormData.login_mobile" placeholder="请输入联系人电话" disabled /> <el-input v-model="applyFormData.login_mobile" placeholder="请输入联系人电话" disabled />
</el-form-item> </el-form-item>
<el-form-item label="经营品类" prop="biz_category"> <el-form-item label="经营品类" prop="biz_category">
<el-cascader v-model="applyFormData.biz_category" :options="cascaderOptions" placeholder="请选择经营品类" <el-cascader v-model="applyFormData.biz_category" :options="cascaderOptions"
:show-all-levels="false" @change="handleChangeBizCategory" clearable /> placeholder="请选择经营品类" :show-all-levels="false" @change="handleChangeBizCategory"
clearable />
</el-form-item> </el-form-item>
<el-form-item label="门店名称" prop="store_name"> <el-form-item label="门店名称" prop="store_name">
<el-input v-model="applyFormData.store_name" placeholder="请输入门店名称" /> <el-input v-model="applyFormData.store_name" placeholder="请输入门店名称" />
</el-form-item> </el-form-item>
<el-form-item label="所在地区" prop="map_address"> <el-form-item label="地图地址" prop="map_address">
<el-cascader v-model="applyFormData.map_address" :options="cascaderOptions2" <el-cascader v-model="applyFormData.map_address" :options="cascaderOptions2"
@change="handleChange" /> @change="handleChange" />
</el-form-item> </el-form-item>
<el-form-item label="详细地址" prop="store_address"> <el-form-item label="搜索定位" prop="position">
<el-input v-model="applyFormData.store_address" placeholder="请输入详细地址" /> <el-autocomplete v-model="applyFormData.position" :fetch-suggestions="querySearch"
</el-form-item> value-key="value" :options="autocompleteOptions" @select="handleSelect">
<el-form-item label="地图搜索" prop="position">
<el-autocomplete v-model="applyFormData.position" placeholder="搜索地址，更快填写"
:fetch-suggestions="querySearch" value-key="value" :options="autocompleteOptions"
@select="handleSelect">
<template #default="{ item }"> <template #default="{ item }">
<div class="auto-item" v-if="item"> <div class="auto-item" v-if="item">
<div> <div>
<p>{{ item.name }}</p> <p>{{ item.name }}</p> <!-- 显示名称 -->
<!-- 显示名称 -->
</div> </div>
<div> <div>
<span>{{ item.address }}</span> <span>{{ item.address }}</span> <!-- 显示地址 -->
<!-- 显示地址 -->
</div> </div>
</div> </div>
</template> </template>
</el-autocomplete> </el-autocomplete>
</el-form-item> </el-form-item>
<el-form-item label="详细地址" prop="store_address">
<el-input v-model="applyFormData.store_address" placeholder="请输入详细地址" />
</el-form-item>
<el-form-item :label="getLabel('front_facade_image', 1)" prop="front_facade_image"> <el-form-item :label="getLabel('front_facade_image', 1)" prop="front_facade_image">
<el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true" <el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true"
:on-remove="(file, fileList) => handleRemove(file, fileList, 'front_facade_image') v-model="applyFormData.front_facade_image"
" :on-success="(response, file, fileList) => :on-remove="(file, fileList) => handleRemove(file, fileList, 'front_facade_image')"
handleUploadSuccess(response, file, fileList, 'front_facade_image') :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'front_facade_image')"
" :on-error="handleUploadError" :on-exceed="handleExceed" :before-upload="beforeUpload" :action="uploadUrl" :on-error="handleUploadError" :on-exceed="handleExceed" :before-upload="beforeUpload"
name="upfile" :class="{ 'upload-hidden': isUploadHidden('front_facade_image') }"> :action="uploadUrl" name="upfile"
:class="{ 'upload-hidden': isUploadHidden('front_facade_image') }">
<el-icon class="avatar-uploader-icon"> <el-icon class="avatar-uploader-icon">
<Plus /> <Plus />
</el-icon> </el-icon>
@ -62,54 +64,26 @@
</el-form-item> </el-form-item>
<el-form-item :label="getLabel('environment_image', 1)" prop="environment_image"> <el-form-item :label="getLabel('environment_image', 1)" prop="environment_image">
<el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true" <el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true"
v-model="applyFormData.environment_image" :on-remove="(file, fileList) => handleRemove(file, fileList, 'environment_image') v-model="applyFormData.environment_image"
" :on-success="(response, file, fileList) => :on-remove="(file, fileList) => handleRemove(file, fileList, 'environment_image')"
handleUploadSuccess(response, file, fileList, 'environment_image') :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'environment_image')"
" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl" name="upfile" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
:class="{ 'upload-hidden': isUploadHidden('environment_image') }"> name="upfile" :class="{ 'upload-hidden': isUploadHidden('environment_image') }">
<el-icon> <el-icon>
<Plus /> <Plus />
</el-icon> </el-icon>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
</div> </div>
<div v-show="active === 2">
<div class="from_box"> <el-form-item label="选择身份" prop="entity_type">
<div class="tit">营业信息</div>
<el-form-item label="主体类型" prop="entity_type">
<el-radio-group v-model="applyFormData.entity_type" @change="clearOtherFields"> <el-radio-group v-model="applyFormData.entity_type" @change="clearOtherFields">
<el-radio-button :value="1">企业</el-radio-button> <el-radio :value="1">企业</el-radio>
<el-radio-button :value="2">个人</el-radio-button> <el-radio :value="2">个人</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<div v-if="applyFormData.entity_type === 1"> <div v-if="applyFormData.entity_type === 1">
<el-form-item :label="getLabel('biz_license_image', 1)" prop="biz_license_image"> <!-- <el-form-item label="许可证类型" prop="license_type">
<el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true"
v-model="applyFormData.biz_license_image" :on-remove="(file, fileList) => handleRemove(file, fileList, 'biz_license_image')
" :on-success="(response, file, fileList) =>
handleUploadSuccess(response, file, fileList, 'biz_license_image')
" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl" name="upfile" :class="{
'upload-hidden': isUploadHidden('biz_license_image'),
}">
<el-icon>
<Plus />
</el-icon>
</el-upload>
</el-form-item>
<el-form-item label="公司名称" prop="biz_license_company">
<el-input v-model="applyFormData.biz_license_company" placeholder="请输入公司名称" />
</el-form-item>
<el-form-item label="法人姓名" prop="legal_person_name">
<el-input v-model="applyFormData.legal_person_name" placeholder="请输入法人姓名" />
</el-form-item>
<el-form-item label="注册号" prop="biz_license_number">
<el-input v-model="applyFormData.biz_license_number" placeholder="请输入注册号" />
</el-form-item>
<!-- <el-form-item label="法人手机号" prop="legal_person_mobile">
<el-input v-model="applyFormData.legal_person_mobile" placeholder="请输入法人手机号" />
</el-form-item> -->
<el-form-item label="许可证类型" prop="license_type">
<el-select v-model="applyFormData.license_type" value-key="" placeholder="请选择类型" clearable <el-select v-model="applyFormData.license_type" value-key="" placeholder="请选择类型" clearable
@change=""> @change="">
<el-option v-for="item in optionsPermitType" :key="item.value2" :label="item.label" <el-option v-for="item in optionsPermitType" :key="item.value2" :label="item.label"
@ -117,32 +91,56 @@
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="getLabel('license_image', 5)" prop="license_image" v-if="applyFormData.license_type!=1"> <el-form-item label="许可证编号" prop="license_number">
<el-upload ref="uploadRef" multiple :limit="5" list-type="picture-card" :auto-upload="true" <el-input v-model="applyFormData.license_number" placeholder="请输入许可证编号" />
v-model="applyFormData.license_image" :on-remove="(file, fileList) => handleRemove(file, fileList, 'license_image') </el-form-item> -->
" :on-success="(response, file, fileList) => <!-- <el-form-item label="营业执照编号" prop="biz_license_number">
handleUploadSuccess(response, file, fileList, 'license_image') <el-input v-model="applyFormData.biz_license_number" placeholder="请输入营业执照编号" />
" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl" name="upfile" </el-form-item> -->
:class="{ 'upload-hidden': isUploadHidden('license_image') }"> <el-form-item label="营业执照公司名" prop="biz_license_company">
<el-input v-model="applyFormData.biz_license_company" placeholder="请输入营业执照公司名" />
</el-form-item>
<el-form-item label="负责人姓名" prop="legal_person_name">
<el-input v-model="applyFormData.legal_person_name" placeholder="请输入负责人姓名" />
</el-form-item>
<!-- <el-form-item label="负责人手机号" prop="legal_person_mobile">
<el-input v-model="applyFormData.legal_person_mobile" placeholder="请输入法人手机号" />
</el-form-item> -->
<!-- <el-form-item label="负责身份证号" prop="legal_person_id_number">
<el-input v-model="applyFormData.legal_person_id_number" placeholder="请输入法人身份证号" />
</el-form-item> -->
<el-form-item :label="getLabel('biz_license_image', 1)" prop="biz_license_image">
<el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true"
v-model="applyFormData.biz_license_image"
:on-remove="(file, fileList) => handleRemove(file, fileList, 'biz_license_image')"
:on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'biz_license_image')"
:on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
name="upfile" :class="{ 'upload-hidden': isUploadHidden('biz_license_image') }">
<el-icon> <el-icon>
<Plus /> <Plus />
</el-icon> </el-icon>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<el-form-item :label="getLabel('license_image', 5)" prop="license_image">
<el-form-item label="许可证编号" prop="license_number" v-if="applyFormData.license_type!=1"> <el-upload ref="uploadRef" multiple :limit="5" list-type="picture-card" :auto-upload="true"
<el-input v-model="applyFormData.license_number" placeholder="请输入许可证编号" /> v-model="applyFormData.license_image"
:on-remove="(file, fileList) => handleRemove(file, fileList, 'license_image')"
:on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'license_image')"
:on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
name="upfile" :class="{ 'upload-hidden': isUploadHidden('license_image') }">
<el-icon>
<Plus />
</el-icon>
</el-upload>
</el-form-item> </el-form-item>
<!-- 法人身份证正反面 --> <!-- 法人身份证正反面 -->
<el-form-item :label="getLabel('legal_person_id_images', 1)" prop="legal_person_id_images"> <el-form-item :label="getLabel('legal_person_id_images', 1)" prop="legal_person_id_images">
<el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true" <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
v-model="applyFormData.legal_person_id_images" :on-remove="(file, fileList) => handleRemove(file, fileList, 'legal_person_id_images') v-model="applyFormData.legal_person_id_images"
" :on-success="(response, file, fileList) => :on-remove="(file, fileList) => handleRemove(file, fileList, 'legal_person_id_images')"
handleUploadSuccess(response, file, fileList, 'legal_person_id_images') :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'legal_person_id_images')"
" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl" name="upfile" :class="{ :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
'upload-hidden': isUploadHidden('legal_person_id_images'), name="upfile" :class="{ 'upload-hidden': isUploadHidden('legal_person_id_images') }">
}">
<el-icon class="avatar-uploader-icon"> <el-icon class="avatar-uploader-icon">
<Plus /> <Plus />
</el-icon> </el-icon>
@ -150,21 +148,16 @@
</el-form-item> </el-form-item>
<el-form-item :label="getLabel('legal_person_id_images2', 1)" prop="legal_person_id_images2"> <el-form-item :label="getLabel('legal_person_id_images2', 1)" prop="legal_person_id_images2">
<el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true" <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
v-model="applyFormData.legal_person_id_images2" :on-remove="(file, fileList) => v-model="applyFormData.legal_person_id_images2"
handleRemove(file, fileList, 'legal_person_id_images2') :on-remove="(file, fileList) => handleRemove(file, fileList, 'legal_person_id_images2')"
" :on-success="(response, file, fileList) => :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'legal_person_id_images2')"
handleUploadSuccess(response, file, fileList, 'legal_person_id_images2') :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl" name="upfile" :class="{ name="upfile" :class="{ 'upload-hidden': isUploadHidden('legal_person_id_images2') }">
'upload-hidden': isUploadHidden('legal_person_id_images2'),
}">
<el-icon class="avatar-uploader-icon"> <el-icon class="avatar-uploader-icon">
<Plus /> <Plus />
</el-icon> </el-icon>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<el-form-item label="法人身份证号码" prop="legal_person_id_number">
<el-input v-model="applyFormData.legal_person_id_number" placeholder="请输入法人身份证号码" />
</el-form-item>
</div> </div>
<div v-if="applyFormData.entity_type === 2"> <div v-if="applyFormData.entity_type === 2">
<el-form-item label="个人身份证号" prop="individual_id_number"> <el-form-item label="个人身份证号" prop="individual_id_number">
@ -173,12 +166,11 @@
<!-- 个人身份证正反面 --> <!-- 个人身份证正反面 -->
<el-form-item :label="getLabel('individual_id_images', 1)" prop="individual_id_images"> <el-form-item :label="getLabel('individual_id_images', 1)" prop="individual_id_images">
<el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true" <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
v-model="applyFormData.individual_id_images" :on-remove="(file, fileList) => handleRemove(file, fileList, 'individual_id_images') v-model="applyFormData.individual_id_images"
" :on-success="(response, file, fileList) => :on-remove="(file, fileList) => handleRemove(file, fileList, 'individual_id_images')"
handleUploadSuccess(response, file, fileList, 'individual_id_images') :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'individual_id_images')"
" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl" name="upfile" :class="{ :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
'upload-hidden': isUploadHidden('individual_id_images'), name="upfile" :class="{ 'upload-hidden': isUploadHidden('individual_id_images') }">
}">
<el-icon class="avatar-uploader-icon"> <el-icon class="avatar-uploader-icon">
<Plus /> <Plus />
</el-icon> </el-icon>
@ -187,12 +179,11 @@
<el-form-item :label="getLabel('individual_id_images2', 1)" prop="individual_id_images2"> <el-form-item :label="getLabel('individual_id_images2', 1)" prop="individual_id_images2">
<el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true" <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
v-model="applyFormData.individual_id_images2" :on-remove="(file, fileList) => handleRemove(file, fileList, 'individual_id_images2') v-model="applyFormData.individual_id_images2"
" :on-success="(response, file, fileList) => :on-remove="(file, fileList) => handleRemove(file, fileList, 'individual_id_images2')"
handleUploadSuccess(response, file, fileList, 'individual_id_images2') :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, 'individual_id_images2')"
" :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl" name="upfile" :class="{ :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
'upload-hidden': isUploadHidden('individual_id_images2'), name="upfile" :class="{ 'upload-hidden': isUploadHidden('individual_id_images2') }">
}">
<el-icon class="avatar-uploader-icon"> <el-icon class="avatar-uploader-icon">
<Plus /> <Plus />
</el-icon> </el-icon>
@ -200,9 +191,7 @@
</el-form-item> </el-form-item>
</div> </div>
</div> </div>
<div v-show="active === 3">
<div class="from_box">
<div class="tit">结算信息</div>
<el-form-item label="账户姓名" prop="account_holder_name"> <el-form-item label="账户姓名" prop="account_holder_name">
<el-input v-model="applyFormData.account_holder_name" /> <el-input v-model="applyFormData.account_holder_name" />
</el-form-item> </el-form-item>
@ -210,7 +199,8 @@
<el-input v-model="applyFormData.account_number" /> <el-input v-model="applyFormData.account_number" />
</el-form-item> </el-form-item>
<el-form-item label="开户银行" prop="bank_name"> <el-form-item label="开户银行" prop="bank_name">
<el-select v-model="applyFormData.bank_name" placeholder="请选择银行" size="large" style="width: 240px"> <el-select v-model="applyFormData.bank_name" placeholder="请选择银行" size="large"
style="width: 240px">
<el-option v-for="bank in bankList2" :key="bank.id" :label="bank.bank_name" <el-option v-for="bank in bankList2" :key="bank.id" :label="bank.bank_name"
:value="bank.bank_name" /> :value="bank.bank_name" />
</el-select> </el-select>
@ -220,136 +210,109 @@
</el-form-item> </el-form-item>
</div> </div>
</el-form> </el-form>
</div> <div class="form-button">
<el-button v-if="active > 1" style="margin-top: 12px" @click="pre" class="custom-button">上一步</el-button>
<div class="form-button"> <el-button v-if="active < 3" style="margin-top: 12px;float: right;" @click="next"
<el-button type="primary" @click="merchToApply" class="custom-button">提交审核</el-button> class="custom-button">下一步</el-button>
<el-button v-if="active === 3" style="margin-top: 12px;float: right;" @click="merchToApply"
class="custom-button">提交</el-button>
</div>
</div> </div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, reactive, onMounted, watch } from "vue"; import { ref, reactive, onMounted, watch } from 'vue'
import cityData from "../../stores/cityData"; import cityData from '../../stores/cityData';
import type { CityDataStructure } from "../../stores/cityData"; import type { CityDataStructure } from '../../stores/cityData';
import { ElMessage } from "element-plus"; import { ElMessage } from 'element-plus';
import { useUserStore } from "@/stores/userStore"; import { useUserStore } from '@/stores/userStore';
import { Plus } from "@element-plus/icons-vue"; import { Plus } from '@element-plus/icons-vue'
import { import { GetStoreCategories, transformStoreCategories, GetPostion, GetBank, merchApply, GetAppDistrict } from '@/api/login';
GetStoreCategories,
transformStoreCategories,
GetPostion,
GetBank,
merchApply,
GetAppDistrict,
} from "@/api/login";
const active = ref(1); const active = ref(1);
const formRef = ref(null); const formRef = ref(null);
const applyFormData = reactive({ const applyFormData = reactive({
bank_name: "", bank_name: '',
bank_branch_name: "", bank_branch_name: '',
account_number: "", account_number: '',
account_holder_name: "", account_holder_name: '',
biz_category: null, biz_category: null,
biz_license_company: "", biz_license_company: '',
biz_license_image: "", biz_license_image: '',
biz_license_number: "", biz_license_number: '',
biz_second_category: null, biz_second_category: null,
city_id: null, city_id: null,
contact_name: "", contact_name: '',
county_id: null, county_id: null,
entity_type: 1, entity_type: 1,
environment_image: "", environment_image: '',
front_facade_image: "", front_facade_image: '',
individual_id_images: "", individual_id_images: '',
individual_id_images2: "", individual_id_images2: '',
individual_id_number: "", individual_id_number: '',
legal_person_id_images: "", legal_person_id_images: '',
legal_person_id_images2: "", legal_person_id_images2: '',
legal_person_id_number: "", legal_person_id_number: '',
legal_person_mobile: "", legal_person_mobile: '',
legal_person_name: "", legal_person_name: '',
license_image: [], license_image: [],
license_number: "", license_number: '',
license_type: "1", license_type: null,
login_mobile: localStorage.getItem("mobilePhone"), login_mobile: localStorage.getItem("mobilePhone"),
province_id: null, province_id: null,
store_address: "", store_address: '',
map_address: "", map_address: '',
position: "", position: '',
store_latitude: null, store_latitude: null,
store_longitude: null, store_longitude: null,
store_name: "", store_name: '',
mapAddressLabel: "", mapAddressLabel: '',
license_imageToString: "", license_imageToString: '',
store_area: "", user_status: ''
user_status: "",
}); });
const optionsPermitType = [ const optionsPermitType = [
{ {
value2: "1", value2: '1',
label: "无需特殊资质", label: '许可证',
}, },
{ {
value2: "2", value2: '2',
label: "需许可证资质", label: '特许证件',
}, },
{ {
value2: "3", value2: '3',
label: "需特许证件资质", label: '其他证件',
}, }
]; ]
const rules = reactive({ const rules = reactive({
contact_name: [{ required: true, message: "请输入联系人姓名", trigger: "blur" }], contact_name: [{ required: true, message: '请输入联系人姓名', trigger: 'blur' }],
biz_category: [{ required: true, message: "请选择经营品类", trigger: "change" }], biz_category: [{ required: true, message: '请选择经营品类', trigger: 'change' }],
store_name: [{ required: true, message: "请输入门店名称", trigger: "blur" }], store_name: [{ required: true, message: '请输入门店名称', trigger: 'blur' }],
map_address: [{ required: true, message: "请选择地图地址", trigger: "change" }], map_address: [{ required: true, message: '请选择地图地址', trigger: 'change' }],
position: [{ required: true, message: "请选择地图地址", trigger: "change" }], position: [{ required: true, message: '请选择地图地址', trigger: 'change' }],
store_address: [{ required: true, message: "请输入详细地址", trigger: "blur" }], store_address: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
front_facade_image: [ front_facade_image: [{ required: true, message: '请上传门脸图', trigger: 'change' }],
{ required: true, message: "请上传门脸图", trigger: ["change", "blur"] }, environment_image: [{ required: true, message: '请上传环境图', trigger: 'change' }],
], entity_type: [{ required: true, message: '请选择身份', trigger: 'change' }],
environment_image: [ license_type: [{ required: true, message: '请选择许可证类型', trigger: 'change' }],
{ required: true, message: "请上传环境图", trigger: ["change", "blur"] }, license_number: [{ required: true, message: '请输入许可证编号', trigger: 'blur' }],
], biz_license_number: [{ required: true, message: '请输入营业执照编号', trigger: 'blur' }],
entity_type: [{ required: true, message: "请主体类型", trigger: "change" }], biz_license_company: [{ required: true, message: '请输入营业执照公司名', trigger: 'blur' }],
// license_type: [{ required: true, message: "请选择许可证类型", trigger: "change" }], legal_person_name: [{ required: true, message: '请输入负责人姓名', trigger: 'blur' }],
// license_number: [{ required: true, message: "请输入许可证编号", trigger: "blur" }], legal_person_mobile: [{ required: true, message: '请输入负责人手机号', trigger: 'blur' }],
biz_license_number: [ legal_person_id_number: [{ required: true, message: '请输入负责人身份证号', trigger: 'blur' }],
{ required: true, message: "请输入注册号", trigger: "blur" }, biz_license_image: [{ required: true, message: '请上传营业执照', trigger: 'change' }],
],
biz_license_company: [
{ required: true, message: "请输入公司名称", trigger: "blur" },
],
legal_person_name: [{ required: true, message: "请输入法人姓名", trigger: "blur" }],
legal_person_mobile: [
{ required: true, message: "请输入法人手机号", trigger: "blur" },
],
legal_person_id_number: [
{ required: true, message: "请输入法人身份证号", trigger: "blur" },
],
biz_license_image: [{ required: true, message: "请上传营业执照", trigger: "change" }],
// license_image: [{ required: true, message: '请上传许可证', trigger: 'change' }], // license_image: [{ required: true, message: '请上传许可证', trigger: 'change' }],
legal_person_id_images: [ legal_person_id_images: [{ required: true, message: '请上传负责人身份证正面', trigger: 'change' }],
{ required: true, message: "请上传法人身份证正面", trigger: "change" }, legal_person_id_images2: [{ required: true, message: '请上传负责人身份证反面', trigger: 'change' }],
], individual_id_number: [{ required: true, message: '请输入个人身份证号', trigger: 'blur' }],
legal_person_id_images2: [ individual_id_images: [{ required: true, message: '请上传个人身份证正面', trigger: 'change' }],
{ required: true, message: "请上传法人身份证反面", trigger: "change" }, individual_id_images2: [{ required: true, message: '请上传个人身份证反面', trigger: 'change' }],
], bank_name: [{ required: true, message: '请选择银行', trigger: 'change' }],
individual_id_number: [
{ required: true, message: "请输入个人身份证号", trigger: "blur" },
],
individual_id_images: [
{ required: true, message: "请上传个人身份证正面", trigger: "change" },
],
individual_id_images2: [
{ required: true, message: "请上传个人身份证反面", trigger: "change" },
],
bank_name: [{ required: true, message: "请选择银行", trigger: "change" }],
// bank_branch_name: [{ required: true, message: '请输入支行名称', trigger: 'blur' }], // bank_branch_name: [{ required: true, message: '请输入支行名称', trigger: 'blur' }],
account_number: [{ required: true, message: "请输入收款账户号码", trigger: "blur" }], account_number: [{ required: true, message: '请输入收款账户号码', trigger: 'blur' }],
account_holder_name: [{ required: true, message: "请输入账户姓名", trigger: "blur" }], account_holder_name: [{ required: true, message: '请输入账户姓名', trigger: 'blur' }]
}); });
const checkForm = async () => { const checkForm = async () => {
@ -359,6 +322,8 @@ const checkForm = async () => {
if (isValid) { if (isValid) {
console.log("可以通过"); console.log("可以通过");
} else {
ElMessage.error('请完善当前页面的表单信息');
} }
}; };
@ -369,9 +334,9 @@ const next = () => {
top: 0, //回到顶部 top: 0, //回到顶部
left: 0, left: 0,
behavior: "smooth", behavior: "smooth",
}); })
} }
}; }
const pre = () => { const pre = () => {
if (active.value > 1) { if (active.value > 1) {
active.value--; active.value--;
@ -379,23 +344,23 @@ const pre = () => {
top: 0, //回到顶部 top: 0, //回到顶部
left: 0, left: 0,
behavior: "smooth", behavior: "smooth",
}); })
} }
}; };
const getLabel = (field: string, limit: number) => { const getLabel = (field: string, limit: number) => {
const labels = { const labels = {
front_facade_image: "门脸图", front_facade_image: '门脸图',
environment_image: "环境图", environment_image: '环境图',
biz_license_image: "营业执照", biz_license_image: '营业执照',
license_image: "许可证", license_image: '许可证',
legal_person_id_images: "法人身份证正面", legal_person_id_images: '负责人身份证正面',
legal_person_id_images2: "法人身份证反面", legal_person_id_images2: '负责人身份证反面',
individual_id_images: "身份证正面", individual_id_images: '个人身份证正面',
individual_id_images2: "身份证反面", individual_id_images2: '个人身份证反面'
}; };
if (field === "license_image") { if (field === 'license_image') {
return `${labels[field]}(${applyFormData[field].length}/${limit})`; return `${labels[field]}(${applyFormData[field].length}/${limit})`;
} else { } else {
const count = applyFormData[field] ? 1 : 0; const count = applyFormData[field] ? 1 : 0;
@ -405,19 +370,17 @@ const getLabel = (field: string, limit: number) => {
const userStore = useUserStore(); const userStore = useUserStore();
const showAll = () => { const showAll = () => {
applyFormData.license_imageToString = applyFormData.license_image applyFormData.license_imageToString = applyFormData.license_image.map(url => `${url}`).join(',');
.map((url) => `${url}`)
.join(",");
}; };
const merchToApply = async () => { const merchToApply = async () => {
showAll(); showAll();
checkForm(); checkForm();
const res = await merchApply(applyFormData); const res = await merchApply(applyFormData);
if (res && res.status === 200) { if (res && res.data.status === 200) {
// ElMessage.success('成功入驻'); // ElMessage.success('成功入驻');
location.reload(); location.reload()
console.log("成功入驻", res); console.log('成功入驻', res);
} else { } else {
console.log(res.data); console.log(res.data);
@ -434,13 +397,13 @@ const processData = () => {
...province, ...province,
children: cityList[provinceIndex].map((city, cityIndex) => { children: cityList[provinceIndex].map((city, cityIndex) => {
const cityItem = { const cityItem = {
...city, ...city
}; };
if (areaData[provinceIndex] && areaData[provinceIndex][cityIndex]) { if (areaData[provinceIndex] && areaData[provinceIndex][cityIndex]) {
cityItem.children = areaData[provinceIndex][cityIndex]; cityItem.children = areaData[provinceIndex][cityIndex];
} }
return cityItem; return cityItem;
}), })
}; };
return provinceItem; return provinceItem;
}); });
@ -452,10 +415,10 @@ const cityData2 = ref<CityDataStructure>();
const cascaderOptions3 = ref(); const cascaderOptions3 = ref();
//hover触发选择 //hover触发选择
const cascaderProps = ref({ const cascaderProps = ref({
value: "value", value: 'value',
label: "label", label: 'label',
children: "children", children: 'children',
expandTrigger: "hover" as const, expandTrigger: 'hover' as const
}); });
const handleChangeBizCategory = (value) => { const handleChangeBizCategory = (value) => {
@ -473,77 +436,63 @@ interface Bank {
const bankList2 = ref<Bank[]>([]); const bankList2 = ref<Bank[]>([]);
onMounted(() => { onMounted(() => {
GetStoreCategories() GetStoreCategories().then(res => {
.then((res) => { if (res.data.code === 0 && res.data.status === 200) {
if (res.code === 0 && res.status === 200) { cascaderOptions.value = transformStoreCategories(res.data.data);
cascaderOptions.value = transformStoreCategories(res.data); } else {
} else {
}
})
.catch((err) => {
ElMessage.error("获取店铺分类失败");
});
GetBank({ }
keyword: "中国工商银行桂平", // 银行名称关键字,小地方支行，查不到，调整关键字范围，尝试市级银行 }).catch(err => {
pageNum: 1, ElMessage.error('获取店铺分类失败');
pageSize: 10, });
})
.then((res) => { GetBank().then(res => {
if (res.code === 0 && res.status === 200) { if (res.data.code === 0 && res.data.status === 200) {
bankList2.value = res.data; bankList2.value = res.data.data;
} else { } else {
ElMessage.error("获取银行失败"); ElMessage.error('获取银行失败');
} }
}) }).catch(err => {
.catch((err) => { ElMessage.error('获取银行失败');
ElMessage.error("获取银行失败"); });
});
GetAppDistrict().then(res => {
if (res.data.code === 0 && res.data.status === 200) {
cityData2.value = res.data.data;
console.log(cascaderOptions3.value);
} else {
ElMessage.error('获取银行失败');
}
}).catch(err => {
ElMessage.error('获取银行失败');
});
GetAppDistrict()
.then((res) => {
if (res.code === 0 && res.status === 200) {
cityData2.value = res.data;
console.log(cascaderOptions3.value);
} else {
ElMessage.error("获取银行失败");
}
})
.catch((err) => {
ElMessage.error("获取银行失败");
});
}); });
const handleChange = (value) => { const handleChange = (value) => {
// 假设 cascader 的值是一个数组，格式为 [省份ID, 城市ID, 区县ID] // 假设 cascader 的值是一个数组，格式为 [省份ID, 城市ID, 区县ID]
console.log(11, value);
if (value && value.length === 3) { if (value && value.length === 3) {
const [provinceId, cityId, countyId] = value; const [provinceId, cityId, countyId] = value;
applyFormData.province_id = provinceId; applyFormData.province_id = provinceId;
applyFormData.city_id = cityId; applyFormData.city_id = cityId;
applyFormData.county_id = countyId; applyFormData.county_id = countyId;
// // 获取区县名称（可选）
// const targetOption2 = cascaderOptions2.value
// .flatMap(province => province.children)
// .flatMap(city => city.children)
// .find(county => county.value === countyId);
// const label2 = targetOption?.label || '';
// applyFormData.mapAddressLabel2 = label2;
//找市
const targetOption = cascaderOptions2.value
.flatMap(province => province.children)
.find(city => city.value === cityId)
const label = targetOption?.label || '';
applyFormData.mapAddressLabel = label;
} }
const names = value.map((id, level) => {
const findName = (options, targetId) => {
for (const item of options) {
if (item.value === targetId) {
return item.label;
}
if (item.children) {
const childName = findName(item.children, targetId);
if (childName) return childName;
}
}
return "";
};
return findName(cascaderOptions2.value, id);
});
applyFormData.mapAddressLabel = names?.join("/");
applyFormData.store_area = names?.join("/");
}; };
const autocompleteOptions = ref([]); const autocompleteOptions = ref([]);
@ -558,86 +507,83 @@ const querySearch = async (queryString, cb) => {
query: queryString, query: queryString,
region: applyFormData.mapAddressLabel, region: applyFormData.mapAddressLabel,
city_limit: true, city_limit: true,
ret_coordtype: "gcj02ll", ret_coordtype: 'gcj02ll'
}; };
const res = await GetPostion(params); const response = await GetPostion(params);
console.log(res); console.log("这是response", response);
if (res?.result?.length) { if (response.status === 200 && response.data.message === 'ok') {
const results = res.result const results = response.data.result
.filter((item) => "location" in item) .filter(item => "location" in item)
.map((item) => ({ .map(item => ({
value: item.name, // 确保有 value 属性 value: item.name, // 确保有 value 属性
label: item.name, // 确保有 label 属性 label: item.name, // 确保有 label 属性
name: item.name, name: item.name,
address: item.address || "", // 确保 address 属性存在 address: item.address || '', // 确保 address 属性存在
lat: item.location?.lat || "", // 确保 lat 属性存在 lat: item.location?.lat || '', // 确保 lat 属性存在
lng: item.location?.lng || "", // 确保 lng 属性存在 lng: item.location?.lng || '' // 确保 lng 属性存在
})); }));
cb(results); cb(results);
} else { } else {
ElMessage.error("搜索失败"); ElMessage.error('搜索失败');
cb([]); cb([]);
} }
} catch (error) { } catch (error) {
ElMessage.error("搜索失败"); ElMessage.error('搜索失败');
cb([]); cb([]);
} }
}; };
const handleSelect = (item) => { const handleSelect = (item) => {
applyFormData.position = item.value; applyFormData.position = item.value;
applyFormData.store_address = item.value;
applyFormData.store_address = item.value;
formRef.value.validate();
console.log(item.value); console.log(item.value);
applyFormData.store_latitude = item.lat; applyFormData.store_latitude = item.lat;
applyFormData.store_longitude = item.lng; applyFormData.store_longitude = item.lng;
}; };
const beforeUpload = (file) => { const beforeUpload = (file) => {
const isJPG = file.type === "image/jpeg"; const isJPG = file.type === 'image/jpeg';
const isPNG = file.type === "image/png"; const isPNG = file.type === 'image/png';
const isLt2M = file.size / 1024 / 1024 < 2; const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG && !isPNG) { if (!isJPG && !isPNG) {
ElMessage.error("上传的图片必须是JPG或PNG格式！"); ElMessage.error('上传的图片必须是JPG或PNG格式！');
return false; return false;
} }
if (!isLt2M) { if (!isLt2M) {
ElMessage.error("上传的图片大小不能超过2MB！"); ElMessage.error('上传的图片大小不能超过2MB！');
return false; return false;
} }
return true; return true;
}; };
const uploadUrl = ref("https://mall.gpxscs.cn/mobile/shop/oss/upload"); const uploadUrl = ref('https://mall.gpxscs.cn/mobile/shop/oss/upload');
const handleRemove = (file, fileList, field) => { const handleRemove = (file, fileList, field) => {
if (field === "license_image") { if (field === 'license_image') {
const removedUrl = file.url; const removedUrl = file.url;
applyFormData[field] = applyFormData[field].filter((url) => url !== removedUrl); applyFormData[field] = applyFormData[field].filter(url => url !== removedUrl);
} else { } else {
applyFormData[field] = ""; applyFormData[field] = '';
} }
}; };
const isUploadHidden = (field: string) => { const isUploadHidden = (field: string) => {
const limits = { const limits = {
license_image: 5, license_image: 5
}; };
const limit = limits[field] || 1; const limit = limits[field] || 1;
if (field === "license_image") { if (field === 'license_image') {
return applyFormData[field].length >= limit; return applyFormData[field].length >= limit;
} else { } else {
return applyFormData[field] !== "" && applyFormData[field] != null; return applyFormData[field] !== '' && applyFormData[field] != null;
} }
}; };
const handleExceed = (files, fileList) => { const handleExceed = (files, fileList) => {
ElMessage.warning(`最多只能上传1张图片`); ElMessage.warning('最多只能上传5张图片');
}; };
const handleUploadSuccess = (response, file, fileList, field) => { const handleUploadSuccess = (response, file, fileList, field) => {
@ -645,72 +591,55 @@ const handleUploadSuccess = (response, file, fileList, field) => {
if (response.data && response.data.url) { if (response.data && response.data.url) {
file.url = response.data.url; file.url = response.data.url;
if (field === "license_image") { if (field === 'license_image') {
applyFormData[field].push(file.url); applyFormData[field].push(file.url);
} else { } else {
applyFormData[field] = file.url; applyFormData[field] = file.url;
} }
formRef.value.validate();
} else { } else {
ElMessage.error("文件上传成功，但未返回文件 URL"); ElMessage.error('文件上传成功，但未返回文件 URL');
} }
} else { } else {
ElMessage.error(response.msg || "文件上传失败"); ElMessage.error(response.msg || '文件上传失败');
} }
}; };
const handleUploadError = (error, file) => { const handleUploadError = (error, file) => {
ElMessage.error("文件上传失败"); ElMessage.error('文件上传失败');
}; };
const clearOtherFields = () => { const clearOtherFields = () => {
if (applyFormData.entity_type === 1) { if (applyFormData.entity_type === 1) {
// 清空个人部分的字段 // 清空个人部分的字段
applyFormData.individual_id_number = ""; applyFormData.individual_id_number = '';
applyFormData.individual_id_images = ""; applyFormData.individual_id_images = '';
applyFormData.individual_id_images2 = ""; applyFormData.individual_id_images2 = '';
} else if (applyFormData.entity_type === 2) { } else if (applyFormData.entity_type === 2) {
// 清空企业部分的字段 // 清空企业部分的字段
applyFormData.license_type = null; applyFormData.license_type = null;
applyFormData.license_number = ""; applyFormData.license_number = '';
applyFormData.biz_license_number = ""; applyFormData.biz_license_number = '';
applyFormData.biz_license_company = ""; applyFormData.biz_license_company = '';
applyFormData.legal_person_name = ""; applyFormData.legal_person_name = '';
applyFormData.legal_person_mobile = ""; applyFormData.legal_person_mobile = '';
applyFormData.legal_person_id_number = ""; applyFormData.legal_person_id_number = '';
applyFormData.biz_license_image = ""; applyFormData.biz_license_image = '';
applyFormData.license_image = []; applyFormData.license_image = [];
applyFormData.legal_person_id_images = ""; applyFormData.legal_person_id_images = '';
applyFormData.legal_person_id_images2 = ""; applyFormData.legal_person_id_images2 = '';
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss">
:deep(.el-upload--picture-card),
:deep(.el-upload-list__item) {
width: 96px;
height: 96px;
}
.signUp-container { .signUp-container {
display: flex; display: flex;
padding-top: 12px; padding: 30px 0px;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: #eee;
.tit {
font-size: 16px;
margin-bottom: 15px;
}
.steps-container { .steps-container {
width: 50%; width: 60%;
padding: 15px;
border-radius: 5px;
background: #fff;
margin-bottom: 12px;
} }
:deep(.upload-hidden .el-upload--picture-card) { :deep(.upload-hidden .el-upload--picture-card) {
@ -718,26 +647,7 @@ const clearOtherFields = () => {
} }
.form-submit { .form-submit {
width: 50%; padding: 20px 0;
:deep(.el-form) {
max-width: 100% !important;
}
.from_box {
width: 100%;
padding: 15px;
margin: 0 0 12px;
border-radius: 5px;
background: #fff;
}
}
.form-button {
width: 100%;
text-align: center;
padding: 20px;
background: #fff;
} }
} }
@ -752,20 +662,16 @@ const clearOtherFields = () => {
} }
} }
.el-form-item {
label {
width: 126px !important;
}
}
@media (max-width: 768px) { @media (max-width: 768px) {
.el-cascader-menu { .el-cascader-menu {
width: 120px; width: 120px;
min-width: 120px; min-width: 120px;
} }
.signUp-container {
.steps-container {
width: 100%;
}
.form-submit {
width: 100%;
}
}
} }
</style> </style>

2
vite.config.ts
View File

@ -16,7 +16,7 @@ export default defineConfig({
// base:'./', // base:'./',
plugins: [ plugins: [
vue(), vue(),
// vueDevTools(), vueDevTools(),
AutoImport({ AutoImport({
resolvers: [ElementPlusResolver()], resolvers: [ElementPlusResolver()],
}), }),