339 lines
8.3 KiB
Vue
339 lines
8.3 KiB
Vue
<template>
|
||
<view class="shopInfo-container">
|
||
<view class="logo-content" @click="updateLogo">
|
||
<u--image
|
||
class="logo-img"
|
||
:src="form.store_logo"
|
||
shape="circle"
|
||
width="110"
|
||
height="110"
|
||
></u--image>
|
||
<view class="logo-text">更换店铺logo</view>
|
||
</view>
|
||
<u-form :model="form" ref="uForm" class="form" label-width="100">
|
||
<u-form-item label="店铺名称" prop="store_name">
|
||
<u-input
|
||
class="form-input"
|
||
disabled
|
||
disabledColor="#fff"
|
||
inputAlign="right"
|
||
v-model="form.store_name"
|
||
placeholder=""
|
||
/>
|
||
</u-form-item>
|
||
<u-form-item label="经营品类" prop="biz_category">
|
||
<u-input
|
||
class="form-input"
|
||
disabled
|
||
disabledColor="#fff"
|
||
inputAlign="right"
|
||
v-model="bizCategory"
|
||
placeholder=""
|
||
/>
|
||
</u-form-item>
|
||
|
||
<u-form-item label="到账比例" prop="split_ratio">
|
||
<u-input
|
||
class="form-input"
|
||
disabled
|
||
disabledColor="#fff"
|
||
inputAlign="right"
|
||
v-model="splitRatio"
|
||
placeholder=""
|
||
/>
|
||
</u-form-item>
|
||
<u-form-item label="合同信息" prop="" @click="skipuContract">
|
||
<u-icon
|
||
style="display: inline-block; margin-left: 8rpx"
|
||
slot="right"
|
||
name="arrow-right"
|
||
size="16"
|
||
color="#cccccc"
|
||
></u-icon>
|
||
</u-form-item>
|
||
|
||
<u-form-item label="营业状态" prop="" class="form-item-20">
|
||
<u-input
|
||
class="form-input"
|
||
disabled
|
||
inputAlign="right"
|
||
disabledColor="#fff"
|
||
color="#5ac725"
|
||
v-model="businessName"
|
||
placeholder=""
|
||
/>
|
||
</u-form-item>
|
||
<u-form-item
|
||
class="form-item-time"
|
||
label="营业时间"
|
||
prop="store_name"
|
||
@click="handleShowTime"
|
||
>
|
||
<u-input
|
||
class="form-input form-input-time"
|
||
disabled
|
||
disabledColor="#ffffff"
|
||
v-model="form.businessTime"
|
||
placeholder="请选择营业时间"
|
||
/>
|
||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||
</u-form-item>
|
||
|
||
<u-form-item label="店铺口号" prop="store_slogan" class="form-item-20">
|
||
<u-input
|
||
class="form-input"
|
||
disabledColor="#fff"
|
||
v-model="form.store_slogan"
|
||
placeholder="请输入店铺口号"
|
||
/>
|
||
</u-form-item>
|
||
<u-form-item label="店铺电话" prop="info.store_tel">
|
||
<u-input
|
||
class="form-input"
|
||
disabledColor="#fff"
|
||
v-model="form.info.store_tel"
|
||
placeholder="请输入店铺电话"
|
||
/>
|
||
</u-form-item>
|
||
|
||
<u-form-item label="店铺所在地" prop="store_slogan">
|
||
<u-input
|
||
class="form-input"
|
||
disabledColor="#fff"
|
||
disabled
|
||
v-model="form.store_area"
|
||
placeholder=""
|
||
/>
|
||
</u-form-item>
|
||
<u-form-item label="店铺详细地址" prop="store_name">
|
||
<u-input
|
||
class="form-input"
|
||
disabledColor="#fff"
|
||
disabled
|
||
v-model="form.store_address"
|
||
placeholder=""
|
||
/>
|
||
</u-form-item>
|
||
<u-form-item label="" prop="store_name" v-if="form.company">
|
||
<view class="shop-description">
|
||
<view class="title">
|
||
店铺介绍（只支持简单的文字，具体请去PC端修改）
|
||
</view>
|
||
<u--textarea
|
||
class="textarea"
|
||
border="surround"
|
||
height="120"
|
||
v-model="form.company.company_description"
|
||
placeholder="请输入内容"
|
||
></u--textarea>
|
||
</view>
|
||
</u-form-item>
|
||
</u-form>
|
||
<view class="btn-content">
|
||
<u-button class="btn-submit" @click="handleSubmit">保存修改</u-button>
|
||
</view>
|
||
<tpfTimeRange
|
||
ref="time"
|
||
:startDefaultTime="form.info.store_opening_hours"
|
||
:endDefaultTime="form.info.store_close_hours"
|
||
@timeRange="handleTimeRange"
|
||
></tpfTimeRange>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { GetShopBaseInfo, UpdataShopInfo } from "../../api/shop";
|
||
import { GetBizCategoryList } from "../../api/audit";
|
||
import { UploadFilePromise } from "../../api/upload";
|
||
import tpfTimeRange from "@/components/tpf-time-range/tpf-time-range.vue";
|
||
export default {
|
||
components: {
|
||
tpfTimeRange,
|
||
},
|
||
data() {
|
||
return {
|
||
form: {
|
||
company: {
|
||
company_description: "",
|
||
},
|
||
info: {
|
||
store_tel: "",
|
||
store_opening_hours: "00:00",
|
||
store_close_hours: "00:00",
|
||
},
|
||
store_logo: "../../static/user-img.png",
|
||
store_slogan: "",
|
||
},
|
||
bizCategoryList: [],
|
||
splitRatio: "",
|
||
bizCategory: "",
|
||
businessName: "营业中",
|
||
showBusinessTimeTPF: false,
|
||
};
|
||
},
|
||
onShow() {
|
||
this.getShopBaseInfo();
|
||
this.getBizCategoryList();
|
||
},
|
||
onReady() {
|
||
// this.$refs["uForm"].setRules(this.rules);
|
||
},
|
||
methods: {
|
||
async getBizCategoryList() {
|
||
let auditInfo = uni.getStorageSync("auditInfo");
|
||
|
||
let res = await GetBizCategoryList();
|
||
if (res && res.status == 200) {
|
||
this.bizCategoryList = res.data;
|
||
if (this.bizCategoryList.length > 0) {
|
||
this.bizCategoryList = this.bizCategoryList
|
||
.reduce((prev, curr) => {
|
||
prev.push(curr);
|
||
if (curr.children.length > 0) {
|
||
prev = prev.concat(curr.children);
|
||
}
|
||
return prev;
|
||
}, [])
|
||
.forEach((item) => {
|
||
if (item.id == auditInfo.biz_category) {
|
||
this.bizCategory = item.category_name;
|
||
}
|
||
});
|
||
}
|
||
}
|
||
|
||
this.splitRatio = auditInfo.split_ratio + "%";
|
||
},
|
||
async getShopBaseInfo() {
|
||
let res = await GetShopBaseInfo();
|
||
if (res && res.status == 200) {
|
||
this.form = res.data;
|
||
this.form.businessTime =
|
||
res.data.info.store_opening_hours +
|
||
"-" +
|
||
res.data.info.store_close_hours;
|
||
}
|
||
},
|
||
skipuContract() {
|
||
uni.navigateTo({
|
||
url: "/pages/my/contract",
|
||
});
|
||
},
|
||
updateLogo() {
|
||
let that = this;
|
||
uni.chooseImage({
|
||
count: 1,
|
||
sizeType: ["compressed"],
|
||
success: async (res) => {
|
||
var imgUrl = res.tempFilePaths[0];
|
||
|
||
let result = await UploadFilePromise(imgUrl);
|
||
if (result && result.status == 200) {
|
||
that.form.store_logo = result.data.url;
|
||
}
|
||
},
|
||
});
|
||
},
|
||
handleShowTime() {
|
||
this.$refs["time"].open();
|
||
},
|
||
handleTimeRange(e) {
|
||
this.form.businessTime = e[0] + e[1];
|
||
this.form.store_opening_hours = e[0];
|
||
this.form.store_close_hours = e[1];
|
||
},
|
||
async handleSubmit() {
|
||
let params = {
|
||
store_logo: this.form.store_logo,
|
||
store_slogan: this.form.store_slogan,
|
||
store_tel: this.form.info.store_tel,
|
||
company_description: this.form.company.company_description,
|
||
};
|
||
|
||
let res = await UpdataShopInfo(params);
|
||
if (res && res.status) {
|
||
uni.showToast({
|
||
title: `修改成功`,
|
||
icon: "success",
|
||
duration: 600,
|
||
});
|
||
}
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import "@/styles/variables.scss";
|
||
.shopInfo-container {
|
||
height: calc(100vh - 88rpx);
|
||
background: #f6f6f6;
|
||
|
||
.logo-content {
|
||
display: flex;
|
||
flex-flow: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
padding: 60rpx 0;
|
||
background: #fff;
|
||
|
||
.logo-img {
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.logo-text {
|
||
color: #ec5d29;
|
||
}
|
||
}
|
||
|
||
.form {
|
||
padding: 40rpx 0;
|
||
|
||
.u-form-item {
|
||
padding: 0 32rpx;
|
||
border-top: 1px solid #f4f4f4;
|
||
background: #fff;
|
||
|
||
.form-input {
|
||
background: #fff;
|
||
}
|
||
|
||
.form-input-time {
|
||
outline: none;
|
||
}
|
||
|
||
.shop-description {
|
||
display: flex;
|
||
flex-flow: column;
|
||
|
||
.title {
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.textarea {
|
||
border: 1px solid #f4f4f4;
|
||
width: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.form-item-20 {
|
||
margin-top: 40rpx;
|
||
}
|
||
|
||
.btn-content {
|
||
margin: 0 auto;
|
||
padding: 48rpx 24rpx;
|
||
width: 80%;
|
||
}
|
||
|
||
.btn-submit {
|
||
height: 88rpx;
|
||
border-radius: 48rpx;
|
||
background: $base-color;
|
||
color: #fff;
|
||
}
|
||
}
|
||
</style>
|