糟车销售
This commit is contained in:
‘huanghaiixia’
228
src/components/common/contractQtyLngList.vue
Normal file
228
src/components/common/contractQtyLngList.vue
Normal file
@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div style="width: 100%">
|
||||
<a-button type="primary" style="margin-bottom: 10px" @click="addContractAgree" v-if="!disabled">新增行</a-button>
|
||||
<a-table :columns="columns" :data-source="dataListContractAgree" :pagination="false" :scroll="{x: 1300}">
|
||||
<template #headerCell="{ column }">
|
||||
<template v-if="column.dataIndex == 'dateFrom'">
|
||||
<span><span class="redStyle">*</span>开始日期</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'dateTo'">
|
||||
<span><span class="redStyle">*</span>结束日期</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'baseInc'">
|
||||
<span><span class="redStyle">*</span>基础量/增量</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'sort'">
|
||||
<span><span class="redStyle">*</span>优先级</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'qtyGjMonth'">
|
||||
<span><span class="redStyle">*</span>总合同量(吉焦)</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'qtyTonMonth'">
|
||||
<span><span class="redStyle">*</span>总合同量(吨)</span>
|
||||
</template>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'dateFrom'">
|
||||
<a-date-picker v-model:value="record.dateFrom" format="YYYY-MM-DD" :value-format="'YYYY-MM-DD'" :disabled="disabled" @change="dateFromTb(dayjs(record.dateFrom || null), index, record)" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'dateTo'">
|
||||
<a-date-picker v-model:value="record.dateTo" format="YYYY-MM-DD" :value-format="'YYYY-MM-DD'" :disabled="disabled" @change="dateToTb(dayjs(record.dateTo || null), index, record)" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'sort'">
|
||||
<a-input-number v-model:value="record.sort" :disabled="disabled" :min="0" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'baseInc'">
|
||||
<a-select v-model:value="record.baseInc" :disabled="disabled" style="width: 100%" allow-clear>
|
||||
<a-select-option v-for="item in optionSelect.baseIncList" :key="item.code" :value="item.code">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'rateTonGj'">
|
||||
<a-input-number v-model:value="record.rateTonGj" v-if="!disabled"
|
||||
:formatter="value => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')"
|
||||
:disabled="disabled" :min="0" @change="numChange('rateTonGj', record, index)" style="width: 100%" />
|
||||
<div v-else>{{ Number.format(Number.parse(record.rateTonGj || 0),numFormat) }}</div>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'qtyGjMonth'">
|
||||
<a-input-number v-model:value="record.qtyGjMonth" v-if="!disabled"
|
||||
:precision="3" :formatter="value => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')"
|
||||
:disabled="disabled" :min="0" @change="numChange('qtyGjMonth', record, index)" style="width: 100%" />
|
||||
<div v-else>{{ Number.format(Number.parse(record.qtyGjMonth || 0),numFormat) }}</div>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'qtyTonMonth'">
|
||||
<a-input-number v-model:value="record.qtyTonMonth" v-if="!disabled"
|
||||
:precision="3" :formatter="value => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')"
|
||||
:disabled="disabled" :min="0" @change="numChange('qtyTonMonth', record, index)" style="width: 100%" />
|
||||
<div v-else>{{ Number.format(Number.parse(record.qtyTonMonth || 0),numFormat) }}</div>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'zfbyTypeCode'">
|
||||
<a-select v-model:value="record.zfbyTypeCode" :disabled="disabled" style="width: 100%" allow-clear>
|
||||
<a-select-option v-for="item in optionSelect.zfbyTypeCodeList" :key="item.code" :value="item.code">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'qtyGjDay'">
|
||||
{{ Number.format(Number.parse(record.qtyGjDay || 0),numFormat) }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'qtyTonDay'">
|
||||
{{ Number.format(Number.parse(record.qtyTonDay || 0),numFormat) }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'zfbyValue'">
|
||||
<a-input-number v-model:value="record.zfbyValue" :disabled="disabled" :min="0" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'note'">
|
||||
<a-input v-model:value="record.note" :disabled="disabled" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'operation'">
|
||||
<a v-if="!disabled" style="margin-right: 10px" @click="btnCheck(record, index)">删除</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { Card } from 'ant-design-vue';
|
||||
import { ref, watch} from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { message } from 'ant-design-vue';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
const router = useRouter();
|
||||
const numFormat = "###,###,###,###,###,###.000"
|
||||
const { t } = useI18n();
|
||||
const dataListContractAgree = ref([])
|
||||
const columns= ref([
|
||||
{ title: t('序号'), dataIndex: 'index', key: 'index', customRender: (column) => `${column.index + 1}` ,width: 80},
|
||||
{ title: t('开始日期'), dataIndex: 'dateFrom', width:160},
|
||||
{ title: t('结束日期'), dataIndex: 'dateTo', width: 160},
|
||||
{ title: t('基础量/增量'), dataIndex: 'baseInc', width: 130},
|
||||
{ title: t('优先级'), dataIndex: 'sort', width: 100},
|
||||
{ title: t('比值(吨/吉焦)'), dataIndex: 'rateTonGj', width: 150},
|
||||
{ title: t('总合同量(吉焦)'), dataIndex: 'qtyGjMonth', width: 150},
|
||||
{ title: t('总合同量(吨)'), dataIndex: 'qtyTonMonth', width: 150},
|
||||
{ title: t('日合同量(吉焦)'), dataIndex: 'qtyGjDay', width: 120},
|
||||
{ title: t('日合同量(吨)'), dataIndex: 'qtyTonDay', width: 120},
|
||||
{ title: t('照付不议类型'), dataIndex: 'zfbyTypeCode', width: 120},
|
||||
{ title: t('照付不议比例%/量数值'), dataIndex: 'zfbyValue', width: 120},
|
||||
{ title: t('备注'), dataIndex: 'note', width: 200},
|
||||
{ title: t('操作'), dataIndex: 'operation', width: 80, fixed: 'right',align: 'center'},
|
||||
]);;
|
||||
const [register, { openModal:openModal}] = useModal();
|
||||
const props = defineProps({
|
||||
disabled: Boolean,
|
||||
list: Array,
|
||||
optionSelect: Object
|
||||
});
|
||||
const emit = defineEmits(['change']);
|
||||
|
||||
const addContractAgree = () => {
|
||||
dataListContractAgree.value.push({
|
||||
dateFrom: null, dateTo: null, rateTonGj: null, qtyGjMonth: null, qtyTonMonth: null, qtyGjDay: null, qtyTonDay: null
|
||||
})
|
||||
}
|
||||
const dateFromTb = (startValue, index, record) => {
|
||||
if (!startValue) return
|
||||
const endValue = dataListContractAgree.value[index]?.dateTo;
|
||||
if (!startValue || !endValue) {
|
||||
return false
|
||||
}
|
||||
if (startValue.valueOf() > endValue.valueOf()) {
|
||||
message.warning('结束日期须大于等于开始日期')
|
||||
dataListContractAgree.value[index].dateFrom = ''
|
||||
return
|
||||
}
|
||||
dayCount(record)
|
||||
}
|
||||
|
||||
const dateToTb = (endValue, index, record) => {
|
||||
if (!endValue) return
|
||||
const startValue = dataListContractAgree.value[index]?.dateFrom;
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
if (startValue.valueOf() > endValue.valueOf()) {
|
||||
message.warning('结束日期须大于等于开始日期')
|
||||
dataListContractAgree.value.splice(index, 1, { ...dataListContractAgree.value[index], dateTo: '' });
|
||||
return
|
||||
}
|
||||
dayCount(record)
|
||||
}
|
||||
const numChange = (key, record) => {
|
||||
if (key == 'qtyGjMonth') {
|
||||
numCount2(record)
|
||||
dayCount(record)
|
||||
}
|
||||
if (key == 'qtyTonMonth') {
|
||||
numCount1(record)
|
||||
dayCount(record)
|
||||
}
|
||||
if (key == 'rateTonGj') {
|
||||
numCount1(record)
|
||||
numCount2(record)
|
||||
dayCount(record)
|
||||
}
|
||||
}
|
||||
const numCount1 = (record) => {
|
||||
// 总合同量(吉焦 =总合同量(吨)qty_ton_mont*rate_ton_gj比值(吨/吉焦)
|
||||
record.qtyGjMonth = (Number(record.qtyTonMonth) || 0) * (Number(record.rateTonGj) || 0)
|
||||
record.qtyGjMonth = record.qtyGjMonth ? record.qtyGjMonth.toFixed(3) : '0'
|
||||
}
|
||||
const numCount2 = (record) => {
|
||||
// 总合同量(吨) = 总合同量(吉焦)qty_gj_month/rate_ton_gj
|
||||
record.qtyTonMonth = Number(record.rateTonGj) ? (Number(record.qtyGjMonth) || 0) /Number(record.rateTonGj) : 0
|
||||
record.qtyTonMonth = record.qtyTonMonth ? record.qtyTonMonth.toFixed(3) : '0'
|
||||
}
|
||||
const dayCount = (record) => {
|
||||
// 日合同量(吉焦) = 总合同量(吉焦)qty_gj_month/开始日期到结束日期的天数；计算结果保留整数
|
||||
const days = dayjs(record.dateTo).diff(dayjs(record.dateFrom), 'day');
|
||||
record.qtyGjDay = days ? (Number(record.qtyGjMonth) || 0) /days : 0
|
||||
// record.qtyGjDay = parseInt(record.qtyGjDay)
|
||||
record.qtyGjDay = record.qtyGjDay ? record.qtyGjDay.toFixed(3) : '0'
|
||||
// 日合同量(吨) = 月气量(万方)/开始日期到结束日期的天数；计算结果保留4位小数；
|
||||
record.qtyTonDay = days ? (Number(record.qtyTonMonth) || 0) /days : 0
|
||||
record.qtyTonDay = record.qtyTonDay ? record.qtyTonDay.toFixed(3) : '0'
|
||||
}
|
||||
const btnCheck = (record, index) => {
|
||||
dataListContractAgree.value.splice(index, 1)
|
||||
}
|
||||
const getQtyList = () => {
|
||||
return dataListContractAgree.value
|
||||
}
|
||||
watch(
|
||||
() => props.disabled,
|
||||
(val) => {
|
||||
if (val) {
|
||||
let idx2 = columns.value.findIndex(v =>v.dataIndex == 'operation')
|
||||
idx2>-1 && columns.value.splice(idx2, 1)
|
||||
}
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
watch(
|
||||
() => props.list,
|
||||
async (val) => {
|
||||
dataListContractAgree.value = val || []
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
defineExpose({
|
||||
getQtyList,
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.redStyle {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-button type="primary" style="margin-bottom: 10px" v-if="!disabled" @click="onAppro">关联签报</a-button>
|
||||
<a-table :columns="columns" :data-source="dataList" :pagination="false">
|
||||
<a-table :columns="columns" :data-source="dataList" :pagination="false" :scroll="{x: 500}">
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'file'">
|
||||
<div v-for="item in (record.lngFileUploadList )">
|
||||
@ -33,13 +33,13 @@
|
||||
const { t } = useI18n();
|
||||
const dataList = ref([])
|
||||
const columns= ref([
|
||||
{ title: t('序号'), dataIndex: 'index', key: 'index', customRender: (column) => `${column.index + 1}` ,width: 100},
|
||||
{ title: t('标题'), dataIndex: 'title', width:100},
|
||||
{ title: t('编号'), dataIndex: 'code', },
|
||||
{ title: t('签报类型'), dataIndex: 'typeName', width: 140},
|
||||
{ title: t('序号'), dataIndex: 'index', key: 'index', customRender: (column) => `${column.index + 1}` ,width: 50},
|
||||
{ title: t('标题'), dataIndex: 'title',},
|
||||
{ title: t('编号'), dataIndex: 'code', width: 100 },
|
||||
{ title: t('签报类型'), dataIndex: 'typeName', width: 100},
|
||||
{ title: t('拟稿人'), dataIndex: 'empName', width: 140},
|
||||
{ title: t('拟稿人所属部门'), dataIndex: 'bDeptName', width: 140},
|
||||
{ title: t('拟稿时间'), dataIndex: 'dateAppro', width: 140},
|
||||
{ title: t('拟稿人所属部门'), dataIndex: 'bDeptName', width: 180},
|
||||
{ title: t('拟稿时间'), dataIndex: 'dateAppro', width: 180},
|
||||
{ title: t('附件'), dataIndex: 'file', width: 140},
|
||||
{ title: t('操作'), dataIndex: 'operation', width: 120, fixed: 'right',align: 'center'},
|
||||
]);
|
||||
|
||||
140
src/components/common/discountList.vue
Normal file
140
src/components/common/discountList.vue
Normal file
@ -0,0 +1,140 @@
|
||||
<template>
|
||||
<div style="width: 100%">
|
||||
<a-button type="primary" style="margin-bottom: 10px" @click="add" v-if="!disabled">新增行</a-button>
|
||||
<a-table :columns="columns" :data-source="dataList" :pagination="false">
|
||||
<template #headerCell="{ column }">
|
||||
<template v-if="column.dataIndex == 'dateFrom'">
|
||||
<span><span class="redStyle">*</span>开始日期</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'dateTo'">
|
||||
<span><span class="redStyle">*</span>结束日期</span>
|
||||
</template>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'dateFrom'">
|
||||
<a-date-picker v-model:value="record.dateFrom" format="YYYY-MM-DD" :value-format="'YYYY-MM-DD'" :disabled="disabled" @change="dateFromTb(dayjs(record.dateFrom || null), index, record)" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'dateTo'">
|
||||
<a-date-picker v-model:value="record.dateTo" format="YYYY-MM-DD" :value-format="'YYYY-MM-DD'" :disabled="disabled" @change="dateToTb(dayjs(record.dateTo || null), index, record)" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'discTypeCode'">
|
||||
<a-select v-model:value="record.discTypeCode" :disabled="disabled" style="width: 100%" allow-clear>
|
||||
<a-select-option v-for="item in optionSelect.discTypeCodeList" :key="item.code" :value="item.code">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'discDesc'">
|
||||
<a-input v-model:value="record.discDesc" :disabled="disabled" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'note'">
|
||||
<a-input v-model:value="record.note" :disabled="disabled" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'operation'">
|
||||
<a v-if="!disabled" style="margin-right: 10px" @click="btnCheck(record, index)">删除</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { Card } from 'ant-design-vue';
|
||||
import { ref, watch} from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { message } from 'ant-design-vue';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
const router = useRouter();
|
||||
const numFormat = "###,###,###,###,###,###.000"
|
||||
const { t } = useI18n();
|
||||
const dataList = ref([])
|
||||
const columns= ref([
|
||||
{ title: t('序号'), dataIndex: 'index', key: 'index', customRender: (column) => `${column.index + 1}` ,width: 80},
|
||||
{ title: t('返优惠类型'), dataIndex: 'discTypeCode', width: 100},
|
||||
{ title: t('开始日期'), dataIndex: 'dateFrom', width:160},
|
||||
{ title: t('结束日期'), dataIndex: 'dateTo', width: 160},
|
||||
{ title: t('优惠说明'), dataIndex: 'discDesc', width: 130},
|
||||
{ title: t('备注'), dataIndex: 'note', width: 200},
|
||||
{ title: t('操作'), dataIndex: 'operation', width: 80, fixed: 'right',align: 'center'},
|
||||
]);
|
||||
const [register, { openModal:openModal}] = useModal();
|
||||
const props = defineProps({
|
||||
disabled: Boolean,
|
||||
list: Array,
|
||||
optionSelect: Object
|
||||
});
|
||||
const emit = defineEmits(['change']);
|
||||
|
||||
const add = () => {
|
||||
dataList.value.push({
|
||||
dateFrom: null, dateTo: null, discTypeCode: null, discDesc: null, note: null
|
||||
})
|
||||
}
|
||||
const dateFromTb = (startValue, index, record) => {
|
||||
if (!startValue) return
|
||||
const endValue = dataList.value[index]?.dateTo;
|
||||
if (!startValue || !endValue) {
|
||||
return false
|
||||
}
|
||||
if (startValue.valueOf() > endValue.valueOf()) {
|
||||
message.warning('结束日期须大于等于开始日期')
|
||||
dataList.value[index].dateFrom = ''
|
||||
return
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const dateToTb = (endValue, index, record) => {
|
||||
if (!endValue) return
|
||||
const startValue = dataList.value[index]?.dateFrom;
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
if (startValue.valueOf() > endValue.valueOf()) {
|
||||
message.warning('结束日期须大于等于开始日期')
|
||||
dataList.value.splice(index, 1, { ...dataList.value[index], dateTo: '' });
|
||||
return
|
||||
}
|
||||
|
||||
}
|
||||
const btnCheck = (record, index) => {
|
||||
dataList.value.splice(index, 1)
|
||||
}
|
||||
const getDataList = () => {
|
||||
return dataList.value
|
||||
}
|
||||
watch(
|
||||
() => props.disabled,
|
||||
(val) => {
|
||||
if (val) {
|
||||
let idx2 = columns.value.findIndex(v =>v.dataIndex == 'operation')
|
||||
idx2>-1 && columns.value.splice(idx2, 1)
|
||||
}
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
watch(
|
||||
() => props.list,
|
||||
async (val) => {
|
||||
dataList.value = val || []
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
defineExpose({
|
||||
getDataList,
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.redStyle {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
105
src/components/common/lngStationList.vue
Normal file
105
src/components/common/lngStationList.vue
Normal file
@ -0,0 +1,105 @@
|
||||
<template>
|
||||
<div style="width: 100%">
|
||||
<a-button type="primary" style="margin-bottom: 10px" @click="add" v-if="!disabled">新增行</a-button>
|
||||
<a-table :columns="columns" :data-source="dataList" :pagination="false">
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'staName'">
|
||||
<a-input-search v-model:value="record.staName" readonly :disabled="isEdit" @search="onSearch(index, record)"/>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'note'">
|
||||
<a-input v-model:value="record.note" :disabled="isEdit" style="width: 100%" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'operation'">
|
||||
<a v-if="!disabled" style="margin-right: 10px" @click="btnCheck(record, index)">删除</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
<lngStationModal @register="register" @success="handleSuccess"></lngStationModal>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { Card } from 'ant-design-vue';
|
||||
import { ref, watch} from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { message } from 'ant-design-vue';
|
||||
import lngStationModal from '/@/components/common/lngStationModal.vue';
|
||||
|
||||
const router = useRouter();
|
||||
const { t } = useI18n();
|
||||
const dataList = ref([])
|
||||
const curIdx = ref(null)
|
||||
const curCode = ref('')
|
||||
const columns= ref([
|
||||
{ title: t('序号'), dataIndex: 'index', key: 'index', customRender: (column) => `${column.index + 1}` ,width: 80},
|
||||
{ title: t('气源地'), dataIndex: 'staName', width:300},
|
||||
{ title: t('备注'), dataIndex: 'note'},
|
||||
{ title: t('操作'), dataIndex: 'operation', width: 80, fixed: 'right',align: 'center'},
|
||||
]);
|
||||
const [register, { openModal:openModal}] = useModal();
|
||||
const props = defineProps({
|
||||
disabled: Boolean,
|
||||
isEdit: Boolean,
|
||||
list: Array,
|
||||
optionSelect: Object
|
||||
});
|
||||
const emit = defineEmits(['change']);
|
||||
|
||||
const add = () => {
|
||||
curIdx.value = null
|
||||
openModal(true,{isUpdate: false})
|
||||
}
|
||||
const onSearch = (idx, record) => {
|
||||
curIdx.value = idx
|
||||
curCode.value = record.staCode
|
||||
openModal(true,{isUpdate: false,curCode: curCode.value, list: dataList.value})
|
||||
}
|
||||
const handleSuccess = (val) => {
|
||||
if (!dataList.value.length) {
|
||||
dataList.value = [{staCode: val[0].code, staName: val[0].fullName, note: val[0].note}]
|
||||
return
|
||||
}
|
||||
if (curIdx.value != null) {
|
||||
dataList.value[curIdx.value] = {staCode: val[0].code, staName: val[0].fullName, note: val[0].note}
|
||||
return
|
||||
}
|
||||
dataList.value.push({staCode: val[0].code, staName: val[0].fullName, note: val[0].note})
|
||||
}
|
||||
|
||||
const btnCheck = (record, index) => {
|
||||
dataList.value.splice(index, 1)
|
||||
}
|
||||
const getDataList = () => {
|
||||
return dataList.value
|
||||
}
|
||||
watch(
|
||||
() => props.disabled,
|
||||
(val) => {
|
||||
if (val) {
|
||||
let idx2 = columns.value.findIndex(v =>v.dataIndex == 'operation')
|
||||
idx2>-1 && columns.value.splice(idx2, 1)
|
||||
}
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
watch(
|
||||
() => props.list,
|
||||
async (val) => {
|
||||
dataList.value = val || []
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
defineExpose({
|
||||
getDataList,
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
</style>
|
||||
115
src/components/common/lngStationModal.vue
Normal file
115
src/components/common/lngStationModal.vue
Normal file
@ -0,0 +1,115 @@
|
||||
<template>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" width="60%" :title="getTitle" @ok="handleSubmit" @cancel="handleCancel"
|
||||
@visible-change="handleVisibleChange" >
|
||||
<BasicTable @register="registerTable" class="lngStationModal"></BasicTable>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, unref, nextTick } from 'vue';
|
||||
import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { BasicTable, useTable, FormSchema, BasicColumn, TableAction } from '/@/components/Table';
|
||||
import { addCodeRule, getCodeRuleInfo, editCodeRule } from '/@/api/system/code';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { Form, message } from 'ant-design-vue';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { getLngBStationLngPage } from '/@/api/mdm/LNGStation';
|
||||
|
||||
const { t } = useI18n();
|
||||
const codeFormSchema: FormSchema[] = [
|
||||
{ field: 'fullName', label: '名称', component: 'Input'},
|
||||
];
|
||||
|
||||
const columns: BasicColumn[] = [
|
||||
{ dataIndex: 'code', title: '编码', componentType: 'input', width: 120,align: 'left', },
|
||||
{ dataIndex: 'fullName', title: '名称', componentType: 'input', align: 'left', },
|
||||
{ dataIndex: 'note', title: '备注', componentType: 'input', align: 'left', },
|
||||
];
|
||||
|
||||
const emit = defineEmits(['success', 'register', 'cancel']);
|
||||
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
const selectedKeys = ref<string[]>([]);
|
||||
const selectedValues = ref([]);
|
||||
const props = defineProps({
|
||||
selectType: { type: String, default: 'radio' },
|
||||
});
|
||||
const list = ref([])
|
||||
const curCode = ref()
|
||||
const type = ref('')
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
|
||||
setModalProps({ confirmLoading: false });
|
||||
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
list.value = data.list || []
|
||||
curCode.value = data.curCode
|
||||
});
|
||||
|
||||
const [registerTable, { getDataSource, setTableData, updateTableDataRecord, reload }] = useTable({
|
||||
title: t('列表'),
|
||||
api: getLngBStationLngPage,
|
||||
columns,
|
||||
|
||||
bordered: true,
|
||||
pagination: true,
|
||||
canResize: false,
|
||||
formConfig: {
|
||||
labelCol:{span: 9},
|
||||
schemas: codeFormSchema,
|
||||
showResetButton: true,
|
||||
},
|
||||
immediate: false, // 设置为不立即调用
|
||||
beforeFetch: (params) => {
|
||||
return { ...params, valid: 'Y'};
|
||||
},
|
||||
rowSelection: {
|
||||
type: props.selectType,
|
||||
onChange: onSelectChange
|
||||
},
|
||||
});
|
||||
const handleVisibleChange = (visible: boolean) => {
|
||||
if (visible) {
|
||||
nextTick(() => {
|
||||
reload();
|
||||
});
|
||||
}
|
||||
};
|
||||
function onSelectChange(rowKeys: string[], e) {
|
||||
selectedKeys.value = rowKeys;
|
||||
selectedValues.value = e
|
||||
}
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? t('列表') : t('')));
|
||||
function handleCancel () {
|
||||
emit('cancel',);
|
||||
}
|
||||
async function handleSubmit() {
|
||||
if (!selectedValues.value.length) {
|
||||
notification.warning({
|
||||
message: t('提示'),
|
||||
description: t('请选择数据')
|
||||
});
|
||||
return
|
||||
}
|
||||
// 新增
|
||||
let idx = list.value.findIndex(v=>v.staCode == selectedValues.value[0].code)
|
||||
let addFlag = !curCode.value && idx>-1
|
||||
let editFlag = curCode.value && curCode.value!==selectedValues.value[0].code && idx > -1
|
||||
if (addFlag || editFlag) {
|
||||
message.warn(selectedValues.value[0].fullName +'不可重复')
|
||||
return
|
||||
}
|
||||
|
||||
closeModal();
|
||||
emit('success', selectedValues.value, type.value);
|
||||
}
|
||||
|
||||
</script>
|
||||
<style >
|
||||
.lngStationModal .basicCol{
|
||||
position: inherit !important;
|
||||
top: 0;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user