Gong-Ying-Lian-API/app/admin/view/shop/customer_spec/index.html

<template>
    <el-card shadow="never">
        <yun-table
                :columns="columns"
                ref="yuntable"
                @render="onTableRender"
                toolbar="refresh,add,edit,del"
                :auth="{
                    add:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','add')},
                    edit:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','edit')},
                    del:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','del')},
                    multi:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','multi')},
                }"
                :extend="extend">
        </yun-table>
    </el-card>
</template>
<script>
import table from "@components/Table.js";
export default{
    components:{
        'YunTable':table
    },
    data:{
        extend:{
            index_url: 'shop/customer_spec/index',
            add_url: 'shop/customer_spec/add',
            edit_url: 'shop/customer_spec/edit',
            del_url: 'shop/customer_spec/del',
            multi_url: 'shop/customer_spec/multi',
        },
        columns:[
            {checkbox: true,selectable:function (row,index){
                //可以根据业务需求返回false让某些行不可选中
                return true;
            }},
            {field:"id",title:"主键",operate:false},
            {field:"customer.name",title:"客户ID"},
            {field:"variety",title:"品种",width: 200, operate: false,formatter:function (data) {
                data = JSON.parse(data);
                let res = "";
                for (var key in Object(data)) {
                   res += data[key]['label'] +'-'
                }
                return res.replace(/-+$/, '')
            }},
            {field:"specs",title:"品种规格",width: 200, operate: false,formatter:function (data) {
                data = JSON.parse(data);
                let res = "";
                for (var key in Object(data)) {
                   res += data[key]['name'] +'-'
                }
                return res.replace(/-+$/, '')
            }},
            {field:"create_time",title:"创建时间",operate:"daterange",formatter:Yunqi.formatter.datetime},
            {field:"update_time",title:"修改时间",operate: false,formatter:Yunqi.formatter.datetime},
            {
                field: 'operate',
                title: __('操作'),
                width:130,
                action:{
                    edit:function(row){
                        //可以根据业务需求返回false让按钮不显示
                        return true
                    },
                    del:true,
                }
            }
        ]
    },
    //页面加载完成时执行
    onLoad:function(query){
        console.log(query);
    },
    //页面初始显示或在框架内显示时执行
    onShow:function(){

    },
    //页面在框架内隐藏时执行
    onHide:function(){

    },
    //页面在框架内关闭时执行
    onUnload:function(){

    },
    methods: {
        onTableRender:function(list){
            //表格渲染完成后执行
            /**
             * table常用方法
             * this.$refs.yuntable.reset();//重新渲染整个组件，当columns修改时，需要重新渲染表格才能生效，可以执行该方法。
             * this.$refs.yuntable.reload();//保持当前的page，重新获取数据
             * this.$refs.yuntable.submit();//返回第一页，重新获取数据
             * this.$refs.yuntable.expandAllTree();//树形表格展开所有节点
             * this.$refs.yuntable.expandTree(topid);//树形表格展开指定节点
             */
        }
    }
}
</script>
<style>
</style>