¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div> |
| | | <div> |
| | | <div class="search-background"> |
| | | <span v-if="tabIndex === '0'" class="search-group"> |
| | | <span style="width: 150px">åä½åç§°ï¼</span> |
| | | <el-input v-model="searchForm.unitName" clearable size="small"></el-input> |
| | | </span> |
| | | <span v-if="tabIndex === '1'" class="search-group"> |
| | | <span style="width: 150px">æä»¶åç§°ï¼</span> |
| | | <el-input v-model="searchForm1.fileName" clearable size="small"></el-input> |
| | | </span> |
| | | <span class="search-group"> |
| | | <el-button size="small" @click="resetSearchForm">é ç½®</el-button> |
| | | <el-button size="small" type="primary" @click="searchList">æ¥ è¯¢</el-button> |
| | | </span> |
| | | <div class="btn"> |
| | | <el-button v-if="tabIndex === '0'" size="small" type="primary" @click="openFormDia('add')">æ° å¢</el-button> |
| | | <el-upload v-if="tabIndex === '1'" ref='upload' :action="action" :before-upload="beforeUpload" |
| | | :headers="uploadHeader" :on-error="onError" :on-success="handleSuccessUp" :show-file-list="false" |
| | | accept='.jpg,.jpeg,.png,.gif,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.zip,.rar'> |
| | | <el-button :loading="upLoading" size="small" type="primary">导å
¥</el-button> |
| | | </el-upload> |
| | | </div> |
| | | </div> |
| | | <div class="table"> |
| | | <div class="table-tab"> |
| | | <el-radio-group v-model="tabIndex" @change="searchList" size="small"> |
| | | <el-radio-button label="0">å®¢æ·æ»¡æåº¦</el-radio-button> |
| | | <el-radio-button label="1">综ååæ</el-radio-button> |
| | | </el-radio-group> |
| | | </div> |
| | | <div v-if="tabIndex === '0'"> |
| | | <TableCard :showForm="false" :showTitle="false"> |
| | | <template v-slot:table> |
| | | <limsTable :column="tableColumn" :height="'calc(100vh - 22em)'" :table-data="tableData" |
| | | :table-loading="tableLoading" style="padding: 0 15px;margin-bottom: 16px" @pagination="pagination" |
| | | :page="page"> |
| | | </limsTable> |
| | | </template> |
| | | </TableCard> |
| | | </div> |
| | | <div v-if="tabIndex === '1'"> |
| | | <TableCard :showForm="false" :showTitle="false"> |
| | | <template v-slot:table> |
| | | <limsTable :column="tableColumn1" :height="'calc(100vh - 22em)'" :table-data="tableData1" |
| | | :table-loading="tableLoading1" style="padding: 0 15px;margin-bottom: 16px" @pagination="pagination0"> |
| | | </limsTable> |
| | | </template> |
| | | </TableCard> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <el-dialog :visible.sync="lookDialogVisible" fullscreen title="æ¥çéä»¶" top="5vh" width="800px"> |
| | | <filePreview v-if="lookDialogVisible" :currentFile="{}" :fileUrl="javaApi + '/word/' + currentInfo.fileUrl" |
| | | style="height: 90vh;overflow-y: auto;" /> |
| | | </el-dialog> |
| | | <FormDialog v-if="formDialog" ref="formDialog" @closeFormDia="closeFormDia"></FormDialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import TableCard from '@/components/TableCard/index.vue'; |
| | | import limsTable from "@/components/Table/lims-table.vue"; |
| | | import FormDialog from './components/formDialog.vue'; |
| | | import filePreview from '@/components/Preview/filePreview.vue' |
| | | import { |
| | | pageClientSatisfaction, |
| | | pageAnalyseFile, |
| | | delClientSatisfaction, |
| | | delAnalyseFile, |
| | | } from '@/api/cnas/systemManagement/customerSatisfaction.js' |
| | | |
| | | export default { |
| | | name: 'a8-customer-satisfaction', |
| | | // import å¼å
¥çç»ä»¶éè¦æ³¨å
¥å°å¯¹è±¡ä¸æè½ä½¿ç¨ |
| | | components: { filePreview, FormDialog, limsTable, TableCard }, |
| | | data() { |
| | | // è¿éåæ¾æ°æ® |
| | | return { |
| | | searchForm: { |
| | | unitName: '', |
| | | }, |
| | | searchForm1: { |
| | | fileName: '', |
| | | }, |
| | | tabIndex: '0', |
| | | tableColumn: [ |
| | | { |
| | | label: 'åä½åç§°', |
| | | prop: 'unitName', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | label: 'æ¥æ', |
| | | prop: 'fillDate', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | label: 'å§å', |
| | | prop: 'userName', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | label: 'é¨é¨', |
| | | prop: 'department', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | label: 'èç³»çµè¯', |
| | | prop: 'contactNumber', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | label: 'åå»ºæ¥æ', |
| | | prop: 'createTime', |
| | | minWidth: '100', |
| | | }, |
| | | { |
| | | dataType: 'action', |
| | | minWidth: '80', |
| | | label: 'æä½', |
| | | operation: [ |
| | | { |
| | | name: 'ç¼è¾', |
| | | type: 'text', |
| | | clickFun: (row) => { |
| | | this.openFormDia('edit', row); |
| | | }, |
| | | }, |
| | | { |
| | | name: 'å é¤', |
| | | type: 'text', |
| | | color: '#f56c6c', |
| | | clickFun: (row) => { |
| | | this.delPlan(row) |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | ], |
| | | tableData: [], |
| | | tableLoading: false, |
| | | page: { |
| | | size: 20, |
| | | current: 1, |
| | | }, |
| | | total: 0, |
| | | tableColumn1: [ |
| | | { |
| | | label: 'éä»¶åç§°', |
| | | prop: 'fileName', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | label: 'å建人', |
| | | prop: 'userName', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | label: 'å建æ¶é´', |
| | | prop: 'createTime', |
| | | minWidth: '100' |
| | | }, |
| | | { |
| | | dataType: 'action', |
| | | minWidth: '50', |
| | | label: 'æä½', |
| | | operation: [ |
| | | { |
| | | name: 'é¢è§', |
| | | type: 'text', |
| | | clickFun: (row) => { |
| | | this.handleLook(row) |
| | | } |
| | | }, |
| | | { |
| | | name: 'ä¸è½½', |
| | | type: 'text', |
| | | clickFun: (row) => { |
| | | this.upload(row); |
| | | }, |
| | | }, |
| | | { |
| | | name: 'å é¤', |
| | | type: 'text', |
| | | color: '#f56c6c', |
| | | clickFun: (row) => { |
| | | this.delFile(row) |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | ], |
| | | tableData1: [], |
| | | tableLoading1: false, |
| | | page1: { |
| | | size: 20, |
| | | current: 1, |
| | | }, |
| | | total1: 0, |
| | | formDialog: false, |
| | | upLoading: false, |
| | | currentInfo: {}, |
| | | lookDialogVisible: false, |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.searchList() |
| | | }, |
| | | // æ¹æ³éå |
| | | methods: { |
| | | // æ¥è¯¢å表 |
| | | searchList() { |
| | | const entity = this.tabIndex === '0' ? this.searchForm : this.searchForm1 |
| | | const page = this.tabIndex === '0' ? this.page : this.page1 |
| | | if (this.tabIndex === '0') { |
| | | this.tableLoading = true |
| | | pageClientSatisfaction({ ...entity, ...page }).then(res => { |
| | | this.tableLoading = false |
| | | if (res.code === 201) return |
| | | this.tableData = res.data.records |
| | | this.total = res.data.total |
| | | }).catch(err => { |
| | | console.log('err---', err); |
| | | this.tableLoading = false |
| | | }) |
| | | } else { |
| | | this.tableLoading1 = true |
| | | pageAnalyseFile({ ...entity, ...page }).then(res => { |
| | | this.tableLoading1 = false |
| | | if (res.code === 201) return |
| | | this.tableData1 = res.data.records |
| | | this.total1 = res.data.total |
| | | }).catch(err => { |
| | | console.log('err---', err); |
| | | this.tableLoading1 = false |
| | | }) |
| | | } |
| | | }, |
| | | openFormDia(type, row) { |
| | | this.formDialog = true |
| | | this.$nextTick(() => { |
| | | this.$refs.formDialog.openDia(type, row); |
| | | }) |
| | | }, |
| | | closeFormDia() { |
| | | this.formDialog = false |
| | | this.searchList() |
| | | }, |
| | | // éç½®æ¥è¯¢æ¡ä»¶ |
| | | resetSearchForm() { |
| | | this.searchForm.unitName = ''; |
| | | this.searchForm1.fileName = ''; |
| | | this.searchList() |
| | | }, |
| | | // 导å
¥æµç¨ |
| | | beforeUpload(file) { |
| | | if (file.size > 1024 * 1024 * 10) { |
| | | this.$message.error('ä¸ä¼ æä»¶ä¸è¶
è¿10M'); |
| | | this.$refs.upload.clearFiles() |
| | | return false; |
| | | } else { |
| | | this.upLoading = true; |
| | | return true; |
| | | } |
| | | }, |
| | | onError(err, file, fileList) { |
| | | this.$message.error('ä¸ä¼ 失败') |
| | | this.$refs.upload.clearFiles() |
| | | }, |
| | | handleSuccessUp(response) { |
| | | this.upLoading = false; |
| | | if (response.code == 200) { |
| | | this.$message.success('ä¸ä¼ æå'); |
| | | this.searchList() |
| | | } |
| | | }, |
| | | // å é¤å®¢æ·æ»¡æåº¦ |
| | | delPlan(row) { |
| | | this.$confirm('æ¤æä½å°æ°¸ä¹
å é¤è¯¥æ°æ®, æ¯å¦ç»§ç»?', 'æç¤º', { |
| | | confirmButtonText: 'ç¡®å®', |
| | | cancelButtonText: 'åæ¶', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | this.tableLoading = true |
| | | delClientSatisfaction({ clientSatisfactionId: row.clientSatisfactionId }).then(res => { |
| | | this.tableLoading = false |
| | | if (res.code === 201) return |
| | | this.$message.success('å 餿å') |
| | | this.searchList() |
| | | }).catch(err => { |
| | | this.tableLoading = false |
| | | console.log('err---', err); |
| | | }) |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已忶å é¤' |
| | | }); |
| | | }); |
| | | }, |
| | | // æ¥çæä»¶ |
| | | handleLook(row) { |
| | | this.currentInfo = row |
| | | this.lookDialogVisible = true |
| | | }, |
| | | // ä¸è½½å®¢æ·ç¦å»º |
| | | upload(row) { |
| | | let url = ''; |
| | | if (row.type == 1) { |
| | | url = this.javaApi + '/img/' + row.fileUrl |
| | | file.downloadIamge(url, row.fileName) |
| | | } else { |
| | | url = this.javaApi + '/word/' + row.fileUrl |
| | | const link = document.createElement('a'); |
| | | link.href = url; |
| | | link.download = row.fileName; |
| | | link.click(); |
| | | } |
| | | }, |
| | | // å é¤å®¢æ·åæéä»¶ |
| | | delFile(row) { |
| | | this.$confirm('æ¤æä½å°æ°¸ä¹
å é¤è¯¥æ°æ®, æ¯å¦ç»§ç»?', 'æç¤º', { |
| | | confirmButtonText: 'ç¡®å®', |
| | | cancelButtonText: 'åæ¶', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | this.tableLoading = true |
| | | delAnalyseFile({ analyseFileId: row.analyseFileId }).then(res => { |
| | | this.tableLoading = false |
| | | if (res.code === 201) return |
| | | this.$message.success('å 餿å') |
| | | this.searchList() |
| | | }).catch(err => { |
| | | this.tableLoading = false |
| | | console.log('err---', err); |
| | | }) |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已忶å é¤' |
| | | }); |
| | | }); |
| | | }, |
| | | // å页 |
| | | pagination({ page, limit }) { |
| | | this.page.current = page; |
| | | this.page.size = limit; |
| | | this.searchList(); |
| | | }, |
| | | // å页 |
| | | pagination0({ page, limit }) { |
| | | this.page.current = page; |
| | | this.page.size = limit; |
| | | this.searchList(); |
| | | }, |
| | | }, |
| | | // ç¨äºä¸ä¼ æä»¶çä¿¡æ¯ |
| | | computed: { |
| | | action() { |
| | | return this.javaApi + '/clientSatisfaction/uploadAnalyseFile' |
| | | } |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .view-title { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | height: 60px; |
| | | padding-left: 20px; |
| | | } |
| | | |
| | | .search-background { |
| | | width: 100%; |
| | | height: 80px; |
| | | line-height: 80px; |
| | | background-color: #ffffff; |
| | | display: flex; |
| | | position: relative; |
| | | } |
| | | |
| | | .search-group { |
| | | display: flex; |
| | | align-items: center; |
| | | margin: 0 20px; |
| | | } |
| | | |
| | | .table { |
| | | background-color: #ffffff; |
| | | } |
| | | |
| | | .table-tab { |
| | | margin: 0 20px 20px 20px; |
| | | } |
| | | |
| | | .btn { |
| | | position: absolute; |
| | | top: 16px; |
| | | right: 20px; |
| | | } |
| | | </style> |