| | |
| | | interface type { |
| | | |
| | | } |
| | | // export default defineComponent({ |
| | | // name: 'workCheckinRecord', |
| | | // setup() { |
| | | const userInfo = useUserInfo() |
| | | const { userInfos } = storeToRefs(userInfo); |
| | | const state = reactive<stateType>({}); |
| | | const currentPage = ref(1) |
| | | const pageSize = ref(10) |
| | | const chosenIndex = ref(-1) |
| | | const handleSizeChange = (val: number) => { |
| | | console.log(`${val} items per page`) |
| | | } |
| | | const handleCurrentChange = (val: number) => { |
| | | console.log(`current page: ${val}`) |
| | | } |
| | | const tableData = reactive( |
| | | [ |
| | | { |
| | | approveType: '单人审批', |
| | | creater: '李四', |
| | | createTime: '2021-04-22 15:21:31', |
| | | updater: '吴海涛', |
| | | updateTime: '2022-04-22 15:21:31', |
| | | }, |
| | | { |
| | | approveType: '多人同时审批', |
| | | creater: '李四', |
| | | createTime: '2021-04-22 15:21:31', |
| | | updater: '吴海涛', |
| | | updateTime: '2022-04-22 15:21:31', |
| | | }, |
| | | ] |
| | | ) |
| | | const timeForm = { |
| | | hour12: false, |
| | | year: 'numeric', |
| | | month: '2-digit', |
| | | day: '2-digit', |
| | | hour: '2-digit', |
| | | minute: '2-digit', |
| | | second: '2-digit' |
| | | } |
| | | const addRef = ref<FormInstance>() |
| | | const addRules = reactive<FormRules>({ |
| | | approveType:[{required: true, message: '该内容不能为空',trigger:'blur'}], |
| | | }) |
| | | const dialogDetails = ref(false) |
| | | const dialogAddRecord = ref(false) |
| | | const deleteDialog = ref(false) |
| | | const addRecord = ref({}) |
| | | const details = ref({}) |
| | | const viewRecord = (row) =>{ |
| | | details.value = JSON.parse(JSON.stringify(row)) |
| | | dialogDetails.value = true |
| | | } |
| | | const deleteRecord = (index) =>{ |
| | | chosenIndex.value = index |
| | | deleteDialog.value = true |
| | | } |
| | | const conFirmDelete = ()=> { |
| | | tableData.splice(chosenIndex.value,1) |
| | | deleteDialog.value = false |
| | | } |
| | | const confirmAddRecord = async (formEl: FormInstance | undefined) =>{ |
| | | if (!formEl) return |
| | | await formEl.validate((valid, fields) => { |
| | | if (valid) { |
| | | if(chosenIndex.value == -1){ |
| | | addRecord.value.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g,'-') |
| | | addRecord.value.updateTime = new Date().toLocaleString('zh', timeForm).replace(/\//g,'-') |
| | | tableData.push(addRecord.value) |
| | | }else{ |
| | | addRecord.value.updateTime = new Date().toLocaleString('zh', timeForm).replace(/\//g,'-') |
| | | tableData[chosenIndex.value] = addRecord.value |
| | | } |
| | | dialogAddRecord.value =false |
| | | } else { |
| | | console.log('error submit!', fields) |
| | | } |
| | | }) |
| | | const userInfo = useUserInfo() |
| | | const { userInfos } = storeToRefs(userInfo); |
| | | |
| | | // 分页 |
| | | const currentPage = ref(1) |
| | | const pageSize = ref(10) |
| | | const chosenIndex = ref(-1) |
| | | const handleSizeChange = (val: number) => { |
| | | console.log(`${val} items per page`) |
| | | } |
| | | const handleCurrentChange = (val: number) => { |
| | | console.log(`current page: ${val}`) |
| | | } |
| | | const tableData = reactive( |
| | | [ |
| | | { |
| | | approveType: '单人审批', |
| | | creater: '李四', |
| | | createTime: '2021-04-22 15:21:31', |
| | | updater: '吴海涛', |
| | | updateTime: '2022-04-22 15:21:31', |
| | | }, |
| | | { |
| | | approveType: '多人同时审批', |
| | | creater: '李四', |
| | | createTime: '2021-04-22 15:21:31', |
| | | updater: '吴海涛', |
| | | updateTime: '2022-04-22 15:21:31', |
| | | }, |
| | | ] |
| | | ) |
| | | |
| | | // 时间格式化 |
| | | const timeForm = { |
| | | hour12: false, |
| | | year: 'numeric', |
| | | month: '2-digit', |
| | | day: '2-digit', |
| | | hour: '2-digit', |
| | | minute: '2-digit', |
| | | second: '2-digit' |
| | | } |
| | | const addRef = ref<FormInstance>() |
| | | const addRules = reactive<FormRules>({ |
| | | approveType:[{required: true, message: '该内容不能为空',trigger:'blur'}], |
| | | }) |
| | | const dialogDetails = ref(false) |
| | | const dialogAddRecord = ref(false) |
| | | const deleteDialog = ref(false) |
| | | const addRecord = ref({}) |
| | | const details = ref({}) |
| | | |
| | | // 查看记录 |
| | | const viewRecord = (row) =>{ |
| | | details.value = JSON.parse(JSON.stringify(row)) |
| | | dialogDetails.value = true |
| | | } |
| | | |
| | | // 删除记录 |
| | | const deleteRecord = (index) =>{ |
| | | chosenIndex.value = index |
| | | deleteDialog.value = true |
| | | } |
| | | const conFirmDelete = ()=> { |
| | | tableData.splice(chosenIndex.value,1) |
| | | deleteDialog.value = false |
| | | } |
| | | |
| | | // 修改记录 |
| | | const editRecord =(index, row)=>{ |
| | | dialogAddRecord.value = true |
| | | chosenIndex.value = index |
| | | addRecord.value = JSON.parse(JSON.stringify(row)) |
| | | } |
| | | |
| | | // 新增修改记录确认 |
| | | const confirmAddRecord = async (formEl: FormInstance | undefined) =>{ |
| | | if (!formEl) return |
| | | await formEl.validate((valid, fields) => { |
| | | if (valid) { |
| | | if(chosenIndex.value == -1){ |
| | | addRecord.value.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g,'-') |
| | | addRecord.value.updateTime = new Date().toLocaleString('zh', timeForm).replace(/\//g,'-') |
| | | tableData.push(addRecord.value) |
| | | }else{ |
| | | addRecord.value.updateTime = new Date().toLocaleString('zh', timeForm).replace(/\//g,'-') |
| | | tableData[chosenIndex.value] = addRecord.value |
| | | } |
| | | dialogAddRecord.value =false |
| | | } else { |
| | | console.log('error submit!', fields) |
| | | } |
| | | const closeAdd =()=>{ |
| | | addRecord.value={} |
| | | chosenIndex.value = -1 |
| | | } |
| | | const indexClear = ()=>{ |
| | | chosenIndex.value = -1 |
| | | } |
| | | const editRecord =(index, row)=>{ |
| | | dialogAddRecord.value = true |
| | | chosenIndex.value = index |
| | | addRecord.value = JSON.parse(JSON.stringify(row)) |
| | | } |
| | | // 折线图 |
| | | const renderMenu = async (value: string) => { |
| | | Session.set('projectId',value) |
| | | userInfos.value.projectId = value |
| | | await initBackEndControlRoutes(); |
| | | }; |
| | | // return { |
| | | // renderMenu, |
| | | // multipleTableRef, |
| | | // tableData, |
| | | // currentPage, |
| | | // pageSize, |
| | | // dialogDetails, |
| | | // details, |
| | | // deleteDialog, |
| | | // dialogAddRecord, |
| | | // viewRecord, |
| | | // deleteRecord, |
| | | // handleSizeChange, |
| | | // handleCurrentChange, |
| | | // Plus, |
| | | // Edit, |
| | | // Delete, |
| | | // Search, |
| | | // Download, |
| | | // handleSelectionChange, |
| | | // Refresh, |
| | | // ...toRefs(state), |
| | | // }; |
| | | // }, |
| | | // }); |
| | | }) |
| | | |
| | | } |
| | | const closeAdd =()=>{ |
| | | addRecord.value={} |
| | | chosenIndex.value = -1 |
| | | } |
| | | const indexClear = ()=>{ |
| | | chosenIndex.value = -1 |
| | | } |
| | | |
| | | // 折线图 |
| | | const renderMenu = async (value: string) => { |
| | | Session.set('projectId',value) |
| | | userInfos.value.projectId = value |
| | | await initBackEndControlRoutes(); |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |