qimall/backend/modules/admin/views/setting/index.php

<?php
use common\helpers\ComponentHelper;

ComponentHelper::loadComponentView('com-image');
ComponentHelper::loadComponentView('com-attachment');
ComponentHelper::loadComponentView('com-rich-text');
?>
<div id="app" v-cloak>
    <el-card class="box-card" v-loading="loading" shadow="never" style="border:0;min-width: 1200px;" body-style="background-color: #f3f3f3;padding: 10px 0 0;">
        <div class="form_box">
            <template>
                <el-card>
                    <el-form :model="ruleForm" size="small" ref="ruleForm" label-width="150px">
                        <el-tabs v-model="activeName" type="card">
                            <el-tab-pane label="系统设置" name="system">
                                <?=ComponentHelper::loadComponentView('system', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="存储设置" name="storage">
                                <?=ComponentHelper::loadComponentView('storage', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="超限设置" name="limit">
                                <?=ComponentHelper::loadComponentView('limit', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="商城创建同步设置" name="mall-create-syn">
                                <?=ComponentHelper::loadComponentView('mall-create-syn', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="地图设置" name="map">
                                <?=ComponentHelper::loadComponentView('map', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="短信设置" name="sms">
                                <?=ComponentHelper::loadComponentView('sms', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="备份设置" name="backups">
                                <?=ComponentHelper::loadComponentView('backups', __DIR__ . '/'); ?>
                            </el-tab-pane>
                        </el-tabs>
                        <el-button :loading="btnLoading" class="button-item" type="primary" style="margin-top: 24px;" @click="submit" size="small">保存
                        </el-button>
                    </el-form>
                </el-card>
            </template>
        </div>
    </el-card>
</div>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            return {
                loading: false,
                btnLoading: false,
                params: {},

                activeName: 'system',
                setting_group_name:{
                    system:'系统设置',
                    storage:'存储设置',
                    limit:'超限设置',
                    map:'地图设置',
                    sms:'短信设置',
                    backups:'备份设置',
                },
                mallId:'',
                mallList:[],
                mode:[],
                goods:0,
                diy:0,
                material:0,
                aliyunActive: 'domestic',
                submailActive: 'domestic',
                qcloudActive: 'domestic',
                smsSystem: {
                    'platform': {
                        'aliyun': '阿里云',
                        'qcloud': '腾讯云',
                        'submail': '赛邮云',
                    }
                },
                ruleForm: {
                    // 基础设置
                    system: {
                        logo:{title:'站点logo',value:'',remark: '仅支持上传 .jpg .png .ico 格式文件'},
                        name:{title:'网站名称',value:'',remark: '网站名称，最多不超过20个字符'},
                        brief_name:{title:'网站简称',value:'',remark: ''},
                        keyword:{title:'网站关键字',value:'',remark: ''},
                        logo_url:{title:'版权LOGO图片',value:'',remark: ''},
                        copyright:{title:'底部版权信息',value:'',remark: ''},
                        copyright_url:{title:'底部版权url',value:'',remark: '例如:https://www.baidu.com'},
                        copyright_status:{title:'版权开关',value:0,remark: '开启后所有商城都将显示版权信息'},
                        contact_tel:{title:'客服电话',value:'',remark: ''},
                        web_service_url:{title:'客服地址',value:'',remark: '例如:https://www.baidu.com'},
                        product_url:{title:'产品动态链接',value:'',remark: '例如:https://www.baidu.com'},
                        official_url:{title:'官网链接',value:'',remark: '例如:https://www.baidu.com'},
                        h5_url:{title:'H5链接',value:'',remark: '例如:https://h5.qijianshirjcs.com'},
                        cat_h5_url:{title:'发薪猫H5链接',value:'',remark: '例如:https://h5.qijianshirjcs.com'},
                        api_url:{title:'api接口域名',value:'',remark: '例如:https://www.baidu.com'},
                        backend_url:{title:'系统管理后台域名',value:'',remark: '例如:https://www.baidu.com'},
                        static_url:{title:'静态文件域名',value:'',remark: '例如:https://www.baidu.com'},
                        login_desc:{title:'登录页简介',value:'',remark: ''},
                        login_logo:{title:'登录页LOGO',value:'',remark: '建议尺寸：高度100px，宽度自由'},
                        login_bg:{title:'登录页背景图',value:'',remark: '建议尺寸1920*1080'},
                        manage_bg:{title:'管理页背景图',value:'',remark: '建议尺寸1920*1080'},
                        open_register:{title:'开启注册功能',value:'1',remark: ''},
                        credentials:{title:'证件信息是否必填',value:'',remark: ''},
                        open_mobile_login_verify:{title:'是否开启手机验证登录',value:0,remark: ' 开启短信验证码登录，需要开启短信服务，请在"系统设置->短信设置"中开启短信服务,及在"账号管理->账户列表"确认账户已经填写了手机号码。'},
                        registered_bg:{title:'注册页背景图',value:'',remark: '建议尺寸1920*1080'},
                        record_number:{title:'备案号',value:'',remark: '如：粤ICP备17128303号'},
                        record_belong:{title:'备案版权所属',value:'',remark: '如: Copyright © 2018-2020 广东七件事网络科技有限公司版权所有'},
                        public_record:{title:'公网备案',value:'',remark: '如：粤公网安备 44010502001439号'},
                        register_protocol:{title:'注册协议',value:'',remark: ''},
                    },
                    storage:{
                        driver:{
                            title:'存储方式',
                            value:'oss',
                            extra:{
                                local:'本地存储',
                                cos:'腾讯云存储',
                                oss:'阿里云存储',
                                qiniu:'七牛云存储'
                            }
                        }
                    },
                    storage_driver:{
                        local:{title:'本地存储',value:'',remark:'本地服务器存储无需额外配置'},
                        cos:{
                            title:'腾讯云存储',
                            value:{
                                bucket: '',
                                area:'',
                                domain:'',
                                secret_id:'',
                                secret_key:'',
                            }
                        },
                        oss:{
                            title:'阿里云存储',
                            value:{
                                storage_aliyun_bucket: '',
                                storage_aliyun_endpoint:'',
                                storage_aliyun_accesskeyid:'',
                                storage_aliyun_accesskeysecret:'',
                                storage_aliyun_user_url:'',
                                storage_aliyun_transport_protocols:'',
                                img_style_interface:'',
                                arn: '',
                            }
                        },
                        qiniu:{
                            title:'七牛云存储',
                            value:{
                                bucket: '',
                                domain:'',
                                access_key_id:'',
                                access_key_secret:'',
                                img_style_interface:'',
                            }
                        }
                    },
                    limit:{
                        img:{title:'上传图片限制',value:'',remark: '-1:表示无限制，单位:MB'},
                        video:{title:'上传视频限制',value:'',remark: '-1:表示无限制，单位:MB'},
                        diy:{title:'diy组件限制',value:'',remark: '-1:表示无限制，单位:个'}
                    },
                    mall_create_syn:{
                        mall:{title:'商城',value:'',remark: '商城'},
                        goods:{title:'商品',value:'',remark: '商品'},
                        diy:{title:'装修',value:0,remark: '装修'},
                        material:{title:'素材中心',value:0,remark: '素材中心'},
                        mode:{title:'模式',value:[],remark: '模式'},
                    },
                    map:{
                        amap_jsapi_key:{title:'高德地图key',value:'',remark: '请前往高德地图开发者平台申请'},
                        amap_jsapi_secret:{title:'高德地图安全秘钥',value:'',remark: '请前往高德地图开发者平台申请'},
                        qq_jsapi_key:{title:'腾讯地图KEY',value:'',remark: '腾讯地图开发者平台申请'},
                        qq_jsapi_secret:{title:'腾讯地图SECRET',value:'',remark: '腾讯地图开发者平台申请'},
                        is_location:{title:'开启实时定位',value:'0',remark: '开启该功能，需额外花费费用开通地图功能'},
                        qq_jsapi_key_h5: {title: 'H5端腾讯地图KEY', value: '',remark: 'H5端使用的腾讯地图KEY, 请前往腾讯地图开发者平台申请, 使用域名白名单方式'},
                    },
                    sms:{
                        status: {title:"状态",value:'0',remark:''},
                        platform: {title:"平台",value:'aliyun',remark:''},
                        access_key_id: {title:"access_key_id",value:'',remark:''},
                        access_key_secret: {title:"access_key_secret",value:'',remark:''},
                        template_name: {title:"模板签名",value:'',remark:''},
                        int_access_key_id: {title:"access_key_id",value:'',remark:''},
                        int_access_key_secret: {title:"access_key_secret",value:'',remark:''},
                        int_template_name: {title:"模板签名",value:'',remark:''},
                        int_captcha_template_id: {title:"模板ID",value:'',remark:''},
                        int_captcha_template_variable:{title:"模板变量",value:'number',remark:''},
                        mobile: {title:"手机号",value:'',remark:''},
                        captcha_template_id: {title:"模板ID",value:'',remark:''},
                        captcha_template_variable:{title:"模板变量",value:'number',remark:''},

                        // 腾讯云短信
                        qcloud_sdk_app_id: {title:"sdk_app_id", value:'', remark:''}, // 腾讯云SDK AppID
                        qcloud_app_key: {title:"app_key", value:'', remark:''}, // 腾讯云SDK AppID
                        qcloud_secret_id: {title:"secret_id", value:'', remark:''}, // 腾讯云SecretId
                        qcloud_secret_key: {title:"secret_key", value:'', remark:''}, // 腾讯云SecretKey
                        qcloud_mobile: {title:"mobile", value:'', remark:''}, // 手机号
                        qcloud_domestic_sign_name: {title:"sign_name", value:'', remark:''}, // 国内短信签名
                        qcloud_international_sign_name: {title:"sign_name", value:'', remark:''}, // 国际短信签名
                        // 腾讯云短信国内信息
                        domestic_captcha_template_id: {title:"captcha_template_id", value:'', remark:''}, // 验证码模板ID
                        domestic_captcha_template_sign: {title:"captcha_template_sign", value:'', remark:''}, // 验证码模板签名
                        // 腾讯云短信国际信息
                        international_captcha_template_id: {title:"captcha_template_id", value:'', remark:''}, // 验证码模板ID
                        international_captcha_template_sign: {title:"captcha_template_sign", value:'', remark:''}, // 验证码模板签名

                        //赛邮云短信配置
                        submail_app_id:{title: 'submail_app_id', value:'', remark:'',},//appId
                        submail_app_key:{title: 'submail_app_key', value:'', remark:'',},//appKey
                        submail_mobile:{title: 'submail_mobile', value:'', remark:'',},//测试手机号
                        submail_domestic_captcha_template_id: {title:"submail_domestic_captcha_template_id", value:'', remark:''}, // 验证码模板ID
                        submail_domestic_captcha_template_sign: {title:"submail_domestic_captcha_template_sign", value:'', remark:''}, // 验证码模板签名
                    },
                    backups: {
                        is_enable: {title:"是否开启备份", value: 1, remark:''},
                        is_auto: {title:"自动备份", value: 1, remark:''},
                    }
                }
            }
        },
        mounted: function() {
            this.loadData();
        },
        methods: {
            loadData() {
                if(this.loading === true) return;
                this.loading = true;
                request({
                    params: {
                        r: 'admin/setting/index',
                    },
                    method: 'get'
                }).then(e => {
                    this.loading = false;
                    if (e.data.code == 0) {
                        if(e.data.data){//有选中的

                            var data = e.data.data;
                            this.mallList = e.data.data.mallList;

                            Object.keys(this.ruleForm).forEach((key) => {
                                Object.keys(this.ruleForm[key]).forEach((k) => {
                                    if (data[key][k]) {
                                        if (typeof data[key][k].value == 'string' && data[key][k].value.indexOf("{") !== -1) {
                                            // 将json字符串转为对象
                                            this.ruleForm[key][k].value = JSON.parse(data[key][k].value);
                                        }else{
                                            this.ruleForm[key][k].value = data[key][k].value;
                                        }
                                    }
                                });
                            });
                        }
                    }
                }).catch(e => {
                    this.loading = false;
                })
            },
            submit() {
                this.btnLoading = true;
                this.$request({
                    params: {
                        r: 'admin/setting/index',
                    },
                    method: 'post',
                    data: {
                        setting: this.ruleForm,
                    },
                }).then(e => {
                    this.btnLoading = false;
                    if (e.data.code === 0) {
                        this.$message.success(e.data.msg);
                    } else {
                        this.$message.error(e.data.msg);
                    }
                }).catch(e => {
                    this.btnLoading = false;
                });
            },
            updateSuccess(e) {
                this.$message.success('上传成功')
            },
            mapOpen(val) {
                if (val == 1) {
                    this.ruleForm.map.is_location.value = 0;
                    this.$confirm('该功能需额外花费费用开通地图功能才可生效,是否继续开启', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.ruleForm.map.is_location.value = 1;
                    }).catch(() => {
                        this.ruleForm.map.is_location.value = 0;          
                    });
                }
            }
        }
    });
</script>