update: 引入element-plus-icon ; PS处理静态图片减少10倍大小;商家入驻和登录弹窗UI优化并添加弹窗内的快捷互相跳转弹窗;右下角悬浮框UI优化;顶部导航高亮状态添加;驳回申请开店调试;
3
package-lock.json
generated
@ -560,9 +560,8 @@
|
|||||||
},
|
},
|
||||||
"node_modules/@element-plus/icons-vue": {
|
"node_modules/@element-plus/icons-vue": {
|
||||||
"version": "2.3.1",
|
"version": "2.3.1",
|
||||||
"resolved": "https://registry.npmmirror.com/@element-plus/icons-vue/-/icons-vue-2.3.1.tgz",
|
"resolved": "https://mirrors.tencent.com/npm/@element-plus/icons-vue/-/icons-vue-2.3.1.tgz",
|
||||||
"integrity": "sha512-XxVUZv48RZAd87ucGS48jPf6pKu0yV5UCg9f4FFwtrYxXOwWuVJo6wOvSLKEoMQKjv8GsX/mhP6UsC1lRwbUWg==",
|
"integrity": "sha512-XxVUZv48RZAd87ucGS48jPf6pKu0yV5UCg9f4FFwtrYxXOwWuVJo6wOvSLKEoMQKjv8GsX/mhP6UsC1lRwbUWg==",
|
||||||
"license": "MIT",
|
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"vue": "^3.2.0"
|
"vue": "^3.2.0"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -5,7 +5,7 @@
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
:root {
|
:root {
|
||||||
--bgcolor: #387197;
|
--bgcolor: #409eff;
|
||||||
}
|
}
|
||||||
|
|
||||||
html{
|
html{
|
||||||
@ -133,11 +133,14 @@ html{
|
|||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
/* 伪元素添加下滑选中线 */
|
/* 伪元素添加下滑选中线 */
|
||||||
.header-menu li:hover span{
|
.header-menu li:hover span,
|
||||||
|
.header-menu .router-link-active span
|
||||||
|
{
|
||||||
color: var(--bgcolor);
|
color: var(--bgcolor);
|
||||||
}
|
}
|
||||||
/*TODO 记得搞一个导航active的*/
|
/*TODO 记得搞一个导航active的*/
|
||||||
.header-menu li::before {
|
.header-menu li::before
|
||||||
|
{
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0px;
|
bottom: 0px;
|
||||||
@ -148,7 +151,9 @@ html{
|
|||||||
transition: all 0.2s;
|
transition: all 0.2s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header-menu li:hover::before {
|
.header-menu li:hover::before,
|
||||||
|
.header-menu .router-link-active li::before
|
||||||
|
{
|
||||||
content: "";
|
content: "";
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 1.2 MiB After Width: | Height: | Size: 197 KiB |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 132 KiB |
|
Before Width: | Height: | Size: 1.7 MiB After Width: | Height: | Size: 128 KiB |
|
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 105 KiB |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 111 KiB |
|
Before Width: | Height: | Size: 1.4 MiB After Width: | Height: | Size: 113 KiB |
|
Before Width: | Height: | Size: 1.5 MiB After Width: | Height: | Size: 100 KiB |
|
Before Width: | Height: | Size: 282 KiB After Width: | Height: | Size: 48 KiB |
|
Before Width: | Height: | Size: 346 KiB After Width: | Height: | Size: 64 KiB |
|
Before Width: | Height: | Size: 336 KiB After Width: | Height: | Size: 62 KiB |
BIN
src/assets/image/about/xiaofa_ppt4-.jpg
Normal file
|
After Width: | Height: | Size: 67 KiB |
|
Before Width: | Height: | Size: 1.5 MiB After Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 1.4 MiB After Width: | Height: | Size: 53 KiB |
|
Before Width: | Height: | Size: 2.2 MiB After Width: | Height: | Size: 77 KiB |
|
Before Width: | Height: | Size: 1.5 MiB After Width: | Height: | Size: 46 KiB |
|
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 51 KiB |
BIN
src/assets/image/company/copyright.jpg
Normal file
|
After Width: | Height: | Size: 65 KiB |
|
Before Width: | Height: | Size: 571 KiB |
|
Before Width: | Height: | Size: 241 KiB After Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 93 KiB |
|
Before Width: | Height: | Size: 2.3 MiB After Width: | Height: | Size: 71 KiB |
|
Before Width: | Height: | Size: 93 KiB |
|
Before Width: | Height: | Size: 2.4 MiB After Width: | Height: | Size: 57 KiB |
@ -7,8 +7,8 @@
|
|||||||
<Footer/>
|
<Footer/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Login :isVisible="showLoginForm" @close-login-form="showLoginForm = false" />
|
<Login :isVisible="showLoginForm" @open-register-form="showRegisterForm = true" @close-login-form="showLoginForm = false" />
|
||||||
<Register :isVisible="showRegisterForm" @close-register-form="showRegisterForm = false" />
|
<Register :isVisible="showRegisterForm" @open-login-form="showLoginForm = true" @close-register-form="showRegisterForm = false" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
|||||||
@ -1,18 +1,4 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- <div class="floating-menu" @click="handleClick">
|
|
||||||
<div class="menu-item-wrapper">
|
|
||||||
<el-button class="menu-item" type="primary" @click="showPhone =!showPhone">官方客服</el-button>
|
|
||||||
<div v-show="showPhone" class="phone-popup">
|
|
||||||
<div class="phone-popup-content">
|
|
||||||
<div class="code">
|
|
||||||
<img src="../assets/image/xiaofa_logo.png" alt="">
|
|
||||||
</div>
|
|
||||||
<p>电话:17777525395</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<el-button class="menu-item" type="primary" @click="navigateTo('feedback')">意见反馈</el-button>
|
|
||||||
</div> -->
|
|
||||||
<div class="floating-menu-mobile" @click="handleClick">
|
<div class="floating-menu-mobile" @click="handleClick">
|
||||||
<div class="customer-serve">
|
<div class="customer-serve">
|
||||||
<i class="iconfont icon-kefu" @click="showPhone = !showPhone"></i>
|
<i class="iconfont icon-kefu" @click="showPhone = !showPhone"></i>
|
||||||
@ -144,8 +130,9 @@ onUnmounted(() => {
|
|||||||
bottom: 20%;
|
bottom: 20%;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
background: white;
|
background: #ffffff;
|
||||||
border-radius: 20%;
|
border-radius: 10px;
|
||||||
|
box-shadow: 0px 1px 10px rgba(0,0,0,.2);
|
||||||
|
|
||||||
.customer-serve {
|
.customer-serve {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
|
|||||||
@ -1,243 +1,278 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="login-box" v-if="isVisible">
|
<div class="login-box" v-if="isVisible">
|
||||||
<el-form :model="formData" :rules="rules" ref="formRef" label-width="120px" :hide-required-asterisk="true">
|
<el-form
|
||||||
<div class="login-container">
|
:model="formData"
|
||||||
<div class="login-close" @click="closeLoginForm">
|
:rules="rules"
|
||||||
×
|
ref="formRef"
|
||||||
</div>
|
label-width="88px"
|
||||||
<h4>登录</h4>
|
:hide-required-asterisk="true"
|
||||||
<div class="passwordLogin">
|
>
|
||||||
<div class="login-phone">
|
<div class="login-container">
|
||||||
<el-form-item label="账号" prop="phoneNumber">
|
<div class="login-close" @click="closeLoginForm">
|
||||||
<el-input v-model="formData.phoneNumber" placeholder="请输入账号" />
|
<el-icon color="#333" size="24" class="btn_close"><Close /></el-icon>
|
||||||
</el-form-item>
|
</div>
|
||||||
</div>
|
<h4>欢迎登录</h4>
|
||||||
<div class="login_password">
|
<div class="passwordLogin">
|
||||||
<el-form-item label="密码" prop="password">
|
<div class="login-phone">
|
||||||
<el-input type="password" v-model="formData.password" placeholder="请输入密码" />
|
<el-form-item label="账号" prop="phoneNumber">
|
||||||
</el-form-item>
|
<el-input
|
||||||
</div>
|
size="large"
|
||||||
<div class="pic_verifyCode">
|
v-model="formData.phoneNumber"
|
||||||
<el-form-item label="验证码" prop="captchaCode">
|
placeholder="请输入账号"
|
||||||
<el-input type="text" v-model="formData.captchaCode" placeholder="请输入验证码" maxlength="4"/>
|
/>
|
||||||
<img :src="captchaUrl" alt="验证码" @click="refreshCaptcha">
|
</el-form-item>
|
||||||
</el-form-item>
|
</div>
|
||||||
</div>
|
<div class="login_password">
|
||||||
<el-button type="primary" @click="handleLogin">登录</el-button>
|
<el-form-item label="密码" prop="password">
|
||||||
<p>注:未入驻的账号请开店入驻成功后再继续</p>
|
<el-input
|
||||||
</div>
|
size="large"
|
||||||
</div>
|
type="password"
|
||||||
</el-form>
|
v-model="formData.password"
|
||||||
</div>
|
placeholder="请输入密码"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
<div class="pic_verifyCode">
|
||||||
|
<el-form-item label="验证码" prop="captchaCode">
|
||||||
|
<el-input
|
||||||
|
size="large"
|
||||||
|
type="text"
|
||||||
|
v-model="formData.captchaCode"
|
||||||
|
placeholder="请输入验证码"
|
||||||
|
maxlength="4"
|
||||||
|
>
|
||||||
|
<template #append>
|
||||||
|
<img class="captcha" :src="captchaUrl" alt="验证码" @click="refreshCaptcha" />
|
||||||
|
</template>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
<div class="foot">
|
||||||
|
<el-button class="btn_sumit" size="large" round type="primary" @click="handleLogin">登录</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="tool">
|
||||||
|
没有账号?
|
||||||
|
<el-button
|
||||||
|
class="btn_sumit"
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="openRegisterForm"
|
||||||
|
>立即入驻</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, defineProps, defineEmits, watch, onMounted, onUnmounted } from 'vue';
|
import {
|
||||||
import { useUserStore } from '@/stores/userStore';
|
ref,
|
||||||
import { useRouter } from 'vue-router';
|
defineProps,
|
||||||
import { GetLogin, GetSmsCode, GetVerifyCode, GetAccountLogin } from '@/api/login';
|
defineEmits,
|
||||||
import { ElMessage } from 'element-plus/es';
|
watch,
|
||||||
|
onMounted,
|
||||||
|
onUnmounted,
|
||||||
|
} from "vue";
|
||||||
|
import { useUserStore } from "@/stores/userStore";
|
||||||
|
import { useRouter } from "vue-router";
|
||||||
|
import {
|
||||||
|
GetLogin,
|
||||||
|
GetSmsCode,
|
||||||
|
GetVerifyCode,
|
||||||
|
GetAccountLogin,
|
||||||
|
} from "@/api/login";
|
||||||
|
import { ElMessage } from "element-plus/es";
|
||||||
|
import { Close } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
isVisible: {
|
isVisible: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false,
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
const emits = defineEmits(['close-login-form']);
|
const emits = defineEmits(["open-register-form", "close-login-form"]);
|
||||||
|
|
||||||
const formData = ref({
|
const formData = ref({
|
||||||
phoneNumber: '',
|
phoneNumber: "",
|
||||||
password: '',
|
password: "",
|
||||||
captchaCode: ''
|
captchaCode: "",
|
||||||
});
|
});
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const verify_token = ref();
|
const verify_token = ref();
|
||||||
const captchaUrl = ref('');
|
const captchaUrl = ref("");
|
||||||
const formRef = ref<InstanceType<typeof import('element-plus/es')['ElForm']>>();
|
const formRef = ref<InstanceType<typeof import("element-plus/es")["ElForm"]>>();
|
||||||
|
|
||||||
const closeLoginForm = () => {
|
const closeLoginForm = () => {
|
||||||
emits('close-login-form');
|
emits("close-login-form");
|
||||||
|
};
|
||||||
|
|
||||||
|
const openRegisterForm = () => {
|
||||||
|
closeLoginForm()
|
||||||
|
emits('open-register-form');
|
||||||
};
|
};
|
||||||
|
|
||||||
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) {
|
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 () => {
|
||||||
await refreshCaptcha();
|
await refreshCaptcha();
|
||||||
};
|
};
|
||||||
|
|
||||||
initCaptcha();
|
initCaptcha();
|
||||||
|
|
||||||
watch(() => props.isVisible, (newValue) => {
|
watch(
|
||||||
|
() => props.isVisible,
|
||||||
|
(newValue) => {
|
||||||
if (newValue) {
|
if (newValue) {
|
||||||
refreshCaptcha();
|
refreshCaptcha();
|
||||||
}
|
}
|
||||||
});
|
}
|
||||||
|
);
|
||||||
|
|
||||||
const rules = ref({
|
const rules = ref({
|
||||||
phoneNumber: [
|
phoneNumber: [{ required: true, message: "请输入账号", trigger: "blur" }],
|
||||||
{ required: true, message: '请输入账号', trigger: 'blur' },
|
password: [{ required: true, message: "请输入密码", trigger: "blur" }],
|
||||||
],
|
captchaCode: [{ required: true, message: "请输入验证码", trigger: "blur" }],
|
||||||
password: [
|
|
||||||
{ required: true, message: '请输入密码', trigger: 'blur' }
|
|
||||||
],
|
|
||||||
captchaCode: [
|
|
||||||
{ required: true, message: '请输入验证码', trigger: 'blur' }
|
|
||||||
]
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const handleLogin = async () => {
|
const handleLogin = async () => {
|
||||||
formRef.value?.validate(async (valid) => {
|
formRef.value?.validate(async (valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
const params = {
|
const params = {
|
||||||
user_account: formData.value.phoneNumber,
|
user_account: formData.value.phoneNumber,
|
||||||
user_password: formData.value.password,
|
user_password: formData.value.password,
|
||||||
verify_code: formData.value.captchaCode,
|
verify_code: formData.value.captchaCode,
|
||||||
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.status === 200) {
|
||||||
console.log("登录成功", res);
|
console.log("登录成功", res);
|
||||||
userStore.setToken(res.data.token);
|
userStore.setToken(res.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(
|
||||||
formData.value.phoneNumber = '';
|
`https://mall.gpxscs.cn/admin/#/login?loginInfo=${JSON.parse(
|
||||||
formData.value.password = '';
|
JSON.stringify(res.data)
|
||||||
formData.value.captchaCode = '';
|
)}`,
|
||||||
console.log(res.data);
|
"_self"
|
||||||
closeLoginForm();
|
);
|
||||||
} else if(res&&res.status===250&&res.data.msg=='用户名或密码错误!'){
|
formData.value.phoneNumber = "";
|
||||||
ElMessage.error('用户名或密码错误!');
|
formData.value.password = "";
|
||||||
console.log("操作失败", res.msg);
|
formData.value.captchaCode = "";
|
||||||
}else if(res&&res.status===250&&res.data.msg=='验证码错误'){
|
console.log(res.data);
|
||||||
ElMessage.error('验证码错误');
|
closeLoginForm();
|
||||||
}
|
} else if (
|
||||||
} else {
|
res &&
|
||||||
ElMessage.error('请正确填写登录信息');
|
res.status === 250 &&
|
||||||
}
|
res.data.msg == "用户名或密码错误!"
|
||||||
});
|
) {
|
||||||
|
ElMessage.error("用户名或密码错误!");
|
||||||
|
console.log("操作失败", res.msg);
|
||||||
|
} else if (res && res.status === 250 && res.data.msg == "验证码错误") {
|
||||||
|
ElMessage.error("验证码错误");
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
ElMessage.error("请正确填写登录信息");
|
||||||
|
}
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 可以在这里添加一些初始化的逻辑
|
// 可以在这里添加一些初始化的逻辑
|
||||||
});
|
});
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
// 可以在这里添加一些清理的逻辑
|
// 可以在这里添加一些清理的逻辑
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss" scoped>
|
||||||
$primary-color: #007BFF;
|
|
||||||
$secondary-color: #6C757D;
|
|
||||||
$border-radius: 8px;
|
|
||||||
$box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
|
|
||||||
.login-box {
|
.login-box {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
right: 0;
|
||||||
height: 100%;
|
bottom: 0;
|
||||||
background-color: rgba(0, 0, 0, 0.4);
|
display: flex;
|
||||||
display: flex;
|
justify-content: center;
|
||||||
justify-content: center;
|
align-items: center;
|
||||||
align-items: center;
|
background-color: rgba(0, 0, 0, 0.75);
|
||||||
z-index: 1000101;
|
z-index: 1000101;
|
||||||
}
|
}
|
||||||
.el-message {
|
.el-message {
|
||||||
z-index: 1000102 !important;
|
z-index: 1000102 !important;
|
||||||
}
|
}
|
||||||
.login-container {
|
.login-container {
|
||||||
padding: 35px;
|
padding: 25px;
|
||||||
border-radius: $border-radius;
|
border-radius: 10px;
|
||||||
box-shadow: $box-shadow;
|
background-color: #fff;
|
||||||
background-color: #fff;
|
width: 500px;
|
||||||
width: 400px;
|
position: relative;
|
||||||
transition: box-shadow 0.3s ease;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
&:hover {
|
h4 {
|
||||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
|
color: #666;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-input {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-close {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
right: 10px;
|
||||||
|
.btn_close{
|
||||||
|
cursor: pointer;
|
||||||
|
&:hover{
|
||||||
|
color: #409efc;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.foot {
|
||||||
|
padding-top: 20px;
|
||||||
|
.btn_sumit {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
h4 {
|
.btn_code {
|
||||||
color: $primary-color;
|
display: block;
|
||||||
text-align: center;
|
width: 60px;
|
||||||
margin-bottom: 30px;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.el-form-item {
|
:deep(.el-input-group__append){
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.captcha{
|
||||||
|
cursor: pointer;
|
||||||
|
border: 1px solid #dcdfe6;
|
||||||
|
border-left: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool{
|
||||||
|
padding-top: 25px;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 100%;
|
text-align: center;
|
||||||
label{
|
font-size: 14px;
|
||||||
width: 100px !important;
|
color: #666;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
.el-input {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
width: 100%;
|
|
||||||
padding: 2px;
|
|
||||||
background-color: #007BFF;
|
|
||||||
color: #fff;
|
|
||||||
border: none;
|
|
||||||
border-radius: $border-radius;
|
|
||||||
font-size: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background-color 0.3s ease;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: #0056b3;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.login-close {
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
right: 10px;
|
|
||||||
font-size: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
color: $secondary-color;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: $primary-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.passwordLogin {
|
|
||||||
p {
|
|
||||||
margin: 10px;
|
|
||||||
color: red;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.pic_verifyCode img {
|
|
||||||
cursor: pointer;
|
|
||||||
width: 100px;
|
|
||||||
height: 50px;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
.el-input{
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
@ -8,11 +8,10 @@
|
|||||||
:hide-required-asterisk="true"
|
:hide-required-asterisk="true"
|
||||||
>
|
>
|
||||||
<div class="register-container">
|
<div class="register-container">
|
||||||
<!-- 关闭按钮 -->
|
<div class="register-close" @click="closeRegisterForm">
|
||||||
<div class="register-close" @click="closeRegisterForm">×</div>
|
<el-icon color="#333" size="24" class="btn_close"><Close /></el-icon>
|
||||||
<!-- 标题 -->
|
</div>
|
||||||
<h4>欢迎登录注册</h4>
|
<h4>欢迎入驻开店</h4>
|
||||||
<!-- 手机号输入项 -->
|
|
||||||
<el-form-item label="手机号" prop="phoneNumber">
|
<el-form-item label="手机号" prop="phoneNumber">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="formData.phoneNumber"
|
v-model="formData.phoneNumber"
|
||||||
@ -21,47 +20,57 @@
|
|||||||
size="large"
|
size="large"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 验证码输入项 -->
|
|
||||||
<el-form-item label="验证码" prop="verificationCode">
|
<el-form-item label="验证码" prop="verificationCode">
|
||||||
<!-- <div class="verifyAndButton">
|
|
||||||
<el-input v-model="formData.verificationCode" placeholder="输入验证码" style="flex: 1;" maxlength="4" />
|
|
||||||
<button type="button" v-if="!sendCode" :style="{
|
|
||||||
marginLeft: '10px',
|
|
||||||
width: '80px',
|
|
||||||
height: '40px',
|
|
||||||
fontSize: '14px',
|
|
||||||
textAlign: 'center',
|
|
||||||
backgroundColor: formData.phoneNumber.length === 11? 'orange' : 'gray',
|
|
||||||
cursor: formData.phoneNumber.length === 11? 'pointer' : 'not-allowed'
|
|
||||||
}"
|
|
||||||
:disabled="formData.phoneNumber.length!== 11" @click="getVerify_code">获取验证码</button>
|
|
||||||
<button v-if="sendCode" :style="{
|
|
||||||
marginLeft: '10px',
|
|
||||||
width: '80px',
|
|
||||||
height: '40px',
|
|
||||||
fontSize: '14px',
|
|
||||||
textAlign: 'center',
|
|
||||||
backgroundColor: 'gray',
|
|
||||||
cursor: 'not-allowed'
|
|
||||||
}" disabled>
|
|
||||||
{{ countdown }}秒后重发
|
|
||||||
</button>
|
|
||||||
</div> -->
|
|
||||||
<el-input
|
<el-input
|
||||||
v-model="formData.verificationCode"
|
v-model="formData.verificationCode"
|
||||||
placeholder="验证码"
|
placeholder="验证码"
|
||||||
size="large"
|
size="large"
|
||||||
>
|
>
|
||||||
<template #append>
|
<template #append>
|
||||||
<el-button type="primary" class="btn_code" size="large" v-if="!sendCode" :disabled="formData.phoneNumber.length!== 11" @click="getVerify_code" round>发送验证码</el-button>
|
<el-button
|
||||||
<el-button type="primary" class="btn_code" size="large" v-if="sendCode" disabled round>{{ countdown }}S</el-button>
|
type="primary"
|
||||||
|
class="btn_code"
|
||||||
|
size="large"
|
||||||
|
v-if="!sendCode"
|
||||||
|
:disabled="formData.phoneNumber.length !== 11"
|
||||||
|
@click="getVerify_code"
|
||||||
|
round
|
||||||
|
>发送验证码</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
class="btn_code"
|
||||||
|
size="large"
|
||||||
|
v-if="sendCode"
|
||||||
|
disabled
|
||||||
|
round
|
||||||
|
>{{ countdown }}S</el-button
|
||||||
|
>
|
||||||
</template>
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<div class="foot">
|
<div class="foot">
|
||||||
<el-button class="btn_sumit" type="primary" size="large" :disabled="!formData.phoneNumber || !formData.verificationCode" round @click="handleRegister">确定</el-button>
|
<el-button
|
||||||
</div>
|
class="btn_sumit"
|
||||||
|
type="primary"
|
||||||
|
size="large"
|
||||||
|
:disabled="!formData.phoneNumber || !formData.verificationCode"
|
||||||
|
round
|
||||||
|
@click="handleRegister"
|
||||||
|
>确定</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="tool">
|
||||||
|
已有账号?
|
||||||
|
<el-button
|
||||||
|
class="btn_sumit"
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="openLoginForm"
|
||||||
|
>立即登录</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
@ -74,6 +83,7 @@ import { useRouter } from "vue-router";
|
|||||||
import { GetSmsCode, GetLogin } from "@/api/login";
|
import { GetSmsCode, GetLogin } from "@/api/login";
|
||||||
import { getApproval_status } from "@/api/login";
|
import { getApproval_status } from "@/api/login";
|
||||||
import { ElMessage } from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
|
import { Close } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
isVisible: {
|
isVisible: {
|
||||||
@ -81,7 +91,7 @@ const props = defineProps({
|
|||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
const emits = defineEmits(["close-register-form"]);
|
const emits = defineEmits(['open-login-form', "close-register-form"]);
|
||||||
const formData = ref({
|
const formData = ref({
|
||||||
phoneNumber: "",
|
phoneNumber: "",
|
||||||
verificationCode: "",
|
verificationCode: "",
|
||||||
@ -100,6 +110,11 @@ const closeRegisterForm = () => {
|
|||||||
emits("close-register-form");
|
emits("close-register-form");
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const openLoginForm = () => {
|
||||||
|
closeRegisterForm()
|
||||||
|
emits('open-login-form');
|
||||||
|
};
|
||||||
|
|
||||||
const getVerify_code = async () => {
|
const getVerify_code = async () => {
|
||||||
const params = {
|
const params = {
|
||||||
number: formData.value.phoneNumber,
|
number: formData.value.phoneNumber,
|
||||||
@ -235,17 +250,17 @@ onUnmounted(() => {
|
|||||||
z-index: 1000102 !important; // 确保这个值高于遮罩层的 z-index
|
z-index: 1000102 !important; // 确保这个值高于遮罩层的 z-index
|
||||||
}
|
}
|
||||||
|
|
||||||
.foot{
|
.foot {
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
.btn_sumit{
|
.btn_sumit {
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn_code{
|
.btn_code {
|
||||||
display: block;
|
display: block;
|
||||||
width: 60px;
|
width: 60px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.register-container {
|
.register-container {
|
||||||
@ -275,11 +290,22 @@ onUnmounted(() => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
top: 10px;
|
top: 10px;
|
||||||
right: 10px;
|
right: 10px;
|
||||||
|
.btn_close{
|
||||||
|
cursor: pointer;
|
||||||
|
&:hover{
|
||||||
|
color: #409efc;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
.tool{
|
||||||
color: red;
|
padding-top: 25px;
|
||||||
margin: 10px 0;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #666;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -19,19 +19,19 @@
|
|||||||
<div class="header-right">
|
<div class="header-right">
|
||||||
<!-- 免费开店按钮始终可见 -->
|
<!-- 免费开店按钮始终可见 -->
|
||||||
<div class="start">
|
<div class="start">
|
||||||
<el-button @click="handleOpenStartPage">
|
<el-button type="primary" @click="handleOpenStartPage">
|
||||||
免费开店
|
立即入驻
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
<!-- 根据登录状态显示不同按钮 -->
|
<!-- 根据登录状态显示不同按钮 -->
|
||||||
<div class="login">
|
<div class="login">
|
||||||
<el-button type="primary" @click="openLoginForm" class="login-button">
|
<el-button plain type="primary" @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="danger" plain @click="logout" class="logout-button">
|
||||||
退出登录
|
退出
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -40,10 +40,10 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
</div>
|
</div>
|
||||||
<div class="login-register-module">
|
<div class="login-register-module">
|
||||||
<span @click="handleOpenStartPage">开店</span>
|
<span @click="handleOpenStartPage">立即入驻</span>
|
||||||
<span>|</span>
|
<span>|</span>
|
||||||
<span @click="openLoginForm">登录</span>
|
<span @click="openLoginForm">商家登录</span>
|
||||||
<span v-if="isLoggedIn" @click="logout">退出登录</span>
|
<span v-if="isLoggedIn" @click="logout">退出</span>
|
||||||
</div>
|
</div>
|
||||||
<!-- 汉堡菜单 -->
|
<!-- 汉堡菜单 -->
|
||||||
<div class="hamburger-menu" @click="toggleMenu">
|
<div class="hamburger-menu" @click="toggleMenu">
|
||||||
|
|||||||
@ -139,9 +139,6 @@
|
|||||||
top: 0;
|
top: 0;
|
||||||
background-position: center center;
|
background-position: center center;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
background: url(../../assets/image/index/slider-bg-shape.png);
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -110,16 +110,16 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
|
|
||||||
<el-upload
|
<el-upload
|
||||||
v-if="item.type == 'upload'"
|
v-if="item.type == 'upload'"
|
||||||
ref="uploadRef"
|
ref="uploadRef"
|
||||||
:limit="1"
|
:limit="1"
|
||||||
list-type="picture-card"
|
list-type="picture-card"
|
||||||
:auto-upload="true"
|
:auto-upload="true"
|
||||||
:on-preview="handlePictureCardPreview"
|
:on-preview="handlePictureCardPreview"
|
||||||
v-model="applyFormData[item.key]"
|
v-model="applyFormData[item.key=='storefrontImg'?'front_facade_image':item.key=='surroundingsImg'?'environment_image':item.key]"
|
||||||
:on-remove="
|
:on-remove="
|
||||||
(file, fileList) =>
|
(file, fileList) =>
|
||||||
handleRemove(file, fileList, item.key)
|
handleRemove(file, fileList, item.key=='storefrontImg'?'front_facade_image':item.key=='surroundingsImg'?'environment_image':item.key)
|
||||||
"
|
"
|
||||||
:on-success="
|
:on-success="
|
||||||
(response, file, fileList) =>
|
(response, file, fileList) =>
|
||||||
@ -127,7 +127,7 @@
|
|||||||
response,
|
response,
|
||||||
file,
|
file,
|
||||||
fileList,
|
fileList,
|
||||||
item.key
|
item.key=='storefrontImg'?'front_facade_image':item.key=='surroundingsImg'?'environment_image':item.key
|
||||||
)
|
)
|
||||||
"
|
"
|
||||||
:on-error="handleUploadError"
|
:on-error="handleUploadError"
|
||||||
@ -135,7 +135,7 @@
|
|||||||
:action="uploadUrl"
|
:action="uploadUrl"
|
||||||
name="upfile"
|
name="upfile"
|
||||||
:class="{
|
:class="{
|
||||||
'upload-hidden': isUploadHidden(item.key),
|
'upload-hidden': isUploadHidden(item.key=='storefrontImg'?'front_facade_image':item.key=='surroundingsImg'?'environment_image':item.key),
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<el-icon class="avatar-uploader-icon">
|
<el-icon class="avatar-uploader-icon">
|
||||||
@ -143,544 +143,6 @@
|
|||||||
</el-icon>
|
</el-icon>
|
||||||
</el-upload>
|
</el-upload>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<!-- <el-form-item label="联系人" prop="contact_name">
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.contact_name"
|
|
||||||
placeholder="请输入联系人姓名"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="联系电话" prop="login_mobile">
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.login_mobile"
|
|
||||||
placeholder="请输入联系人电话"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="经营品类" prop="biz_category">
|
|
||||||
<el-cascader
|
|
||||||
v-model="applyFormData.biz_category"
|
|
||||||
:options="cascaderOptions"
|
|
||||||
placeholder="请选择经营品类"
|
|
||||||
:show-all-levels="false"
|
|
||||||
@change="handleChangeBizCategory"
|
|
||||||
clearable
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="门店名称" prop="store_name">
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.store_name"
|
|
||||||
placeholder="请输入门店名称"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="所在地区" prop="map_address">
|
|
||||||
<el-cascader
|
|
||||||
style="marginright: 5px"
|
|
||||||
v-model="applyFormData.map_address"
|
|
||||||
:options="cascaderOptions2"
|
|
||||||
@change="handleChange"
|
|
||||||
/>
|
|
||||||
<el-autocomplete
|
|
||||||
v-if="applyFormData.map_address"
|
|
||||||
style="width: 180px"
|
|
||||||
v-model="applyFormData.position"
|
|
||||||
placeholder="试试搜索,快速填写地址"
|
|
||||||
:fetch-suggestions="querySearch"
|
|
||||||
value-key="value"
|
|
||||||
:options="autocompleteOptions"
|
|
||||||
@select="handleSelect"
|
|
||||||
>
|
|
||||||
<template #default="{ item }">
|
|
||||||
<div class="auto-item" v-if="item">
|
|
||||||
<div>
|
|
||||||
<p>{{ item.name }}</p>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span>{{ item.address }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-autocomplete>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
label="详细地址"
|
|
||||||
prop="store_address"
|
|
||||||
v-if="applyFormData.map_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-upload
|
|
||||||
ref="uploadRef"
|
|
||||||
multiple
|
|
||||||
:limit="1"
|
|
||||||
list-type="picture-card"
|
|
||||||
:auto-upload="true"
|
|
||||||
:on-remove="
|
|
||||||
(file, fileList) =>
|
|
||||||
handleRemove(file, fileList, 'front_facade_image')
|
|
||||||
"
|
|
||||||
:on-success="
|
|
||||||
(response, file, fileList) =>
|
|
||||||
handleUploadSuccess(
|
|
||||||
response,
|
|
||||||
file,
|
|
||||||
fileList,
|
|
||||||
'front_facade_image'
|
|
||||||
)
|
|
||||||
"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
:on-error="handleUploadError"
|
|
||||||
:on-exceed="handleExceed"
|
|
||||||
:before-upload="beforeUpload"
|
|
||||||
:action="uploadUrl"
|
|
||||||
name="upfile"
|
|
||||||
:class="{ 'upload-hidden': isUploadHidden('front_facade_image') }"
|
|
||||||
>
|
|
||||||
<el-icon class="avatar-uploader-icon">
|
|
||||||
<Plus />
|
|
||||||
</el-icon>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
<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"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
v-model="applyFormData.environment_image"
|
|
||||||
:on-remove="
|
|
||||||
(file, fileList) =>
|
|
||||||
handleRemove(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"
|
|
||||||
:class="{ 'upload-hidden': isUploadHidden('environment_image') }"
|
|
||||||
>
|
|
||||||
<el-icon>
|
|
||||||
<Plus />
|
|
||||||
</el-icon>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="主体类型" prop="entity_type">
|
|
||||||
<el-radio-group
|
|
||||||
v-model="applyFormData.entity_type"
|
|
||||||
@change="clearOtherFields"
|
|
||||||
>
|
|
||||||
<el-radio-button :value="1">企业</el-radio-button>
|
|
||||||
<el-radio-button :value="2">个人</el-radio-button>
|
|
||||||
</el-radio-group>
|
|
||||||
</el-form-item>
|
|
||||||
<div v-if="applyFormData.entity_type === 1">
|
|
||||||
<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-preview="handlePictureCardPreview"
|
|
||||||
: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-button
|
|
||||||
type="info"
|
|
||||||
plain
|
|
||||||
v-if="
|
|
||||||
applyFormData.biz_license_image &&
|
|
||||||
!applyFormData.biz_license_company
|
|
||||||
"
|
|
||||||
@click="handleOcrText(currentBbatchNo, 'biz_license_image')"
|
|
||||||
>点击免填营业执照信息</el-button
|
|
||||||
>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
label="公司名称"
|
|
||||||
prop="biz_license_company"
|
|
||||||
v-if="applyFormData.biz_license_image"
|
|
||||||
>
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.biz_license_company"
|
|
||||||
placeholder="请输入公司名称"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
label="法人姓名"
|
|
||||||
prop="legal_person_name"
|
|
||||||
v-if="applyFormData.biz_license_image"
|
|
||||||
>
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.legal_person_name"
|
|
||||||
placeholder="请输入法人姓名"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
label="注册号"
|
|
||||||
prop="biz_license_number"
|
|
||||||
v-if="applyFormData.biz_license_image"
|
|
||||||
>
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.biz_license_number"
|
|
||||||
placeholder="请输入注册号"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
label="许可证类型"
|
|
||||||
prop="license_type"
|
|
||||||
v-if="applyFormData.biz_license_image"
|
|
||||||
>
|
|
||||||
<el-select
|
|
||||||
v-model="applyFormData.license_type"
|
|
||||||
value-key=""
|
|
||||||
placeholder="请选择类型"
|
|
||||||
clearable
|
|
||||||
@change=""
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in optionsPermitType"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"
|
|
||||||
>
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
:label="getLabel('license_image', 5)"
|
|
||||||
prop="license_image"
|
|
||||||
v-if="applyFormData.license_type != 1"
|
|
||||||
>
|
|
||||||
<el-upload
|
|
||||||
ref="uploadRef"
|
|
||||||
multiple
|
|
||||||
:limit="5"
|
|
||||||
list-type="picture-card"
|
|
||||||
:auto-upload="true"
|
|
||||||
v-model="applyFormData.license_image"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
: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
|
|
||||||
label="许可证编号"
|
|
||||||
prop="license_number"
|
|
||||||
v-if="applyFormData.license_type != 1"
|
|
||||||
>
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.license_number"
|
|
||||||
placeholder="请输入许可证编号"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<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"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
v-model="applyFormData.legal_person_id_images"
|
|
||||||
:on-remove="
|
|
||||||
(file, fileList) =>
|
|
||||||
handleRemove(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="{
|
|
||||||
'upload-hidden': isUploadHidden('legal_person_id_images'),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<el-icon class="avatar-uploader-icon">
|
|
||||||
<Plus />
|
|
||||||
</el-icon>
|
|
||||||
</el-upload>
|
|
||||||
<el-button
|
|
||||||
type="info"
|
|
||||||
plain
|
|
||||||
v-if="
|
|
||||||
applyFormData.legal_person_id_images &&
|
|
||||||
!applyFormData.legal_person_id_number
|
|
||||||
"
|
|
||||||
@click="handleOcrText(currentBbatchNo, 'legal_person_id_images')"
|
|
||||||
>点击免填身份证</el-button
|
|
||||||
>
|
|
||||||
</el-form-item>
|
|
||||||
<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"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
v-model="applyFormData.legal_person_id_images2"
|
|
||||||
:on-remove="
|
|
||||||
(file, fileList) =>
|
|
||||||
handleRemove(file, fileList, 'legal_person_id_images2')
|
|
||||||
"
|
|
||||||
:on-success="
|
|
||||||
(response, file, fileList) =>
|
|
||||||
handleUploadSuccess(
|
|
||||||
response,
|
|
||||||
file,
|
|
||||||
fileList,
|
|
||||||
'legal_person_id_images2'
|
|
||||||
)
|
|
||||||
"
|
|
||||||
:on-error="handleUploadError"
|
|
||||||
:before-upload="beforeUpload"
|
|
||||||
:action="uploadUrl"
|
|
||||||
name="upfile"
|
|
||||||
:class="{
|
|
||||||
'upload-hidden': isUploadHidden('legal_person_id_images2'),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<el-icon class="avatar-uploader-icon">
|
|
||||||
<Plus />
|
|
||||||
</el-icon>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
label="法人身份证号码"
|
|
||||||
prop="legal_person_id_number"
|
|
||||||
v-if="applyFormData.legal_person_id_images"
|
|
||||||
>
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.legal_person_id_number"
|
|
||||||
placeholder="请输入法人身份证号码"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div v-if="applyFormData.entity_type === 2">
|
|
||||||
<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"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
v-model="applyFormData.individual_id_images"
|
|
||||||
:on-remove="
|
|
||||||
(file, fileList) =>
|
|
||||||
handleRemove(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="{
|
|
||||||
'upload-hidden': isUploadHidden('individual_id_images'),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<el-icon class="avatar-uploader-icon">
|
|
||||||
<Plus />
|
|
||||||
</el-icon>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<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"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
v-model="applyFormData.individual_id_images2"
|
|
||||||
:on-remove="
|
|
||||||
(file, fileList) =>
|
|
||||||
handleRemove(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="{
|
|
||||||
'upload-hidden': isUploadHidden('individual_id_images2'),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<el-icon class="avatar-uploader-icon">
|
|
||||||
<Plus />
|
|
||||||
</el-icon>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
label="个人身份证号"
|
|
||||||
prop="individual_id_number"
|
|
||||||
v-if="applyFormData.individual_id_images"
|
|
||||||
>
|
|
||||||
<el-input
|
|
||||||
v-model="applyFormData.individual_id_number"
|
|
||||||
placeholder="请输入个人身份证号"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="银行卡" prop="bank_image">
|
|
||||||
<el-upload
|
|
||||||
ref="uploadRef"
|
|
||||||
:limit="1"
|
|
||||||
list-type="picture-card"
|
|
||||||
:auto-upload="true"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
v-model="applyFormData.bank_image"
|
|
||||||
:on-remove="
|
|
||||||
(file, fileList) => handleRemove(file, fileList, 'bank_image')
|
|
||||||
"
|
|
||||||
:on-success="
|
|
||||||
(response, file, fileList) =>
|
|
||||||
handleUploadSuccess(response, file, fileList, 'bank_image')
|
|
||||||
"
|
|
||||||
:on-error="handleUploadError"
|
|
||||||
:before-upload="beforeUpload"
|
|
||||||
:action="uploadUrl"
|
|
||||||
name="upfile"
|
|
||||||
:class="{
|
|
||||||
'upload-hidden': isUploadHidden('bank_image'),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<el-icon class="avatar-uploader-icon">
|
|
||||||
<Plus />
|
|
||||||
</el-icon>
|
|
||||||
</el-upload>
|
|
||||||
<el-button
|
|
||||||
type="info"
|
|
||||||
plain
|
|
||||||
v-if="applyFormData.bank_image && !applyFormData.account_number"
|
|
||||||
@click="handleOcrText(currentBbatchNo, 'bank_image')"
|
|
||||||
>点击免填银行卡号</el-button
|
|
||||||
>
|
|
||||||
</el-form-item>
|
|
||||||
<template v-if="applyFormData.bank_image">
|
|
||||||
<el-form-item label="开户名称" prop="account_holder_name">
|
|
||||||
<el-input v-model="applyFormData.account_holder_name" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="银行卡号" prop="account_number">
|
|
||||||
<el-input v-model="applyFormData.account_number" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="开户银行" prop="bank_branch_name">
|
|
||||||
<el-select-v2
|
|
||||||
clearable
|
|
||||||
filterable
|
|
||||||
remote
|
|
||||||
@change="bankListChange"
|
|
||||||
:remote-method="bankListRemoteMethod"
|
|
||||||
v-model="applyFormData.bank_branch_name"
|
|
||||||
placeholder="搜索银行名称"
|
|
||||||
placement="top-start"
|
|
||||||
style="width: 350px"
|
|
||||||
:options="bankList2"
|
|
||||||
>
|
|
||||||
</el-select-v2>
|
|
||||||
</el-form-item>
|
|
||||||
</template>
|
|
||||||
-->
|
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -817,7 +279,7 @@ const applyFormData = reactive({
|
|||||||
license_image: [],
|
license_image: [],
|
||||||
license_number: "",
|
license_number: "",
|
||||||
license_type: "",
|
license_type: "",
|
||||||
login_mobile: "",
|
login_mobile: localStorage.getItem("mobilePhone"),
|
||||||
province_id: null,
|
province_id: null,
|
||||||
store_address: "",
|
store_address: "",
|
||||||
map_address: "",
|
map_address: "",
|
||||||
|
|||||||
@ -6,13 +6,6 @@ const formConfig = [
|
|||||||
placeholder: "请输入联系人",
|
placeholder: "请输入联系人",
|
||||||
sort: 1,
|
sort: 1,
|
||||||
},
|
},
|
||||||
{
|
|
||||||
type: "input",
|
|
||||||
key: "legal_person_mobile",
|
|
||||||
label: "法人手机号",
|
|
||||||
placeholder: "请输入法人手机号",
|
|
||||||
sort: 1,
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
type: "select",
|
type: "select",
|
||||||
key: "biz_category",
|
key: "biz_category",
|
||||||
@ -80,6 +73,13 @@ const formConfig = [
|
|||||||
placeholder: "请输入法人姓名",
|
placeholder: "请输入法人姓名",
|
||||||
sort: 10,
|
sort: 10,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
type: "input",
|
||||||
|
key: "legal_person_mobile",
|
||||||
|
label: "法人手机号",
|
||||||
|
placeholder: "请输入法人手机号",
|
||||||
|
sort: 10,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
type: "input",
|
type: "input",
|
||||||
key: "biz_license_number",
|
key: "biz_license_number",
|
||||||
|
|||||||