|
|
|
|
@ -1,61 +1,140 @@
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
import { onMounted, ref, reactive, unref } from "vue";
|
|
|
|
|
import { useRoute, useRouter } from "vue-router";
|
|
|
|
|
import testImg from "@/assets/images/test.png";
|
|
|
|
|
import { chunk } from "lodash-es";
|
|
|
|
|
import type { RowData } from "@/config/final";
|
|
|
|
|
import { getFinalList } from "@/api/final";
|
|
|
|
|
import { useFinal } from "@/store/modules/final";
|
|
|
|
|
import { formatToDateHMS } from "@/utils/dateUtil";
|
|
|
|
|
import { useMessage, useDialog } from "naive-ui";
|
|
|
|
|
import { audit } from "@/api/task/task";
|
|
|
|
|
import NotPassed from "@/components/Approval/NotPassed.vue";
|
|
|
|
|
import { RepeatModal, RepeatTaskTableModal } from "../comp";
|
|
|
|
|
const dialog = useDialog();
|
|
|
|
|
const message = useMessage();
|
|
|
|
|
const router = useRouter();
|
|
|
|
|
const notPassModalRef = ref(null); // 不通过弹窗
|
|
|
|
|
const sortorder = ref("asc");
|
|
|
|
|
const sortname = ref("states");
|
|
|
|
|
const loading = ref(true);
|
|
|
|
|
const total = ref(0);
|
|
|
|
|
|
|
|
|
|
const tableData = ref<any>([]);
|
|
|
|
|
const finalStore = useFinal();
|
|
|
|
|
import { computed, onMounted, reactive, ref, unref } from 'vue'
|
|
|
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
|
|
import { chunk } from 'lodash-es'
|
|
|
|
|
import { useDialog, useMessage } from 'naive-ui'
|
|
|
|
|
import { RepeatModal, RepeatTaskTableModal } from '../comp'
|
|
|
|
|
import testImg from '@/assets/images/test.png'
|
|
|
|
|
import type { RowData } from '@/config/final'
|
|
|
|
|
import { getFinalList } from '@/api/final'
|
|
|
|
|
import { useFinal } from '@/store/modules/final'
|
|
|
|
|
import { formatToDateHMS } from '@/utils/dateUtil'
|
|
|
|
|
import { audit } from '@/api/task/task'
|
|
|
|
|
import NotPassed from '@/components/Approval/NotPassed.vue'
|
|
|
|
|
|
|
|
|
|
const emit = defineEmits(['changeShow'])
|
|
|
|
|
const dialog = useDialog()
|
|
|
|
|
const message = useMessage()
|
|
|
|
|
const router = useRouter()
|
|
|
|
|
const notPassModalRef = ref(null) // 不通过弹窗
|
|
|
|
|
const sortorder = ref('asc')
|
|
|
|
|
const sortname = ref('states')
|
|
|
|
|
const loading = ref(true)
|
|
|
|
|
const total = ref(0)
|
|
|
|
|
const scrollContainer = ref(null)
|
|
|
|
|
const tableData = ref<any>([])
|
|
|
|
|
const finalStore = useFinal()
|
|
|
|
|
|
|
|
|
|
let num = 1
|
|
|
|
|
const pagination = reactive({
|
|
|
|
|
page: 1,
|
|
|
|
|
pageCount: 20,
|
|
|
|
|
pageSize: 20,
|
|
|
|
|
});
|
|
|
|
|
const repeatModalRef = ref(null);
|
|
|
|
|
const repeatTaskTableModalRef = ref(null);
|
|
|
|
|
const emit = defineEmits(["changeShow"]);
|
|
|
|
|
})
|
|
|
|
|
const repeatModalRef = ref(null)
|
|
|
|
|
const repeatTaskTableModalRef = ref(null)
|
|
|
|
|
const selectionIds = ref([])
|
|
|
|
|
const showActions = computed(() => {
|
|
|
|
|
return selectionIds.value.length
|
|
|
|
|
})
|
|
|
|
|
function handleCheck(row: any, showcheck: any) {
|
|
|
|
|
if (showcheck == false) {
|
|
|
|
|
console.log(tableData.value)
|
|
|
|
|
tableData.value.forEach((item) => {
|
|
|
|
|
if (item.length > 0) {
|
|
|
|
|
item.forEach((itemx, index) => {
|
|
|
|
|
if (row.id == itemx.id)
|
|
|
|
|
itemx.showcheck = true
|
|
|
|
|
|
|
|
|
|
// newlistx.push(itemx)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
selectionIds.value.push(row)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
tableData.value.forEach((item) => {
|
|
|
|
|
if (item.length > 0) {
|
|
|
|
|
item.forEach((itemx, index) => {
|
|
|
|
|
if (row.id == itemx.id)
|
|
|
|
|
itemx.showcheck = false
|
|
|
|
|
|
|
|
|
|
// newlistx.push(itemx)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
selectionIds.value.pop(row)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
function switchBatch() {
|
|
|
|
|
tableData.value.forEach((item) => {
|
|
|
|
|
item.forEach((itemx, index) => {
|
|
|
|
|
itemx.showcheck = false
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
selectionIds.value = []
|
|
|
|
|
}
|
|
|
|
|
function changeContent() {
|
|
|
|
|
emit("changeShow");
|
|
|
|
|
emit('changeShow')
|
|
|
|
|
}
|
|
|
|
|
function initRem() {
|
|
|
|
|
const designWidth = 1440
|
|
|
|
|
const rempPx = 16
|
|
|
|
|
const scale = window.innerWidth / designWidth
|
|
|
|
|
document.documentElement.style.fontSize = `${scale * rempPx}px`
|
|
|
|
|
}
|
|
|
|
|
const initRem = () => {
|
|
|
|
|
const designWidth = 1440;
|
|
|
|
|
const rempPx = 16;
|
|
|
|
|
const scale = window.innerWidth / designWidth;
|
|
|
|
|
document.documentElement.style.fontSize = scale * rempPx + "px";
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
function initData() {
|
|
|
|
|
query(1, 10);
|
|
|
|
|
async function initData(
|
|
|
|
|
page: number,
|
|
|
|
|
pageSize: number,
|
|
|
|
|
filterId?: any,
|
|
|
|
|
taskName?: string,
|
|
|
|
|
) {
|
|
|
|
|
const asideParmas = unref(finalStore.getAsideValue)
|
|
|
|
|
// 有过滤配置的时候优先使用过滤配置，不要使用左侧参数
|
|
|
|
|
// let params = filterId ? { userSearchId: filterId } : asideParmas
|
|
|
|
|
let params = asideParmas
|
|
|
|
|
params = params?.izshowall ? {} : params
|
|
|
|
|
|
|
|
|
|
const result = await getFinalList({
|
|
|
|
|
sortorder: sortorder.value,
|
|
|
|
|
pageSize,
|
|
|
|
|
currPage: page,
|
|
|
|
|
sortname: sortname.value,
|
|
|
|
|
taskName,
|
|
|
|
|
isFail: true,
|
|
|
|
|
...params,
|
|
|
|
|
})
|
|
|
|
|
const { data, pageCount, totalCount } = result
|
|
|
|
|
console.log(data, pageCount, totalCount)
|
|
|
|
|
// tableData.value = tableData.value.concat(data);
|
|
|
|
|
tableData.value = data
|
|
|
|
|
console.log(tableData.value)
|
|
|
|
|
total.value = totalCount
|
|
|
|
|
pagination.page = page
|
|
|
|
|
pagination.pageCount = Math.ceil(totalCount / pageSize)
|
|
|
|
|
loading.value = false
|
|
|
|
|
tableData.value.forEach((item) => {
|
|
|
|
|
item.showcheck = false
|
|
|
|
|
if (isValidTimestamp(item.createdate))
|
|
|
|
|
item.createdate = formatToDateHMS(item.createdate)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
tableData.value = chunk(tableData.value, 4)
|
|
|
|
|
}
|
|
|
|
|
async function query(
|
|
|
|
|
page: number,
|
|
|
|
|
pageSize: number,
|
|
|
|
|
filterId?: any,
|
|
|
|
|
taskName?: string
|
|
|
|
|
taskName?: string,
|
|
|
|
|
) {
|
|
|
|
|
console.log("query", taskName);
|
|
|
|
|
console.log('query', taskName)
|
|
|
|
|
|
|
|
|
|
const asideParmas = unref(finalStore.getAsideValue);
|
|
|
|
|
const asideParmas = unref(finalStore.getAsideValue)
|
|
|
|
|
// 有过滤配置的时候优先使用过滤配置，不要使用左侧参数
|
|
|
|
|
// let params = filterId ? { userSearchId: filterId } : asideParmas
|
|
|
|
|
let params = asideParmas;
|
|
|
|
|
params = params?.izshowall ? {} : params;
|
|
|
|
|
let params = asideParmas
|
|
|
|
|
params = params?.izshowall ? {} : params
|
|
|
|
|
|
|
|
|
|
const result = await getFinalList({
|
|
|
|
|
sortorder: sortorder.value,
|
|
|
|
|
@ -63,94 +142,155 @@ async function query(
|
|
|
|
|
currPage: page,
|
|
|
|
|
sortname: sortname.value,
|
|
|
|
|
taskName,
|
|
|
|
|
isFail: true,
|
|
|
|
|
...params,
|
|
|
|
|
});
|
|
|
|
|
const { data, pageCount, totalCount } = result;
|
|
|
|
|
console.log(data, pageCount, totalCount);
|
|
|
|
|
|
|
|
|
|
tableData.value = data;
|
|
|
|
|
})
|
|
|
|
|
const { data, pageCount, totalCount } = result
|
|
|
|
|
// console.log(data, pageCount, totalCount);
|
|
|
|
|
const newlist = []
|
|
|
|
|
const oldlist = tableData.value
|
|
|
|
|
if (oldlist.length > 0) {
|
|
|
|
|
oldlist.forEach((item) => {
|
|
|
|
|
// console.log(item);
|
|
|
|
|
if (item.length > 0) {
|
|
|
|
|
item.forEach((itemx: any) => {
|
|
|
|
|
itemx.showcheck = false
|
|
|
|
|
newlist.push(itemx)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
data.forEach((item) => {
|
|
|
|
|
item.showcheck = false
|
|
|
|
|
newlist.push(item)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
data.forEach((item) => {
|
|
|
|
|
item.showcheck = false
|
|
|
|
|
newlist.push(item)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// tableData.value = tableData.value.concat(data);
|
|
|
|
|
tableData.value = newlist
|
|
|
|
|
// console.log(tableData.value);
|
|
|
|
|
total.value = totalCount
|
|
|
|
|
pagination.page = page
|
|
|
|
|
pagination.pageCount = Math.ceil(totalCount / pageSize)
|
|
|
|
|
loading.value = false
|
|
|
|
|
tableData.value.forEach((item) => {
|
|
|
|
|
if (isValidTimestamp(item.createdate))
|
|
|
|
|
item.createdate = formatToDateHMS(item.createdate)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
total.value = totalCount;
|
|
|
|
|
pagination.page = page;
|
|
|
|
|
pagination.pageCount = Math.ceil(totalCount / pageSize);
|
|
|
|
|
loading.value = false;
|
|
|
|
|
tableData.value.map((item) => {
|
|
|
|
|
item.createdate = formatToDateHMS(item.createdate);
|
|
|
|
|
});
|
|
|
|
|
tableData.value = chunk(tableData.value, 4)
|
|
|
|
|
}
|
|
|
|
|
function isValidTimestamp(value) {
|
|
|
|
|
if (typeof value !== 'number' || !Number.isInteger(value))
|
|
|
|
|
return false // 首先确保值是一个整数数字
|
|
|
|
|
|
|
|
|
|
tableData.value = chunk(tableData.value, 4);
|
|
|
|
|
const date = new Date(value)
|
|
|
|
|
return !Number.isNaN(date.getTime()) // 验证能否转换为有效日期
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 查看详情页
|
|
|
|
|
function goDetail(row) {
|
|
|
|
|
router.push({
|
|
|
|
|
name: "final-detail",
|
|
|
|
|
name: 'final-detail',
|
|
|
|
|
query: { id: row.id, packageid: row.packageid },
|
|
|
|
|
});
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 小结批量不通过
|
|
|
|
|
function repeatBatchReject(items) {
|
|
|
|
|
console.log(items);
|
|
|
|
|
rejectHandler(items);
|
|
|
|
|
console.log(items)
|
|
|
|
|
rejectHandler(items)
|
|
|
|
|
}
|
|
|
|
|
// 审核不通过
|
|
|
|
|
function rejectHandler(list) {
|
|
|
|
|
const msg = validate(list);
|
|
|
|
|
console.log(list)
|
|
|
|
|
const msg = validate(list)
|
|
|
|
|
if (msg !== null) {
|
|
|
|
|
message.error(msg);
|
|
|
|
|
return;
|
|
|
|
|
message.error(msg)
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
function validate(items: any[]) {
|
|
|
|
|
if (items.length === 0) return "至少选中一个任务";
|
|
|
|
|
return null;
|
|
|
|
|
if (items.length === 0)
|
|
|
|
|
return '至少选中一个任务'
|
|
|
|
|
return null
|
|
|
|
|
}
|
|
|
|
|
const modal = unref(notPassModalRef)! as any;
|
|
|
|
|
modal.showModal(list);
|
|
|
|
|
console.log(notPassModalRef)
|
|
|
|
|
const modal = unref(notPassModalRef)! as any
|
|
|
|
|
modal.showModal(list)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function showModal(modalRef: any) {
|
|
|
|
|
const modal = unref(modalRef)! as any;
|
|
|
|
|
modal.showModal();
|
|
|
|
|
const modal = unref(modalRef)! as any
|
|
|
|
|
modal.showModal()
|
|
|
|
|
}
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
initRem();
|
|
|
|
|
initData();
|
|
|
|
|
});
|
|
|
|
|
initRem()
|
|
|
|
|
initData(1, 20)
|
|
|
|
|
})
|
|
|
|
|
const item = {
|
|
|
|
|
img: testImg,
|
|
|
|
|
checked: false,
|
|
|
|
|
title: "YP45678",
|
|
|
|
|
date: "2023-12-19 12:09:18",
|
|
|
|
|
};
|
|
|
|
|
const data = ref<any[]>([]);
|
|
|
|
|
title: 'YP45678',
|
|
|
|
|
date: '2023-12-19 12:09:18',
|
|
|
|
|
}
|
|
|
|
|
const data = ref<any[]>([])
|
|
|
|
|
function actionHandler(action: any, row: any) {
|
|
|
|
|
const { key } = action;
|
|
|
|
|
const { key } = action
|
|
|
|
|
switch (key) {
|
|
|
|
|
case "view":
|
|
|
|
|
goDetail(row);
|
|
|
|
|
break;
|
|
|
|
|
case "reset":
|
|
|
|
|
case 'view':
|
|
|
|
|
goDetail(row)
|
|
|
|
|
break
|
|
|
|
|
case 'reset':
|
|
|
|
|
// resetHandler()
|
|
|
|
|
break;
|
|
|
|
|
case "approval":
|
|
|
|
|
singleApproval(row);
|
|
|
|
|
break;
|
|
|
|
|
case "reject":
|
|
|
|
|
rejectHandler([row]);
|
|
|
|
|
break;
|
|
|
|
|
break
|
|
|
|
|
case 'approval':
|
|
|
|
|
singleApproval(row)
|
|
|
|
|
break
|
|
|
|
|
case 'reject':
|
|
|
|
|
rejectHandler(row)
|
|
|
|
|
break
|
|
|
|
|
default:
|
|
|
|
|
break;
|
|
|
|
|
break
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 审核通过
|
|
|
|
|
function doAudit(param: any, row: any) {
|
|
|
|
|
dialog.info({
|
|
|
|
|
title: '确认提示',
|
|
|
|
|
content: '确认给该任务审批为【通过】吗?',
|
|
|
|
|
positiveText: '确定',
|
|
|
|
|
negativeText: '取消',
|
|
|
|
|
onPositiveClick: () => {
|
|
|
|
|
audit(param).then((res) => {
|
|
|
|
|
const { code } = res
|
|
|
|
|
if (code === 'OK') {
|
|
|
|
|
message.success(res.message)
|
|
|
|
|
// changecardstatus(3, row);
|
|
|
|
|
initData(1, 20)
|
|
|
|
|
num = 1
|
|
|
|
|
reload()
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
message.error(res.message)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
onNegativeClick: () => {},
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 单个审批通过
|
|
|
|
|
function singleApproval(row) {
|
|
|
|
|
console.log(row);
|
|
|
|
|
console.log(row)
|
|
|
|
|
const param = {
|
|
|
|
|
result: true,
|
|
|
|
|
comment: "",
|
|
|
|
|
disposeType: "",
|
|
|
|
|
disposeTypeId: "",
|
|
|
|
|
failCauseId: "",
|
|
|
|
|
failCauseName: "",
|
|
|
|
|
comment: '',
|
|
|
|
|
disposeType: '',
|
|
|
|
|
disposeTypeId: '',
|
|
|
|
|
failCauseId: '',
|
|
|
|
|
failCauseName: '',
|
|
|
|
|
flowTaskInfoList: [
|
|
|
|
|
{
|
|
|
|
|
formId: row.id,
|
|
|
|
|
@ -158,54 +298,105 @@ function singleApproval(row) {
|
|
|
|
|
taskName: row.fromTaskName,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
};
|
|
|
|
|
doAudit(param, row);
|
|
|
|
|
}
|
|
|
|
|
doAudit(param, row)
|
|
|
|
|
}
|
|
|
|
|
// 批量通过
|
|
|
|
|
function batchApproval() {
|
|
|
|
|
const items: any = selectionIds.value
|
|
|
|
|
const msg = validate(items)
|
|
|
|
|
function validate(items: any[]) {
|
|
|
|
|
if (items.length === 0)
|
|
|
|
|
return '至少选中一个任务'
|
|
|
|
|
return null
|
|
|
|
|
}
|
|
|
|
|
if (msg !== null) {
|
|
|
|
|
message.error(msg)
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
console.log(items)
|
|
|
|
|
const list: any = []
|
|
|
|
|
items.forEach((item) => {
|
|
|
|
|
list.push({
|
|
|
|
|
formId: item.id,
|
|
|
|
|
taskId: item.taskId,
|
|
|
|
|
taskName: item.fromtaskname,
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 审核通过
|
|
|
|
|
function doAudit(param: any, row: any) {
|
|
|
|
|
dialog.info({
|
|
|
|
|
title: "确认提示",
|
|
|
|
|
content: "确认给该任务审批为【通过】吗?",
|
|
|
|
|
positiveText: "确定",
|
|
|
|
|
negativeText: "取消",
|
|
|
|
|
onPositiveClick: () => {
|
|
|
|
|
audit(param).then((res) => {
|
|
|
|
|
const { code } = res;
|
|
|
|
|
if (code === "OK") {
|
|
|
|
|
message.success(res.message);
|
|
|
|
|
//changecardstatus(3, row);
|
|
|
|
|
query(1, 10);
|
|
|
|
|
reload();
|
|
|
|
|
} else {
|
|
|
|
|
message.error(res.message);
|
|
|
|
|
const param = {
|
|
|
|
|
result: true,
|
|
|
|
|
comment: '',
|
|
|
|
|
disposeType: '',
|
|
|
|
|
disposeTypeId: '',
|
|
|
|
|
failCauseId: '',
|
|
|
|
|
failCauseName: '',
|
|
|
|
|
flowTaskInfoList: list,
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
onNegativeClick: () => {},
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
doAudit(param, {})
|
|
|
|
|
selectionIds.value = []
|
|
|
|
|
num = 1
|
|
|
|
|
}
|
|
|
|
|
// 批量不通过
|
|
|
|
|
function batchReject() {
|
|
|
|
|
const items: any = selectionIds.value
|
|
|
|
|
rejectHandler(items)
|
|
|
|
|
selectionIds.value = []
|
|
|
|
|
num = 1
|
|
|
|
|
}
|
|
|
|
|
// 修改卡片状态渲染效果
|
|
|
|
|
function changecardstatus(states, item) {
|
|
|
|
|
// let index = tableData.value.findIndex(itemx => itemx.id === item.id);
|
|
|
|
|
let newlist = [];
|
|
|
|
|
tableData.value.map((itemarr, indexarr) => {
|
|
|
|
|
itemarr.map((itemobj: any, indexobj) => {
|
|
|
|
|
if (item.id == itemobj.id) {
|
|
|
|
|
itemobj.states = states;
|
|
|
|
|
}
|
|
|
|
|
newlist.push(itemobj);
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
tableData.value = chunk(newlist, 4);
|
|
|
|
|
const newlist = []
|
|
|
|
|
tableData.value.forEach((itemarr, indexarr) => {
|
|
|
|
|
itemarr.forEach((itemobj, indexobj) => {
|
|
|
|
|
if (item.id == itemobj.id)
|
|
|
|
|
itemobj.states = states
|
|
|
|
|
|
|
|
|
|
newlist.push(itemobj)
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
tableData.value = chunk(newlist, 4)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function reload() {
|
|
|
|
|
// query(1, 20)
|
|
|
|
|
// num=1
|
|
|
|
|
// selectionIds.value = []
|
|
|
|
|
// checkedRowKeys.value = []
|
|
|
|
|
// const { page, pageSize } = unref(tableRef.value?.pagination) as PaginationProps
|
|
|
|
|
// query(page!, pageSize!)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let debounceTimer
|
|
|
|
|
// 检查是否滚动到底部
|
|
|
|
|
function checkBottom() {
|
|
|
|
|
const container = scrollContainer.value
|
|
|
|
|
// console.log(1)
|
|
|
|
|
if (!container)
|
|
|
|
|
return
|
|
|
|
|
|
|
|
|
|
// const { scrollTop, clientHeight, scrollHeight } = container;
|
|
|
|
|
const scrollTop = window.pageYOffset || document.documentElement.scrollTop
|
|
|
|
|
|
|
|
|
|
// 获取视口的内部高度
|
|
|
|
|
const clientHeight
|
|
|
|
|
= window.innerHeight || document.documentElement.clientHeight
|
|
|
|
|
|
|
|
|
|
// 获取整个文档的高度
|
|
|
|
|
const scrollHeight = document.documentElement.scrollHeight
|
|
|
|
|
|
|
|
|
|
clearTimeout(debounceTimer)
|
|
|
|
|
debounceTimer = setTimeout(() => {
|
|
|
|
|
if (scrollTop + clientHeight >= scrollHeight - 10) {
|
|
|
|
|
num = num + 1
|
|
|
|
|
console.log(num)
|
|
|
|
|
query(num, 20)
|
|
|
|
|
// fetchData(); // 接近底部时加载更多数据
|
|
|
|
|
}
|
|
|
|
|
}, 500)
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
@ -250,18 +441,17 @@ function reload() {
|
|
|
|
|
src="@/assets/images/task/btn-not-pass.png"
|
|
|
|
|
alt=""
|
|
|
|
|
@click.stop="batchReject"
|
|
|
|
|
/>
|
|
|
|
|
>
|
|
|
|
|
<SvgIcon size="24" name="vs" />
|
|
|
|
|
<img
|
|
|
|
|
class="btn-approval"
|
|
|
|
|
src="@/assets/images/task/btn-pass.png"
|
|
|
|
|
alt=""
|
|
|
|
|
@click.stop="batchApproval"
|
|
|
|
|
/>
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<n-popover
|
|
|
|
|
ref="popover"
|
|
|
|
|
:style="{ padding: '0px' }"
|
|
|
|
|
style="width: 148px"
|
|
|
|
|
:show-arrow="false"
|
|
|
|
|
@ -275,26 +465,20 @@ function reload() {
|
|
|
|
|
</template>
|
|
|
|
|
<ul class="wrapper-header-action">
|
|
|
|
|
<li @click="importHandler">
|
|
|
|
|
<SvgIcon size="20" name="import" /><span style="margin-left: 5px"
|
|
|
|
|
>批量导入数据</span
|
|
|
|
|
>
|
|
|
|
|
<SvgIcon size="20" name="import" /><span style="margin-left: 5px">批量导入数据</span>
|
|
|
|
|
</li>
|
|
|
|
|
<li @click="exportHandler">
|
|
|
|
|
<SvgIcon size="20" name="download" /><span
|
|
|
|
|
style="margin-left: 5px"
|
|
|
|
|
>导出待审数据</span
|
|
|
|
|
>
|
|
|
|
|
>导出待审数据</span>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<SvgIcon size="20" name="download" /><span
|
|
|
|
|
style="margin-left: 5px"
|
|
|
|
|
>导出全部数据</span
|
|
|
|
|
>
|
|
|
|
|
>导出全部数据</span>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<SvgIcon size="20" name="look" /><span style="margin-left: 5px"
|
|
|
|
|
>查看导入记录</span
|
|
|
|
|
>
|
|
|
|
|
<SvgIcon size="20" name="look" /><span style="margin-left: 5px">查看导入记录</span>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</n-popover>
|
|
|
|
|
@ -302,13 +486,35 @@ function reload() {
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="header_data">
|
|
|
|
|
<DataHeader :hasColor="true" />
|
|
|
|
|
<DataHeader :has-color="true" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="wrapper-settings">
|
|
|
|
|
<div>
|
|
|
|
|
<div>
|
|
|
|
|
<span>提报时间排序</span><SvgIcon style="margin-left: 6px" name="sort" size="13" />
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<span>相似度排序</span><SvgIcon style="margin-left: 6px" name="sort" size="13" />
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<span>提报人排序</span><SvgIcon style="margin-left: 6px" name="sort" size="13" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="width: 3vw">
|
|
|
|
|
<SvgIcon name="magnifying-1" size="18" style="margin-right: 8px" />
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="cursor: pointer"
|
|
|
|
|
size="18"
|
|
|
|
|
name="column"
|
|
|
|
|
@click="showModal(customTabelRef)"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div ref="scrollContainer" class="cotnet_wrapeer" @scroll="checkBottom">
|
|
|
|
|
<div
|
|
|
|
|
class="data_wrapper"
|
|
|
|
|
v-for="(sitem, sindex) in tableData"
|
|
|
|
|
:key="sindex"
|
|
|
|
|
class="data_wrapper"
|
|
|
|
|
:style="
|
|
|
|
|
sitem.length == 1
|
|
|
|
|
? { width: '25%' }
|
|
|
|
|
@ -320,51 +526,60 @@ function reload() {
|
|
|
|
|
"
|
|
|
|
|
>
|
|
|
|
|
<div
|
|
|
|
|
class="item"
|
|
|
|
|
v-for="(item, index) in sitem"
|
|
|
|
|
:key="index"
|
|
|
|
|
class="item"
|
|
|
|
|
:style="
|
|
|
|
|
sitem.length == 1
|
|
|
|
|
? { width: '25%' }
|
|
|
|
|
? { margin: '0 4% 0 4%' }
|
|
|
|
|
: sitem.length == 2
|
|
|
|
|
? { margin: '0 2% 0 2%' }
|
|
|
|
|
: sitem.length == 3
|
|
|
|
|
? { width: '75%' }
|
|
|
|
|
? { margin: '0 1.2% 0 1.2%' }
|
|
|
|
|
: {}
|
|
|
|
|
"
|
|
|
|
|
>
|
|
|
|
|
<div class="top">
|
|
|
|
|
<div
|
|
|
|
|
class="img"
|
|
|
|
|
:style="`background:url(${item.img});background-size:100%;background-repeat: no-repeat;`"
|
|
|
|
|
>
|
|
|
|
|
<div class="check_box" v-show="item.states == 2">
|
|
|
|
|
<n-checkbox size="medium" label=" " />
|
|
|
|
|
</div>
|
|
|
|
|
:style="
|
|
|
|
|
item.serverThumbnailUrl != null
|
|
|
|
|
? `background:url(${item.serverThumbnailUrl});background-size:100% 100%;background-repeat: no-repeat;`
|
|
|
|
|
: `background:url(${item.imgUrl});background-size:100% 100%;background-repeat: no-repeat;`
|
|
|
|
|
"
|
|
|
|
|
@click="goDetail(item)"
|
|
|
|
|
/>
|
|
|
|
|
<div v-show="item.states == 2" class="check_box">
|
|
|
|
|
<n-checkbox
|
|
|
|
|
size="medium"
|
|
|
|
|
label=" "
|
|
|
|
|
:checked="item.showcheck"
|
|
|
|
|
@click="handleCheck(item, item.showcheck)"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content">
|
|
|
|
|
<div class="content" @click="goDetail(item)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<n-ellipsis style="max-width: 8.5vw">
|
|
|
|
|
<n-ellipsis style="max-width: 100%">
|
|
|
|
|
任务ID：{{ item.fromtaskid }}
|
|
|
|
|
</n-ellipsis>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="date">
|
|
|
|
|
<n-ellipsis style="max-width: 8.5vw"
|
|
|
|
|
>{{ item.createdate }}
|
|
|
|
|
<n-ellipsis style="max-width: 100%">
|
|
|
|
|
{{ item.createdate }}
|
|
|
|
|
</n-ellipsis>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tag_box">
|
|
|
|
|
<div
|
|
|
|
|
class="tag_item"
|
|
|
|
|
v-for="index in 2"
|
|
|
|
|
:key="index"
|
|
|
|
|
class="tag_item"
|
|
|
|
|
:style="
|
|
|
|
|
index == 2 || item.states == 3
|
|
|
|
|
? 'color:#02C984'
|
|
|
|
|
: item.states == 2
|
|
|
|
|
? 'color: #fe9800;background:#f7eac0'
|
|
|
|
|
? 'color: #fe9800;background:#f7eac075'
|
|
|
|
|
: item.states == 5
|
|
|
|
|
? 'color:#FF4E4F;background:#f7c0c0'
|
|
|
|
|
? 'color:#FF4E4F;background:#f7c0c06b'
|
|
|
|
|
: 'color:#02C984'
|
|
|
|
|
"
|
|
|
|
|
>
|
|
|
|
|
@ -386,22 +601,22 @@ function reload() {
|
|
|
|
|
<div class="bottom">
|
|
|
|
|
<!-- <div class="reset_action">重置审批</div> -->
|
|
|
|
|
<div
|
|
|
|
|
class="resovle_action"
|
|
|
|
|
v-show="item.states != 2"
|
|
|
|
|
class="resovle_action"
|
|
|
|
|
@click="goDetail(item)"
|
|
|
|
|
>
|
|
|
|
|
查看
|
|
|
|
|
</div>
|
|
|
|
|
<div
|
|
|
|
|
class="resovle_action"
|
|
|
|
|
v-show="item.states == 2"
|
|
|
|
|
class="resovle_action"
|
|
|
|
|
@click="actionHandler({ key: 'approval' }, item)"
|
|
|
|
|
>
|
|
|
|
|
通过
|
|
|
|
|
</div>
|
|
|
|
|
<div
|
|
|
|
|
class="reject_action"
|
|
|
|
|
v-show="item.states == 2"
|
|
|
|
|
class="reject_action"
|
|
|
|
|
@click="actionHandler({ key: 'reject' }, [item])"
|
|
|
|
|
>
|
|
|
|
|
不通过
|
|
|
|
|
@ -409,7 +624,8 @@ function reload() {
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<NotPassed ref="notPassModalRef" @success="reload" />
|
|
|
|
|
</div>
|
|
|
|
|
<NotPassed ref="notPassModalRef" @success="initData(1, 20)" />
|
|
|
|
|
<RepeatModal
|
|
|
|
|
ref="repeatModalRef"
|
|
|
|
|
@reject="repeatBatchReject"
|
|
|
|
|
@ -440,6 +656,15 @@ function reload() {
|
|
|
|
|
width: 100%;
|
|
|
|
|
background: #fff;
|
|
|
|
|
padding: 0px 24px 24px 24px;
|
|
|
|
|
.btn-approval {
|
|
|
|
|
width: 68px;
|
|
|
|
|
height: 28px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.btn-left {
|
|
|
|
|
margin-left: 16px;
|
|
|
|
|
}
|
|
|
|
|
.icon-wrap {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
@ -463,6 +688,7 @@ function reload() {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.xjcc {
|
|
|
|
|
//width: 226px;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
color: #507afd;
|
|
|
|
|
margin-right: 20px;
|
|
|
|
|
@ -520,12 +746,37 @@ function reload() {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
&-settings {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
padding: 12px 0px;
|
|
|
|
|
> div {
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
// justify-content: space-between;
|
|
|
|
|
//width: 20vw;
|
|
|
|
|
> div {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
margin-right: 30px;
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
height: 18px;
|
|
|
|
|
line-height: 18px;
|
|
|
|
|
/* font-family: PingFang SC, PingFang SC-Regular; */
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
text-align: left;
|
|
|
|
|
color: #666666;
|
|
|
|
|
line-height: 0.88rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.header_data {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
.data_wrapper {
|
|
|
|
|
// padding-right: 10px;
|
|
|
|
|
display: flex;
|
|
|
|
|
//box-sizing: border-box;
|
|
|
|
|
flex-flow: row wrap;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// justify-content: flex-start;
|
|
|
|
|
@ -533,16 +784,20 @@ function reload() {
|
|
|
|
|
// flex: 1;
|
|
|
|
|
.item {
|
|
|
|
|
flex: 1;
|
|
|
|
|
min-width: 23%;
|
|
|
|
|
width: 23%;
|
|
|
|
|
margin-left: 2.3%;
|
|
|
|
|
height: 12.4vh;
|
|
|
|
|
background: #ffffff;
|
|
|
|
|
border: 0.075rem solid #e8e8e8;
|
|
|
|
|
height: 7rem;
|
|
|
|
|
|
|
|
|
|
background: url("@/assets/images/cardbg.png");
|
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
// border: 0.075rem solid #e8e8e8;
|
|
|
|
|
border-radius: 0.18rem;
|
|
|
|
|
padding: 0.5rem 0.625rem;
|
|
|
|
|
// margin-right: 20px;
|
|
|
|
|
margin: 0 1% 0 1%;
|
|
|
|
|
margin-bottom: 1rem;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
.top {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-flow: row nowrap;
|
|
|
|
|
@ -550,23 +805,28 @@ function reload() {
|
|
|
|
|
justify-content: flex-start;
|
|
|
|
|
height: 75%;
|
|
|
|
|
border-bottom: 0.05rem solid #e8e8e8;
|
|
|
|
|
position: relative;
|
|
|
|
|
.img {
|
|
|
|
|
width: 35%;
|
|
|
|
|
//width: 5.25rem;
|
|
|
|
|
//width: 35%;
|
|
|
|
|
|
|
|
|
|
width: 5.25rem;
|
|
|
|
|
height: 3.43rem;
|
|
|
|
|
// height: auto;
|
|
|
|
|
object-fit: cover;
|
|
|
|
|
border-radius: 0.18rem;
|
|
|
|
|
.check_box {
|
|
|
|
|
margin-left: 0.5rem;
|
|
|
|
|
}
|
|
|
|
|
.check_box {
|
|
|
|
|
position: absolute;
|
|
|
|
|
left: 0.25rem;
|
|
|
|
|
top: 0.6rem;
|
|
|
|
|
}
|
|
|
|
|
.content {
|
|
|
|
|
margin-left: 0.8rem;
|
|
|
|
|
width: calc(100% - 6rem);
|
|
|
|
|
.title,
|
|
|
|
|
.date {
|
|
|
|
|
font-size: 0.68rem;
|
|
|
|
|
font-weight: bolder;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
text-align: left;
|
|
|
|
|
color: #323233;
|
|
|
|
|
line-height: 1rem;
|
|
|
|
|
@ -577,19 +837,20 @@ function reload() {
|
|
|
|
|
flex-flow: row nowrap;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: flex-start;
|
|
|
|
|
margin-top: 0.5rem;
|
|
|
|
|
.tag_item {
|
|
|
|
|
min-width: 1.93rem;
|
|
|
|
|
min-width: 2rem;
|
|
|
|
|
min-height: 0.875rem;
|
|
|
|
|
font-size: 0.625rem;
|
|
|
|
|
font-size: 0.52rem;
|
|
|
|
|
padding: 0.0625rem 0.18rem;
|
|
|
|
|
font-weight: bolder;
|
|
|
|
|
text-align: left;
|
|
|
|
|
// color: #507afd;
|
|
|
|
|
line-height: 0.875rem;
|
|
|
|
|
letter-spacing: 0.006rem;
|
|
|
|
|
margin-right: 0.5rem;
|
|
|
|
|
margin-right: 0.2rem;
|
|
|
|
|
// opacity: 0.1;
|
|
|
|
|
background: #c0f7e4;
|
|
|
|
|
background: #c0f7ec69;
|
|
|
|
|
border-radius: 0.125rem;
|
|
|
|
|
text-align: center;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
@ -630,5 +891,43 @@ function reload() {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.cotnet_wrapeer {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 67vh;
|
|
|
|
|
//padding-right: 10px; /* 右侧内边距 */
|
|
|
|
|
overflow: hidden; /* 默认隐藏滚动条 */
|
|
|
|
|
}
|
|
|
|
|
.cotnet_wrapeer:hover {
|
|
|
|
|
overflow: auto;
|
|
|
|
|
width: calc(100% + 5px);
|
|
|
|
|
}
|
|
|
|
|
/* 定义滚动条的宽度及背景颜色 */
|
|
|
|
|
::-webkit-scrollbar {
|
|
|
|
|
position: fixed;
|
|
|
|
|
width: 5px; /* for vertical scrollbars */
|
|
|
|
|
height: 10px; /* for horizontal scrollbars */
|
|
|
|
|
background: #f1f1f1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 定义滚动条轨道的样式 */
|
|
|
|
|
::-webkit-scrollbar-track {
|
|
|
|
|
background-color: #e1e1e1;
|
|
|
|
|
border-radius: 10px; /* 圆角 */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 定义滚动条滑块的样式 */
|
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
|
|
|
background-color: #888;
|
|
|
|
|
border-radius: 10px; /* 圆角 */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 滑块hover时的样式 */
|
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
|
|
|
background-color: #555;
|
|
|
|
|
}
|
|
|
|
|
:deep(.n-checkbox .n-checkbox-box) {
|
|
|
|
|
width: 0.85rem;
|
|
|
|
|
height: 0.85rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
