管道气采购
This commit is contained in:
123
src/components/common/contractFactListModal.vue
Normal file
123
src/components/common/contractFactListModal.vue
Normal file
@ -0,0 +1,123 @@
|
||||
<template>
|
||||
<div>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" width="60%" :title="getTitle" @ok="handleSubmit"
|
||||
@visible-change="handleVisibleChange" >
|
||||
<BasicTable @register="registerTable" class="contractFactListModal"></BasicTable>
|
||||
</BasicModal>
|
||||
</div>
|
||||
</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 { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { getLngContractFactPage,} from '/@/api/contract/ContractFact';
|
||||
|
||||
const { t } = useI18n();
|
||||
const codeFormSchema: FormSchema[] = [
|
||||
{ field: 'kName', label: '合同号/名称', component: 'Input'},
|
||||
{
|
||||
field: 'relTypeCode',
|
||||
label: '关联类别',
|
||||
component: 'XjrSelect',
|
||||
componentProps: {
|
||||
datasourceType: 'dic',
|
||||
params: { itemId: '2003815292742479874' },
|
||||
labelField: 'name',
|
||||
valueField: 'value',
|
||||
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const columns: BasicColumn[] = [
|
||||
{ title: t('合同号'), dataIndex: 'kNo', sorter: true},
|
||||
{ title: t('合同名称'), dataIndex: 'kName', sorter: true},
|
||||
{ title: t('关联类别'), dataIndex: 'relTypeName', sorter: true},
|
||||
{ title: t('合同类别'), dataIndex: 'kTypeName1', sorter: true},
|
||||
{ title: t('承办人'), dataIndex: 'empName', sorter: true,},
|
||||
{ title: t('承办部门'), dataIndex: 'bDeptName', sorter: true,},
|
||||
|
||||
];
|
||||
|
||||
const emit = defineEmits(['success', 'register']);
|
||||
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
const selectedKeys = ref<string[]>([]);
|
||||
const selectedValues = ref([]);
|
||||
const props = defineProps({
|
||||
selectType: { type: String, default: 'checkbox' },
|
||||
|
||||
});
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
|
||||
setModalProps({ confirmLoading: false });
|
||||
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
});
|
||||
|
||||
const [registerTable, { getDataSource, setTableData, updateTableDataRecord, reload }] = useTable({
|
||||
title: t('合同列表'),
|
||||
api: getLngContractFactPage,
|
||||
columns,
|
||||
|
||||
bordered: true,
|
||||
pagination: true,
|
||||
canResize: false,
|
||||
formConfig: {
|
||||
labelCol:{span: 9, offSet:10},
|
||||
schemas: codeFormSchema,
|
||||
showResetButton: true,
|
||||
},
|
||||
immediate: false, // 设置为不立即调用
|
||||
beforeFetch: (params) => {
|
||||
return { ...params, valid: 'Y',approCode: 'YSP'};
|
||||
},
|
||||
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('')));
|
||||
|
||||
async function handleSubmit() {
|
||||
if (!selectedValues.value.length) {
|
||||
notification.warning({
|
||||
message: t('提示'),
|
||||
description: t('请选择合同')
|
||||
});
|
||||
return
|
||||
}
|
||||
closeModal();
|
||||
emit('success', selectedValues.value);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<style >
|
||||
.contractFactListModal .basicCol{
|
||||
position: inherit !important;
|
||||
top: 0;
|
||||
}
|
||||
</style>
|
||||
150
src/components/common/correlationApproList.vue
Normal file
150
src/components/common/correlationApproList.vue
Normal file
@ -0,0 +1,150 @@
|
||||
<template>
|
||||
<div>
|
||||
<Card title="签报列表" :bordered="false" >
|
||||
<a-button type="primary" style="margin-bottom: 10px" v-if="!disabled" @click="onAppro">关联签报</a-button>
|
||||
<a-table :columns="columns" :data-source="dataList" :pagination="false">
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'file'">
|
||||
<div v-for="item in (record.lngFileUploadList )">
|
||||
<a @click="handleDownload(item)">{{item.fileOrg}}</a>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'operation'">
|
||||
<a style="margin-right: 10px" @click="btnCheck('view', record, index)">查看</a>
|
||||
<a v-if="!disabled" style="margin-right: 10px" @click="btnCheck('delete', record, index)">删除</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</Card>
|
||||
<approListModal @register="register" @success="handleSuccess" />
|
||||
</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 { parseDownloadUrl} from '/@/api/system/file';
|
||||
import { downloadByUrl } from '/@/utils/file/download';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import approListModal from '/@/components/common/approListModal.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const router = useRouter();
|
||||
const { t } = useI18n();
|
||||
const dataList = ref([])
|
||||
const columns= ref([
|
||||
{ title: t('序号'), dataIndex: 'index', key: 'index', sorter: true, customRender: (column) => `${column.index + 1}` ,width: 100},
|
||||
{ title: t('标题'), dataIndex: 'title', sorter: true, width:100},
|
||||
{ title: t('编号'), dataIndex: 'code', sorter: true},
|
||||
{ title: t('签报类型'), dataIndex: 'typeName', sorter: true, width: 140},
|
||||
{ title: t('拟稿人'), dataIndex: 'empName', sorter: true, width: 140},
|
||||
{ title: t('拟稿人所属部门'), dataIndex: 'bDeptName', sorter: true, width: 140},
|
||||
{ title: t('拟稿时间'), dataIndex: 'dateAppro', sorter: true, width: 140},
|
||||
{ title: t('附件'), dataIndex: 'file', sorter: true, width: 140},
|
||||
{ title: t('操作'), dataIndex: 'operation', width: 120, fixed: 'right',align: 'center'},
|
||||
]);
|
||||
const [register, { openModal:openModal}] = useModal();
|
||||
const props = defineProps({
|
||||
disabled: Boolean,
|
||||
list: Array,
|
||||
});
|
||||
const emit = defineEmits(['change']);
|
||||
const handleDownload = (info) => {
|
||||
const url = parseDownloadUrl(info.response ? info.response.data.fileUrl : info.fileUrl);
|
||||
const fileName = info.response ? info.response.data.fileOrg : info.fileOrg;
|
||||
downloadByUrl({ url, fileName: fileName});
|
||||
};
|
||||
const onAppro = (val)=> {
|
||||
openModal(true,{isUpdate: false})
|
||||
}
|
||||
const handleSuccess = (val) =>{
|
||||
val.forEach(v => {
|
||||
v.approId = v.id
|
||||
v.id = null
|
||||
})
|
||||
if (!dataList.value.length) {
|
||||
dataList.value = val
|
||||
emit('change', dataList.value);
|
||||
return
|
||||
}
|
||||
let arr = []
|
||||
val.forEach(v => {
|
||||
dataList.value.forEach(i => {
|
||||
if (v.code == i.code){
|
||||
message.warning(v.code + '已重复, 签报不需要重复选择')
|
||||
} else {
|
||||
arr.push(v)
|
||||
}
|
||||
})
|
||||
})
|
||||
dataList.value = unique([...dataList.value, ...arr], 'code')
|
||||
emit('change', dataList.value);
|
||||
}
|
||||
function unique(arr, u_key) {
|
||||
const map = new Map()
|
||||
arr.forEach((item, index) => {
|
||||
if (!map.has(item[u_key])) {
|
||||
map.set(item[u_key], item)
|
||||
}
|
||||
})
|
||||
return [...map.values()]
|
||||
}
|
||||
const btnCheck = (btn, record, index) => {
|
||||
if (btn == 'delete') {
|
||||
Modal.confirm({
|
||||
title: '提示信息',
|
||||
content: '是否取消关联?',
|
||||
okText: '确认',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
dataList.value.splice(index, 1);
|
||||
emit('change', dataList.value);
|
||||
},
|
||||
onCancel() {}
|
||||
});
|
||||
|
||||
}
|
||||
if (btn == 'view') {
|
||||
router.push({
|
||||
path: '/approve/Appro/form',
|
||||
query: {
|
||||
id: record.id || record.approId,
|
||||
disabled: true
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
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,
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.btn {
|
||||
color: #5e95ff;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
152
src/components/common/correlationContractFactList.vue
Normal file
152
src/components/common/correlationContractFactList.vue
Normal file
@ -0,0 +1,152 @@
|
||||
<template>
|
||||
<div>
|
||||
<Card title="关联合同信息" :bordered="false" >
|
||||
<a-button type="primary" style="margin-bottom: 10px" v-if="!disabled" @click="onAppro">关联合同</a-button>
|
||||
<a-table :columns="columns" :data-source="dataList" :pagination="false" :scroll="{x: 1000}">
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'file'">
|
||||
<div v-for="item in (record.lngFileUploadList )">
|
||||
<a @click="handleDownload(item)">{{item.fileOrg}}</a>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'operation'">
|
||||
<a style="margin-right: 10px" @click="btnCheck('view', record, index)">查看</a>
|
||||
<a v-if="!disabled" style="margin-right: 10px" @click="btnCheck('delete', record, index)">删除</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</Card>
|
||||
<contractFactListModal @register="register" @success="handleSuccess" />
|
||||
</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 { parseDownloadUrl} from '/@/api/system/file';
|
||||
import { downloadByUrl } from '/@/utils/file/download';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import contractFactListModal from '/@/components/common/contractFactListModal.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const router = useRouter();
|
||||
const { t } = useI18n();
|
||||
const dataList = ref([])
|
||||
const columns= ref([
|
||||
{ title: t('序号'), dataIndex: 'index', key: 'index', sorter: true, customRender: (column) => `${column.index + 1}` ,width: 80},
|
||||
{ title: t('合同号'), dataIndex: 'kNo', sorter: true, width:180},
|
||||
{ title: t('合同名称'), dataIndex: 'kName', sorter: true, width: 300},
|
||||
{ title: t('关联类别'), dataIndex: 'relTypeName', sorter: true, width: 100},
|
||||
{ title: t('合同类别'), dataIndex: 'kTypeName1', sorter: true, width: 100},
|
||||
{ title: t('合同主体'), dataIndex: 'comName', sorter: true, width: 250},
|
||||
{ title: t('我方联系人'), dataIndex: 'empName', sorter: true, width: 140},
|
||||
{ title: t('联系电话'), dataIndex: 'tel', sorter: true, width: 140},
|
||||
{ title: t('业务部门'), dataIndex: 'bDeptName', sorter: true, width: 140},
|
||||
{ title: t('附件'), dataIndex: 'file', sorter: true, width: 140},
|
||||
{ title: t('操作'), dataIndex: 'operation', width: 120, fixed: 'right',align: 'center'},
|
||||
]);
|
||||
const [register, { openModal:openModal}] = useModal();
|
||||
const props = defineProps({
|
||||
disabled: Boolean,
|
||||
list: Array,
|
||||
});
|
||||
const emit = defineEmits(['change']);
|
||||
const handleDownload = (info) => {
|
||||
const url = parseDownloadUrl(info.response ? info.response.data.fileUrl : info.fileUrl);
|
||||
const fileName = info.response ? info.response.data.fileOrg : info.fileOrg;
|
||||
downloadByUrl({ url, fileName: fileName});
|
||||
};
|
||||
const onAppro = (val)=> {
|
||||
openModal(true,{isUpdate: false})
|
||||
}
|
||||
const handleSuccess = (val) =>{
|
||||
val.forEach(v => {
|
||||
v.approId = v.id
|
||||
v.id = null
|
||||
})
|
||||
if (!dataList.value.length) {
|
||||
dataList.value = val
|
||||
emit('change', dataList.value);
|
||||
return
|
||||
}
|
||||
let arr = []
|
||||
val.forEach(v => {
|
||||
dataList.value.forEach(i => {
|
||||
if (v.kNo == i.kNo){
|
||||
message.warning(v.kNo + '已重复, 合同不需要重复选择')
|
||||
} else {
|
||||
arr.push(v)
|
||||
}
|
||||
})
|
||||
})
|
||||
dataList.value = unique([...dataList.value, ...arr], 'kNo')
|
||||
emit('change', dataList.value);
|
||||
}
|
||||
function unique(arr, u_key) {
|
||||
const map = new Map()
|
||||
arr.forEach((item, index) => {
|
||||
if (!map.has(item[u_key])) {
|
||||
map.set(item[u_key], item)
|
||||
}
|
||||
})
|
||||
return [...map.values()]
|
||||
}
|
||||
const btnCheck = (btn, record, index) => {
|
||||
if (btn == 'delete') {
|
||||
Modal.confirm({
|
||||
title: '提示信息',
|
||||
content: '是否取消关联?',
|
||||
okText: '确认',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
dataList.value.splice(index, 1);
|
||||
emit('change', dataList.value);
|
||||
},
|
||||
onCancel() {}
|
||||
});
|
||||
|
||||
}
|
||||
if (btn == 'view') {
|
||||
router.push({
|
||||
path: '/approve/Appro/form',
|
||||
query: {
|
||||
id: record.id || record.approId,
|
||||
disabled: true
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
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,
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.btn {
|
||||
color: #5e95ff;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user