<template> 
 | 
    <GlobalWindow 
 | 
        :title="title" 
 | 
        width="100%" 
 | 
        :visible.sync="visible" 
 | 
        :confirm-working="isWorking" 
 | 
        @confirm="confirm" 
 | 
    > 
 | 
        <el-button type="primary" style="margin-bottom: 15px;" @click="add">添加</el-button> 
 | 
        <el-table v-if="form.solutionList && form.solutionList.length>0" 
 | 
            :data="form.solutionList" 
 | 
            border 
 | 
            border 
 | 
            style="width: 100%"> 
 | 
            <el-table-column 
 | 
                label="序号" 
 | 
                align="center" 
 | 
                width="80"> 
 | 
                <template slot-scope="scope"> 
 | 
                    <span>{{scope.$index + 1}}</span> 
 | 
                </template> 
 | 
            </el-table-column> 
 | 
            <el-table-column 
 | 
                align="center" 
 | 
                label="保险方案"> 
 | 
                <template slot-scope="scope"> 
 | 
                    <el-select v-model="scope.row.solution.id" :disabled="scope.row.disabled" filterable @change="changeSolution($event, scope.$index)" placeholder="请选择"> 
 | 
                        <el-option 
 | 
                            v-for="item in programme" 
 | 
                            :key="item.id" 
 | 
                            :label="item.name" 
 | 
                            :value="item.id"> 
 | 
                        </el-option> 
 | 
                    </el-select> 
 | 
                </template> 
 | 
            </el-table-column> 
 | 
          <el-table-column 
 | 
              align="center" 
 | 
              label="委托商户"> 
 | 
            <template slot-scope="scope"> 
 | 
              <el-select :ref="'shopSelect'+scope.$index" disabled v-model="scope.row.shopId" clearable value-key="id" placeholder="请选择"> 
 | 
                <el-option 
 | 
                    v-for="item in shops" 
 | 
                    :key="item.id" 
 | 
                    :label="item.name" 
 | 
                    :value="item.id"> 
 | 
                </el-option> 
 | 
              </el-select> 
 | 
            </template> 
 | 
          </el-table-column> 
 | 
            <el-table-column 
 | 
                align="center" 
 | 
                label="加减保功能"> 
 | 
                <template slot-scope="{row}"> 
 | 
                    <el-checkbox :true-label="1" :false-label="0" disabled  v-model="row.canAdd">加保</el-checkbox> 
 | 
                    <el-checkbox :true-label="1" :false-label="0"  disabled   v-model="row.canReduce">减保</el-checkbox> 
 | 
                </template> 
 | 
            </el-table-column> 
 | 
            <el-table-column 
 | 
                align="center" 
 | 
                label="签署状态"> 
 | 
                <template slot-scope="{row}"> 
 | 
                    <template v-if="row.signStatus === 0">待签章</template> 
 | 
                    <template v-else-if="row.signStatus === 1">已签章</template> 
 | 
                </template> 
 | 
            </el-table-column> 
 | 
            <el-table-column 
 | 
                label="操作" 
 | 
                align="center" 
 | 
                width="100"> 
 | 
                <template slot-scope="scope"> 
 | 
                    <el-button type="text" size="small" style="color: red;" @click="dele(scope.$index)">删除</el-button> 
 | 
                </template> 
 | 
            </el-table-column> 
 | 
        </el-table> 
 | 
    </GlobalWindow> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import BaseOpera from '@/components/base/BaseOpera' 
 | 
import GlobalWindow from '@/components/common/GlobalWindow' 
 | 
import { all, listForCompany } from '@/api/business/solutions' 
 | 
  
 | 
import {updateSolutions, pageAll as shopList, allForFp} from '@/api/business/company' 
 | 
  
 | 
export default { 
 | 
  name: 'modification', 
 | 
  extends: BaseOpera, 
 | 
  components: { GlobalWindow }, 
 | 
  data () { 
 | 
    return { 
 | 
      // 表单数据 
 | 
      form: { 
 | 
        id: null, 
 | 
        solutionList: [ 
 | 
          { 
 | 
            solution: { id: null, baseId: null,type:0 }, 
 | 
            canAdd: 0, 
 | 
            shopId:null, 
 | 
            canReduce: 0 
 | 
          } 
 | 
        ] 
 | 
      }, 
 | 
      // 验证规则 
 | 
      rules: { 
 | 
        solutionList: [ 
 | 
          { required: true, message: '请输入公司账号' } 
 | 
        ] 
 | 
      }, 
 | 
      programme: [], 
 | 
      shops: [] 
 | 
    } 
 | 
  }, 
 | 
  created () { 
 | 
    this.config({ 
 | 
      api: '/business/company', 
 | 
      'field.id': 'id' 
 | 
    }) 
 | 
  }, 
 | 
  methods: { 
 | 
    changeSolution (e, index) { 
 | 
      let baseId = '' 
 | 
      this.programme.forEach(item => { 
 | 
        if (item.id === e) { 
 | 
          baseId = item.baseId 
 | 
          this.form.solutionList[index].solution.type = item.type 
 | 
          // console.log(item.type) 
 | 
          // if(item.type == 1){ 
 | 
            this.form.solutionList[index].shopId =item.shopId 
 | 
          // } 
 | 
        } 
 | 
      }) 
 | 
  
 | 
      this.form.solutionList[index].solution.baseId = baseId 
 | 
    }, 
 | 
    confirm () { 
 | 
      this.isWorking = true 
 | 
      updateSolutions(this.form) 
 | 
        .then(res => { 
 | 
          this.visible = false 
 | 
          this.$tip.apiSuccess('新建成功') 
 | 
          this.$emit('success') 
 | 
        }) 
 | 
        .catch(e => { 
 | 
          this.$tip.apiFailed(e) 
 | 
        }) 
 | 
        .finally(() => { 
 | 
          this.isWorking = false 
 | 
        }) 
 | 
    }, 
 | 
    // 获取全部方案 
 | 
    getAll () { 
 | 
      all({ dataType: 2 }) 
 | 
        .then(res => { 
 | 
          this.programme = res 
 | 
        }) 
 | 
      allForFp({ type: 1, status: 0 }) 
 | 
        .then(res => { 
 | 
          console.log(res) 
 | 
          this.shops = res 
 | 
        }) 
 | 
    }, 
 | 
    open (title, target) { 
 | 
      var that = this 
 | 
      this.title = title 
 | 
      for (const key in this.form) { 
 | 
        this.form[key] = target[key] 
 | 
      } 
 | 
      this.getAll() 
 | 
      this.form.solutionList=[] 
 | 
      listForCompany({ companyId: target.id }) 
 | 
        .then(resa => { 
 | 
          resa.forEach(item => { 
 | 
            this.form.solutionList.push({ 
 | 
              disabled: true, 
 | 
              solution: { id: item.solutionId, baseId: item.solutionBaseId,type:item.solutionType }, 
 | 
              shopId: item.shopId, 
 | 
              canAdd: 1, 
 | 
              canReduce: 1, 
 | 
              signStatus: item.signStatus 
 | 
            }) 
 | 
          }) 
 | 
          that.visible = true 
 | 
        }) 
 | 
    }, 
 | 
    add () { 
 | 
      this.form.solutionList.push({ 
 | 
        disabled: false, 
 | 
        solution: { id: null, baseId: null }, 
 | 
        shopId: null, 
 | 
        canAdd: 1, 
 | 
        canReduce: 1 
 | 
      }) 
 | 
    }, 
 | 
    dele (index) { 
 | 
      if (this.form.solutionList.length === 1) { 
 | 
        this.$message.warning('至少保留一项') 
 | 
        return 
 | 
      } 
 | 
      this.form.solutionList.splice(index, 1) 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</script> 
 |