Skip to content

G
groupPurchase-miniapp
Commit e384bf5a authored by 刘玉宏's avatar 刘玉宏
Browse files
Options

Merge branch 'master' of http://gitlab.platform.xinhuaapp.com/pengjiani/groupPurchase-miniapp

parents 68c2b300 0fb422cd
Show whitespace changes
Inline Side-by-side
Showing with 542 additions and 89 deletions
src/api/shop.js
View file @ e384bf5a
......@@ -72,3 +72,12 @@ export function applyShop(data) {
data,
});
}
// 申请成为商家
export function editShop(data) {
return request({
url: `/sgyrdd/shop/update`,
method: 'POST',
data,
});
}
src/api/storeEntry.js
View file @ e384bf5a
......@@ -16,4 +16,3 @@ export function applyShop(data) {
data,
});
}
src/pages/storeEntry/detail.vue
View file @ e384bf5a
......@@ -5,48 +5,49 @@
<view class="formmain">
<wd-form ref="form" :model="formData" :rules="rules">
<wd-cell-group border>
<wd-picker
<!--<wd-picker
label="店铺类型"
placeholder="请选择店铺类型"
label-width="100px"
prop="promotion"
v-model="formData.promotion"
:columns="promotionlist"
/>
/>-->
<wd-input
label="店铺名称"
label-width="100px"
prop="xm"
prop="shopName"
clearable
v-model="formData.xm"
v-model="formData.shopName"
placeholder="请输入店铺名称"
/>
<wd-input
label="联系电话"
label-width="100px"
prop="sjh"
prop="tel"
clearable
v-model="formData.sjh"
v-model="formData.tel"
placeholder="请输入联系电话"
/>
<!--获取省市区县--->
<wd-input
label="所在地区"
label-width="100px"
v-model="formData.szdq"
prop="szdq"
v-model="formData.area"
prop="area"
readonly
placeholder="请选择所在地区"
@click="getLocationFn"
@click="chooseShopPosition"
/>
<wd-input
label="详细地址"
label-width="100px"
prop="xxdz"
prop="shopAddress"
clearable
v-model="formData.xm"
v-model="formData.shopAddress"
placeholder="请输入详细地址"
/>
<wd-input
<!--<wd-input
label="小区/学校"
label-width="100px"
v-model="formData.szdq"
......@@ -54,99 +55,165 @@
readonly
placeholder="请选择"
@click="getLocationFn"
/>
/>-->
<view class="flex">
<view class="logo">LOGO/门头照</view>
<view class="shopLogobox">
<wd-upload
:file-list="fileList1"
:file-list="fileListShopLogo"
image-mode="aspectFill"
:action="action"
@change="handleChange1"
@change="handleLogoFileChange"
:limit="1"
class="img1"
:header="headers"
:before-remove="beforeRemove"
></wd-upload>
<view class="errormsg" v-if="shopLogoNull">LOGO/门头照未上传</view>
</view>
</view>
<view class="flex">
<view class="logo">营业执照</view>
<view class="shopLogobox">
<wd-upload
:file-list="fileList1"
:file-list="fileListQualifications"
image-mode="aspectFill"
:action="action"
@change="handleChange1"
@change="handleQualificationsChange"
:limit="1"
class="img1"
:header="headers"
:before-remove="beforeRemove"
></wd-upload>
<view class="errormsg" v-if="qualificationsNull">营业执照未上传</view>
</view>
<view class="flex">
</view>
<view class="flex flexcard">
<view class="logo">身份证照</view>
<view class="cardblock">
<wd-upload
:file-list="fileList1"
:file-list="fileListCardForward"
image-mode="aspectFill"
:action="action"
@change="handleChange1"
@change="handleIndentityForwardChange"
:limit="1"
class="img1"
:header="headers"
:before-remove="beforeRemove"
></wd-upload>
<view class="errormsg" v-if="cardForwardNull">正面照未上传</view>
</view>
<view class="cardblock">
<wd-upload
:file-list="fileListCardBackward"
image-mode="aspectFill"
:action="action"
@change="handleIndentityBackwardChange"
:limit="1"
:header="headers"
:before-remove="beforeRemove"
></wd-upload>
<view class="errormsg" v-if="cardBackwardNull">反面照未上传</view>
</view>
</view>
<view class="flex flexcenter">
<view class="logo">店铺分类{{ chooseCategory.categoryId }}</view>
<view class="shopcatebox">
<view class="text shopcateboxtxt" @click="showclass">
<template v-if="choosedShopInfo.length != 0">
<wd-tag
v-for="(item, index) in choosedShopInfo"
:key="index"
type="danger"
round
>
{{ item.areaName }}
</wd-tag>
</template>
<template v-else>请选择</template>
</view>
<view class="newAddCertification">
<view class="citem" v-for="(item, index) in choosedShopInfo" :key="index">
<text class="titleOfC">请上传{{ item.areaName }}相关经营许可证</text>
<wd-upload
:file-list="fileList1"
:file-list="testFileList[item.areaId]"
image-mode="aspectFill"
:action="action"
@change="handleChange1"
@change="handleCategoyChange($event, item.areaId)"
:limit="1"
class="img1"
:header="headers"
:before-remove="beforeRemove"
></wd-upload>
</view>
<view class="flex">
<view class="logo">店铺分类</view>
<view class="text" @click="showclass">请选择</view>
</view>
<text class="text errormsg" v-if="isCategoryNull">店铺分类未选择</text>
</view>
</view>
<wd-textarea
placeholder="请填写评价"
placeholder="请填写店铺介绍"
label="店铺介绍"
clearable
label-width="100px"
v-model="formData.szdq"
prop="szdq"
v-model="formData.intro"
prop="intro"
/>
<button type="primary" style="width: 80%">提交</button>
<wd-button type="error" width="80%" class="submitBTN" @tap="submitData">提交</wd-button>
</wd-cell-group>
<wd-popup
v-model="show"
position="bottom"
custom-style="height:300px;overflow:auto;"
custom-style="height:500px;overflow:auto;"
@close="handleClose"
>
<view class="hcontent">
<view class="flex1">
<view class="text">取消</view>
<view class="text" @tap="handleClose">取消</view>
<view class="text">请选择</view>
<view class="text">确定</view>
<view class="text" @tap="chooseCategory">确定</view>
</view>
<view class="nr">
<view class="left">
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<view class="name">周边美食</view>
<template v-for="(item, index) in shopCategoryTree" :key="index">
<view
class="name"
@tap="setActiveCategory(index)"
:class="{ active: categoryActiveIndex == index }"
>
{{ item.name }}
</view>
</template>
</view>
<view class="right">
<view class="item">
<view class="hname">生活用品</view>
<template v-for="(item, index) in shopCategoryTree" :key="index">
<view class="item" v-show="categoryActiveIndex == index">
<view
v-for="item1 in shopCategoryTree[index].children"
:key="item1.areaId"
class="miniitem"
>
<view class="hname">
{{ item1.name }}
</view>
<view class="hnr">
<wd-tag round>标签</wd-tag>
<wd-tag round>标签</wd-tag>
<wd-tag round>标签</wd-tag>
<wd-tag round>标签</wd-tag>
<template v-for="sitem in item1.children" :key="sitem.areaId">
<wd-tag
class="tagstyle"
:class="{
active: choosedShopInfo.some(
(item) => item.areaId === sitem.areaId,
),
}"
round
@tap="chooseShopType(sitem.areaId, sitem.name)"
>
{{ sitem.name }}
</wd-tag>
</template>
</view>
</view>
</view>
</template>
</view>
</view>
</view>
......@@ -158,8 +225,163 @@
</template>
<script setup>
import Header from '@/pages/order/components/Header/index.vue';
import { reactive, ref } from 'vue';
const promotionlist = ref([
import { getToken } from '@/utils/auth';
import { ref, reactive } from 'vue';
import { sgyrShopCategory, applyShop, editShop } from '@/api/shop';
// 用户选择的分类
const choosedShopInfo = ref([]);
// 确保choosedShopInfo内是用户最新选择的分类
const chooseShopType = (id, name) => {
let hasSameData = false;
choosedShopInfo.value.forEach((item) => {
if (item.areaId === id) {
hasSameData = true;
}
});
if (!hasSameData) {
choosedShopInfo.value.push({ areaId: id, areaName: name });
} else {
choosedShopInfo.value = choosedShopInfo.value.filter((item) => {
return item.areaId !== id;
});
}
};
const beforeRemove = ({ file, fileList, resolve }) => {
xma.showModal({
title: '提示',
content: '确定删除图片' + file.name + '吗',
success: function (res) {
if (res.confirm) {
xma.showToast({ title: '删除成功', duration: 2000 });
console.log(fileList);
resolve(true);
} else if (res.cancel) {
xma.showToast({ title: '取消删除操作', duration: 2000 });
}
},
});
};
const token = getToken();
// 上传图片地址
const action = ref(import.meta.env.VITE_APP_BASE_URL + '/sgyrdd/file/update');
const headers = ref('');
// const fileDomain = import.meta.env.VITE_APP_IMG_URL;
// 店铺logo图片组
const fileListShopLogo = ref([]);
// 身份证正面图片组
const fileListCardForward = ref([]);
// 身份证反面图片组
const fileListCardBackward = ref([]);
// 店铺资质图片组
const fileListQualifications = ref([]);
// 门头图片上传是否为空
const shopLogoNull = ref(false);
// 身份证正面上传是否为空
const cardForwardNull = ref(false);
// 身份证反面上传是否为空
const cardBackwardNull = ref(false);
// 资质图片上传是否为空
const qualificationsNull = ref(false);
/**
* 图片地址处理
*/
const processingImageAddresses = (fileList) => {
const data = fileList.value.map((item) => {
return JSON.parse(item.response).data.url;
});
return data.join(',');
};
const processingImageAddresses1 = (fileList) => {
const data = fileList.map((item) => {
return JSON.parse(item.response).data.url;
});
return data.join(',');
};
const categoryShopsList = ref({});
const testFileList = ref([]);
const handleCategoyChange = ({ fileList: files }, val) => {
testFileList.value[val] = files;
categoryShopsList.value[val] = processingImageAddresses1(testFileList.value[val]);
};
const handleLogoFileChange = ({ fileList: files }) => {
if (files.length > 0) {
shopLogoNull.value = false;
fileListShopLogo.value = files;
formData.shopLogo = processingImageAddresses(fileListShopLogo);
} else {
shopLogoNull.value = true;
fileListShopLogo.value = [];
}
};
const handleIndentityForwardChange = ({ fileList: files }) => {
if (files.length > 0) {
cardForwardNull.value = false;
fileListCardForward.value = files;
shopPersonalInformation.identityCardFront = processingImageAddresses(fileListCardForward);
} else {
cardForwardNull.value = true;
fileListCardForward.value = [];
}
};
const handleIndentityBackwardChange = ({ fileList: files }) => {
if (files.length > 0) {
cardBackwardNull.value = false;
fileListCardBackward.value = files;
shopPersonalInformation.identityCardReverse = processingImageAddresses(fileListCardBackward);
} else {
cardBackwardNull.value = true;
fileListCardBackward.value = [];
}
};
const handleQualificationsChange = ({ fileList: files }) => {
if (files.length > 0) {
qualificationsNull.value = false;
fileListQualifications.value = files;
categoryShops.qualifications = processingImageAddresses(fileListQualifications);
} else {
qualificationsNull.value = true;
fileListQualifications.value = [];
}
};
const shopCategoryTree = ref([]);
const categoryActiveIndex = ref(0);
const isNewFlag = ref(true);
onLoad((options) => {
headers.value = { Authorization: 'Bearer ' + token };
getShopCategoryFun();
if (options.content === 0) {
isNewFlag.value = false;
}
});
const getShopCategoryFun = async () => {
const res = await sgyrShopCategory();
shopCategoryTree.value = res.data;
// console.log(shopCategoryTree.value);
};
const applyShopFun = async (data) => {
const res = await applyShop(data);
console.log(res);
};
const editShopFun = async (data) => {
const res = await editShop(data);
console.log(res);
};
const setActiveCategory = (index) => {
console.log(index);
categoryActiveIndex.value = index;
choosedShopArr.value = [];
};
/* const promotionlist = ref([
{
value: '1',
label: '连锁直营',
......@@ -168,17 +390,49 @@ const promotionlist = ref([
value: '2',
label: '连锁加盟',
},
]);
]); */
const show = ref(false);
const fileList = ref([
{
url: '1',
},
]);
const handleClose = () => {
show.value = false;
// choosedShopInfo.value = [];
// categoryShopsList.value = {};
// testFileList.value = [];
// choosedShopArr.value = [];
};
let originChooseCategoryLength = 0;
const chooseCategory = () => {
show.value = false;
// 对新增资质上传，添加动态变量绑定
if (choosedShopInfo.value.length > originChooseCategoryLength) {
for (let i = originChooseCategoryLength; i < choosedShopInfo.value.length; i++) {
testFileList.value[choosedShopInfo.value[i].areaId] = [];
// testFileList.value.push({ areaId: choosedShopInfo.value[i].areaId, arr: [] });
}
originChooseCategoryLength = choosedShopInfo.value.length;
}
// 对于移除资质上传，重新匹配choosedShopInfo和categoryShopsList的值
// choosedShopInfo [{ areaId: id, areaName: name },{ areaId: id, areaName: name }]
// categoryShopsList {'3235':'xxxxx','3699':'yyyy'}
for (const key in categoryShopsList.value) {
let hasThisKey = false;
for (let i = 0; i < choosedShopInfo.value.length; i++) {
if (choosedShopInfo.value[i].areaId === key) {
hasThisKey = true;
}
}
if (!hasThisKey) {
delete categoryShopsList.value[key];
}
}
console.log(choosedShopInfo.value);
console.log(categoryShopsList.value);
};
const showclass = () => {
show.value = true;
};
const isCategoryNull = ref(false);
function chooseImage({ fileList: files }) {
xma.chooseImage({
count: 6, // 默认9
......@@ -189,35 +443,159 @@ function chooseImage({ fileList: files }) {
},
});
}
const formData = ref({
systemCode: 'one-centre',
promotion: '',
xm: '',
sfz: '',
sjh: '',
szdq: '',
xxdz: '',
const shopDetail = reactive({
shopName: '', // 店铺名称
intro: '', // 店铺简介
tel: '', // 联系电话
shopLat: 0.0, // 店铺所在纬度
shopLng: 0.0, // 店铺所在经度
shopAddress: '', // 店铺详细地址
province: '贵州', // 省份
city: '贵阳', // 城市
area: '南明', // 区县
shopLogo: '', // 店铺LOGO
transactionStart: '', // 营业开始时间
transactionEnd: '', // 营业结束时间
communities: [], // 绑定小区
});
const shopPersonalInformation = reactive({
identityCardFront: '', // 身份证正面
identityCardReverse: '', // 身份证反面
});
const categoryShops = reactive({
categoryId: '3237', // 分类id
qualifications: '', // 经营资质图片，以,分割
});
const formData = reactive({
shopName: '我是店铺名称', // 店铺名称
intro: '我是店铺简介', // 店铺简介
tel: '13699999999', // 联系电话
shopLat: 0.0, // 店铺所在纬度
shopLng: 0.0, // 店铺所在经度
shopAddress: '', // 店铺详细地址
province: '贵州', // 省份
city: '贵阳', // 城市
area: '南明', // 区县
shopLogo: '', // 店铺LOGO
transactionStart: '', // 营业开始时间
transactionEnd: '', // 营业结束时间
communities: [], // 绑定小区
});
const form = ref();
const test = ref();
const rules = ref({
promotion: [{ required: true, message: '请选择' }],
xm: [{ required: true, message: '请输入店铺名称' }],
sjh: [{ required: true, message: '请输入联系电话' }],
szdq: [{ required: true, message: '请选择' }],
xxdz: [{ required: true, message: '请输入详细地址' }],
shopName: [
{
required: true,
message: '店铺名称不能为空',
},
],
tel: [
{
required: true,
message: '请输入联系电话',
},
{
pattern: /^1[3-9]\d{9}$/,
message: '请输入正确的手机号',
},
],
intro: [{ required: true, message: '请填写店铺介绍' }],
shopAddress: [{ required: true, message: '请输入详细地址' }],
area: [{ required: true, message: '请选择地区' }],
});
const shopDetail = ref({
/* const shopDetail = ref({
shopAddress: '',
});
}); */
const chooseShopPosition = async () => {
const res = await getLocationFn();
formData.shopAddress = res.address;
formData.shopLat = res.lat;
formData.shopLng = res.lon;
console.log(res);
console.log(formData.shopLat, formData.shopLng);
};
const getLocationFn = () => {
return new Promise((resolve, reject) => {
xma.chooseLocation({
success: function (res) {
console.log('位置名称：' + res.name);
console.log('详细地址：' + res.address);
console.log('纬度：' + res.latitude);
console.log('经度：' + res.longitude);
resolve({ lat: res.latitude, lon: res.longitude, name: res.name, address: res.address });
},
fail: function (err) {
return err;
},
});
});
/* xma.chooseLocation({
success: function (res) {
console.log(res);
// console.log('位置名称：' + res.name);
// console.log('详细地址：' + res.address);
// console.log('纬度：' + res.latitude);
// console.log('经度：' + res.longitude);
formData.value.shopAddress = res.address;
formData.value.shopLat = res.latitude;
formData.value.shopLng = res.longitude;
},
}); */
};
const submitData = () => {
categoryShops.categoryId === '' ? (isCategoryNull.value = true) : (isCategoryNull.value = false);
fileListShopLogo.value.length === 0 ? (shopLogoNull.value = true) : (shopLogoNull.value = false);
fileListCardForward.value.length === 0
? (cardForwardNull.value = true)
: (cardForwardNull.value = false);
fileListCardBackward.value.length === 0
? (cardBackwardNull.value = true)
: (cardBackwardNull.value = false);
fileListQualifications.value.length === 0
? (qualificationsNull.value = true)
: (qualificationsNull.value = false);
const dealCategoryData = ref([]);
for (let i = 0; i < choosedShopInfo.value.length; i++) {
dealCategoryData.value.push({
categoryId: choosedShopInfo.value[i].areaId,
qualifications: categoryShopsList.value[choosedShopInfo.value[i].areaId] || '',
});
}
console.log(dealCategoryData.value);
form.value
.validate()
.then(({ valid, errors }) => {
if (valid) {
console.log('成功');
console.log(formData);
if (isNewFlag.value) {
applyShopFun({
shopDetail: formData,
shopPersonalInformation,
categoryShops: dealCategoryData.value,
});
} else {
editShopFun({
shopDetail: formData,
shopPersonalInformation,
categoryShops: dealCategoryData.value,
});
}
}
})
.catch((error) => {
console.log(error, 'error');
});
};
</script>
......@@ -235,6 +613,12 @@ page {
border: 1px solid #d5d1d1;
}
.submitBTN {
display: block;
width: 80%;
margin: 20rpx auto;
}
.wd-tag {
margin-left: 15rpx;
}
......@@ -249,7 +633,7 @@ page {
width: 100%;
justify-content: space-between;
box-sizing: border-box;
border-bottom: 1px solid #ccc;
border-bottom: 1rpx solid #ccc;
background: #fff;
z-index: 6;
}
......@@ -259,21 +643,37 @@ page {
display: flex;
.left {
background: #ebe7e7;
width: 33%;
background: rgb(244, 244, 244);
width: 28%;
height: 100%;
overflow-y: auto;
position: fixed;
.name {
text-align: center;
text-align: left;
padding-left: 20rpx;
height: 40px;
line-height: 40px;
}
.name.active {
background: #fff;
}
}
.right {
background: #fff;
width: 67%;
width: 72%;
position: fixed;
left: 28%;
height: 100%;
overflow-y: auto;
.item {
height: auto;
padding: 10rpx 0px 40rpx 0px;
.miniitem {
margin-bottom: 40rpx;
.hname {
font-size: 14px;
......@@ -281,6 +681,19 @@ page {
padding-bottom: 10px;
border-bottom: 1px solid #ccc;
}
.hnr {
.tagstyle {
margin-bottom: 10rpx;
&.active {
color: #fa4350;
border: 1px solid #fa4350;
}
}
}
}
}
}
}
}
......@@ -288,18 +701,25 @@ page {
.container {
width: 375 * 2rpx;
margin: 0 auto;
height: 100vh;
overflow-y: auto;
padding-bottom: 40rpx;
.content {
padding-top: 88rpx;
padding-bottom: 44rpx;
}
.formmain {
background: #f3f3f3;
}
.flex.flexcard {
.cardblock {
margin-right: 20rpx;
}
}
.flex {
display: flex;
align-items: flex-start;
......@@ -309,10 +729,17 @@ page {
.text {
margin-left: 16px;
width: 60%;
width: 100%;
font-size: var(--wot-input-fs, var(--wot-cell-title-fs, 14px));
color: var(--wot-input-placeholder-color, #bfbfbf);
}
.text.shopcateboxtxt {
margin-left: 0px;
}
.text.errormsg {
color: #fa4350;
}
.logo {
position: relative;
......@@ -321,6 +748,7 @@ page {
display: inline-block;
font-size: var(--wot-input-fs, var(--wot-cell-title-fs, 14px));
line-height: var(--wot-cell-line-height, 24px);
width: 100px;
&::after {
position: absolute;
......@@ -334,7 +762,24 @@ page {
}
.img1 {
margin-left: 16px;
margin-right: 16px;
}
.errormsg {
font-size: 24rpx;
padding-left: 5rpx;
color: #fa4350;
}
}
}
.newAddCertification {
margin-top: 40rpx;
.citem {
margin-bottom: 20rpx;
.titleOfC {
margin-bottom: 10rpx;
display: block;
}
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment