From d592747d5eaa2cfbe698f8ac61222eb3aa75d1fc Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期二, 02 八月 2022 09:09:12 +0800 Subject: [PATCH] 添加修改页面 --- src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue | 297 +++++++++++++++++++++++++++-------------------------------- 1 files changed, 135 insertions(+), 162 deletions(-) diff --git a/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue b/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue index 4d8d77a..91a85f7 100644 --- a/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue +++ b/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue @@ -1,6 +1,6 @@ <template> <div class="home-container"> - <el-scrollbar height="100%"> + <div style="height: 100%"> <el-row class="homeCard"> <el-col :span="8"> <div class="grid-content topInfo"> @@ -27,6 +27,7 @@ ref="multipleTableRef" :data="tableData" style="width: 100%" + height="calc(100% - 100px)" :header-cell-style="{background: '#fafafa'}" @selection-change="handleSelectionChange" > @@ -41,22 +42,22 @@ </template> </el-table-column> </el-table> - </div> - <div class="pageBtn"> - <el-pagination - v-model:currentPage="currentPage" - v-model:page-size="pageSize" - :page-sizes="[10, 15]" - small=false - background - layout="total, sizes, prev, pager, next, jumper" - :total="100" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - /> + <div class="pageBtn"> + <el-pagination + v-model:currentPage="currentPage" + v-model:page-size="pageSize" + :page-sizes="[10, 15]" + small=false + background + layout="total, sizes, prev, pager, next, jumper" + :total="100" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> + </div> </div> </div> - </el-scrollbar> + </div> <el-dialog v-model="dialogDetails" title="证书过滤"> <el-form :model="details" label-width="120px"> <el-form-item label="证书名称"> @@ -134,136 +135,139 @@ 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 searchType=ref('') - const chosenIndex = ref(-1) - const handleSizeChange = (val: number) => { - console.log(`${val} items per page`) + const userInfo = useUserInfo() + const { userInfos } = storeToRefs(userInfo); + const state = reactive<stateType>({}); + const currentPage = ref(1) + const pageSize = ref(10) + const searchType=ref('') + 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( + [ + { + certificate: '登高作业证', + jobType: '高处作业' + }, + { + certificate: '焊接与热切割作业', + jobType: '动火作业' + }, + { + certificate: '低压电工证', + jobType: '临时用电' + }, + { + certificate: '化工自动化控制仪表作业', + jobType: '设备检修' } - const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`) + ] + ) + const addRef = ref<FormInstance>() + const addRules = reactive<FormRules>({ + certificate:[{required: true, message: '该内容不能为空',trigger:'blur'}], + jobType:[{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){ + tableData.unshift(addRecord.value) + }else{ + tableData[chosenIndex.value] = addRecord.value + } + dialogAddRecord.value =false + } else { + console.log('error submit!', fields) } - const tableData = reactive( - [ - { - certificate: '登高作业证', - jobType: '高处作业' - }, - { - certificate: '焊接与热切割作业', - jobType: '动火作业' - }, - { - certificate: '低压电工证', - jobType: '临时用电' - }, - { - certificate: '化工自动化控制仪表作业', - jobType: '设备检修' - } - ] - ) - const addRef = ref<FormInstance>() - const addRules = reactive<FormRules>({ - certificate:[{required: true, message: '该内容不能为空',trigger:'blur'}], - jobType:[{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){ - tableData.unshift(addRecord.value) - }else{ - 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 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(); + }; </script> <style scoped lang="scss"> $homeNavLengh: 8; .home-container { - height: 100%; + height: calc(100vh - 114px); + box-sizing: border-box; overflow: hidden; - padding: 20px; .homeCard{ width: 100%; padding: 20px; + box-sizing: border-box; background: #fff; border-radius: 4px; + + .main-card{ + width: 100%; + height: 100%; + .cardTop{ + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 20px; + .mainCardBtn{ + margin: 0; + } + } + .pageBtn{ + height: 60px; + display: flex; + align-items: center; + justify-content: right; + + .demo-pagination-block + .demo-pagination-block { + margin-top: 10px; + } + .demo-pagination-block .demonstration { + margin-bottom: 16px; + } + } + } + &:last-of-type{ + height: calc(100% - 100px); + } } .el-row{ display: flex; @@ -287,37 +291,6 @@ white-space: nowrap; margin-right: 20px; } - } - } - .mainPages{ - height: 100%; - display: flex; - flex-direction: column; - justify-content: space-between; - } - .main-card{ - width: 100%; - .cardTop{ - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 20px; - .mainCardBtn{ - margin: 0; - } - } - } - .pageBtn{ - display: flex; - align-items: center; - justify-content: right; - margin-top: 20px; - - .demo-pagination-block + .demo-pagination-block { - margin-top: 10px; - } - .demo-pagination-block .demonstration { - margin-bottom: 16px; } } } -- Gitblit v1.9.2