zfire-newmall-admin/src/views/workOrder/workOrderPool/detailModule/SettleAccounts/index.vue

<template>
  <zj-page-container>
    <zj-page-fill class="neibuview">
      <zj-form-container ref="formRef" v-if="formData.orderType" :form-data="formData">
        <zj-form-module :title="`费用结算-${({ INSTALL: '安装', REPAIR: '维修' })[formData.orderType]}`" :form-data="formData"
          :form-items="repairInfo" />
      </zj-form-container>
      <el-empty v-else description="暂时没有结算信息"></el-empty>
    </zj-page-fill>
    <div v-if="formData.settleStatus == 'YWG'" style="box-sizing: border-box;padding: 16px;">
      <el-button type="primary" size="mini" @click="queding">确定结算</el-button>
    </div>
    <div v-else style="box-sizing: border-box;padding: 16px;">
      <el-button v-if="showbtn" type="danger" size="mini" @click="itemOrderBaseSettleNormReset">重新结算</el-button>
    </div>
  </zj-page-container>
</template>

<script>
import { required } from '@/components/template/rules_verify.js'
import { listPageV2 } from "@/api/workOrder/settlementStandardInstall";
import { listPageV2 as listPageV2Repair } from "@/api/workOrder/settlementStandardRepair";
import { orderBaseSettleNormDetail, orderBaseSettleNormConfirm, settleNormInstallQuery, settleNormOtherQuery, orderBaseSettleNormReset } from "@/api/workOrderPool.js";
import { EventBus } from '@/utils/eventBus'
export default {
  props: {
    id: {
      type: [String, Number],
      default: null,
    }
  },
  data() {
    return {
      gonglv: [],
      gonglr: [],
      classifyList: [],
      otherList: [],
      formData: {},
      showbtn: false,
    }
  },
  computed: {
    // 产品信息
    productInfoColumns() {
      return [
        {
          columnAttributes: {
            label: '工单来源',
            prop: 'orderChannelText'
          },
        },
        {
          columnAttributes: {
            label: '产品品牌',
            prop: 'brand'
          },
        },
        {
          columnAttributes: {
            label: '产品大类',
            prop: 'mainName'
          },
        },
        {
          columnAttributes: {
            label: '产品小类',
            prop: 'smallName'
          },
        },
        {
          columnAttributes: {
            label: '产品机型',
            prop: 'goodsName'
          },
        },
        {
          columnAttributes: {
            label: '数量',
            prop: 'orderNum'
          },
        }]
    },
    // 师傅信息
    masterInfoColumns() {
      return [{
        columnAttributes: {
          label: '工程师名称',
          prop: 'workerName'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.normList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '联系电话',
          prop: 'workerMobile',
          width: '140px'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.normList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '结算费用',
          prop: 'settleAmount'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr">
            <el-form-item label="" label-width="0px" prop={`normList.${row.pfuqinid}.workerList.${row.zijideid}.${column.columnAttributes.prop}`} rules={required}>
              <el-input
                type="number"
                disabled={!this.formData.normList[row.pfuqinid].bianji || this.formData?.normList[row.pfuqinid]?.workerList?.[row.zijideid]?.["poolStatus"] == "YES"}
                value={this.formData?.normList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
                onInput={(val) => {
                  // var num = 0
                  // this.formData?.normList[row.pfuqinid]?.workerList.map((item, in_dex) => {
                  //   if (in_dex !== row.zijideid) {
                  //     num += Number(item.settleAmount)
                  //   }
                  // })
                  // // 最大
                  // var maxNum = Number(this.formData.normList[row.pfuqinid]["settleAmount"]) - num
                  // this.formData.normList[row.pfuqinid].workerList[row.zijideid][column.columnAttributes.prop] = Number(val) > maxNum ? maxNum : Number(val)
                  this.formData.normList[row.pfuqinid].workerList[row.zijideid][column.columnAttributes.prop] = val
                }}
                placeholder="请输入内容"
              >
              </el-input>
            </el-form-item>
          </div>
        }
      }, {
        columnAttributes: {
          label: '确认人',
          prop: 'confirmBy'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.normList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '确认时间',
          prop: 'confirmTime'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.normList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '汇总状态',
          prop: 'poolStatus'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {({ "NO": "未汇总", "YES": "已汇总" })[this.formData?.normList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]]}
          </div>
        }
      }, {
        columnAttributes: {
          label: '操作',
          prop: '',
          fixed: 'right',
          width: "100px"
        },
        render: (h, { row, column, index }) => {
          return this.formData.settleStatus == 'YWG' || (this.formData.settleStatus == 'YJS' && this.formData?.normList[row.pfuqinid]?.workerList.find(item => item.poolStatus == "NO")) ? (<div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData.normList[row.pfuqinid].bianji ? <el-button type="text" onClick={
              () => {
                var yjsje = [0, 0, 0, this.formData?.normList[row.pfuqinid]?.workerList.filter(item => item.poolStatus == "YES").map(item => item.settleAmount)].reduce(function (prev, curr, idx, arr) {
                  return prev + curr;
                })
                var nou = this.formData?.normList[row.pfuqinid]?.workerList.filter(item => item.poolStatus == "NO")
                var qian = ((((Number(this.formData?.normList[row.pfuqinid]["settleAmount"]) - yjsje) / nou.length) * 100) / 100).toFixed(2)
                var rongyu = ((Number(this.formData?.normList[row.pfuqinid]["settleAmount"]) - yjsje) - (qian * nou.length)).toFixed(2)
                nou.map((item, index) => {
                  if (index === 0) {
                    item.settleAmount = (Number(qian) + Number(rongyu)).toFixed(2)
                  } else {
                    item.settleAmount = qian
                  }
                })
              }
            }>平分费用</el-button> : null}
            {this.formData.normList[row.pfuqinid].bianji ? <el-button type="text" onClick={
              () => {
                var item = this.formData.normList[row.pfuqinid]
                if ([0, 0, 0, ...item.workerList.map(val => Number(val.settleAmount))].reduce(function (prev, curr, idx, arr) {
                  return prev + curr;
                }) == Number(item.settleAmount)) {
                  this.formData.normList[row.pfuqinid].bianji = false
                } else {
                  this.$message.warning(`费用信息-${item.channelText}-${item.parentCategoryName}-${item.categoryName}-${item.label}:合计结算总金额与总金额不等`)
                }
              }
            }>确定</el-button> : null}
            {!this.formData.normList[row.pfuqinid].bianji ? <el-button type="text" onClick={
              () => {
                this.formData.normList[row.pfuqinid].bianji = true
              }
            }>修改</el-button> : null}
          </div>) : null
        }
      }]
    },
    masterInfoColumnsOther() {
      return [{
        columnAttributes: {
          label: '工程师名称',
          prop: 'workerName'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.otherNormList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '联系电话',
          prop: 'workerMobile',
          width: '140px'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.otherNormList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '结算费用',
          prop: 'settleAmount'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr">
            <el-form-item label="" label-width="0px" prop={`otherNormList.${row.pfuqinid}.workerList.${row.zijideid}.${column.columnAttributes.prop}`} rules={required}>
              <el-input
                type="number"
                disabled={!this.formData.otherNormList[row.pfuqinid].bianji || this.formData?.otherNormList[row.pfuqinid]?.workerList?.[row.zijideid]?.["poolStatus"] == "YES"}
                value={this.formData?.otherNormList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
                onInput={(val) => {
                  // var num = 0
                  // this.formData?.otherNormList[row.pfuqinid]?.workerList.map((item, in_dex) => {
                  //   if (in_dex !== row.zijideid) {
                  //     num += Number(item.settleAmount)
                  //   }
                  // })
                  // // 最大
                  // var maxNum = Number(this.formData.otherNormList[row.pfuqinid]["settleAmount"]) - num
                  // this.formData.otherNormList[row.pfuqinid].workerList[row.zijideid][column.columnAttributes.prop] = Number(val) > maxNum ? maxNum : Number(val)
                  this.formData.otherNormList[row.pfuqinid].workerList[row.zijideid][column.columnAttributes.prop] = val
                }}
                placeholder="请输入内容"
              >
              </el-input>
            </el-form-item>
          </div>
        }
      }, {
        columnAttributes: {
          label: '确认人',
          prop: 'confirmBy'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.otherNormList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '确认时间',
          prop: 'confirmTime'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData?.otherNormList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]}
          </div>
        }
      },
      {
        columnAttributes: {
          label: '汇总状态',
          prop: 'poolStatus'
        },
        render: (h, { row, column, index }) => {
          return <div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {({ "NO": "未汇总", "YES": "已汇总" })[this.formData?.otherNormList[row.pfuqinid]?.workerList?.[row.zijideid]?.[column.columnAttributes.prop]]}
          </div>
        }
      }, {
        columnAttributes: {
          label: '操作',
          prop: '',
          fixed: 'right',
          width: "100px"
        },
        render: (h, { row, column, index }) => {
          return this.formData.settleStatus == 'YWG' || (this.formData.settleStatus == 'YJS' && this.formData?.otherNormList[row.pfuqinid]?.workerList.find(item => item.poolStatus == "NO")) ? (<div class="redbordererr" style="padding:0 6px;display:flex;align-items:center;">
            {this.formData.otherNormList[row.pfuqinid].bianji ? <el-button type="text" onClick={
              () => {
                var yjsje = [0, 0, 0, this.formData?.otherNormList[row.pfuqinid]?.workerList.filter(item => item.poolStatus == "YES").map(item => item.settleAmount)].reduce(function (prev, curr, idx, arr) {
                  return prev + curr;
                })
                var nou = this.formData?.otherNormList[row.pfuqinid]?.workerList.filter(item => item.poolStatus == "NO")
                var qian = ((((Number(this.formData?.otherNormList[row.pfuqinid]["settleAmount"]) - yjsje) / nou.length) * 100) / 100).toFixed(2)
                var rongyu = ((Number(this.formData?.otherNormList[row.pfuqinid]["settleAmount"]) - yjsje) - (qian * nou.length)).toFixed(2)
                nou.map((item, index) => {
                  if (index === 0) {
                    item.settleAmount = (Number(qian) + Number(rongyu)).toFixed(2)
                  } else {
                    item.settleAmount = qian
                  }
                })
              }
            }>平分费用</el-button> : null}
            {this.formData.otherNormList[row.pfuqinid].bianji ? <el-button type="text" onClick={
              () => {
                var item = this.formData.otherNormList[row.pfuqinid]
                if ([0, 0, 0, ...item.workerList.map(val => Number(val.settleAmount))].reduce(function (prev, curr, idx, arr) {
                  return prev + curr;
                }) == Number(item.settleAmount)) {
                  this.formData.otherNormList[row.pfuqinid].bianji = false
                } else {
                  this.$message.warning(`其他费用信息-${item.channelText}-${item.type}-${item.label}:合计结算总金额与总金额不等`)
                }
              }
            }>确定</el-button> : null}
            {!this.formData.otherNormList[row.pfuqinid].bianji ? <el-button type="text" onClick={
              () => {
                this.formData.otherNormList[row.pfuqinid].bianji = true
              }
            }>修改</el-button> : null}
          </div>) : null
        }
      }]
    },
    classifyColumns() {
      return [{
        columnAttributes: {
          label: '工单类型',
          prop: 'typeName'
        },
      },
      {
        columnAttributes: {
          label: '结算工单来源',
          prop: 'channelId',
          width: '110'
        },
        render: (h, { row, column, index }) => {
          return this.panfuan(row) ? <div class="redbordererr">
            <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
              <el-select
                disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                value={row[column.columnAttributes.prop]}
                onInput={(val) => { row[column.columnAttributes.prop] = val }}
                onChange={(val) => {
                  row.parentCategoryId = ""
                  row.parentCategoryName = ""
                  row.categoryId = ""
                  row.categoryName = ""
                  row.label = ""
                  row.normAmount = ""
                  row.repairAmount = ""
                  row.settleNormId = ""
                  if (val) {
                    var data = this.classifyListChuLi("orderChannelId", "orderChannelText").find(item => item.value == val)
                    row.channelText = data.label
                  } else {
                    row.channelText = ""
                  }
                }}
                placeholder="请选择">
                {this.classifyListChuLi("orderChannelId", "orderChannelText").map((item, index_) => <el-option key={index_} label={item.label} value={item.value}></el-option>)}
              </el-select>
            </el-form-item>
          </div> : null
        }
      },
      {
        columnAttributes: {
          label: '结算产品大类',
          prop: 'parentCategoryId',
          width: '110'
        },
        render: (h, { row, column, index }) => {
          return this.panfuan(row) ? <div class="redbordererr">
            <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
              <el-select
                disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                value={row[column.columnAttributes.prop]}
                onInput={(val) => { row[column.columnAttributes.prop] = val }}
                onChange={(val) => {
                  row.categoryId = ""
                  row.categoryName = ""
                  row.label = ""
                  row.normAmount = ""
                  row.repairAmount = ""
                  row.settleNormId = ""
                  if (val) {
                    var data = this.classifyListChuLi("parentCategoryId", "parentCategoryName", (item) => item.orderChannelId == row.channelId).find(item => item.value == val)
                    row.parentCategoryName = data.label
                  } else {
                    row.parentCategoryName = ""
                  }
                }}
                placeholder="请选择">
                {this.classifyListChuLi("parentCategoryId", "parentCategoryName", (item) => item.orderChannelId == row.channelId).map((item, index_) => <el-option key={index_} label={item.label} value={item.value}></el-option>)}
              </el-select>
            </el-form-item>
          </div> : null
        }
      },
      {
        columnAttributes: {
          label: '结算产品小类',
          prop: 'categoryId',
          width: '110'
        },
        render: (h, { row, column, index }) => {
          return this.panfuan(row) ? <div class="redbordererr">
            <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
              <el-select
                disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                value={row[column.columnAttributes.prop]}
                onInput={(val) => { row[column.columnAttributes.prop] = val }}
                onChange={(val) => {
                  row.label = ""
                  row.normAmount = ""
                  row.repairAmount = ""
                  row.settleNormId = ""
                  if (val) {
                    var data = this.classifyListChuLi("categoryId", "categoryName", (item) => item.orderChannelId == row.channelId && item.parentCategoryId == row.parentCategoryId).find(item => item.value == val)
                    row.categoryName = data.label
                  } else {
                    row.categoryName = ""
                  }
                }}
                placeholder="请选择">
                {this.classifyListChuLi("categoryId", "categoryName", (item) => item.orderChannelId == row.channelId && item.parentCategoryId == row.parentCategoryId).map((item, index_) => <el-option key={index_} label={item.label} value={item.value}></el-option>)}
              </el-select>
            </el-form-item>
          </div> : null
        }
      }]
    },
    normColumns() {
      return [
        ...this.productInfoColumns,
        ...this.classifyColumns,
        ...(() => {
          if (this.formData.orderType == 'INSTALL') {
            return [
              {
                columnAttributes: {
                  label: '结算功率',
                  prop: 'label'
                },
                render: (h, { row, column, index }) => {
                  return this.panfuan(row) ? <div class="redbordererr">
                    <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
                      <el-select
                        disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                        value={row[column.columnAttributes.prop]}
                        onInput={(val) => { row[column.columnAttributes.prop] = val }}
                        onChange={(val) => {
                          if (val) {
                            var data = this.getflList(this.gonglv, row).find(item => item.label == val)
                            row.normAmount = data.normAmount
                            row.settleNormId = data.id
                          } else {
                            row.normAmount = ""
                            row.settleNormId = ""
                          }
                        }}
                        placeholder="请选择">
                        {this.getflList(this.gonglv, row).map((item, index_) => <el-option key={index_} label={item.label} value={item.label}></el-option>)}
                      </el-select>
                    </el-form-item>
                  </div> : null
                }
              },
              {
                columnAttributes: {
                  label: '结算标准(元/套)',
                  prop: 'normAmount'
                },
              },
              {
                columnAttributes: {
                  label: '结算数量',
                  prop: 'settleNum'
                },
                render: (h, { row, column, index }) => {
                  return this.panfuan(row) ? <div class="redbordererr">
                    <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
                      <el-input
                        type="number"
                        disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                        value={row[column.columnAttributes.prop]}
                        onInput={(val) => { row[column.columnAttributes.prop] = val }}
                        placeholder="请输入内容"
                      >
                      </el-input>
                    </el-form-item>
                  </div> : null
                }
              },
              {
                columnAttributes: {
                  label: '结算金额(元)',
                  prop: 'settleAmount',
                },
                render: (h, { row, column, index }) => {
                  row.settleAmount = (((Number(row.normAmount || 0) * Number(row.settleNum || 0)) * 100) / 100).toFixed(2)
                  return this.panfuan(row) ? <div class="redbordererr">
                    {row.settleAmount}
                  </div> : null
                }
              },
            ]
          }
          return []
        })(),
        ...(() => {
          if (this.formData.orderType == 'REPAIR') {
            return [
              {
                columnAttributes: {
                  label: '质保类型',
                  prop: 'label'
                },
                render: (h, { row, column, index }) => {
                  return this.panfuan(row) ? <div class="redbordererr">
                    <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
                      <el-select
                        disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                        value={row[column.columnAttributes.prop]}
                        onInput={(val) => { row[column.columnAttributes.prop] = val }}
                        onChange={(val) => {
                          if (val) {
                            var data = this.getflList(this.gonglr, row).find(item => item.label == val)
                            row.repairAmount = data.repairAmount
                            row.normAmount = data.normAmount
                            row.settleNormId = data.id
                          } else {
                            row.repairAmount = ""
                            row.normAmount = ""
                            row.settleNormId = ""
                          }
                        }}
                        placeholder="请选择">
                        {this.getflList(this.gonglr, row).map((item, index_) => <el-option key={index_} label={({ INSIDE: '保内', OUT: '保外' })[item.label]} value={item.label}></el-option>)}
                      </el-select>
                    </el-form-item>
                  </div> : null
                }
              },
              {
                columnAttributes: {
                  label: '上门费（元/单）',
                  prop: 'repairAmount',
                  width: '110'
                },
                render: (h, { row, column, index }) => {
                  return this.panfuan(row) ? <div class="redbordererr">
                    <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
                      <el-input
                        disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                        type="number"
                        value={row[column.columnAttributes.prop]}
                        onInput={(val) => { row[column.columnAttributes.prop] = val }}
                        placeholder="请输入内容"
                      >
                      </el-input>
                    </el-form-item>
                  </div> : null
                }
              },
              {
                columnAttributes: {
                  label: '维修费结算比例%',
                  prop: 'normAmount',
                  width: '110'
                },
                render: (h, { row, column, index }) => {
                  return this.panfuan(row) ? <div class="redbordererr">
                    {row[column.columnAttributes.prop]}%
                  </div> : null
                }
              },
              {
                columnAttributes: {
                  label: '维修费用结算',
                  prop: 'repairNormAmount',
                  width: '110'
                },
                render: (h, { row, column, index }) => {
                  return this.panfuan(row) ? <div class="redbordererr">
                    <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
                      <el-input
                        disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                        type="number"
                        value={row[column.columnAttributes.prop]}
                        onInput={(val) => { row[column.columnAttributes.prop] = val }}
                        placeholder="请输入内容"
                      >
                      </el-input>
                    </el-form-item>
                  </div> : null
                }
              },
              {
                columnAttributes: {
                  label: '结算数量',
                  prop: 'settleNum'
                },
                render: (h, { row, column, index }) => {
                  return this.panfuan(row) ? <div class="redbordererr">
                    <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
                      <el-input
                        type="number"
                        disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                        value={row[column.columnAttributes.prop]}
                        onInput={(val) => { row[column.columnAttributes.prop] = val }}
                        placeholder="请输入内容"
                      >
                      </el-input>
                    </el-form-item>
                  </div> : null
                }
              },
              {
                columnAttributes: {
                  label: '结算金额(元)',
                  prop: 'settleAmount',
                },
                render: (h, { row, column, index }) => {
                  row.settleAmount = (((Number(row.repairAmount || 0) + (Number(row.normAmount || 0) / 100) * Number(row.repairNormAmount || 0) * Number(row.settleNum || 0)) * 100) / 100).toFixed(2)
                  return this.panfuan(row) ? <div class="redbordererr">
                    {row.settleAmount}
                  </div> : null
                }
              },
            ]
          }
          return []
        })(),
        {
          columnAttributes: {
            label: '备注',
            prop: 'remark'
          },
          render: (h, { row, column, index }) => {
            return this.panfuan(row) ? <div class="redbordererr">
              <el-form-item label="" label-width="0px">
                <el-input
                  disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                  value={row[column.columnAttributes.prop]}
                  onInput={(val) => { row[column.columnAttributes.prop] = val }}
                  placeholder="请输入内容"
                >
                </el-input>
              </el-form-item>
            </div> : null
          }
        },
        ...this.masterInfoColumns
      ]
    },
    otherclassifyColumns() {
      return [
        {
          columnAttributes: {
            label: '结算工单来源',
            prop: 'channelId',
            width: '110'
          },
          render: (h, { row, column, index }) => {
            return this.panfuan(row) ? <div class="redbordererr">
              <el-form-item label="" label-width="0px" prop={`normList.${index}.${column.columnAttributes.prop}`} rules={required}>
                <el-select
                  disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                  value={row[column.columnAttributes.prop]}
                  onInput={(val) => { row[column.columnAttributes.prop] = val }}
                  onChange={(val) => {
                    row.type = ""
                    row.label = ""
                    row.normAmount = ""
                    row.settleNormId = ""
                    row.settleNum = ""
                    if (val) {
                      var data = this.otherListChuLi("orderChannelId", "orderChannelText").find(item => item.value == val)
                      row.channelText = data.label
                    } else {
                      row.channelText = ""
                    }
                  }}
                  placeholder="请选择">
                  {this.otherListChuLi("orderChannelId", "orderChannelText").map((item, index_) => <el-option key={index_} label={item.label} value={item.value}></el-option>)}
                </el-select>
              </el-form-item>
            </div> : null
          }
        },
        {
          columnAttributes: {
            label: '费用类型',
            prop: 'type'
          },
          render: (h, { row, column, index }) => {
            return this.panfuan(row) ? <div class="redbordererr">
              <el-form-item label="" label-width="0px">
                <el-select
                  disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                  value={row[column.columnAttributes.prop]}
                  onInput={(val) => { row[column.columnAttributes.prop] = val }}
                  onChange={(val) => {
                    row.label = ""
                    row.normAmount = ""
                    row.settleNormId = ""
                    row.settleNum = ""
                  }}
                  placeholder="请选择">
                  {this.otherListChuLi("type", "typeName", (item) => item.orderChannelId == row.channelId).map((item, index_) => <el-option key={index_} label={item.label} value={item.value}></el-option>)}
                </el-select>
              </el-form-item>
            </div> : null
          }
        },
        {
          columnAttributes: {
            label: '规格',
            prop: 'label'
          },
          render: (h, { row, column, index }) => {
            return this.panfuan(row) ? <div class="redbordererr">
              <el-form-item label="" label-width="0px">
                <el-select
                  disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                  value={row[column.columnAttributes.prop]}
                  onInput={(val) => { row[column.columnAttributes.prop] = val }}
                  onChange={(val) => {
                    row.settleNum = ""
                    if (val) {
                      var data = this.otherListChuLi("label", "label", (item) => { return item.orderChannelId == row.channelId && item.type == row.type }, "normAmount", "id").find(item => item.label == val)
                      row.normAmount = data.normAmount
                      row.settleNormId = data.id
                    } else {
                      row.normAmount = ""
                      row.settleNormId = ""
                    }
                  }}
                  placeholder="请选择">
                  {this.otherListChuLi("label", "label", (item) => item.orderChannelId == row.channelId && item.type == row.type).map((item, index_) => <el-option key={index_} label={item.label} value={item.value}></el-option>)}
                </el-select>
              </el-form-item>
            </div> : null
          }
        }]
    },
    otherColumns() {
      return [
        ...this.productInfoColumns,
        ...this.otherclassifyColumns,
        {
          columnAttributes: {
            label: '单价(元/套)',
            prop: 'normAmount'
          },
        },
        {
          columnAttributes: {
            label: '数量',
            prop: 'settleNum'
          },
          render: (h, { row, column, index }) => {
            return this.panfuan(row) ? <div class="redbordererr">
              <el-form-item label="" label-width="0px">
                <el-input
                  type="number"
                  disabled={!row.bianji || row.normAmount ? this.formData.settleStatus != 'YWG' : true}
                  value={row[column.columnAttributes.prop]}
                  onInput={(val) => { row[column.columnAttributes.prop] = val }}
                  placeholder="请输入内容"
                >
                </el-input>
              </el-form-item>
            </div> : null
          }
        },
        {
          columnAttributes: {
            label: '结算金额(元)',
            prop: 'settleAmount',
          },
          render: (h, { row, column, index }) => {
            row.settleAmount = (((Number(row.normAmount || 0) * Number(row.settleNum || 0)) * 100) / 100).toFixed(2)
            return this.panfuan(row) ? <div class="redbordererr">
              {row.settleAmount}
            </div> : null
          }
        },
        {
          columnAttributes: {
            label: '备注',
            prop: 'remark'
          },
          render: (h, { row, column, index }) => {
            return this.panfuan(row) ? <div class="redbordererr">
              <el-form-item label="" label-width="0px">
                <el-input
                  disabled={!row.bianji || this.formData.settleStatus != 'YWG'}
                  value={row[column.columnAttributes.prop]}
                  onInput={(val) => { row[column.columnAttributes.prop] = val }}
                  placeholder="请输入内容"
                >
                </el-input>
              </el-form-item>
            </div> : null
          }
        },
        ...this.masterInfoColumnsOther
      ]
    },
    // 师傅汇总
    shiFuHuiZongColumns() {
      return [
        {
          columnAttributes: {
            label: '工程师名称',
            prop: 'workerName'
          },
        },
        {
          columnAttributes: {
            label: '联系电话',
            prop: 'workerMobile'
          },
        },
        {
          columnAttributes: {
            label: '费用结算总金额',
            prop: 'zonjine'
          },
        },
        {
          columnAttributes: {
            label: '结算总金额',
            prop: 'settleAmount'
          },
        }]
    },
    repairInfo() {
      return [
        {
          name: 'el-input',
          md: 6,
          attributes: { disabled: true, },
          formItemAttributes: { label: '网点名称', prop: 'websitName' },
        },
        {
          name: 'el-input',
          md: 6,
          attributes: { disabled: true, },
          formItemAttributes: { label: '工程师', prop: 'workerName' },
        },
        {
          name: 'el-input',
          md: 6,
          attributes: { disabled: true, },
          formItemAttributes: { label: '联系电话', prop: 'mobile' },
        },
        {
          name: 'el-input',
          md: 6,
          attributes: { disabled: true, },
          formItemAttributes: { label: '身份证', prop: 'idcard' },
        },
        {
          md: 24,
          name: 'slot-component',
          formItemAttributes: {
            label: '费用结算',
            prop: 'normList',
          },
          render: (h, { props, onInput }) => {
            var { formData } = props
            return (
              <zj-table
                columns={this.normColumns}
                table-data={formData.normList}
                tableAttributes={{
                  'span-method': ({ row, column, rowIndex, columnIndex }) => {
                    if (columnIndex === this.normColumns.length - 1) {
                      if (row.zijideid == 0) {
                        return {
                          rowspan: formData.normList[row.pfuqinid].workerList.length,
                          colspan: 1
                        };
                      } else {
                        return {
                          rowspan: 0,
                          colspan: 0
                        };
                      }
                    }
                  }
                }}
              />
            )
          }
        },
        {
          md: 24,
          name: 'slot-component',
          formItemAttributes: {
            label: '其他费用结算',
            prop: 'otherNormList',
          },
          render: (h, { props, onInput }) => {
            var { formData } = props
            return (
              <zj-table
                columns={this.otherColumns}
                table-data={formData.otherNormList}
                tableAttributes={{
                  'span-method': ({ row, column, rowIndex, columnIndex }) => {
                    if (columnIndex === this.otherColumns.length - 1) {
                      if (row.zijideid == 0) {
                        return {
                          rowspan: formData.otherNormList[row.pfuqinid].workerList.length,
                          colspan: 1
                        };
                      } else {
                        return {
                          rowspan: 0,
                          colspan: 0
                        };
                      }
                    }
                  }
                }}
              />
            )
          }
        },
        {
          md: 24,
          name: 'slot-component',
          formItemAttributes: {
            label: '师傅结算费用汇总',
            prop: 'otherNormList',
          },
          render: (h, { props, onInput }) => {
            var { formData } = props

            return (
              <zj-table
                columns={this.shiFuHuiZongColumns}
                table-data={this.zongbiaoheji}
                tableAttributes={{
                  'span-method': ({ row, column, rowIndex, columnIndex }) => {
                    if (columnIndex === 2) {
                      if (rowIndex == 0) {
                        return {
                          rowspan: this.zongbiaoheji.length,
                          colspan: 1
                        };
                      } else {
                        return {
                          rowspan: 0,
                          colspan: 0
                        };
                      }
                    }
                  }
                }}
              />
            )
          }
        }
      ]
    },
    zongbiaoheji() {
      var workers = {}
      var zonjine = 0
      this.formData.normList.map(item => {
        zonjine += (Number(item.settleAmount) || 0);
        item?.workerList?.map(data => {
          if (!workers[data.workerId]) {
            workers[data.workerId] = JSON.parse(JSON.stringify(data))
          } else {
            workers[data.workerId].settleAmount = (((Number(workers[data.workerId].settleAmount) + Number(data.settleAmount)) * 100) / 100).toFixed(2)
          }
        })
      })
      this.formData.otherNormList.map(item => {
        zonjine += (Number(item.settleAmount) || 0);
        item?.workerList?.map(data => {
          if (!workers[data.workerId]) {
            workers[data.workerId] = JSON.parse(JSON.stringify(data))
          } else {
            workers[data.workerId].settleAmount = (((Number(workers[data.workerId].settleAmount) + Number(data.settleAmount)) * 100) / 100).toFixed(2)
          }
        })
      })
      return Object.keys(workers).map(key => {
        workers[key].zonjine = ((zonjine * 100) / 100).toFixed(2)
        return workers[key]
      })
    },
  },
  watch: {
    id: {
      handler(newVal, oldVal) {
        this.init()
      },
      deep: true,
      immediate: true,
    },
  },
  methods: {

    panfuan(item) {
      if (!!item.id) {
        return true
      } else {
        return false
      }
    },

    // 产品类型过滤筛选
    classifyListChuLi(value, label, func, ...keys) {
      var obj = {}
      this.classifyList.map(item => {
        if (func && !func(item)) {
          return
        }
        obj[item[value]] = {
          label: item[label]
        }
        for (var key of keys) {
          obj[item[value]][key] = item[key]
        }
      })
      return Object.keys(obj).map(value => {
        return {
          value: value,
          ...obj[value]
        }
      })
    },

    // 其他类型筛选
    otherListChuLi(value, label, func, ...keys) {
      var obj = {}
      this.otherList.map(item => {
        if (func && !func(item)) {
          return
        }
        obj[item[value]] = {
          label: item[label]
        }
        for (var key of keys) {
          obj[item[value]][key] = item[key]
        }
      })
      return Object.keys(obj).map(value => {
        return {
          value: value,
          ...obj[value]
        }
      })
    },

    getflList(list = [], row = {},) {
      return list.filter(item => (
        item.type == row.type &&
        item.parentCategoryId == row.parentCategoryId &&
        item.categoryId == row.categoryId
        // &&
        // !~this.formData.normList.map(v => `${v.type}_${v.parentCategoryId}_${v.categoryId}_${v.label}`).filter(v => (
        //   v != `${row.type}_${row.parentCategoryId}_${row.categoryId}_${row.label}`
        // )).indexOf(`${item.type}_${item.parentCategoryId}_${item.categoryId}_${item.label}`)
      ))

    },

    queding() {
      this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
        if (valid) {
          try {
            this.formData.normList.filter(item => !!item.id).map(item => {
              if ([0, 0, 0, ...item.workerList.map(val => Number(val.settleAmount))].reduce(function (prev, curr, idx, arr) {
                return prev + curr;
              }) !== Number(item.settleAmount)) {
                throw new Error(`费用信息-${item.channelText}-${item.parentCategoryName}-${item.categoryName}-${item.label}:合计结算总金额与总金额不等`);
              }
            })
            this.formData.otherNormList.filter(item => !!item.id).map(item => {
              if ([0, 0, 0, ...item.workerList.map(val => Number(val.settleAmount))].reduce(function (prev, curr, idx, arr) {
                return prev + curr;
              }) !== Number(item.settleAmount)) {
                throw new Error(`其他费用信息-${item.channelText}-${item.type}-${item.label}:合计结算总金额与总金额不等`);
              }
            })
          } catch (err) {
            this.$message.warning(err.message)
            return
          }
          orderBaseSettleNormConfirm({
            ...this.formData,
            normList: this.formData.normList.filter(item => !!item.id),
            otherNormList: this.formData.otherNormList.filter(item => !!item.id),
          }).then(res => {
            this.$message({
              type: 'success',
              message: '结算成功'
            })
            // 结算成功后跳转列表
            EventBus.$emit('handleOrderClone')
          })
        }
      })
    },

    itemOrderBaseSettleNormReset() {
      try {
        this.formData.normList.filter(item => !!item.id).map(item => {
          if ([0, 0, 0, ...item.workerList.map(val => Number(val.settleAmount))].reduce(function (prev, curr, idx, arr) {
            return prev + curr;
          }) !== Number(item.settleAmount)) {
            throw new Error(`费用信息-${item.channelText}-${item.parentCategoryName}-${item.categoryName}-${item.label}:合计结算总金额与总金额不等`);
          }
        })
        this.formData.otherNormList.filter(item => !!item.id).map(item => {
          if ([0, 0, 0, ...item.workerList.map(val => Number(val.settleAmount))].reduce(function (prev, curr, idx, arr) {
            return prev + curr;
          }) !== Number(item.settleAmount)) {
            throw new Error(`其他费用信息-${item.channelText}-${item.type}-${item.label}:合计结算总金额与总金额不等`);
          }
        })
      } catch (err) {
        this.$message.warning(err.message)
        return
      }
      orderBaseSettleNormReset({
        ...this.formData,
        normList: this.formData.normList.filter(item => !!item.id),
        otherNormList: this.formData.otherNormList.filter(item => !!item.id),
      }).then(res => {
        this.$message({
          type: 'success',
          message: '结算成功'
        })
        // 结算成功后跳转列表
        EventBus.$emit('handleOrderClone')
      })
    },

    init() {
      if (this.id) {
        orderBaseSettleNormDetail({
          id: this.id
        }).then(res => {
          var orderChannelId
          var normList = []
          var pfuqinid = 0
          res.data.normList.map((item, index) => {
            if (!orderChannelId) { orderChannelId = item.orderChannelId }
            item.settleNum = item.settleNum || ""
            normList.push({ ...item, pfuqinid: pfuqinid, zijideid: 0, bianji: res.data.settleStatus == 'YJS' ? false : true })
            item.workerList.map((resdata, ind_) => {
              if (resdata.poolStatus === "NO") { this.showbtn = true }
              if (ind_ !== 0) { normList.push({ pfuqinid: pfuqinid, zijideid: ind_ }) }
              if (ind_ == item.workerList.length - 1) { pfuqinid += (ind_ + 1) }
            })
          })
          var otherNormList = []
          var qtpfuqinid = 0
          res.data.otherNormList.map((item, index) => {
            item.settleNum = item.settleNum || ""
            otherNormList.push({ ...item, pfuqinid: qtpfuqinid, zijideid: 0, bianji: res.data.settleStatus == 'YJS' ? false : true })
            item.workerList.map((resdata, ind_) => {
              if (resdata.poolStatus === "NO") { this.showbtn = true }
              if (ind_ !== 0) { otherNormList.push({ pfuqinid: qtpfuqinid, zijideid: ind_ }) }
              if (ind_ == item.workerList.length - 1) { qtpfuqinid += (ind_ + 1) }
            })
          })
          this.formData = res.data ? { ...res.data, normList, otherNormList } : {};
          // -------------------------------------------------------------------
          if (this.formData.orderType == "INSTALL") {
            // 安装单请求
            listPageV2({ "pageNum": 1, "pageSize": -1 }).then(res => {
              this.gonglv = res.data.records
            })
          } else if (this.formData.orderType == "REPAIR") {
            // 维修单请求
            listPageV2Repair({ "pageNum": 1, "pageSize": -1 }).then(res => {
              this.gonglr = res.data.records
            })
          }
          settleNormInstallQuery({
            settleNormType: this.formData.orderType,
            type: this.formData.orderSmallType
          }).then(res => {
            this.classifyList = res.data
          })
          settleNormOtherQuery().then(res => {
            this.otherList = res.data
          })
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.neibuview {
  box-sizing: border-box;
  padding-left: 16px;

  ::v-deep &>.zj-page-fill-scroll {
    box-sizing: border-box;
    padding-right: 16px;

    &>div:nth-child(1) {
      margin-top: 20px;
    }
  }
}
</style>