// import dayjs from "dayjs";
|
import editForm from "../form.vue";
|
import { handleTree } from "@/utils/tree";
|
import { message } from "@/utils/message";
|
import { zhaobiaoPageOrder } from "@/api/item/index";
|
|
import {
|
getCaigoufangshiList,
|
getHangyepingmuList,
|
getOrderStatusList,
|
getRegionList,
|
getDaimaleixingList,
|
caigourenAdd,
|
caigourenUpdate,
|
caigourenDelete,
|
caigourenBatchDelete
|
} from "@/api/item/index";
|
// import { usePublicHooks } from "../../hooks";
|
import { addDialog } from "@/components/ReDialog";
|
import { type Ref, reactive, ref, onMounted, h } from "vue";
|
import type { FormItemProps } from "./types";
|
import { cloneDeep, deviceDetection, getKeyList } from "@pureadmin/utils";
|
// import { useUserStoreHook } from "@/store/modules/user";
|
import type { PaginationProps } from "@pureadmin/table";
|
|
// const nowRole = computed(() => {
|
// return useUserStoreHook().nowRole;
|
// });
|
const selectedNum = ref(0);
|
|
export function useDept(tableRef: Ref) {
|
const form = reactive({
|
// 新增日期范围,可为 null,类型为数组
|
createDateRange: null,
|
// 行政区域,可为 null,类型为字符串
|
xingzhengquyu: [],
|
// 行业品目,可为 null,类型为字符串
|
hangyepinmu: "",
|
// 订单状态,可为 null,类型为 32 位整数
|
orderStatus: "",
|
// 质疑有无,可为 null,类型为布尔值
|
zhiyi: [],
|
// 投诉有无,可为 null,类型为布尔值
|
tousu: [],
|
// 项目名称,可为 null,类型为字符串
|
projectName: null,
|
// 代理机构名称,可为 null,类型为字符串
|
dailijigoumingcheng: null,
|
caigourenmingcheng: null,
|
// 中标供应商姓名,可为 null,类型为字符串
|
zhongbiaoName: null,
|
// 专家姓名,可为 null,类型为字符串
|
zhuanjiaName: null
|
});
|
const state = reactive({
|
caigoufangshiList: [],
|
hangyepingmuList: [],
|
orderStatusList: [],
|
regionList: [],
|
daimaleixingList: []
|
});
|
const pagination = reactive<PaginationProps>({
|
total: 0,
|
pageSize: 10,
|
currentPage: 1,
|
background: true
|
});
|
//获取采购方式
|
const getCaigoufangshiListFun = async () => {
|
const res = await getCaigoufangshiList();
|
state.caigoufangshiList = res.result;
|
};
|
|
//获取行业品目
|
const getHangyepingmuListFun = async () => {
|
const res = await getHangyepingmuList();
|
state.hangyepingmuList = res.result;
|
};
|
|
//获取项目进度
|
const getOrderStatusListFun = async () => {
|
const res = await getOrderStatusList();
|
state.orderStatusList = res.result;
|
};
|
|
// 获取区域
|
const getRegionListFun = async () => {
|
const res = await getRegionList();
|
state.regionList = res.result;
|
};
|
|
// 获取代码类型
|
const getDaimaleixingListFun = async () => {
|
const res = await getDaimaleixingList();
|
state.daimaleixingList = res.result;
|
};
|
const formRef = ref();
|
const dataList = ref([]);
|
const loading = ref(true);
|
// const { tagStyle } = usePublicHooks();
|
const getOrderStatus = row => {
|
const res = state.orderStatusList.find(item => {
|
return row.orderStatus == item.status;
|
});
|
return res?.label;
|
};
|
const columns: TableColumnList = [
|
{
|
label: "勾选列", // 如果需要表格多选,此处label必须设置
|
type: "selection",
|
fixed: "left",
|
reserveSelection: true // 数据刷新后保留选项
|
},
|
{
|
label: "采购人",
|
prop: "caigourenmingcheng",
|
minWidth: 70
|
},
|
{
|
label: "项目名称",
|
prop: "projectName",
|
width: 180,
|
align: "left"
|
},
|
{
|
label: "项目进度",
|
prop: "orderStatus",
|
minWidth: 70,
|
cellRenderer: ({ row }) => getOrderStatus(row)
|
},
|
{
|
label: "报名费",
|
prop: "baomingfei",
|
minWidth: 70
|
},
|
{
|
label: "投标保证金",
|
prop: "toubiaobaozhengjin",
|
minWidth: 70
|
},
|
{
|
label: "中标供应商",
|
prop: "zhongbiaoName",
|
minWidth: 180
|
},
|
{
|
label: "评审专家",
|
prop: "zhuanjiaName",
|
minWidth: 70
|
},
|
{
|
label: "质疑",
|
prop: "zhiyi",
|
minWidth: 100,
|
cellRenderer: ({ row }) => <span>{row.status === 1 ? "有" : "无"}</span>
|
},
|
{
|
label: "投诉",
|
prop: "tousu",
|
minWidth: 100,
|
cellRenderer: ({ row }) => (
|
// <el-tag size={props.size} style={tagStyle.value(row.status)}>
|
<span>{row.status === 1 ? "有" : "无"}</span>
|
// </el-tag>
|
)
|
},
|
{
|
label: "操作",
|
fixed: "right",
|
width: 80,
|
slot: "operation"
|
}
|
];
|
const CGRcolumns: TableColumnList = [
|
{
|
label: "勾选列", // 如果需要表格多选,此处label必须设置
|
type: "selection",
|
fixed: "left",
|
reserveSelection: true // 数据刷新后保留选项
|
},
|
{
|
label: "代理机构",
|
prop: "dailijigoumingcheng",
|
minWidth: 70
|
},
|
{
|
label: "项目名称",
|
prop: "projectName",
|
width: 180,
|
align: "left"
|
},
|
{
|
label: "项目进度",
|
prop: "orderStatus",
|
minWidth: 70,
|
cellRenderer: ({ row }) => getOrderStatus(row)
|
},
|
{
|
label: "报名费",
|
prop: "baomingfei",
|
minWidth: 70
|
},
|
{
|
label: "投标保证金",
|
prop: "toubiaobaozhengjin",
|
minWidth: 70
|
},
|
{
|
label: "中标供应商",
|
prop: "zhongbiaoName",
|
minWidth: 180
|
},
|
{
|
label: "评审专家",
|
prop: "zhuanjiaName",
|
minWidth: 70
|
},
|
{
|
label: "质疑",
|
prop: "zhiyi",
|
minWidth: 100,
|
cellRenderer: ({ row }) => <span>{row.status === 1 ? "有" : "无"}</span>
|
},
|
{
|
label: "投诉",
|
prop: "tousu",
|
minWidth: 100,
|
cellRenderer: ({ row }) => (
|
// <el-tag size={props.size} style={tagStyle.value(row.status)}>
|
<span>{row.status === 1 ? "有" : "无"}</span>
|
// </el-tag>
|
)
|
},
|
{
|
label: "操作",
|
fixed: "right",
|
width: 80,
|
slot: "operation"
|
}
|
];
|
|
/** 当CheckBox选择项发生变化时会触发该事件 */
|
function handleSelectionChange(val) {
|
selectedNum.value = val.length;
|
// 重置表格高度
|
tableRef.value.setAdaptive();
|
}
|
/** 取消选择 */
|
function onSelectionCancel() {
|
selectedNum.value = 0;
|
// 用于多选表格,清空用户的选择
|
tableRef.value.getTableRef().clearSelection();
|
}
|
/** 批量删除 */
|
async function onbatchDel() {
|
// 返回当前选中的行
|
const curSelected = tableRef.value.getTableRef().getSelectionRows();
|
const data = [];
|
curSelected.forEach(item => {
|
data.push({ id: item.id });
|
});
|
const res = await caigourenBatchDelete(data);
|
if (res.code == "200") {
|
// 接下来根据实际业务,通过选中行的某项数据,比如下面的id,调用接口进行批量删除
|
message(
|
`已删除项目名称为 ${getKeyList(curSelected, "projectName")} 的数据`,
|
{
|
type: "success"
|
}
|
);
|
onSearch();
|
} else {
|
message(res.message, {
|
type: "error"
|
});
|
}
|
tableRef.value.getTableRef().clearSelection();
|
onSearch();
|
}
|
function handleSizeChange(val: number) {
|
console.log(`${val} items per page`);
|
}
|
|
function handleCurrentChange(val: number) {
|
console.log(`current page: ${val}`);
|
}
|
|
function resetForm(formEl) {
|
if (!formEl) return;
|
formEl.resetFields();
|
onSearch();
|
}
|
const checkboxAsRadio = data => {
|
if (data.length > 1) {
|
data.shift();
|
}
|
};
|
async function onSearch() {
|
const obj = cloneDeep(form);
|
obj.tousu = obj.tousu.join("");
|
obj.zhiyi = obj.zhiyi.join("");
|
obj.xingzhengquyu = obj.xingzhengquyu ? obj.xingzhengquyu.join("") : "";
|
loading.value = true;
|
const { result } = await zhaobiaoPageOrder(obj); // 这里是返回一维数组结构,前端自行处理成树结构,返回格式要求:唯一id加父节点parentId,parentId取父节点id
|
const newData = result.items;
|
loading.value = false;
|
pagination.total = result.total;
|
pagination.pageSize = result.pageSize;
|
pagination.currentPage = result.page;
|
// if (!isAllEmpty(form.name)) {
|
// // 前端搜索项目名称
|
// newData = newData.filter(item => item.name.includes(form.name));
|
// }
|
// if (!isAllEmpty(form.status)) {
|
// // 前端搜索状态
|
// newData = newData.filter(item => item.status === form.status);
|
// }
|
dataList.value = handleTree(newData); // 处理成树结构
|
}
|
|
function formatHigherDeptOptions(treeList) {
|
// 根据返回数据的status字段值判断追加是否禁用disabled字段,返回处理后的树结构,用于上级项目级联选择器的展示(实际开发中也是如此,不可能前端需要的每个字段后端都会返回,这时需要前端自行根据后端返回的某些字段做逻辑处理)
|
if (!treeList || !treeList.length) return;
|
const newTreeList = [];
|
for (let i = 0; i < treeList.length; i++) {
|
treeList[i].disabled = treeList[i].status === 0 ? true : false;
|
formatHigherDeptOptions(treeList[i].children);
|
newTreeList.push(treeList[i]);
|
}
|
return newTreeList;
|
}
|
|
function openDialog(title = "新增", row?: FormItemProps) {
|
console.log(row, "-");
|
|
addDialog({
|
title: `${title}项目`,
|
props: {
|
formInline: {
|
higherDeptOptions: formatHigherDeptOptions(cloneDeep(dataList.value)),
|
id: row?.id ?? "",
|
projectCode: row?.projectCode ?? "", // 项目编号(必填)
|
projectName: row?.projectName ?? "", // 项目名称(必填)
|
hangyepinmu: row?.hangyepinmu ?? null, // 行业品目(可选)
|
caigoufangshi: row?.caigoufangshi ?? null, // 采购方式(可选)
|
caigouyusuan: row?.caigouyusuan ?? null, // 采购预算(可选)
|
dingbiaoguize: row?.dingbiaoguize ?? null, // 定标规则(可选)
|
baomingfei: row?.baomingfei ?? null, // 报名费(可选)
|
toubiaobaozhengjin: row?.toubiaobaozhengjin ?? null, // 投标保证金(可选)
|
lianhetitoubiao: row?.lianhetitoubiao ?? null, // 联合体投标(可选)
|
kaibiaofangshi: row?.kaibiaofangshi ?? null, // 开标方式(可选)
|
shifoufenbao: row?.shifoufenbao ?? "false", // 是否分包(可选)
|
shifoutuisongxuanchuan: row?.shifoutuisongxuanchuan ?? "true", // 是否推送宣传(可选)
|
caigourenmingcheng: row?.caigourenmingcheng ?? null, // 采购人名称(可选)
|
xingzhengquyu: row?.xingzhengquyu.split(",") ?? [], // 行政区域(可选)
|
xingzhengquyuName: row?.xingzhengquyuName ?? null, // 行政区域名称(可选)
|
jigoudaima: row?.jigoudaima ?? null, // 机构代码(可选)
|
daimaleixing: row?.daimaleixing ?? null, // 代码类型(可选)
|
lianxiren: row?.lianxiren ?? null, // 联系人(可选)
|
lianxidianhua: row?.lianxidianhua ?? null, // 联系电话(可选)
|
tongxindizhi: row?.tongxindizhi ?? null, // 通信地址(可选)
|
dianziyoujian: row?.dianziyoujian ?? null, // 电子邮件(可选)
|
xiangmujingbanren: row?.xiangmujingbanren ?? null, // 项目经办人(可选)
|
zhiwu: row?.zhiwu ?? null, // 职务(可选)
|
jingbanrendianhua: row?.jingbanrendianhua ?? null, // 经办人电话(可选)
|
dailijigoumingcheng: row?.dailijigoumingcheng ?? null, // 代理机构名称(可选)
|
dailiLianxiren: row?.dailiLianxiren ?? null, // 代理机构联系人(可选)
|
dailiLianxidianhua: row?.dailiLianxidianhua ?? null, // 代理机构联系电话(可选)
|
dailiDianziyoujian: row?.dailiDianziyoujian ?? null, // 代理机构电子邮件(可选)
|
dailiTongxindizhi: row?.dailiTongxindizhi ?? null, // 代理机构通信地址(可选)
|
dailiXiangmujingli: row?.dailiXiangmujingli ?? null, // 代理机构项目经理(可选
|
dailijingliLianxidianhua: row?.dailijingliLianxidianhua ?? null // 代理机构项目经理联系电话(可选)
|
}
|
},
|
width: "80%",
|
draggable: true,
|
fullscreen: deviceDetection(),
|
fullscreenIcon: true,
|
sureBtnLoading: true,
|
closeOnClickModal: false,
|
contentRenderer: () => h(editForm, { ref: formRef, formInline: null }),
|
beforeSure: (done, { options, closeLoading }) => {
|
const FormRef = formRef.value.getRef();
|
const curData = cloneDeep(options.props.formInline as FormItemProps);
|
async function chores() {
|
message(`您${title}了项目名称为${curData.projectName}的这条数据`, {
|
type: "success"
|
});
|
// curData.dingbiaoguize = curData.dingbiaoguize.join("");
|
curData.xingzhengquyu = curData.xingzhengquyu.join(",");
|
let res;
|
if (title == "新增") {
|
res = await caigourenAdd(curData);
|
} else {
|
res = await caigourenUpdate(curData);
|
}
|
if (res.code == "200") {
|
done(); // 关闭弹框
|
onSearch(); // 刷新表格数据
|
} else {
|
closeLoading();
|
message(res.message, {
|
type: "error"
|
});
|
}
|
}
|
FormRef.validate((valid, obj) => {
|
if (valid) {
|
// 表单规则校验通过
|
if (title === "新增") {
|
// 实际开发先调用新增接口,再进行下面操作
|
chores();
|
} else {
|
// 实际开发先调用修改接口,再进行下面操作
|
chores();
|
}
|
} else {
|
closeLoading();
|
const fail = [];
|
for (const key in obj) {
|
fail.push(obj[key][0].message);
|
}
|
message(fail[0], {
|
type: "warning"
|
});
|
return false;
|
}
|
});
|
}
|
});
|
}
|
|
async function handleDelete(row) {
|
const res = await caigourenDelete({ id: row.id });
|
if (res.code == "200") {
|
message(`您删除了项目名称为${row.projectName}的这条数据`, {
|
type: "success"
|
});
|
onSearch();
|
} else {
|
message(res.message, {
|
type: "error"
|
});
|
}
|
}
|
|
onMounted(() => {
|
onSearch();
|
getCaigoufangshiListFun();
|
getHangyepingmuListFun();
|
getOrderStatusListFun();
|
getRegionListFun();
|
getDaimaleixingListFun();
|
});
|
|
return {
|
form,
|
state,
|
loading,
|
columns,
|
CGRcolumns,
|
dataList,
|
selectedNum,
|
/** 搜索 */
|
onSearch,
|
/** 重置 */
|
resetForm,
|
/** 新增、修改项目 */
|
openDialog,
|
/** 删除项目 */
|
handleDelete,
|
handleSelectionChange,
|
handleSizeChange,
|
handleCurrentChange,
|
pagination,
|
checkboxAsRadio,
|
onSelectionCancel,
|
onbatchDel
|
};
|
}
|