Merge remote-tracking branch 'origin/master'

jiangping

2024-01-27 bd25d9a8a058e8c618ee4188ed5f15a898c0f7e8

 platform/src/components/business/OperaDispatchUnitWindow.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,293 @@
<template>
    <GlobalWindow
        :title="title"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <el-form :model="form" ref="form" :rules="rules">
            <el-form-item label="派遣单位名称" prop="name">
                <el-input v-model="form.name" placeholder="请输入" v-trim/>
            </el-form-item>
            <el-form-item label="派遣单位信用代码" prop="code">
                <el-input v-model="form.code" placeholder="请输入" v-trim/>
            </el-form-item>
            <el-form-item label="派遣单位描述" prop="content">
                <el-input v-model="form.content" placeholder="请输入" v-trim/>
            </el-form-item>
        </el-form>
        <div class="list">
            <el-button type="primary" style="margin-bottom: 15px;" @click="add">添加方案</el-button>
            <div class="list_item" v-for="(item, index) in form.saveDuSolutionDTOList" :key="index">
                <div class="list_item_input">
                    <div class="list_item_input_label"><span>*</span>保险方案</div>
                    <div class="list_item_input_val">
                        <el-select v-model="item.solutionId" @change="changeTypeWork($event, index)" placeholder="请选择">
                            <el-option
                                v-for="item in insuranceScheme"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                        <div style="display: flex; align-items: center;">
                            <el-button type="primary" @click="addItem(index)">添加</el-button>
                            <el-button type="danger" @click="deleItem(index)">删除</el-button>
                        </div>
                    </div>
                </div>
                <div class="list_item_table">
                    <el-table
                        :data="item.saveDuWorkTypeDTOList"
                        border
                        style="width: 100%">
                        <el-table-column label="序号" width="80px">
                            <template slot-scope="scope">
                                <span>{{scope.$index + 1}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                            prop="name"
                            label="所属工种">
                            <template slot-scope="scope">
                                <el-select v-model="scope.row.workTypeId" @change="changeGZ($event, index, scope.$index)" placeholder="请选择">
                                    <el-option
                                        v-for="item in item.typeWork"
                                        :key="item.id"
                                        :label="item.name"
                                        :value="item.id">
                                    </el-option>
                                </el-select>
                            </template>
                        </el-table-column>
                        <el-table-column
                            prop="address"
                            label="操作视频（非必填）">
                            <template slot-scope="scope">
                                <div style="width: 100px; height: 100px;">
                                    <UploadAvatarVideo :uploadData="{ folder: 'unit' }" :file="scope.row.file" @uploadSuccess="result($event, index, scope.$index)" />
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column
                            label="操作"
                            width="90"
                            fixed="right">
                            <template slot-scope="scope">
                                <el-button type="text" @click="dele(index, scope.$index)">删除</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>
        </div>
    </GlobalWindow>
</template>

<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalWindow from '@/components/common/GlobalWindow'
import UploadAvatarVideo from '@/components/common/UploadAvatarVideo'
import { all } from '@/api/business/solutions'
import { findListByDTO } from '@/api/business/worktype'
export default {
  name: 'OperaDispatchUnitWindow',
  extends: BaseOpera,
  components: { GlobalWindow, UploadAvatarVideo },
  data () {
    return {
      // è¡¨å•æ•°æ®
      form: {
        id: null,
        name: '',
        code: '',
        content: '',
        saveDuSolutionDTOList: [
          {
            id: '',
            saveDuWorkTypeDTOList: [
              {
                videoUrl: '',
                workTypeId: '',
                workTypeName: '',
                file: {
                  videourl: '',
                  videourlfull: ''
                }
              }
            ],
            typeWork: [],
            solutionId: '',
            solutionName: ''
          }
        ]
      },
      // éªŒè¯è§„则
      rules: {
        name: [
          { required: true, message: '请输入派遣单位名称' }
        ],
        code: [
          { required: true, message: '请输入派遣单位信用代码' }
        ],
        content: [
          { required: true, message: '请输入派遣单位描述' }
        ]
      },
      insuranceScheme: []
    }
  },
  created () {
    this.config({
      api: '/business/dispatchUnit',
      'field.id': 'id'
    })
    all({})
      .then(res => {
        this.insuranceScheme = res
      })
  },
  methods: {
    open (title, target) {
      this.title = title
      this.visible = true
      this.form.saveDuSolutionDTOList = [
        {
          id: '',
          saveDuWorkTypeDTOList: [
            {
              videoUrl: '',
              workTypeId: '',
              workTypeName: '',
              file: {
                videourl: '',
                videourlfull: ''
              }
            }
          ],
          typeWork: [],
          solutionId: '',
          solutionName: ''
        }
      ]
      // æ–°å»º
      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]
        }
      })
    },
    // åˆ‡æ¢å·¥ç§
    changeGZ(a, b, c) {
      let text = ''
      this.form.saveDuSolutionDTOList[b].typeWork.forEach(item => {
        if (item.id === a) {
          text = item.name
        }
      })
      this.form.saveDuSolutionDTOList[b].saveDuWorkTypeDTOList[c].workTypeName = text
    },
    // åˆ‡æ¢æ–¹æ¡ˆ
    changeTypeWork(id, index) {
      findListByDTO({ queryType: 0, id })
        .then(res => {
          this.form.saveDuSolutionDTOList[index].typeWork = res
        })
      let text = ''
      this.insuranceScheme.forEach(item => {
        if (item.id === id) {
          text = item.name
        }
      })
      this.form.saveDuSolutionDTOList[index].solutionName = text
    },
    add() {
      this.form.saveDuSolutionDTOList.unshift({
        id: '',
        saveDuWorkTypeDTOList: [
          {
            videoUrl: '',
            workTypeId: '',
            file: {
              videourl: '',
              videourlfull: ''
            }
          }
        ],
        solutionId: ''
      })
    },
    addItem(index) {
      this.form.saveDuSolutionDTOList[index].saveDuWorkTypeDTOList.push({
        videoUrl: '',
        workTypeId: '',
        file: {
          videourl: '',
          videourlfull: ''
        }
      })
    },
    deleItem(index) {
      if (this.form.saveDuSolutionDTOList.length === 1) {
        this.$message.warning('至少保留一项内容')
        return
      }
      this.form.saveDuSolutionDTOList.splice(index, 1)
    },
    result(e, a, b) {
      this.form.saveDuSolutionDTOList[a].saveDuWorkTypeDTOList[b].videoUrl = e.imgurl
    },
    dele(a, b) {
      if (this.form.saveDuSolutionDTOList[a].saveDuWorkTypeDTOList.length === 1) {
        this.$message.warning('至少保留一项内容')
        return
      }
      this.form.saveDuSolutionDTOList[a].saveDuWorkTypeDTOList.splice(b, 1)
    }
  }
}
</script>

<style lang="scss" scoped>
    .list {
        width: 100%;
        margin-bottom: 20px;
        .list_item {
            width: 100%;
            margin-bottom: 20px;
            &:last-child {
                margin: 0 !important;
            }
            .list_item_input {
                width: 100%;
                margin-bottom: 15px;
                .list_item_input_label {
                    margin-bottom: 10px;
                    font-size: 14px;
                    color: #606266;
                    span {
                        color: red;
                        margin-right: 4px;
                    }
                }
                .list_item_input_val {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                }
            }
            .list_item_table {

            }
        }
    }
</style>