@extends('layouts.base')
@section('title', '基础设置')
@section('content')
    <link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-goods1.css')}}"/>
    <link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-ohter.css')}}"/>
    <style>
        .el-checkbox-group {
            position: relative;
            z-index: 0;
        }

        .el-checkbox {
            margin-top: 10px !important;
        }
    </style>
    <div id='re_content'>

        <div class="con">

            <div class="vue-main-title">
                <div class="title" style="margin-top: 20px"><span
                            style="width: 4px;height: 18px;background-color: #29ba9c;margin-right:15px;display:inline-block;"></span><b>基础设置</b>
                </div>
            </div>

            <div class="setting">
                <el-form ref="form" label-width="15%">
                    <div class="block">

                        <el-form-item label="是否开启企业管理PC端">
                            <template>
                                <el-switch v-model="form.open_state" :active-value="1"
                                           :inactive-value="0"></el-switch>
                            </template>
                        </el-form-item>


                        <el-form-item label="平台名称">
                            <el-input v-model="form.pc_title"
                                      style="width:65%;"></el-input>
                        </el-form-item>

                        <el-form-item label="登录链接">
                            <el-input v-model="form.login_url"
                                      style="width:65%;"></el-input>
                            <el-button type="primary" @click="copy(form.login_url)">复制</el-button>
                        </el-form-item>


                        <el-form-item label="平台Logo">
                            <el-input v-model="form.pc_logo" :disabled="true"
                                      style="width:65%;"></el-input>
                            <el-button type="primary" @click="uploadShow3=true">选择图片</el-button>
                            <div class="tip">建议图片尺寸:300px * 300px</div>
                        </el-form-item>
                        <el-form-item label="" v-if="form.pc_logo_url">
                            <el-link :href="form.pc_logo_url" target="_blank">
                                <el-image :src="form.pc_logo_url"
                                          style="width: 150px;height: 150px"></el-image>
                            </el-link>
                        </el-form-item>

                        <el-form-item label="浏览器标题图标">
                            <el-input v-model="form.pc_favorite_icon" :disabled="true"
                                      style="width:65%;"></el-input>
                            <el-button type="primary" @click="uploadShow2=true">选择图片</el-button>
                            <div class="tip">建议图片尺寸:300px * 300px</div>
                        </el-form-item>
                        <el-form-item label="" v-if="form.pc_favorite_icon_url">
                            <el-link :href="form.pc_favorite_icon_url" target="_blank">
                                <el-image :src="form.pc_favorite_icon_url"
                                          style="width: 150px;height: 150px"></el-image>
                            </el-link>
                        </el-form-item>

                        <el-form-item label="平台登录页广告">
                            <el-input v-model="form.pc_login_left_banner" :disabled="true"
                                      style="width:65%;"></el-input>
                            <el-button type="primary" @click="uploadShow1=true">选择图片</el-button>
                            <div class="tip">建议图片尺寸:750px * 365px</div>
                        </el-form-item>
                        <el-form-item label="" v-if="form.pc_login_left_banner_url">
                            <el-link :href="form.pc_login_left_banner_url" target="_blank">
                                <el-image :src="form.pc_login_left_banner_url"
                                          style="width: 150px;height: 150px"></el-image>
                            </el-link>
                        </el-form-item>


                        <el-form-item label="平台底部版权信息" style="margin-bottom: 60px;">
                            <tinymceee v-model="form.copyright" style="width:70%;"
                                       v-if="form.copyright!==undefined"></tinymceee>
                        </el-form-item>


                    </div>
                </el-form>
            </div>

            <upload-img :upload-show="uploadShow1" :name="chooseImgName1" @replace="changeProp1"
                        @sure="sureImg1"></upload-img>
            <upload-img :upload-show="uploadShow2" :name="chooseImgName2" @replace="changeProp2"
                        @sure="sureImg2"></upload-img>
            <upload-img :upload-show="uploadShow3" :name="chooseImgName3" @replace="changeProp3"
                        @sure="sureImg3"></upload-img>

            <div class="confirm-btn">
                <el-button type="primary" @click="submit">提交</el-button>
            </div>
            </el-form>
        </div>
    </div>

    <script src="{{resource_get('static/yunshop/tinymce4.7.5/tinymce.min.js')}}"></script>

    @include('public.admin.uploadImg')
    @include('public.admin.tinymceee')



    <script>

        var app = new Vue({
            el: "#re_content",
            delimiters: ['[[', ']]'],
            name: 'test',
            data() {
                return {
                    form: {},
                    template_list: {},
                    activeName: 'first',
                    uploadShow1: false,
                    uploadShow2: false,
                    uploadShow3: false,
                    chooseImgName1: '',
                    chooseImgName2: '',
                    chooseImgName3: '',
                }
            },
            created() {
                this.getData();
            },
            mounted() {
            },
            methods: {
                copy(url) {
                    let oInput = document.createElement('input');
                    oInput.value = url;
                    document.body.appendChild(oInput);
                    oInput.select(); // 选择对象;
                    console.log(oInput.value);
                    document.execCommand("Copy"); // 执行浏览器复制命令
                    this.$message({message: '复制成功', type: 'success'});
                    oInput.remove()
                },
                changeProp1(val) {
                    if (val == true) {
                        this.uploadShow1 = false;
                    } else {
                        this.uploadShow1 = true;
                    }
                },
                changeProp2(val) {
                    if (val == true) {
                        this.uploadShow2 = false;
                    } else {
                        this.uploadShow2 = true;
                    }
                },
                changeProp3(val) {
                    if (val == true) {
                        this.uploadShow3 = false;
                    } else {
                        this.uploadShow3 = true;
                    }
                },
                sureImg1(name, image, image_url) {
                    this.form.pc_login_left_banner = image;
                    this.form.pc_login_left_banner_url = image_url;
                },
                sureImg2(name, image, image_url) {
                    this.form.pc_favorite_icon = image;
                    this.form.pc_favorite_icon_url = image_url;
                },
                sureImg3(name, image, image_url) {
                    this.form.pc_logo = image;
                    this.form.pc_logo_url = image_url;
                },
                getData() {
                    this.$http.post('{!! yzWebFullUrl('plugin.business-pc.admin.setting.index') !!}', {is_json: 1}).then(response => {
                        if (response.data.result) {
                            console.log(response.data.result);
                            this.form = response.data.data.setting;
                        } else {
                            this.$message({message: response.data.msg, type: 'error'});
                        }
                    }, response => {
                        this.$message({message: response.data.msg, type: 'error'});
                    })
                },
                submit() {
                    let that = this;
                    if (this.form.websocket_open != 1 && this.form.open_state == 1) {
                        this.websocketOpen()
                    } else {
                        this.postData()
                    }
                },

                websocketOpen() {
                    this.$confirm("检测到websocket没有开启是否同步开启?若是使用项目管理通知功能请点’是‘或自行到系统->系统工具设置(无论是否，该页面设置依然会生效)", '提示', {
                        confirmButtonText: '是',
                        cancelButtonText: '否',
                        type: 'warning'
                    }).then(() => {
                        this.form.websocket_open = 1
                        this.postData()
                    }).catch(() => {
                        this.postData()
                    });
                },
                postData() {
                    this.$http.post('{!! yzWebFullUrl('plugin.business-pc.admin.setting.edit') !!}', this.form).then(response => {
                        if (response.data.result) {
                            this.$message({message: response.data.msg, type: 'success'});
                            this.getData();
                        } else {
                            this.$message({message: response.data.msg, type: 'error'});
                        }
                    }, response => {
                        this.$message({message: response.data.msg, type: 'error'});
                    })
                },
            }
        })

    </script>
@endsection