| New file |
| | |
| | | <script setup> |
| | | import BasicTable from '@/components/basic/BasicTable.vue' |
| | | import request from "@/utils/request" |
| | | import deepClone from "@/utils/deepClone"; |
| | | import {ElMessage} from "element-plus"; |
| | | import router from "@/router"; |
| | | import {onMounted, ref} from "vue"; |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | /*title里的参数设置 |
| | | * { |
| | | * type:{expand,checkbox} 类型 |
| | | * field: 数据指向位置 |
| | | * title: 标题 |
| | | * sortable: 是否可排序 |
| | | * editRender: 是否可编辑 |
| | | * showOverflow: 是否显示省略号 |
| | | * width: 宽度 |
| | | * fixed: left,right是否固定列 |
| | | * slots:插槽类型 |
| | | * filters:[{ data: '' }],slots: { filter: 'num1_filter' }} 表头筛选框 |
| | | * editRender: { name: 'input', attrs: { placeholder: '' } } 数据列是否可编辑 |
| | | * } |
| | | * |
| | | * */ |
| | | |
| | | let tableProp = $ref({ |
| | | title:[ |
| | | |
| | | {type:'expand',fixed:"left",slots: { content:'content' },width: 50}, |
| | | { type: 'checkbox',fixed:"left", title: '选择', width: 80 }, |
| | | { type: 'seq',fixed:"left", title: '自序', width: 80 }, |
| | | {title: '操作', width: 110, slots: { default: 'button_slot' },fixed:"left"}, |
| | | {field: 'prodID', title: '编号', sortable: true,editRender: { name: 'input', attrs: { placeholder: '' } } }, |
| | | {field: 'product', title: '名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'typeName', title: '所属类别', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'query', title: '快速查询', sortable: true}, |
| | | {field: 'remarks', title: '备注', sortable: true,showOverflow:"ellipsis"}, |
| | | {field: 'creator', title: '创建人', sortable: true}, |
| | | {field: 'createTime', title: '创建时间', sortable: true} |
| | | ], |
| | | datas:null, |
| | | //脚部求和 |
| | | footList:['remarks'], |
| | | //筛选条件列 |
| | | filter:{ |
| | | product:'n*' |
| | | }, |
| | | buttons: [ |
| | | //{ code: 'myInsert', name: '新增' }, |
| | | // { code: 'deleteList', name: '删除' }, |
| | | { code: 'checkList', name: '提交' } |
| | | ], |
| | | |
| | | }) |
| | | let flag = $ref(false) |
| | | request.get("/product").then((res) => { |
| | | if(res.code==200){ |
| | | tableProp.datas= res.data |
| | | flag = true |
| | | //console.log(res.data) |
| | | }else{ |
| | | ElMessage.warning(res.msg) |
| | | } |
| | | }) |
| | | |
| | | //接收子组件传过来的选中复选框数据 |
| | | const getCheckList = (row) =>{ |
| | | alert('我接收到子组件传送的确认复选框信息可在控制台查看') |
| | | console.log(row) |
| | | } |
| | | |
| | | |
| | | const getChildren = (row,type) =>{ |
| | | switch (type) { |
| | | case 'edit' :{ |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | |
| | | break |
| | | } |
| | | case 'delete':{ |
| | | alert('我接收到子组件传送的删除信息') |
| | | break |
| | | } |
| | | } |
| | | } |
| | | const getFilterChildren = (param) =>{ |
| | | |
| | | |
| | | } |
| | | |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | |
| | | <div style="width: 100%;height: 100%;"> |
| | | <!-- <el-input v-model="tableProp.filter.product"/>--> |
| | | <basic-table v-if="flag" |
| | | :tableProp="tableProp" |
| | | @getCheckList="getCheckList" |
| | | @getChildren="getChildren" |
| | | @getFilterChildren="getFilterChildren" |
| | | ></basic-table> |
| | | </div> |
| | | </template> |
| | | |
| | | <style scoped> |
| | | |
| | | </style> |