¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div style="padding: 10px"> |
| | | <div class="header"> |
| | | <div></div> |
| | | <div style="min-width: 200px"> |
| | | <el-button type="primary" size="small" @click="addFun">æ° å¢</el-button> |
| | | <el-button type="primary" size="small" @click="approvalFun">审 æ¹</el-button> |
| | | <el-button type="primary" size="small" @click="approveFun">æ¹ å</el-button> |
| | | <el-upload style="display: inline-block; padding: 0 6px" :action="action" :headers="uploadHeader" |
| | | :on-error="onError" :show-file-list="false" :on-success="onSuccess"> |
| | | <el-button size="small" type="primary">导 å
¥</el-button> |
| | | </el-upload> |
| | | <el-button size="small" @click="openDownloadDia">导åº</el-button> |
| | | </div> |
| | | </div> |
| | | <el-table :data="tableData" style="width: 100%" height="calc(100vh - 18em)"> |
| | | <el-table-column type="index" label="åºå·" width="120"> |
| | | <template v-slot="scope"> |
| | | <span>{{ (search.current - 1) * search.size + scope.$index + 1 }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="jobActivity" label="ä½ä¸æ´»å¨" min-width="180"></el-table-column> |
| | | <el-table-column prop="category" label="é£é©å ç´ ç±»å«" width="testDate" min-width="180"></el-table-column> |
| | | <el-table-column prop="description" label="é£é©å ç´ æè¿°" min-width="180"></el-table-column> |
| | | <el-table-column prop="result" label="å¯å¯¼è´çäºæ
" min-width="180"></el-table-column> |
| | | <el-table-column prop="intolerable" label="æ¯å¦ä¸å¯æ¿åé£é©" min-width="180"></el-table-column> |
| | | <el-table-column prop="plan" label="æ§å¶è®¡å" min-width="180"></el-table-column> |
| | | <el-table-column prop="editorName" label="ç¼å¶äººå§å" min-width="180"></el-table-column> |
| | | <el-table-column prop="editorDate" label="ç¼å¶æ¥æ" min-width="180"></el-table-column> |
| | | <el-table-column prop="approvalName" label="审æ¹å§å" min-width="180"></el-table-column> |
| | | <el-table-column prop="approvalDate" label="å®¡æ¹æ¥æ" min-width="180"></el-table-column> |
| | | <el-table-column prop="approvalStatus" label="审æ¹ç¶æ" min-width="180"> |
| | | <template #default="{ row }"> |
| | | {{ row.approvalStatus === 1 ? 'éè¿' : row.approvalStatus === 2 ? 'ä¸éè¿' : '' }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="approveName" label="æ¹åå§å" min-width="180"></el-table-column> |
| | | <el-table-column prop="approveStatus" label="æ¹åç¶æ" min-width="180"> |
| | | <template #default="{ row }"> |
| | | {{ row.approveStatus === 1 ? 'éè¿' : row.approveStatus === 2 ? 'ä¸éè¿' : '' }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="approveDate" label="æ¹åäººæ¥æ" min-width="180"></el-table-column> |
| | | <el-table-column fixed="right" label="æä½" width="100"> |
| | | <template v-slot="scope"> |
| | | <el-button type="text" size="small" @click="editClick(scope.row)">ç¼è¾</el-button> |
| | | <el-button @click="deleteClick(scope.row)" type="text" size="small">å é¤</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination :current-page="1" :page-size="search.size" :page-sizes="[10, 20, 30, 50, 100]" :total="search.total" |
| | | layout="->,total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange"> |
| | | </el-pagination> |
| | | <el-dialog title="æç¤º" :visible.sync="dialogVisible" width="50%"> |
| | | <el-form ref="form" :model="form" label-width="120px"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ä½ä¸æ´»å¨"> |
| | | <el-input v-model="form.jobActivity" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="é£é©å ç´ ç±»å«"> |
| | | <el-input v-model="form.category" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="é£é©å ç´ æè¿°"> |
| | | <el-input v-model="form.description" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å¯å¯¼è´çäºæ
"> |
| | | <el-input v-model="form.result" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æ¯å¦ä¸å¯æ¿åé£é©" label-width="130px"> |
| | | <el-input v-model="form.intolerable" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æ§å¶è®¡å"> |
| | | <el-input v-model="form.plan" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="dialogVisible = false">å æ¶</el-button> |
| | | <el-button type="primary" @click="addApi" :loading="loading">ç¡® å®</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | getPageList, |
| | | riskAnalysisApprovalOfControlPlanChecklist, |
| | | approvalOfControlPlanChecklist, |
| | | deleteSignificantRiskFactorAnalysis, |
| | | analysisOfMajorRiskFactorsAdded, |
| | | exportSignificantRiskFactors, |
| | | } from '@/api/cnas/systemManagement/measuresDealRisks.js' |
| | | import { mapGetters } from "vuex"; |
| | | export default { |
| | | data() { |
| | | return { |
| | | dialogVisible: false, |
| | | form: {}, |
| | | loading: false, |
| | | search: { |
| | | size: 20, |
| | | current: 1, |
| | | total: 0 |
| | | }, |
| | | tableData: [], |
| | | } |
| | | }, |
| | | computed: { |
| | | action() { |
| | | return this.javaApi + '/manageControlPlanList/importControlPlanList' |
| | | }, |
| | | ...mapGetters(["userId"]), |
| | | }, |
| | | methods: { |
| | | handleSizeChange(val) { |
| | | this.search.size = val; |
| | | this.initData(); |
| | | }, |
| | | handleCurrentChange(val) { |
| | | this.search.current = val; |
| | | this.initData(); |
| | | }, |
| | | initData() { |
| | | getPageList(this.search).then(res => { |
| | | if (res.code === 201) return; |
| | | this.tableData = res.data.records; |
| | | this.search.total = res.data.total; |
| | | }); |
| | | }, |
| | | // å®¡æ¹ |
| | | approvalFun() { |
| | | this.$confirm('æ¯å¦å®¡æ¹éè¿?', 'æç¤º', { |
| | | confirmButtonText: 'éè¿', |
| | | cancelButtonText: 'ä¸éè¿', |
| | | type: 'warning', |
| | | closeOnClickModal: false, // ç¦æ¢ç¹å»é®ç½©å±å
³é |
| | | distinguishCancelAndClose: true, |
| | | beforeClose: (action, instance, done) => { |
| | | if (action === 'confirm') { |
| | | this.approvalApi(this.userId, 1) |
| | | done(); |
| | | } else if (action === 'cancel') { |
| | | this.approvalApi(this.userId, 2) |
| | | done(); |
| | | } else if (action === 'close') { |
| | | // ç¹å»âÃâæé®ï¼ä¸å
许å
³é |
| | | done(); |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | // å®¡æ¹æ¥å£ |
| | | approvalApi(userId, status) { |
| | | riskAnalysisApprovalOfControlPlanChecklist({ approval: userId, status }).then(res => { |
| | | if (res.code === 201) return; |
| | | this.initData() |
| | | this.$message({ |
| | | type: 'success', |
| | | message: 'æä½æå!' |
| | | }); |
| | | }); |
| | | }, |
| | | // æ¹å |
| | | approveFun() { |
| | | this.$confirm('æ¯å¦æ¹åéè¿?', 'æç¤º', { |
| | | confirmButtonText: 'éè¿', |
| | | cancelButtonText: 'ä¸éè¿', |
| | | type: 'warning', |
| | | closeOnClickModal: false, // ç¦æ¢ç¹å»é®ç½©å±å
³é |
| | | distinguishCancelAndClose: true, |
| | | beforeClose: (action, instance, done) => { |
| | | if (action === 'confirm') { |
| | | this.approveApi(this.userId, 1) |
| | | done(); |
| | | } else if (action === 'cancel') { |
| | | this.approveApi(this.userId, 2) |
| | | done(); |
| | | } else if (action === 'close') { |
| | | // ç¹å»âÃâæé®ï¼ä¸å
许å
³é |
| | | done(); |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | // æ¹åæ¥å£ |
| | | approveApi(userId, status) { |
| | | approvalOfControlPlanChecklist({ approve: userId, status }).then(res => { |
| | | if (res.code === 201) return; |
| | | this.initData() |
| | | this.$message({ |
| | | type: 'success', |
| | | message: 'æä½æå!' |
| | | }); |
| | | }); |
| | | }, |
| | | onError() { |
| | | this.$message({ |
| | | type: 'error', |
| | | message: 'æä½å¤±è´¥!' |
| | | }); |
| | | }, |
| | | onSuccess(response) { |
| | | if (response.code == 201) { |
| | | this.$message({ |
| | | type: 'error', |
| | | message: response.message, |
| | | }); |
| | | return |
| | | } |
| | | this.initData() |
| | | this.$message({ |
| | | type: 'success', |
| | | message: 'æä½æå!' |
| | | }); |
| | | }, |
| | | addFun() { |
| | | this.form = {} |
| | | this.dialogVisible = true |
| | | }, |
| | | // å é¤ |
| | | deleteClick(row) { |
| | | this.$confirm('æ¤æä½å°æ°¸ä¹
å é¤è¯¥æ°æ®, æ¯å¦ç»§ç»?', 'æç¤º', { |
| | | confirmButtonText: 'ç¡®å®', |
| | | cancelButtonText: 'åæ¶', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | deleteSignificantRiskFactorAnalysis({ id: row.id }).then(res => { |
| | | if (res.code === 201) return; |
| | | this.initData() |
| | | this.$message({ |
| | | type: 'success', |
| | | message: 'æä½æå!' |
| | | }); |
| | | }); |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已忶å é¤' |
| | | }); |
| | | }); |
| | | }, |
| | | addApi() { |
| | | this.loading = true |
| | | analysisOfMajorRiskFactorsAdded(this.form).then(res => { |
| | | if (res.code === 201) return; |
| | | this.dialogVisible = false |
| | | this.loading = false |
| | | this.initData() |
| | | this.$message({ |
| | | type: 'success', |
| | | message: 'æä½æå!' |
| | | }); |
| | | }).catch(err => { |
| | | this.loading = false |
| | | }); |
| | | }, |
| | | // ç¼è¾ |
| | | editClick(row) { |
| | | this.form = { ...row } |
| | | this.dialogVisible = true |
| | | }, |
| | | // å¯¼åº |
| | | openDownloadDia() { |
| | | exportSignificantRiskFactors().then(res => { |
| | | this.outLoading = false |
| | | this.$message.success('å¯¼åºæå') |
| | | const blob = new Blob([res], { type: 'application/msword' }); |
| | | this.$download.saveAs(blob, 'é大é£é©å ç´ åæåæ§å¶è®¡åæ¸
å' + '.docx'); |
| | | }) |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.initData() |
| | | }, |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .header { |
| | | height: 3em; |
| | | width: 100%; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | } |
| | | </style> |