qimall/addons/Mch/backend/views/store/detail-basic.php

<div class="grid-box">
    <el-row :gutter="20">
        <el-col :span="4" v-for="(val, key) in statisticsData" :key="key">
            <div class="grid-item" flex="dir:top main:center">
                <div class="grid-text">
                    <span>{{ val }}</span>
                    <el-popover placement="top-start" width="250" trigger="hover" content="商户订单结算给会员的佣金">
                        <i slot="reference" v-if="key == 'total_settled_amount'" class="el-icon-question grid-icon"></i>
                    </el-popover>
                </div>
                <div class="grid-val">{{ basicForm[key] }}</div>
            </div>
        </el-col>
    </el-row>
</div>

<!-- 基础信息 -->
<el-card class="store-card" shadow="never">
    <div slot="header" class="store-card-head" flex="flex main:justify cross:center">
        <span>基础信息</span>
        <div class="head-btn">
            <el-button :loading="switchStoreLoading" size="small" :type="isDisable ? '' : 'primary'" @click="storeSwitch">{{ isDisable ? '启用' : '禁用' }}商户</el-button>
            <el-button size="small" type="primary" @click="storeEdit('baseDialogVisible')">编辑</el-button>
        </div>
    </div>
    <div class="store-card-body">
        <el-descriptions :column="2">
            <div slot="title" flex="flex cross:center">
                <el-avatar :size="60" :src="basicForm.logo_img"></el-avatar>
                <span class="store-name">{{ basicForm.store_name }}</span>
            </div>
            <el-descriptions-item label="姓名">{{basicForm.shop_owner}}</el-descriptions-item>
            <el-descriptions-item label="手机号">{{basicForm.shop_mobile}}</el-descriptions-item>
            <el-descriptions-item label="类目">{{basicForm.cate_name}}</el-descriptions-item>
            <el-descriptions-item label="商户介绍">{{basicForm.store_desc}}</el-descriptions-item>
            <el-descriptions-item label="营业执照">
                <el-image style="width: 150px; height: 100px" :src="basicForm.license_img"></el-image>
            </el-descriptions-item>
            <el-descriptions-item label="创建时间">{{basicForm.created_at|dateTimeFormat('Y-m-d H:i:s')}}</el-descriptions-item>
            <el-descriptions-item label="到期时间" v-if="basicForm.expire_time==0">无限期</el-descriptions-item>
            <el-descriptions-item label="到期时间" v-else>{{basicForm.expire_time|dateTimeFormat('Y-m-d H:i:s')}}</el-descriptions-item>
        </el-descriptions>
    </div>
</el-card>

<!-- 地址信息/自提点 -->

<!-- 商户分享 -->
<el-card class="store-card" body-style="padding: 0;" shadow="never">
    <div slot="header" class="store-card-head" flex="flex main:justify cross:center">
        <span>商户分享</span>
        <el-button size="small" type="primary" @click="storeEdit('shareDialogVisible')">编辑</el-button>
    </div>
    <div class="store-card-body">
        <el-descriptions :column="2">
            <el-descriptions-item label="分享标题">{{basicForm.share_title}}</el-descriptions-item>
            <el-descriptions-item label="分享描述">{{basicForm.share_desc}}</el-descriptions-item>
            <el-descriptions-item label="分享图片">
                <el-image v-if="basicForm.share_pic" style="width: 150px; height: 100px" :src="basicForm.share_pic"></el-image>
            </el-descriptions-item>
        </el-descriptions>
    </div>
</el-card>

<!-- 客服设置 -->
<el-card class="store-card" body-style="padding: 0;" shadow="never">
    <div slot="header" class="store-card-head" flex="flex main:justify cross:center">
        <span>客服设置</span>
        <el-button size="small" type="primary" @click="storeEdit('serviceDialogVisible')">编辑</el-button>
    </div>
    <div class="store-card-body">
        <el-descriptions :column="1">
            <el-descriptions-item label="外部客服链接">{{ basicForm.customer_service.web_service_url}}</el-descriptions-item>
        </el-descriptions>
    </div>
</el-card>

<div style="padding: 20px 0;">
    <el-button size="small" type="primary" @click="submit('basicForm')">保存</el-button>
</div>

<!-- 基本信息弹窗 -->
<el-dialog title="基本信息" :visible.sync="baseDialogVisible" width="600px">
    <el-form ref="basicForm" :model="basicForm" label-width="80px" size="small">
        <el-form-item label="商户名称">
            <el-input class="width-200" v-model="basicForm.store_name"></el-input>
        </el-form-item>
        <el-form-item label="商户logo">
            <div flex="dir:left">
                <template v-if="basicForm.logo_img">
                    <el-image class="elImages" style="width: 80px; height: 80px" :src="basicForm.logo_img"></el-image>
                    <el-button class="delele-img-btn" size="mini" type="danger" icon="el-icon-close" circle @click="storeDetailDeletePic('logo_img')"></el-button>
                </template>
                <template v-else>
                    <com-attachment :multiple="false" :max="1" type="images" @selected="storeDetailSelectedImg($event, 'logo_img')">
                        <div class="card-upload">
                            <i class="el-icon-plus"></i>
                        </div>
                    </com-attachment>
                </template>
            </div>
        </el-form-item>
        <el-form-item label="手机号">
            <el-input class="width-200" v-model="basicForm.shop_mobile"></el-input>
        </el-form-item>
        <el-form-item label="类目">
            <el-select v-model="basicForm.c_id" placeholder="请选择门店分类">
                <el-option :label="item.name" :value="item.id" :key="index" v-for="(item, index) in categorys"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="营业执照">
            <div flex="dir:left">
                <template v-if="basicForm.license_img">
                    <el-image class="elImages" style="width: 80px; height: 80px" :src="basicForm.license_img"></el-image>
                    <el-button class="delele-img-btn" size="mini" type="danger" icon="el-icon-close" circle @click="storeDetailDeletePic('license_img')"></el-button>
                </template>
                <template v-else>
                    <com-attachment :multiple="false" :max="1" type="images" @selected="storeDetailSelectedImg($event, 'license_img')">
                        <div class="card-upload">
                            <i class="el-icon-plus"></i>
                        </div>
                    </com-attachment>
                </template>
            </div>
        </el-form-item>
        <el-form-item label="到期时间">
            <div>
                <span v-if="basicForm.expire_time">{{basicForm.expire_time | dateTimeFormat('Y-m-d H:i:s')}}</span>
                <span v-else>无限期</span>
                <template>
                    <el-button size="mini" type="primary" @click="editExpireTime=true" style="padding: 6px;margin-left: 10px;">修改有效期</el-button>
                </template>
            </div>
            <div v-if="editExpireTime" style="margin-top: 10px;">
                <el-date-picker v-model="expireDate" type="date" placeholder="选择日期" format="yyyy-MM-dd" align="center" value-format="timestamp" @change="expireDateChange"> </el-date-picker>
            </div>
        </el-form-item>
        <el-form-item>
            <div flex="main:right">
                <el-button type="primary" @click="baseDialogVisible=false">确定</el-button>
            </div>
        </el-form-item>
    </el-form>
</el-dialog>

<!-- 商户分享弹窗 -->
<el-dialog title="商户分享" :visible.sync="shareDialogVisible" width="600px">
    <el-form ref="basicForm" :model="basicForm" label-width="80px" size="small">
        <el-form-item label="分享标题">
            <el-input class="width-200" v-model="basicForm.share_title"></el-input>
        </el-form-item>
        <el-form-item label="分享描述">
            <el-input class="width-200" v-model="basicForm.share_desc"></el-input>
        </el-form-item>
        <el-form-item label="分享图片">
            <div flex="cross:bottom">
                <div flex="dir:left">
                    <template v-if="basicForm.share_pic">
                        <el-image class="elImages" style="width: 80px; height: 80px" :src="basicForm.share_pic"></el-image>
                        <el-button class="delele-img-btn" size="mini" type="danger" icon="el-icon-close" circle @click="storeDetailDeletePic('share_pic')"></el-button>
                    </template>
                    <template v-else>
                        <com-attachment :multiple="false" :max="1" type="images" @selected="storeDetailSelectedImg($event, 'share_pic')">
                            <div class="card-upload">
                                <i class="el-icon-plus"></i>
                            </div>
                        </com-attachment>
                    </template>
                </div>
                <div class="tips-text" style="padding-left: 10px;">建议上传200px*200px图片</div>
            </div>
        </el-form-item>
        <el-form-item>
            <div flex="main:right">
                <el-button type="primary" @click="shareDialogVisible=false">确定</el-button>
            </div>
        </el-form-item>
    </el-form>
</el-dialog>

<!-- 客服设置 -->
<el-dialog title="客服设置" :visible.sync="serviceDialogVisible" width="600px">
    <el-form ref="basicForm" :model="basicForm" label-width="120px" size="small">
        <el-form-item label="客服外部链接">
            <el-input v-model="basicForm.customer_service.web_service_url"></el-input>
        </el-form-item>
        <el-form-item>
            <div flex="main:right">
                <el-button type="primary" @click="serviceDialogVisible=false">确定</el-button>
            </div>
        </el-form-item>
    </el-form>
</el-dialog>