LocalLivingServicesUniapp/pages/store/brandMessage.vue

<template>
    <view>
        <cu-custom bgColor="bg-fff" :isBack="true">
            <block slot="content"> 品牌信息</block>
        </cu-custom>
        <status v-if="form && form.logoStatus !== null" :status="form.logoStatus" :updateTime="form.logoUpdateTime" :remark="form.logoRemark"></status>
        <view class="tab-top" :style="form && form.logoStatus == null ? 'margin-top: 14upx' : 'margin-top: 144upx;'">
            <form>
                <view class="borderRadiu">
                    <view class=" cu-form-group margin-top1 justify-between">
                        <view class="content ">
                            <text class="text-bold">品牌/logo</text>
                            <i class="text-bg "></i>
                        </view>
                        <!-- <view class="title" style="color: #449AFF;font-size: 26upx;">查看示例</view> -->
                    </view>
                    <view class="customize">
                        <view class="booder-top">
                            <view class="business-img ">
                                <image :src="logoImg ? logoImg : '/static/store/upload1.png'" mode=""
                                @click="businessChange()"></image>
                            </view>
                        </view>

                        <view class="business-prompt">
                            该图片会在门店列表作为门店头像展示，建议上传能代表门店的照片，如品牌Logo，招牌，门牌等; 
                            <br>图片比例1:1，支持png，jpg，jpeg格式，大小不超过5M
                        </view>
                    </view>
                </view>
            </form>
        </view>
        <view class="padding flex sub-bottom">
            <button class="cu-btn round line-gray  shadow" @click="$Router.push({ name: 'settings' })">取消</button>
            <button style="margin-left: 12upx;width:77%" class="cu-btn bg-blue round " @click="sumbit">提交审核</button>
        </view>
    </view>
</template>
<script>
import configService from '../../common/service/config.service'
import { USER_INFO } from "@/common/util/constants"
import status from "./components/status.vue"

export default {
    data(){
        return{
            logoImg: '',
            form:{}
        }
    },
    components:{status},
    async onLoad(data) {
        if (data.params) {
            let obj = JSON.parse(decodeURIComponent(data.params));
            this.form = obj
            this.logoImg=obj.logo
						console.log(obj,this.logoImg)
        }
    },
    methods: {
        async businessChange() {
            let [chooseImageErr, chooseImageRes] = await uni.chooseImage({
                count: 1,
                sizeType: ['compressed']
            });
            let size = chooseImageRes.tempFiles[0].size / 1024 / 1024 < 5;
            if (!size) {
                this.$refs.uToast.show({
                    title: '上传图片大小不能超过 5MB!',
                    type: 'error',
                })
                return false
            }

            if (chooseImageRes) {
                // this.logoImg = chooseImageRes.tempFilePaths[0];
                uni.uploadFile({
                    url: configService.apiUrl + '/sys/common/upload',
                    filePath: chooseImageRes.tempFilePaths[0],
                    name: "file",
                    formData: {
                        'biz': 'temp',
                    },
                    success: (files) => {
                        let data = JSON.parse(files.data);
                        if (data.success) {
                            this.logoImg =configService.apiUrl + '/' + data.message
                        }
                    }
                });
            }
        },
        sumbit(){
            let data={
                merchantId:uni.getStorageSync(USER_INFO).merchantId,
                logo:this.logoImg,
            }
            
            if(this.form.logoStatus==null){
                // this.$http.post('/merchant/localMerchantBrand/add',data).then(res => {
									this.$http.post('/merchant/localMerchantBrand/addNew',data).then(res => {
                    if (res.data.success) {
												uni.showToast({
													icon:'none',
													title:'成功'
												})
                        uni.navigateBack({
                            delta: 1 // 返回的页面数，默认为1
                        })
                    }
                    else {
												uni.showToast({
													icon:'none',
													title:res.data.message
												})
                    }
                })
            }
            else{
                this.$http.post('/merchant/localMerchantBrand/edit',{...data,id:this.form.logoId}).then(res => {
                    if (res.data.success) {
												uni.showToast({
													icon:'none',
													title:res.data.result || '成功'
												})
                        uni.navigateBack({
                            delta: 1 // 返回的页面数，默认为1
                        })
                    }
                    else {
											uni.showToast({
												icon:'none',
												title:res.data.message
											})
                    }
                })
            }
            
        }
    }
}
</script>
<style scoped lang="scss">
page {
    background: #F8F8FA;
}
.tab-top {
    padding: 0 26upx;
}


.borderRadiu {
    background-color: #fff;
    .customize{
        padding: 0 18upx 18upx;
    }
    .title {
        font-size: 30upx;
        // padding: 10px;
    }
    .business-img {
        height: 210upx;
        width: 210upx;
        background-size: cover;
        
        image {
            width: 100%;
            height: 100%;
        }
    }
    .business-prompt{
       padding-top: 16upx;
        font-size: 20upx;
        color: #999999;
    }
}
.booder-top {
    border-bottom: 1px solid rgb(238, 238, 238);
    padding-bottom: 7px;
}
.sub-bottom {
    position: fixed;
    width: 100%;
    bottom: 0;
    background: #FFFFFF;
    border-top: 1px solid #EEEEEE;
}
</style>