Mr.Shi

MrShi

2024-01-26 58c2e3e1dd75513b90f878684e913d85db41cc41

 company/src/components/business/OperaInsuranceWindow.vue

@@ -9,9 +9,13 @@
            <el-form-item label="保险公司" prop="name">
                <el-input v-model="form.name" placeholder="平安保险" v-trim/>
            </el-form-item>
            <el-button type="primary" style="margin-bottom: 10px;">添加</el-button>
            <div style="width: 100%; display: flex; align-items: center;margin-bottom: 10px;">
                <el-button type="primary" @click="add">添加</el-button>
                <el-button type="primary" @click="impor">导入工种</el-button>
                <el-button type="text" @click="exprot">导入模版xls</el-button>
            </div>
            <el-table
                :data="tableData"
                :data="form.worktypeList"
                border
                style="width: 100%; margin-bottom: 20px;">
                <el-table-column
@@ -34,17 +38,21 @@
                    align="center"
                    width="100">
                    <template slot-scope="scope">
                        <el-button type="text" size="small" style="color: red;">删除</el-button>
                        <el-button type="text" size="small" style="color: red;" @click="dele(scope.$index)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-form>
        <!--    上传工种    -->
        <input type="file" @change="getFile" style="opacity: 0;" ref="upload" accept=".xlsx" />
    </GlobalWindow>
</template>

<script>
    import BaseOpera from '@/components/base/BaseOpera'
    import GlobalWindow from '@/components/common/GlobalWindow'
    import { importExcel, all } from '@/api/business/worktype'

    export default {
        name: 'OperaInsuranceWindow',
        extends: BaseOpera,
@@ -54,12 +62,14 @@
                // 表单数据
                form: {
                    id: null,
                    name: ''
                    name: '',
                    worktypeList: [
                        { name: '' }
                    ]
                },
                // 验证规则
                rules: {
                },
                tableData: []
                }
            }
        },
        created () {
@@ -67,6 +77,81 @@
                api: '/business/insurance',
                'field.id': 'id'
            })
        },
        methods: {
            open (title, target) {
                this.title = title
                this.visible = true
                // 新建
                if (target == null) {
                    this.$nextTick(() => {
                        this.$refs.form.resetFields()
                        this.form[this.configData['field.id']] = null
                    })
                    return
                }
                // 编辑
                this.$nextTick(() => {
                    for (const key in this.form) {
                        this.form[key] = target[key]
                    }
                    all({ insuranceId: this.form.id })
                        .then(res => {
                            let arr = []
                            res.forEach(item => {
                                arr.push({ name: item.name })
                            })
                            this.form.worktypeList = arr
                        })
                })
            },
            // 导出模板
            exprot() {
                let a = document.createElement("a");
                a.href = '/public/file/typeWork.xlsx';
                a.download = '保险公司-工种导入模版.xlsx';
                a.click();
            },
            // 导入工种模板
            getFile(e) {
                const formdate = new FormData()
                formdate.append('file', e.target.files[0])
                importExcel(formdate)
                    .then(res => {
                        res.forEach(item => {
                            if (this.form.worktypeList.length === 0) {
                                this.form.worktypeList.push({ name: item })
                            } else {
                                let next = true
                                this.form.worktypeList.forEach(row => {
                                    if (row.name === item) {
                                        next = false
                                    }
                                })
                                if (next) {
                                    this.form.worktypeList.push({ name: item })
                                }
                            }
                        })
                    })
                    .finally(() => {
                        this.$refs.upload.value = null
                    })
            },
            // 上传文件
            impor() {
                this.$refs.upload.click()
            },
            add() {
                this.form.worktypeList.push({ name: '' })
            },
            dele(index) {
                if (this.form.worktypeList.length === 1) {
                    this.$message.warning('至少保留一项内容')
                    return
                }
                this.form.worktypeList.splice(index, 1)
            }
        }
    }
</script>