Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

表格初始化向后台传输查询条件,传不过去;点击删除按钮删除某一行用params也无法传递参数到后台 #171

Open
yantingbin2012 opened this issue Sep 15, 2020 · 3 comments

Comments

@yantingbin2012
Copy link

yantingbin2012 commented Sep 15, 2020

<template>
    <div class="filter-table-demo">
        <nvFilterTable
        :items="items"
            :columns="columns"
            :action="action"
            :pagination="pagination"
            url="/api/index"
            :rowSelect="true"
            :title="title"
            :tips="tips"
        />
    </div>
</template>

<script>

export default {
    name: 'demo-list-list',
    data() {
        return {
         items: [
                   {
                        name: 'name',
                        title: '模板名称',
                        type: 'select',
                        width: '200px',
                        option: [
                            {
                                    name: '全部',
                                    value: 'all'
                                },
                                {
                                    name: '通用上线模板',
                                    value: '通用上线模板'
                                },
                                {
                                    name: '云上产品上线模板',
                                    value: '云上产品上线模板'
                                }
                            ],
                            value: 'all',
                            required: true
                        },
                        {
                            name: 'date',
                            submitAlias: ['startTime', 'endTime'],
                            title: '创建日期',
                            type: 'nvTimeRange',
                            nvType: 'daterangetime',
                            validateType: 'array',
                            dateFormat: 'YYYY-MM-DD HH:mm:ss',
                            value: ['2018-06-13 00:00:03', '2018-06-18 00:00:15'],
                            required: true
                        }
                    ],
            title: '任务单信息',
            tips: '说明: 本表格只包含部分功能示例,详见说明文档: 模板 -> 表格模板',
            // table columns config
            columns: [
                {
                    title: 'ID',
                    key: 'RWD_ID',
                    link: '',
                    width: 100
                },
                {
                    title: '项目名称',
                    key: 'XM_ID',
                    render: (h, obj) => {
                        return h('span',
                            {
                                on: {
                                    click: () => {
                                        alert('您点击了模板名称');
                                    }
                                },
                                style: {
                                    cursor: 'pointer',
                                    color: '#495060'
                                }
                            },
                            [
                                h('nv-icon', {
                                    style: {
                                        marginRight: '5px'
                                    },
                                    props: {
                                        type: 'cube'
                                    }
                                }),
                                obj.row.XM_ID
                            ]);
                    }
                },
               // {
                //    title: '模板说明',
               //     key: 'detail',
              //      render(h, obj) {
              //          if (obj.row.detail === '云上产品请使用该模板') {
               //             return <span style="color: red">{obj.row.detail}</span>;
              //          }
              //          else {
             //               return <span>{obj.row.detail}</span>;
             //           }
             //       }
             //   },
            //    {
            //        title: '模板命令',
             //       key: 'cmd',
            //        color: '#00f',
            //        filters: [
             //           {
              //              label: 'empty',
             //               value: 'empty'
              //          },
             //           {
               //             label: 'release',
               //             value: 'release'
                 //       }
                //    ],
                //    filterMethod(value, row) {
                //        return row.cmd.indexOf(value) > -1;
               //     }
              //  },
               // {
               //     title: '创建日期',
              //      key: 'date',
               //     sortable: true
             //   },
             //   {
             //       title: '创建人',
             //       key: 'person',
             //       link: 'https://www.baidu.com/s?wd={person}',
             //       target: '_blank'
             //   }
            ],
            // page info
            pagination: {
                // 不使用远端分页
                remote: false,
                defaultPageSize: 10,
                pageSizeOptions: [10, 20, 30, 100]
            },
            // table action config, detail see documention:
            action: {
                title: '操作',
                list: [
                    {
                        type: 'nv-icon',
                        icon: 'edit',
                        className: 'delete-icon',
                        // label和icon只能展示一个
                        label: '编辑',
                        link: 'https://www.baidu.com?id={id}',
                        target: '_blank'
                    },
                    {
                        type: 'nv-icon',
                        btnType: 'error',
                        className: 'delete-icon',
                        icon: 'trash-alias',
                        style: {
                            color: '#2d8cf0'
                        },
                        confirm: {
                            title: '删除模板',
                            content: '数据删除后不可恢复,确认删除吗?',
                            okText: '删除',
                            cancelText: '我再想想',
                            api: '/api/user/delete',
                            params:{id : '123'},
                            successTip: '删除成功',
                            autoFresh: true
                        }
                    }
                ]
            }

        };
    }
};
</script>

<style lang="less" >

    .demo-list {

    }
</style>

@yantingbin2012 yantingbin2012 changed the title 表格初始化向后台传输查询条件,传不过去 表格初始化向后台传输查询条件,传不过去;点击删除按钮删除某一行用params也无法传递参数到后台 Sep 15, 2020
@iyuxy
Copy link
Collaborator

iyuxy commented Sep 17, 2020

请先查看下浏览器中的请求发送情况,看参数是否携带发送。

@yantingbin2012
Copy link
Author

![image](https://user-images.githubusercontent.com/71314807/93453613-766cff80-f90c-11ea-847f-8e311cfa3000.png
image
image
打得日志里面携带了,但是后端就是收不到,详情可以查看图片

@iyuxy
Copy link
Collaborator

iyuxy commented Sep 21, 2020

看network
image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants