yanglao/public/assets/js/backend/service/goods.js

define(['jquery', 'bootstrap', 'backend', 'table', 'form','vue'], function ($, undefined, Backend, Table, Form, Vue) {

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    dragsort_url: '',
                    index_url: 'service/goods/index' + location.search,
                    add_url: 'service/goods/add',
                    edit_url: 'service/goods/edit',
                    multi_url: 'service/goods/multi',
                    import_url: 'service/goods/import',
                    table: 'service_goods',
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                pk: 'id',
                sortName: 'weigh',
                fixedColumns: true,
                fixedRightNumber: 1,
                columns: [
                    [
                         {field: 'id', title: __('商品信息'),operate: false,cellStyle: function () {return {css: {"min-width": "200px"}}},formatter:function (value,row){
                             let result = `<div style="display: flex;align-items: center">
        <img src="${row.image}" alt="" style="width: 92px;height: 92px;">
        <div style="flex: 1;margin-left: 20px;">
            <div style="width: 100%;display: flex;align-items: center;justify-content: space-between">
                <div style="color: #333;font-size: 14px;margin-right: 10px;font-weight:bold;">${row.name}</div>`;
                             
                             if(row.status == 'normal'){
                                 result += `<div style="background: #FFF7E6;height: 26px;display: flex;align-items: center;padding: 0 8px;border-radius: 13px;color: #FFA600;margin-right: 10px;font-size:12px;">已上架</div>`
                             }else {
                                  result += `<div style="background: #F7F7F7;height: 26px;display: flex;align-items: center;padding: 0 8px;border-radius: 13px;color: #A4A9B7;margin-right: 10px;font-size:12px;">已下架</div>`
                             }
                             result += `   
                
                <div style="flex:1"></div>
                <div style="color: #E4484B;font-size: 14px;">¥${row.price}</div>
                <div style="background: rgba(248, 118, 121, 0.10);height: 26px;display: flex;align-items: center;padding: 0 8px;border-radius: 13px;margin-left: 8px;color:rgba(248, 118, 121, 1);"><span style="color: rgba(248, 118, 121, 1)">ID：</span>${row.id}</div>
            </div>
            <div style="color: #666;font-size: 12px;text-align: left;margin: 10px 0;">${row.tag_name}</div>
            <div style="display: flex;align-items: center;">
                <div style="background: #F0FAF3;height: 26px;display: flex;align-items: center;padding: 0 8px;border-radius: 13px;color: #62CB81;margin-right: 10px;font-size:12px;">${row.categoryName}/${row.twoCategoryName}</div>
                <div style="background: rgba(97, 22, 255, 0.07);height: 26px;display: flex;align-items: center;padding: 0 8px;border-radius: 13px;color: rgba(97, 22, 255, 1);margin-right: 10px;font-size:12px;">${row.to_shop_text}</div>
                <div></div>
                <div style="color: #999;font-size: 12px;">销量：${row.salenums}</div>
            </div>
        </div>
    </div>`
                            return result
                        }},
                        {field: 'id', title: __('城市/规格'),operate: false, cellStyle: function () {return {css: {"min-width": "250px"}}},formatter:function (value,row){
                            let result = '';
                            if(row.city){
                                result += `<div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;border-bottom: 1px solid #EEEEEE;">
        <span style="font-size: 14px;color: #999;">城市</span>
        <span style="color: #333333;font-size: 14px;">${row.city}专属</span>
    </div>`
                            }else {
                                 result += `<div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;border-bottom: 1px solid #EEEEEE;">
        <span style="font-size: 14px;color: #999;">城市</span>
        <span style="color: #333333;font-size: 14px;">全国通用</span>
    </div>`
                            }
                            if(row.spec_type == 1){
                                result += `
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;">
        <span style="font-size: 14px;color: #999;">规格</span>
        <span style="color: #6116FF;font-size: 14px;">${row.spec_type_text}</span>
    </div>
                            `
                            }else {
                                 result += `
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;">
        <span style="font-size: 14px;color: #999;">规格</span>
        <span style="color: #1677FF;font-size: 14px;">${row.spec_type_text}</span>
    </div>
                            `
                            }
                            return result
                        }},
                        {field: 'id', title: __('服务者职能'),operate: false,cellStyle: function () {return {css: {"min-width": "200px","max-width": "300px"}}},formatter:function (value,row){
                            let word = row.skillCateName.split(',')
                            let result = '<div style="color: #333;font-size: 14px;margin-bottom: 8px;flex-wrap: wrap;display: flex;align-items: center">';
                            for(let i=0; i < word.length; i++){
                                result += `<div style="margin: 0 8px 8px;">${word[i]}</div>`
                            }
                            result+='</div>'
                            return result
                        }},
                        {field: 'id', title: __('时间设置'),operate: false, cellStyle: function () {return {css: {"min-width": "250px"}}},formatter:function (value,row){
                            return `
                           
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;border-bottom: 1px solid #EEEEEE;">
        <span style="font-size: 14px;color: #999;">最早相应</span>
        <span style="color: #333;font-size: 14px;">${row.response_hour}小时</span>
    </div>
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;">
        <span style="font-size: 14px;color: #999;">可约时段</span>
        <span style="color: #FF1F2B;font-size: 14px;">${row.start_hour}点-${row.end_hour}点</span>
    </div>
                            `
                        }},
                        {field: 'id', title: __('下单设置'),operate: false, cellStyle: function () {return {css: {"min-width": "250px"}}},formatter:function (value,row){
                            return `
                           
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;border-bottom: 1px solid #EEEEEE;">
        <span style="font-size: 14px;color: #999;">是否选择出行</span>
        <span style="color: #62CB81;font-size: 14px;">${row.is_travel_text}</span>
    </div>
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;">
        <span style="font-size: 14px;color: #999;">是否选择服务人员</span>
        <span style="color: #333;font-size: 14px;">${row.choose_skill_type_text}</span>
    </div>
                            `
                        }},
                        {field: 'id', title: __('时间/权重'),operate: false, cellStyle: function () {return {css: {"min-width": "250px"}}},formatter:function (value,row){
                            return `
                           
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;border-bottom: 1px solid #EEEEEE;">
        <span style="font-size: 14px;color: #999;">更新时间</span>
        <span style="color: #333;font-size: 14px;">${row.update_time}</span>
    </div>
    <div style="display: flex;align-items: center;justify-content:space-between;padding: 0 20px;width: 250px;height: 66px;">
        <span style="font-size: 14px;color: #999;">权重</span>
        <span style="color: #FFA600;font-size: 14px;">${row.weigh}</span>
    </div>
                            `
                        }},
                        
                        {checkbox: true,visible: false},
                        {field: 'id', title: __('Id'),visible: false},
                        {field: 'name', title: __('Name'), operate: 'LIKE',visible: false},
                        {field: 'category_id', title: __('Category_id'),visible: false},
                        {field: 'two_category_id', title: __('Two_category_id'),visible: false},

                        {field: 'skill_cate_ids', title: __('Skill_cate_ids'),visible: false},
                        {field: 'type', title: __('Type'), searchList: {"0":__('Type 0'),"1":__('Type 1')}, formatter: Table.api.formatter.normal,visible: false},
                        {field: 'image', title: __('Image'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.image,visible: false},
                        {field: 'images', title: __('Images'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images,visible: false},
                        {field: 'price', title: __('Price'), operate:'BETWEEN',visible: false},
                        {field: 'response_hour', title: __('Response_hour'),visible: false},
                        {field: 'spec_type', title: __('Spec_type'), searchList: {"0":__('Spec_type 0'),"1":__('Spec_type 1')}, formatter: Table.api.formatter.normal,visible: false},
                        // {field: 'flow_path_images', title: __('Flow_path_images'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images},
                        // {field: 'illustrate_images', title: __('Illustrate_images'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images},
                        {field: 'salenums', title: __('Salenums'),visible: false},

                        {field: 'status', title: __('Status'), searchList: {"normal":__('Status normal'),"hidden":__('Status hidden')}, formatter: Table.api.formatter.status,visible: false},
                        {field: 'weigh', title: __('Weigh'), operate: false,visible: false},
                        {field: 'createtime', title: __('Createtime'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime,visible: false},
                        {field: 'updatetime', title: __('Updatetime'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime,visible: false},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate,
                            buttons: [
                                {
                                    name: 'up',
                                    title: __('上架'),
                                    text: __('上架'),
                                    classname: 'btn btn-xs btn-detail btn-ajax',
                                    confirm: '确认上架？',
                                    url: function(row){
                                        return 'service/goods/updateGoodsStatus?status=normal&id='+row.id;
                                    },
                                    success: function (data, ret) {
                                        $(".btn-refresh").trigger('click');
                                    },
                                    hidden:function(row){
                                        if(row.status == 'normal'){
                                            return true;
                                        }
                                    }

                                },
                                {
                                    name: 'down',
                                    title: __('下架'),
                                    text: __('下架'),
                                    classname: 'btn btn-xs btn-down btn-ajax',
                                    confirm: '确认下架？',
                                    url: function(row){
                                        return 'service/goods/updateGoodsStatus?status=hidden&id='+row.id;
                                    },
                                    success: function (data, ret) {
                                        $(".btn-refresh").trigger('click');
                                    },
                                    hidden:function(row){
                                        if(row.status == 'hidden'){
                                            return true;
                                        }
                                    }

                                },
                                {
                                    name: 'list',
                                    title: __('附加项目'),
                                    text: __('附加项目'),
                                    classname: 'btn btn-xs btn-change btn-dialog',
                                    
                                    url: function(row){
                                        return 'service/goodsadd/index?goods_id='+row.id;
                                    },

                                },
                                {
                                    name: 'edit',
                                    text: __('编辑'),
                                    title: __('编辑'),
                                    classname: 'btn btn-xs btn-status btn-dialog',
                                    icon: 'fa fa-list-o',
                                    url: 'service/goods/edit',
                                }
                            ],
                            formatter: Table.api.formatter.operate}
                    ]
                ]
            });

            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        add: function () {
            
            let add = new Vue({
                el: '#app',
                data(){
                    return {
                        category_id: '',
                        two_category_id: '',
                        spec_type: 0,
                        choose_skill_type: 0,
                        categoryList: [{name: '测试',id:1}],
            
                        spu: [{
                                name: '',
                                info: [{name: ''}]
                            }],
    						sku: [],
                    }
                },
                watch:{
                    spu:{
                        deep: true,
                        handler(){
                          let sku = this.combination(this.spu)
                          let arr = [];
                          for(let i = 0; i < sku.length; i++){
                              arr.push({
                                  name: sku[i].join(','),
                                  cost_seconds:'',
                                  price: '',
                                  unit: ''
                              })
                          }
                          this.sku = arr;
                        }
                    },
                    category_id(){
                        console.log(111)
                        this.two_category_id = ''
                    }
                },
                methods:{
                    changeCate(){
                        console.log(1111)
                        Fast.api.ajax({
                                        url: 'service/goods/category',
                                        loading: true,
                                        data: {
                                            pid: this.category_id
                                        }
                                    }, function (ret, res) {
                                        Fast.api.close();
                                    })
                    },
                    changeSpecType(e){
                        console.log(this.spec_type)
                    },
                    addSpuName(){
                        this.spu.push({
                            name: '',
                            info: [{name: ''}]
                        })

                    },
                    delSpuName(index){
                        this.spu.splice(index,1)
                    },
                    delSkuName(key, value){
                        value.splice(key,1)
                    },
                    addSkuName(value){
                        value.push({name: ''})
                    },
                    combination(spu){
                        let result = [[]];
                        spu.map(a=>{
                            var res = [];
                            result.map(b=>{
                                a.info.map(c => {
                                    
                                    res.push([...b,c.name])
                                })
                            })
                            
                            result = res;
                        })
                        return result
                    }
                }
            })
            
            
            Controller.api.bindevent();
            

        },
        edit: function () {
            let add = new Vue({
                el: '#app',
                data(){
                    return {
                        category_id: '',
                        two_category_id: '',
                        spec_type: Config.spec_type,
                        choose_skill_type: Config.choose_skill_type,
                        categoryList: [{name: '测试',id:1}],
                       
                        spu: Config.spec_type === 1 ? Config.spu : [{
                                name: '',
                                info: [{name: ''}]
                            }],
    						sku: Config.spec_type === 1 ? Config.sku :[],
    						status: Config.status
                    }
                },
                watch:{
                    spu:{
                        deep: true,
                        handler(){
                          let sku = this.combination(this.spu)
                          let arr = [];
                          for(let i = 0; i < sku.length; i++){
                              arr.push({
                                  name: sku[i].join(','),
                                  cost_seconds:'',
                                  price: '',
                                  unit: ''
                              })
                          }
                          this.sku = arr;
                        }
                    },
                    category_id(){
                        console.log(111)
                        this.two_category_id = ''
                    }
                },
                
                methods:{
                    changeCate(){
                        console.log(1111)
                        Fast.api.ajax({
                                        url: 'service/goods/category',
                                        loading: true,
                                        data: {
                                            pid: this.category_id
                                        }
                                    }, function (ret, res) {
                                        Fast.api.close();
                                    })
                    },
                    changeSpecType(e){
                        console.log(this.spec_type)
                    },
                    addSpuName(){
                        this.spu.push({
                            name: '',
                            info: [{name: ''}]
                        })

                    },
                    delSpuName(index){
                        this.spu.splice(index,1)
                    },
                    delSkuName(key, value){
                        value.splice(key,1)
                    },
                    addSkuName(value){
                        value.push({name: ''})
                    },
                    combination(spu){
                        let result = [[]];
                        spu.map(a=>{
                            var res = [];
                            result.map(b=>{
                                a.info.map(c => {
                                    
                                    res.push([...b,c.name])
                                })
                            })
                            
                            result = res;
                        })
                        return result
                    }
                }
            })
            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        }
    };
    return Controller;
});