@extends('layouts.base')
@section('title', "代客下单")
@section('content')
<style>
    .rightlist #app .rightlist-head{line-height:50px;padding:15px 0;}
    .rightlist #app{margin-left:30px;}
    .rightlist #app .el-breadcrumb{padding:30px 0;font-size:16px;}
    /* .el-form-item__label{padding-right:30px;} */
    .tip{font-size:12px;color:#999;font-weight:500}
    .rightlist-head-con{padding-right:20px;font-size:16px;color:#888;}
    /* .rightlist-head-con{float:left;padding-right:20px;font-size:16px;color:#888;} */
    .el-tag{font-weight:700;font-size:15px;margin-bottom:30px;}
    .el-icon-edit{font-size:16px;padding:0 15px;color:#409EFF;cursor: pointer;}
    /* 滑块选择小白点 */
    .el-switch.is-checked .el-switch__core::after {left: 100%;margin-left: -17px;}
    .el-switch__core::after {content: "";position: absolute;top: 1px;left: 1px;border-radius: 100%;transition: all .3s;width: 16px;height: 16px;background-color: #fff;}
    .tip1{font-size:12px;color:red;font-weight:500}
    [v-cloak]{
        display:none;
    }
</style>
<div class="rightlist">
    <div id="app"  v-cloak v-loading="loading">
        <div class="rightlist-head">
            <div class="rightlist-head-con">代客下单</div>
        </div>
        <el-form label-width="35%">
            <el-form-item label="订单类型">
                <el-radio v-model.number="type" :label="1">平台自营</el-radio>
                <el-radio  v-if="store_enabled == 1" v-model.number="type" :label="2">门店</el-radio>
                <el-radio  v-if="supplier_enabled ==1" v-model.number="type" :label="3">供应商</el-radio>
            </el-form-item>
            <el-form-item v-if="type==2" label="选择门店">
            <el-select v-model="store_id" placeholder="请输入门店Id或者门店名称" filterable remote :remote-method="remoteSearchStoreOrSupplier" :loading="searchStoreOrSupplierLoading" style="width:50%;">
                <el-option v-for="item in storeList" :key="item.id" :label="item.store_name" :value="item.id" ></el-option>
            </el-select>
            </el-form-item>
            <el-form-item v-if="type==3" label="选择供应商">
                <el-select v-model="supplier_id" placeholder="请选择供应商Id或者供应商名称" style="width:50%;" filterable remote :remote-method="remoteSearchStoreOrSupplier" :loading="searchStoreOrSupplierLoading">
                   <el-option v-for="item in supplierList" :key="item.id" :label="item.realname" :value="item.id"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="success" @click="next()">下一步</el-button>
            </el-form-item>
        </el-form>
    </div>
<script>
    var app = new Vue({
        el:"#app",
        delimiters: ['[[', ']]'],
        data() {
            let store_enabled = {{  $store_enabled }};
            let supplier_enabled = {{  $supplier_enabled }};
            // console.log(store_enabled)
            // console.log(supplier_enabled)
            return{
                type:1,
                store_id:"",
                store_enabled:store_enabled,
                supplier_enabled:supplier_enabled,
                supplier_id:"",
                loading:false,
                table_loading:false,
                rules:{},
                 //分页
                total:0,
                per_size:0,
                current_page:0,
                rules:{},
                storeList:[],
                supplierList:[],
                searchStoreOrSupplierLoading:false
            }
        },
        created() {

        },
        methods: {
            remoteSearchStoreOrSupplier(keyword){
                if(keyword==""){
                    return;
                }
                this.searchStoreOrSupplierLoading=true;
                this.$http.post("{!! yzWebFullUrl('plugin.help-user-buying.admin.index.get-source') !!}",{
                    source_input:keyword,
                    source:this.type==2?'store-cashier':'supplier'
                }).then(res=>{
                    this.searchStoreOrSupplierLoading=false;
                    if(res.data.result){
                        return res.data.data;
                    }
                    return Promise.reject(res.data);
                }).then(({ stores,supplier })=>{
                    if(this.type==2){
                        this.storeList=stores;
                    }else{
                        this.supplierList=supplier;
                    }
                }).catch(err=>{
                    this.$message.error(err.msg);
                })
            },
            next(){
                if(this.type==1) {
                    window.location.href="{!! yzWebFullUrl('plugin.help-user-buying.admin.index.shop-index') !!}";
                } else if(this.type==2) {
                    if(!this.store_id) {
                        this.$message.error("请选择门店!");
                        return;
                    }
                    window.location.href="{!! yzWebFullUrl('plugin.help-user-buying.admin.index.store-index',['store_id' => '']) !!}"+this.store_id;
                } else if(this.type==3) {
                    if(!this.supplier_id) {
                        this.$message.error("请选择供应商!");
                        return;
                    }
                    window.location.href="{!! yzWebFullUrl('plugin.help-user-buying.admin.index.supplier-index',['supplier_id' => '']) !!}"+this.supplier_id;
                }
                // window.location.href="{!! yzWebFullUrl('plugin.help-user-buying.admin.index.store-index',['store_id' => '']) !!}"+;
                //         window.location.href='{!! yzWebFullUrl('plugin.help-user-buying.admin.index.shop-index') !!}';
                // window.location.href='{!! yzWebFullUrl('plugin.help-user-buying.admin.index.shop-index') !!}';
            },
            // 分页
            currentChange(page) {
                var that = this;
                let json = {page:page,id:that.id,leader_name:that.search_form.leader_name,start_time:that.search_form.start_time,
                            member_num:that.search_form.member_num,status:that.search_form.status,order_sn:that.search_form.order_sn};
                that.getData(json);
            },
            // 搜索
            search() {
                var that = this;
                console.log(that.search_form)
                let json = {page:1,id:that.id,leader_name:that.search_form.leader_name,start_time:that.search_form.start_time,
                            member_num:that.search_form.member_num,status:that.search_form.status,order_sn:that.search_form.order_sn};
                that.getData(json);
            },

            submitForm() {
                var that = this;
                that.all_loading = true;
                that.$http.post("{!! yzWebFullUrl('plugin.wechat.admin.reply.controller.default-reply.add') !!}",{keywords_id:that.data.id}).then(response => {
                    console.log(response);
                    if(response.data.result==1){
                        that.keyword_list = response.data.data;
                        that.$message.success("保存成功！");
                        window.location.href='{!! yzWebFullUrl('plugin.wechat.admin.reply.controller.default-reply.index') !!}';
                    }
                    else{
                        that.$message.error(response.data);
                    }
                    that.all_loading = false;
                }),function(res){
                    console.log(res);
                    that.all_loading = false;
                };
            },
        },
    })

</script>
@endsection