Files
BMS/bms-front/src/views/price/basic/redline/components/RedlineExpiredDrawer.vue
T

149 lines
4.7 KiB
Vue

<template>
<el-drawer v-model="visible" size="960px" :title="title" append-to-body>
<el-form :inline="true" @submit.prevent>
<el-form-item label="产品代码">
<el-input
v-model="queryParams.productCode"
placeholder="产品代码"
clearable
style="width: 160px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="产品名称">
<el-input
v-model="queryParams.productName"
placeholder="产品名称"
clearable
style="width: 160px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="失效时间段">
<el-date-picker
v-model="dateRange"
type="daterange"
value-format="YYYY-MM-DD"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
style="width: 260px"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="list" border max-height="calc(100vh - 260px)" empty-text="暂无失效产品">
<el-table-column label="产品代码" prop="productCode" min-width="110" show-overflow-tooltip />
<el-table-column label="产品名称" prop="productName" min-width="140" show-overflow-tooltip />
<el-table-column label="时效等级" prop="serviceLevel" width="90" align="center" />
<el-table-column label="走货属性" prop="cargoAttr" min-width="110" show-overflow-tooltip />
<el-table-column label="目的区域" prop="destRegion" width="90" align="center" />
<el-table-column label="生效日期" prop="effectiveDate" width="120" align="center" />
<el-table-column label="失效日期" prop="expireDate" width="120" align="center" />
<el-table-column label="国家数" prop="countryCount" width="80" align="center" />
<el-table-column label="附加费数" prop="surchargeCount" width="90" align="center" />
<el-table-column label="状态" width="90" align="center">
<template #default="{ row }">
<dict-tag :options="bms_product_effect_status" :value="row.status" />
</template>
</el-table-column>
<el-table-column label="更新内容" prop="updateNote" min-width="140" show-overflow-tooltip />
<el-table-column label="操作" width="120" align="center" fixed="right">
<template #default="{ row }">
<el-button
link
type="primary"
title="价格"
icon="Document"
@click="excelFileRef.open(row)"
v-hasPermi="['price:redline:query']"
></el-button>
<el-button
link
type="primary"
title="红线价明细"
icon="View"
@click="emit('view-country', row)"
v-hasPermi="['price:redline:query']"
></el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="loadList"
/>
<redline-excel-file-drawer ref="excelFileRef" />
</el-drawer>
</template>
<script setup>
import { listRedline } from '@/api/price/redline'
import RedlineExcelFileDrawer from './RedlineExcelFileDrawer.vue'
const emit = defineEmits(['view-country'])
const { proxy } = getCurrentInstance()
const { bms_product_effect_status } = useDict('bms_product_effect_status')
const excelFileRef = ref()
const title = '失效价格'
const visible = ref(false)
const loading = ref(false)
const list = ref([])
const total = ref(0)
const dateRange = ref([])
const queryParams = ref({
pageNum: 1,
pageSize: 10,
productCode: undefined,
productName: undefined,
statusGroup: 'expired'
})
function open() {
visible.value = true
resetQuery()
}
function loadList() {
loading.value = true
const p = { ...queryParams.value }
if (dateRange.value && dateRange.value.length === 2) {
proxy.addDateRange(p, dateRange.value)
}
listRedline(p).then(res => {
list.value = res.rows || []
total.value = res.total || 0
}).finally(() => {
loading.value = false
})
}
function handleQuery() {
queryParams.value.pageNum = 1
loadList()
}
function resetQuery() {
dateRange.value = []
queryParams.value = {
pageNum: 1,
pageSize: 10,
productCode: undefined,
productName: undefined,
statusGroup: 'expired'
}
loadList()
}
defineExpose({ open })
</script>