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

feat: 添加myui样式，修改地图标题和删除多余注释，修改店铺地图省市区文案UI交互，优化店铺信息资料流程，优化营业信息资料流程，优化资金结算信息流程，统一添加上一步返回按钮

Browse Source
This commit is contained in:
mixtan 2025-05-15 18:55:38 +08:00
parent d553101182
commit aea2bcd259
7 changed files with 214 additions and 234 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
java-mall-app-shop-admin/main.js
View File

@ -6,6 +6,7 @@ import './uni.promisify.adaptor'
import tui from './utils/httpRequest'
import Socket from './utils/socket.js'
import "@/static/reset.css"
import "@/styles/myui.scss"
// import Utils from './utils/http'
// import "@/static/font/iconfont.css"

20
java-mall-app-shop-admin/pages.json
View File

@ -45,7 +45,7 @@
{
"path": "pages/audit/mapAddress",
"style": {
"navigationBarTitleText": "选择地图地址"
"navigationBarTitleText": "填写地区信息"
}
},
{
@ -188,13 +188,6 @@
"fontSize":"14px",
"height": "58px",
"spacing":"5px",
// "midButton":{
// "text":"视图中心",
// "height": "80px",
// "width": "60px",
// "iconPath": "/static/shituzhongxin.png",
// "iconWidth": "40px"
// },
"list": [
{
"pagePath": "pages/order/order",
@ -229,17 +222,6 @@
},
"text": "视图中心"
},
// {
// "pagePath": "pages/manage/manage",
// "iconfont": {
// "text": "\ue606",
// "selectedText": "\ue606",
// "selectedColor": "#4b71ff",
// "color":"#000",
// "fontSize":"24px"
// },
// "text": "经营"
// },
{
"pagePath": "pages/my/my",
"iconfont": {

12
java-mall-app-shop-admin/pages/audit/mapAddress.vue
View File

@ -2,7 +2,7 @@
<view class="mapAddress-container">
<u-form :model="form" class="form" ref="uForm" label-width="100">
<u-form-item
label="选择省市区"
label="所在省市区"
prop="administrativeRegion"
required
@click="showMPCityPicker"
@ -12,7 +12,7 @@
disabledColor="#fff"
class="form-input city-input"
v-model="form.administrativeRegion"
placeholder="请先选择省市区"
placeholder="请选择省市区"
border="none"
/>
<u-icon
@ -23,17 +23,17 @@
color="#aaaaaa"
></u-icon>
</u-form-item>
<u-form-item label="地图地址" prop="name" required>
<u-form-item label="搜索地址" prop="name" required>
<u-input
class="form-input"
v-model="form.searchAddress"
placeholder="请输入地址查询"
placeholder="搜索地址，更快填写"
@input="handerSearchAddress"
/>
</u-form-item>
</u-form>
<view class="tips" v-if="searchAddressList.length > 0"
>请单击选择下面地址</view
>单击地址确定</view
>
<scroll-view
v-if="form.searchAddress.length > 0"
@ -121,7 +121,7 @@ export default {
this.searchAddressList = [];
if (this.citys.length == 0) {
this.$refs.uToast.show({
message: "请先选择省市区",
message: "请选择所在地区",
type: "error",
duration: 1000,
});

23
java-mall-app-shop-admin/pages/audit/shop1.vue
View File

@ -9,7 +9,7 @@
<u-navbar
:autoBack="true"
:safeAreaInsetTop="true"
title="填写店铺信息第1步 / 共3步"
title="填写店铺信息"
>
<template slot="right">
<view class="btn-login-out" @click="loginOut">退出登录</view>
@ -51,7 +51,7 @@
/>
</u-form-item>
<u-form-item
label="地图地址"
label="所在地区"
prop="mapAddress"
required
@click="shkipuSelectAddress"
@ -107,9 +107,12 @@
</u-upload>
</u-form-item>
</u-form>
<view class="btn-content">
<u-button class="btn-next" @click="handleNext">下一步</u-button>
<view class="myui_check_text">检查并确认店铺信息无误</view>
<u-button text="下一步" color="#4b71ff" @click="handleNext"></u-button>
</view>
<u-toast ref="uToast" />
</view>
</template>
@ -329,11 +332,9 @@ export default {
}
.form {
padding: 0 36rpx;
padding: 0 24rpx 0 30rpx;
background: #fff;
border-top: 1px solid #f2f2f2;
.u-form-item__body__right {
}
/deep/.shop1-from-item {
.u-form-item__body__right {
@ -375,15 +376,7 @@ export default {
}
.btn-content {
bottom: 40rpx;
width: 94%;
padding: 48rpx 24rpx;
}
.btn-next {
border-radius: 24rpx;
background: #4b71ff;
color: #fff;
padding: 30rpx 48rpx 88rpx;
}
.btn-login-out {

354
java-mall-app-shop-admin/pages/audit/shop2.vue
View File

@ -1,10 +1,6 @@
<template>
<view class="shop-2-container">
<u-navbar
:autoBack="true"
:safeAreaInsetTop="true"
title="填写店铺信息第2步 / 共3步"
>
<u-navbar :autoBack="true" :safeAreaInsetTop="true" title="营业信息">
<template slot="right">
<view class="btn-login-out" @click="loginOut">退出登录</view>
</template>
@ -18,27 +14,89 @@
></u-subsection>
<view class="up-block" v-show="active == 0">
<view class="up-title">
营业执照 <text class="color_red">（必传项）</text>
</view>
<u-upload
:class="fileList.length == 0 ? 'shop2-2-upload' : ''"
class="shop2-2-upload"
@afterRead="afterRead($event, 'businessLicense')"
@delete="deletePic($event, 'businessLicense')"
accept="image"
uploadIcon=""
:fileList="fileList"
:max-count="1"
width="125"
height="88"
></u-upload>
<view class="up-title"> 营业执照信息 </view>
<u-form :model="form" class="form" ref="uForm" label-width="120">
<u-form-item label="营业执照" prop="businessLicenseFiles">
<u-upload
:class="form.businessLicenseFiles.length == 0 ? 'shop2-2-upload' : ''"
class="shop2-2-upload"
@afterRead="afterRead($event, 'businessLicense')"
@delete="deletePic($event, 'businessLicense')"
accept="image"
:fileList="form.businessLicenseFiles"
:max-count="1"
width="125"
height="88"
uploadText="点击上传营业执照"
></u-upload>
</u-form-item>
<template v-if="form.businessLicenseFiles.length && form.biz_license_company">
<u-form-item label="公司名称" prop="biz_license_company" required>
<u-input
class="form-input"
v-model="form.biz_license_company"
placeholder="请输入公司名称"
/>
</u-form-item>
<u-form-item label="法人姓名" prop="legal_person_name" required>
<u-input
class="form-input"
v-model="form.legal_person_name"
placeholder="请输入法人姓名"
/>
</u-form-item>
<u-form-item label="注册号" prop="biz_license_number" required>
<u-input
class="form-input"
v-model="form.biz_license_number"
placeholder="请输入注册号"
/>
</u-form-item>
<u-form-item label="所属行业" prop="license_type" @click="showPicker = true">
<u-input
style="pointer-events: none"
class="form-input"
v-model="license_type_name"
placeholder="请选择所属行业"
readonly
/>
<u-icon
style="display: inline-block; margin-left: 8rpx"
name="arrow-down"
size="12"
color="#aaaaaa"
></u-icon>
</u-form-item>
<u-form-item label="许可证" v-if="form.license_type != 1">
<u-upload
:class="form.specialLicenseFiles.length == 0 ? 'shop2-3-upload' : ''"
@afterRead="afterRead($event, 'licenseNumber')"
@delete="deletePic($event, 'licenseNumber')"
accept="image"
:uploadIcon="form.specialLicenseFiles.length == 0 ? '' : 'camera-fill'"
:fileList="form.specialLicenseFiles"
:max-count="5"
width="125"
height="88"
></u-upload>
</u-form-item>
<u-form-item
label="许可证编号"
prop="license_number"
v-if="form.license_type != 1"
>
<u-input
class="form-input"
v-model="form.license_number"
placeholder="请输入许可证编号"
/>
</u-form-item>
</template>
</u-form>
</view>
<view class="up-block up-block-3" v-show="active == 0">
<view class="up-title">
法人身份证正反面（{{ fileList3.length + fileList4.length }} /2）
<text class="color_red">（必传项）</text>
</view>
<view class="up-title"> 法人信息 </view>
<view class="up-block-3-content">
<u-upload
:class="fileList3.length == 0 ? 'shop2-4-upload' : ''"
@ -63,40 +121,27 @@
uploadIcon=""
></u-upload>
</view>
<u-form
v-if="fileList3.length && form.legal_person_id_number"
:model="form"
class="form"
ref="uForm3"
label-width="120"
>
<u-form-item label="身份证号码" prop="legal_person_id_number" required>
<u-input
class="form-input"
maxlength="18"
v-model="form.legal_person_id_number"
placeholder="请输入身份证号码"
/>
</u-form-item>
</u-form>
</view>
<view class="up-block up-block-2" v-show="active == 0">
<view class="up-title">
许可证(最大上传{{ fileList2.length }}/5)
<u-icon
style="display: inline-block; margin: 0 8rpx"
@click="handlePopup"
name="question-circle"
size="12"
color="aaaaaa"
>
</u-icon>
（可传项）
</view>
<u-upload
:class="fileList2.length == 0 ? 'shop2-3-upload' : ''"
@afterRead="afterRead($event, 'licenseNumber')"
@delete="deletePic($event, 'licenseNumber')"
accept="image"
:uploadIcon="fileList2.length == 0 ? '' : 'camera-fill'"
:fileList="fileList2"
:max-count="5"
width="125"
height="88"
></u-upload>
</view>
<!--个人-->
<view class="up-block up-block-3" v-show="active == 1">
<view class="up-title">
法人身份证正反面（{{ fileList5.length + fileList6.length }} /2）<text
class="color_red"
>（必传项）</text
>
</view>
<view class="up-title"> 个人信息 </view>
<view class="up-block-3-content">
<u-upload
:class="fileList5.length == 0 ? 'shop2-4-upload' : ''"
@ -123,81 +168,13 @@
uploadIcon=""
></u-upload>
</view>
</view>
<view class="up-block up-block-2" v-show="active == 0">
<u-form :model="form" class="form" ref="uForm" label-width="120">
<u-form-item
label="许可证类型"
prop="license_type"
@click="showPicker = true"
>
<u-input
style="pointer-events: none"
class="form-input"
v-model="form.license_type"
placeholder="请选择许可证类型"
readonly
/>
<u-icon
style="display: inline-block; margin-left: 8rpx"
name="arrow-down"
size="12"
color="#aaaaaa"
></u-icon>
</u-form-item>
<u-form-item label="公司名称" prop="biz_license_company" required>
<u-input
class="form-input"
v-model="form.biz_license_company"
placeholder="请输入公司名称"
/>
</u-form-item>
<u-form-item label="法人姓名" prop="legal_person_name" required>
<u-input
class="form-input"
v-model="form.legal_person_name"
placeholder="请输入法人姓名"
/>
</u-form-item>
<u-form-item label="法人手机号" prop="legal_person_mobile" required>
<u-input
class="form-input"
v-model="form.legal_person_mobile"
maxlength="11"
placeholder="请输入法人手机号"
/>
</u-form-item>
<u-form-item
label="法人身份证号码"
prop="legal_person_id_number"
required
>
<u-input
class="form-input"
maxlength="18"
v-model="form.legal_person_id_number"
placeholder="请输入法人身份证号码"
/>
</u-form-item>
<u-form-item label="营业执照编号" prop="biz_license_number">
<u-input
class="form-input"
v-model="form.biz_license_number"
placeholder="请输入营业执照编号"
/>
</u-form-item>
<u-form-item label="许可证编号" prop="license_number">
<u-input
class="form-input"
v-model="form.license_number"
placeholder="请输入许可证编号"
/>
</u-form-item>
</u-form>
</view>
<view class="up-block up-block-2" v-show="active == 1">
<u-form :model="form2" class="form" ref="uForm2" label-width="100">
<u-form
v-if="fileList5.length"
:model="form2"
class="form"
ref="uForm2"
label-width="100"
>
<u-form-item label="身份证号码" prop="individual_id_number" required>
<u-input
class="form-input"
@ -209,9 +186,13 @@
</u-form>
</view>
</view>
<view class="btn-content">
<u-button class="btn-next" @click="handleNext">下一步</u-button>
<view class="myui_check_text">检查并确认营业证件信息无误</view>
<u-button text="下一步" color="#4b71ff" @click="handleNext"></u-button>
<u-button text="上一步" class="myui_btn_prev" @click="handlePrev"></u-button>
</view>
<u-popup
class="shop2-popup"
:mask="true"
@ -245,11 +226,10 @@
支持各种小证,因各地监管规则不一,请联系客服获取其他小证支持情况的详细。
</view>
</view>
<u-button class="btn-queren" @click="showPopup = false"
>我知道了</u-button
>
<u-button class="btn-queren" @click="showPopup = false">我知道了</u-button>
</view>
</u-popup>
<u-picker
:show="showPicker"
:columns="columns"
@ -265,11 +245,7 @@
<script>
import { mapActions } from "vuex";
import {
UploadFilePromise,
batchNoApi,
imgOcrResultApi,
} from "../../api/upload";
import { UploadFilePromise, batchNoApi, imgOcrResultApi } from "../../api/upload";
const orcImgTypeConf = {
FR_ID_CARD_FRONT: "FR_ID_CARD_FRONT",
@ -288,15 +264,16 @@ export default {
showPicker: false,
list: [
{
name: "企业",
name: "企业类型",
},
{
name: "个人",
name: "个人类型",
},
],
form: {
license_type: 1, // 所属行业
license_image: "", // 许可证路径
biz_license_number: "", //营业执照编号
biz_license_number: "", //注册号
biz_license_company: "", // 公司真实名字
biz_license_image: "", // 营业执照路径
legal_person_name: "", //法人姓名
@ -304,12 +281,15 @@ export default {
legal_person_id_number: "", //法人身份证号
legal_person_id_images: "", //身份证图片正面路径
legal_person_id_images2: "", // 身份证图片反面路径
businessLicenseFiles: [],
specialLicenseFiles: [],
},
form2: {
individual_id_number: "",
individual_id_images: "",
individual_id_images2: "",
},
license_type_name: "",
action: "",
fileList: [],
fileList2: [],
@ -321,28 +301,28 @@ export default {
[
{
id: 1,
name: "许可证",
name: "无需特殊资质",
},
{
id: 2,
name: "特许证件",
name: "需许可证资质",
},
{
id: 3,
name: "其他证件",
name: "需特许证件资质",
},
],
],
rules: {
entity_type: {
required: true,
trigger: ["blur"],
trigger: ["change", "blur"],
message: "请选择您的许可证类型",
},
biz_license_company: {
required: true,
message: "请输入公司名称",
trigger: ["blur"],
trigger: ["change", "blur"],
},
legal_person_name: {
required: true,
@ -389,7 +369,7 @@ export default {
individual_id_number: [
{
required: true,
message: "请输入身份证号",
message: "请输入个人身份证号",
trigger: ["change", "blur"],
},
{
@ -407,8 +387,13 @@ export default {
};
},
onReady() {
this.$refs["uForm"].setRules(this.rules);
this.$refs["uForm2"].setRules(this.rules2);
this.$refs["uForm"]?.setRules(this.rules);
this.$refs["uForm2"]?.setRules(this.rules2);
},
mounted() {
this.license_type_name = this.columns?.[0].filter(
(item) => item.id == this.form.license_type
)?.[0].name;
},
methods: {
getOcrText(filePath, file, type) {
@ -428,8 +413,7 @@ export default {
if (formDataStr !== "") {
formDataStr += "&";
}
formDataStr +=
encodeURIComponent(key) + "=" + encodeURIComponent(value);
formDataStr += encodeURIComponent(key) + "=" + encodeURIComponent(value);
});
const imgOcrRes = await imgOcrResultApi(formDataStr);
@ -450,10 +434,11 @@ export default {
switch (type) {
case "businessLicense":
this.fileList.push(group);
this.form.businessLicenseFiles.push(group);
break;
case "licenseNumber":
this.fileList2.push(group);
this.form.specialLicenseFiles.push(group);
break;
case "idFront":
this.fileList3.push(group);
@ -500,36 +485,34 @@ export default {
switch (type) {
case "businessLicense":
var ocr = await this.getOcrText(
imgUrl,
item,
orcImgTypeConf.BUSINESS_LICENCE
);
var ocr = await this.getOcrText(imgUrl, item, orcImgTypeConf.BUSINESS_LICENCE);
this.form.biz_license_company = ocr.bizLicenseCompanyName;
this.form.legal_person_name = ocr.bizLicenseOwnerName;
this.form.biz_license_number = ocr.bizLicenseCreditCode;
console.log("BUSINESS_LICENCE", ocr);
break;
case "licenseNumber":
break;
case "idFront":
var ocr = await this.getOcrText(
imgUrl,
item,
orcImgTypeConf.ID_CARD_FRONT
);
var ocr = await this.getOcrText(imgUrl, item, orcImgTypeConf.ID_CARD_FRONT);
this.form.legal_person_name = ocr.name;
this.form.legal_person_id_number = ocr.idNumber;
console.log("ID_CARD_FRONT", ocr);
break;
case "personIdFront":
var ocr = await this.getOcrText(imgUrl, item, orcImgTypeConf.ID_CARD_FRONT);
this.form2.individual_id_number = ocr.idNumber;
console.log("personIdFront", ocr);
break;
}
},
deletePic(e, type) {
switch (type) {
case "businessLicense":
this.fileList.splice(0, 1);
this.form.businessLicenseFiles.splice(0, 1);
break;
case "licenseNumber":
this.fileList2.splice(e.index, 1);
this.form.specialLicenseFiles.splice(e.index, 1);
let arr = this.form.license_image.split(",");
arr.splice(e.index, 1);
this.form.license_image = arr.join(",");
@ -550,8 +533,8 @@ export default {
},
handleSubsection(e) {
this.active = e;
// this.fileList = [];
// this.fileList2 = [];
// this.form.businessLicenseFiles = [];
// this.form.specialLicenseFiles = [];
// this.fileList3 = [];
// this.fileList4 = [];
// this.fileList5 = [];
@ -612,7 +595,7 @@ export default {
auditItem.entity_type = this.active + 1;
// auditItem.license_type = this.licenseType.id;
// auditItem.license_image = JSON.stringify(this.fileList2.join(","));
// auditItem.license_image = JSON.stringify(this.form.specialLicenseFiles.join(","));
uni.setStorageSync("auditItem", auditItem);
@ -658,11 +641,18 @@ export default {
});
}
},
handlePrev() {
uni.navigateBack();
},
handleCancel() {
this.showPicker = false;
},
handleConfirm(e) {
this.form.license_type = e.value[0].name;
this.form.license_type = e.value[0].id;
this.license_type_name = e.value[0].name;
this.licenseType = e.value[0];
this.showPicker = false;
@ -674,9 +664,12 @@ export default {
};
</script>
<style lang="scss">
.shop-2-container {
<style lang="scss" scoped>
page {
background: #f2f2f2;
}
.shop-2-container {
// background: #f2f2f2;
// height: 100vh;
.u-navbar {
@ -689,7 +682,7 @@ export default {
.up-block {
background: #fff;
padding: 24rpx;
padding: 24rpx 24rpx 0;
margin-bottom: 20rpx;
.up-title {
@ -701,8 +694,8 @@ export default {
/deep/.shop2-2-upload {
.u-upload__button {
// background: url("../../static/shenhe-bg1.png");
background-image: url("../../static/business-license-bg.png");
background-size: 100% 100%;
// background: url("../../static/business-license-bg.png");
// background-size: 100% 100%;
}
}
@ -786,16 +779,7 @@ export default {
}
.btn-content {
// position: fixed;
bottom: 40rpx;
width: 94%;
padding: 48rpx 24rpx;
}
.btn-next {
border-radius: 16rpx;
background: #4b71ff;
color: #fff;
padding: 30rpx 48rpx 88rpx;
}
.btn-login-out {
@ -807,4 +791,4 @@ export default {
color: red;
}
}
</style>
</style>

28
java-mall-app-shop-admin/pages/audit/shop3.vue
View File

@ -1,11 +1,13 @@
<template>
<view class="shop-3-container">
<u-navbar :autoBack="true" :safeAreaInsetTop="true" title="填写店铺信息第3步 / 共3步">
<u-navbar :autoBack="true" :safeAreaInsetTop="true" title="资金结算信息">
<template slot="right">
<view class="btn-login-out" @click="loginOut">退出登录</view>
</template>
</u-navbar>
<u-form :model="form" ref="uForm" label-width="90">
<view class="from1">
<u-form :model="form" ref="uForm" label-width="90">
<u-form-item label="开户名称" required prop="account_holder_name">
<u-input v-model="form.account_holder_name" placeholder="请输入开户名称" />
</u-form-item>
@ -55,6 +57,8 @@
></u-icon>
</u-form-item>
</u-form>
</view>
<lzcPicker
:pickerList="bankList"
@ -104,7 +108,9 @@
</tui-dropdown-list>
<view class="btn-content">
<u-button class="btn-submit" @click="handleSubmit">提交审核</u-button>
<view class="myui_check_text">检查并确认资金结算信息无误</view>
<u-button text="提交审核" color="#4b71ff" @click="handleSubmit"></u-button>
<u-button text="上一步" class="myui_btn_prev" @click="handlePrev"></u-button>
</view>
<u-toast ref="uToast" />
@ -208,6 +214,10 @@ export default {
this.firstBranchBankLoad = true;
},
handlePrev() {
uni.navigateBack()
},
async handleSubmit() {
let valid = this.$refs.uForm.validate().then((valid) => {
return valid;
@ -310,8 +320,6 @@ export default {
<style lang="scss">
.shop-3-container {
padding: 24rpx;
::v-deep .tui-dropdownlist-show {
box-shadow: 1rpx 1rpx 20rpx rgba(100, 100, 100, 0.1);
border: 1rpx solid rgba(100, 100, 100, 0.1);
@ -363,11 +371,13 @@ export default {
height: 88rpx;
}
.from1{
padding: 24rpx 24rpx 24rpx 36rpx;
}
.btn-content {
position: relative;
bottom: 24rpx;
width: 94%;
padding: 48rpx 24rpx;
padding: 30rpx 24rpx 88rpx;
}
.btn-submit {

10
java-mall-app-shop-admin/styles/myui.scss Normal file
View File

@ -0,0 +1,10 @@
.myui_check_text{
color: #999;
padding: 20rpx 0 24rpx;
text-align: center;
font-size: 28rpx;
}
.myui_btn_prev {
margin-top: 20rpx;
}