132 lines
3.8 KiB
Vue
132 lines
3.8 KiB
Vue
<template>
|
|
<ATablePage
|
|
ref="tablePage"
|
|
v-bind="tablePageProps">
|
|
<!-- <template #highFormItem="formData">
|
|
<ElFormItem label="产品分类">
|
|
<GoodsCategoryDropTable v-model="formData.goodsCategoryId" :default-biz-type="defaultBizType"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="产品编码">
|
|
<ElInput v-model="formData.sn" placeholder="产品编码"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="产品名称">
|
|
<ElInput v-model="formData.goodsName" placeholder="产品名称"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="创建时间">
|
|
<ADtPicker v-model="formData.createTimes" :change-handler="research"/>
|
|
</ElFormItem>
|
|
</template> -->
|
|
<template #simpleFormItem="formData">
|
|
<ElFormItem>
|
|
<ElInput v-model="formData.keywords" placeholder="产品名称/编码"/>
|
|
</ElFormItem>
|
|
</template>
|
|
<template #columns>
|
|
<ElTableColumn label="产品编码" prop="sn"/>
|
|
<ElTableColumn label="图片" width="100">
|
|
<template #default="{ row }">
|
|
<el-image :preview-src-list="[AppApi.fileUrl(row.picture)]" :src="AppApi.fileUrl(row.picture)" preview-teleported show-progress style="width: 32px; height: 32px"/>
|
|
</template>
|
|
</ElTableColumn>
|
|
<ElTableColumn label="产品名称" prop="goodsName"/>
|
|
<ElTableColumn label="规格" prop="specParams"/>
|
|
|
|
<ElTableColumn label="是否可用" prop="canuse">
|
|
<template #default="{row}">
|
|
<ElSwitch v-model="row.canuse" @change="enableGoodsHandler($event as boolean,row.id)"/>
|
|
</template>
|
|
</ElTableColumn>
|
|
<ElTableColumn label="备注" prop="memo"/>
|
|
<ElTableColumn label="创建时间" prop="createTime" width="160"/>
|
|
</template>
|
|
<GoodsForm ref="goodsForm" :default-biz-type="defaultBizType" :research="research"/>
|
|
</ATablePage>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import GoodsApi from '@/pages/gds/goods/goods-api.ts'
|
|
import GoodsForm from '@/pages/gds/goods/GoodsForm.vue'
|
|
import AppApi from '@/common/app/app-api.ts'
|
|
import ATablePage, {
|
|
type ATablePageInstance,
|
|
buildTablePageProps,
|
|
} from '@/components/a-page/a-table-page/ATablePage.tsx'
|
|
import { bizType } from '@/pages/gds/goods-category/constants.ts'
|
|
|
|
const props = defineProps<{
|
|
defaultBizType: typeof bizType[number]['val']
|
|
}>()
|
|
|
|
const goodsFormIns = useTemplateRef<InstanceType<typeof GoodsForm>>('goodsForm')
|
|
|
|
const tablePageIns = useTemplateRef<ATablePageInstance>('tablePage')
|
|
|
|
function research() {
|
|
tablePageIns.value?.doSearch()
|
|
}
|
|
|
|
const tablePageProps = buildTablePageProps({
|
|
pageLayout: {
|
|
enableHighForm: false,
|
|
},
|
|
searchForm: {
|
|
defaultData: {bizType: props.defaultBizType},
|
|
highForm: {
|
|
contentWidth: 320,
|
|
},
|
|
paging(param: GoodsTypes.SearchGoodsParam) {
|
|
return GoodsApi.paging(param)
|
|
},
|
|
},
|
|
toolBar: {
|
|
leftTools: [
|
|
{
|
|
icon: 'Plus',
|
|
label: '新建',
|
|
action() {
|
|
goodsFormIns.value?.open()
|
|
},
|
|
},
|
|
],
|
|
},
|
|
table: {
|
|
actionColumn: {
|
|
tableActions: [
|
|
{
|
|
tooltip: '编辑',
|
|
icon: 'Edit',
|
|
action({row}) {
|
|
goodsFormIns.value?.open(row)
|
|
},
|
|
},
|
|
{
|
|
icon: 'Delete',
|
|
loading: false,
|
|
type: 'danger',
|
|
tooltip: '删除',
|
|
confirm: {
|
|
title: '是否删除当前数据',
|
|
},
|
|
action({row}) {
|
|
return GoodsApi.del([ row.id! ])
|
|
.then(() => {
|
|
ElMessage.success('删除成功')
|
|
return true
|
|
})
|
|
},
|
|
},
|
|
],
|
|
},
|
|
},
|
|
})
|
|
|
|
|
|
function enableGoodsHandler(enable: boolean, id: string) {
|
|
GoodsApi.enable({enable, id})
|
|
.then(() => {
|
|
ElMessage.success(enable ? '启用成功' : '禁用成功')
|
|
research()
|
|
})
|
|
}
|
|
</script>
|