jude-user-recharge/web/src/views/backend/order/distribution/index.vue

<template>
	<div class="default-main ba-table-box">
		<!-- 表格顶部菜单 -->
		<TableHeader :buttons="['refresh', 'columnDisplay',]"></TableHeader>
		<!-- 表格 -->
		<!-- 要使用`el-table`组件原有的属性，直接加在Table标签上即可 -->
		<Table ref="tableRef"></Table>

	</div>
</template>

<script setup lang="ts">
import { ref, reactive, provide, } from 'vue'
import baTableClass from '/@/utils/baTable'
import Table from '/@/components/table/index.vue'
import TableHeader from '/@/components/table/header/index.vue'
import { baTableApi } from '/@/api/common'
import { useI18n } from 'vue-i18n'

defineOptions({
    name: 'order/distribution',
})


const { t } = useI18n()

const baTable = new baTableClass(
	new baTableApi('/admin/order.Distribution/'),
	{
		column: [
			{ label: '编号', prop: 'id', align: 'center', width: 70, operator: '=' },
			{ 
				label: '关联订单编号', 
				prop: 'order_no', 
				align: 'center', 
				minWidth: 160,
			},
			{ 
				label: '分佣产品', 
				prop: 'commission_product', 
				align: 'center', 
				minWidth: 140,
			},
			{ 
				label: '购买人', 
				prop: 'g_name', 
				align: 'center', 
				minWidth: 100,
			},
			{ 
				label: '分佣人', 
				prop: 'f_name', 
				align: 'center', 
				minWidth: 100,
			},
			{ 
				label: '分佣金额', 
				prop: 'commission_amount', 
				align: 'center', 
				minWidth: 120,
			},
			{ 
				label: '佣金比例', 
				prop: 'commission_rate', 
				align: 'center', 
				minWidth: 110,
				formatter: (row: any, column: any, cellValue: any) => {
					return cellValue ? `${cellValue}%` : '-';
				},
			},
			{ 
				label: '创建时间', 
				prop: 'create_time', 
				align: 'center',
				minWidth: 170,
			},
			{
				label: '状态',
				prop: 'status',
				align: 'center',
				render: 'tag',
				custom: {
					'1': 'warning',
					'2': 'success',
					'3': 'info',
				},
				replaceValue: {
					'1': '待结算',
					'2': '已结算',
					'3': '已取消',
				},
				minWidth: 100,
			},
			{
				label: '操作',
				align: 'center',
				width: '180',
				render: 'slot',
				slotName: 'operate',
				operator: false,
			},
		],
		dblClickNotEditColumn: [undefined,],
		filter: {
			limit: 20,
		},
	},
	{
		defaultItems: {
		},
	},
)

baTable.mount()
baTable.getIndex()
provide('baTable', baTable)

// 搜索
const seachList = () => {
	baTable.table.filter!.page = 1
	baTable.table.loading = true
}
</script>
<style scoped lang="scss">

</style>