¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <GlobalWindow |
| | | :title="title" |
| | | width="100%" |
| | | :visible.sync="visible" |
| | | :confirm-working="isWorking" |
| | | @confirm="confirm" |
| | | > |
| | | <div class="box"> |
| | | <div class="top"> |
| | | {{title}} |
| | | </div> |
| | | <div class="box_table"> |
| | | <div class="box_table_head"> |
| | | <div class="box_table_head_item">æä¿ä¼ä¸</div> |
| | | <div class="box_table_head_item">ä¿é©æ¹æ¡</div> |
| | | <div class="box_table_head_item">ä¿åå·</div> |
| | | <div class="box_table_head_item">ä¿é©çæèµ·æ</div> |
| | | <div class="box_table_head_item">ä¿é©çææ¢æ</div> |
| | | <div class="box_table_head_item">å ä¿äººæ°</div> |
| | | <div class="box_table_head_item">åä¿äººæ°</div> |
| | | <div class="box_table_head_item">æ¹åçææ</div> |
| | | </div> |
| | | <div class="box_table_content " > |
| | | <div class="box_table_content_item box_table_content_header">{{ apply.companyName }}</div> |
| | | <div class="box_table_content_item box_table_content_header">{{ apply.solutionsName }}</div> |
| | | <div class="box_table_content_item box_table_content_header">{{ apply.code }}</div> |
| | | <div class="box_table_content_item box_table_content_header">{{ apply.startTime }}</div> |
| | | <div class="box_table_content_item box_table_content_header">{{ apply.endTime }}</div> |
| | | <div class="box_table_content_item box_table_content_header">{{ model.addNum}}</div> |
| | | <div class="box_table_content_item box_table_content_header">{{ model.delNum}}</div> |
| | | <div class="box_table_content_item box_table_content_header">{{ model.applyStartTime}}</div> |
| | | </div> |
| | | </div> |
| | | <div class="box_table"> |
| | | <div class="box_table_head"> |
| | | <div class="box_table_head_item1">å ä¿åå·¥</div> |
| | | <div class="box_table_head_item1">åä¿åå·¥</div> |
| | | </div> |
| | | <div class="box_table_head"> |
| | | <div class="box_table_head_item">åºå·</div> |
| | | <div class="box_table_head_item">åå·¥å§å</div> |
| | | <div class="box_table_head_item">身份è¯å·</div> |
| | | <div class="box_table_head_item">æ§å«</div> |
| | | <div class="box_table_head_item">æ´¾é£åä½</div> |
| | | <div class="box_table_head_item">æå±å·¥ç§</div> |
| | | <div class="box_table_head_item">åºå·</div> |
| | | <div class="box_table_head_item">åå·¥å§å</div> |
| | | <div class="box_table_head_item">身份è¯å·</div> |
| | | <div class="box_table_head_item">æ§å«</div> |
| | | <div class="box_table_head_item">æ´¾é£åä½</div> |
| | | <div class="box_table_head_item">æå±å·¥ç§</div> |
| | | </div> |
| | | <div class="box_table_content" v-for="(item, index) in detailList" :key="index"> |
| | | <div class="box_table_content_item">{{item.add.id!=null?(index + 1):''}}</div> |
| | | <div class="box_table_content_item" >{{ item.add.memberName }}</div> |
| | | <div class="box_table_content_item">{{ item.add.memberIdcardNo }}</div> |
| | | <div class="box_table_content_item">{{ item.add.sex==0?"ç·":(item.add.sex==1?"女":"" )}}</div> |
| | | <div class="box_table_content_item">{{ item.add.duName }}</div> |
| | | <div class="box_table_content_item">{{item.add.workTypeName}}</div> |
| | | <div class="box_table_content_item">{{item.del.id!=null?(index + 1):''}}</div> |
| | | <div class="box_table_content_item" >{{ item.del.memberName }}</div> |
| | | <div class="box_table_content_item">{{ item.del.memberIdcardNo }}</div> |
| | | <div class="box_table_content_item">{{ item.del.sex==0?"ç·":(item.del.sex==1?"女":"" ) }}</div> |
| | | <div class="box_table_content_item">{{ item.del.duName }}</div> |
| | | <div class="box_table_content_item">{{item.del.workTypeName}}</div> |
| | | </div> |
| | | </div> |
| | | <div class="box_table" v-if="type==1" style="border-top: 0px solid #b4bbc5;" > |
| | | <div class="box_table_head"> |
| | | <div class="box_table_head_item5">夿³¨</div> |
| | | <div class="box_table_head_item5"> |
| | | <input v-model="form.checkInfo" style="width: 100%;height: 45px;border: 0px;outline: none;" placeholder="请è¾å
¥" v-trim/> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <template v-if="type==1" v-slot:footer> |
| | | <el-button type="primary" :loading="isWorking.export" @click="check(0)">æäº¤éè¿</el-button> |
| | | <!-- <el-button type="danger" :loading="isWorking.export" @click="check(1)">å®¡æ ¸ä¸éè¿</el-button>--> |
| | | <el-button @click="visible=false">åæ¶</el-button> |
| | | </template> |
| | | <template v-else v-slot:footer> |
| | | <el-button type="primary" :loading="isWorking.export" @click="exportComFilesDo">ä¼ä¸è¯ä»¶</el-button> |
| | | <el-button type="primary" :loading="isWorking.export" @click="exportDetail">导åºè¯¦å</el-button> |
| | | <el-button @click="visible=false">åæ¶</el-button> |
| | | </template> |
| | | </GlobalWindow> |
| | | </template> |
| | | |
| | | <script> |
| | | import BaseOpera from '@/components/base/BaseOpera' |
| | | import GlobalWindow from '@/components/common/GlobalWindow' |
| | | import {getChangeDetailList, exportJiajianBaoExcel} from "@/api/business/insuranceApply"; |
| | | import {exportComFiles} from "@/api/business/company"; |
| | | // import {all as solutionAll} from "@/api/business/solutions"; |
| | | export default { |
| | | name: 'ApplyChangeDetails', |
| | | extends: BaseOpera, |
| | | components: { GlobalWindow }, |
| | | data () { |
| | | return { |
| | | model:{}, |
| | | apply:{}, |
| | | type:0, |
| | | detailList:[], |
| | | // è¡¨åæ°æ® |
| | | form: { |
| | | id: null, |
| | | dealBackApply:0, |
| | | checkInfo: '' |
| | | }, |
| | | // éªè¯è§å |
| | | rules: { |
| | | }, |
| | | reverse: true, |
| | | tableData: [] |
| | | } |
| | | }, |
| | | created () { |
| | | this.config({ |
| | | api: '/business/insuranceApply', |
| | | 'field.id': 'id' |
| | | }) |
| | | }, |
| | | methods: { |
| | | open(title,target,target2){ |
| | | this.title=title |
| | | this.visible=true |
| | | this.apply = target |
| | | this.model = target2 |
| | | this.form.id=target.id |
| | | this.getDetailListDo() |
| | | }, |
| | | getDetailListDo() { |
| | | this.detailList = [] |
| | | var that = this |
| | | getChangeDetailList({applyChangeId: this.model.id}) |
| | | .then(res => { |
| | | var addDetailList = [] |
| | | var delDetailList = [] |
| | | res.forEach(item1 => { |
| | | if (item1.type == 1) { |
| | | delDetailList.push(item1); |
| | | } else { |
| | | addDetailList.push(item1); |
| | | } |
| | | }) |
| | | var index = addDetailList.length > delDetailList.length?addDetailList.length : delDetailList.length |
| | | for(var i = 0;i<index;i++){ |
| | | var addModel = addDetailList.length > i?addDetailList[i]:{} |
| | | var delModel = delDetailList.length > i?delDetailList[i]:{} |
| | | that.detailList.push({add:addModel,del:delModel}); |
| | | console.log(detailList) |
| | | } |
| | | }).catch(err => {}) |
| | | }, |
| | | exportDetail(){ |
| | | this.$dialog.exportConfirm('确认导åºè¯¦ååï¼') |
| | | .then(() => { |
| | | this.isWorking = true |
| | | exportJiajianBaoExcel({ id: this.model.id }) |
| | | .then(response => { |
| | | this.download(response) |
| | | }) |
| | | .catch(e => { |
| | | console.log(e) |
| | | this.$message.error('æ°æ®ä¸è½½å¤±è´¥ï¼') |
| | | }) |
| | | .finally(() => { |
| | | this.isWorking = false |
| | | }) |
| | | }) |
| | | .catch(() => { |
| | | }) |
| | | }, |
| | | exportComFilesDo(){ |
| | | this.$dialog.exportConfirm('确认导åºä¼ä¸è¯ä»¶åï¼') |
| | | .then(() => { |
| | | this.isWorking = true |
| | | exportComFiles({ id: this.apply.companyId }) |
| | | .then(response => { |
| | | this.download(response) |
| | | }) |
| | | .catch(e => { |
| | | console.log(e) |
| | | this.$message.error('æ°æ®ä¸è½½å¤±è´¥ï¼') |
| | | }) |
| | | }) |
| | | .catch(() => { |
| | | }) |
| | | |
| | | }, |
| | | handleSizeChange(val) { |
| | | console.log(`æ¯é¡µ ${val} æ¡`); |
| | | }, |
| | | handleCurrentChange(val) { |
| | | console.log(`å½å页: ${val}`); |
| | | }, |
| | | handleClick(tab, event) { |
| | | console.log(tab, event); |
| | | }, |
| | | onSubmit() { |
| | | |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .box { |
| | | width: 100%; |
| | | .top{ |
| | | width: 100%; |
| | | align-items: center; |
| | | flex-wrap: wrap; |
| | | border-top: 1px solid #b4bbc5; |
| | | border-left: 1px solid #b4bbc5; |
| | | font-size: 14px; |
| | | font-weight: bold; |
| | | text-align: center; |
| | | padding: 15px; |
| | | } |
| | | .box_header { |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | flex-wrap: wrap; |
| | | border-top: 1px solid #b4bbc5; |
| | | border-left: 1px solid #b4bbc5; |
| | | .box_header_item { |
| | | width: 50%; |
| | | height: 50px; |
| | | display: flex; |
| | | align-items: center; |
| | | border-right: 1px solid #b4bbc5; |
| | | border-bottom: 1px solid #b4bbc5; |
| | | box-sizing: border-box; |
| | | |
| | | .box_header_item_label { |
| | | flex: 1; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 14px; |
| | | color: black; |
| | | background: #f2f2f2; |
| | | border-right: 1px solid #b4bbc5; |
| | | } |
| | | .box_header_item_val { |
| | | flex: 1; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 14px; |
| | | color: black; |
| | | } |
| | | } |
| | | } |
| | | .box_table { |
| | | width: 100%; |
| | | border-top: 1px solid #b4bbc5; |
| | | border-left: 1px solid #b4bbc5; |
| | | box-sizing: border-box; |
| | | .box_table_head { |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | .box_table_head_item1 { |
| | | flex: 1; |
| | | height: 50px; |
| | | background: #f2f2f2; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 14px; |
| | | color: black; |
| | | border-right: 1px solid #b4bbc5; |
| | | border-bottom: 1px solid #b4bbc5; |
| | | box-sizing: border-box; |
| | | } |
| | | .box_table_head_item { |
| | | flex: 1; |
| | | height: 50px; |
| | | background: #f2f2f2; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 14px; |
| | | color: black; |
| | | border-right: 1px solid #b4bbc5; |
| | | border-bottom: 1px solid #b4bbc5; |
| | | box-sizing: border-box; |
| | | &:nth-child(3) { |
| | | flex: 1.5;; |
| | | } |
| | | &:nth-child(9) { |
| | | flex: 1.5;; |
| | | } |
| | | } |
| | | .box_table_head_item5 { |
| | | flex: 1; |
| | | height: 50px; |
| | | background: #f2f2f2; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 14px; |
| | | color: black; |
| | | border-right: 1px solid #b4bbc5; |
| | | border-bottom: 1px solid #b4bbc5; |
| | | box-sizing: border-box; |
| | | &:nth-child(2) { |
| | | flex: 5; |
| | | } |
| | | } |
| | | .box_form_item { |
| | | flex: 1; |
| | | height: 50px; |
| | | background: #ffffff; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 14px; |
| | | color: black; |
| | | border-right: 1px solid #b4bbc5; |
| | | border-bottom: 1px solid #b4bbc5; |
| | | box-sizing: border-box; |
| | | &:nth-child(1) { |
| | | //flex: 0.5; |
| | | } |
| | | } |
| | | } |
| | | .box_table_content { |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | .box_table_content_header{ |
| | | border-bottom: 0px solid #b4bbc5 !important; |
| | | } |
| | | .box_table_content_item { |
| | | flex: 1; |
| | | height: 50px; |
| | | background: #ffffff; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 14px; |
| | | color: black; |
| | | border-right: 1px solid #b4bbc5; |
| | | border-bottom: 1px solid #b4bbc5; |
| | | box-sizing: border-box; |
| | | &:nth-child(3) { |
| | | flex: 1.5; |
| | | } |
| | | &:nth-child(9) { |
| | | flex: 1.5; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |