<template>
  <view class="page">
    <scroll-view class="scroll" scroll-y>
      <uni-list>
        <view class="section">
          <uni-list-item title="订货单位">
            <template v-slot:footer>
              <view class="readonly-text">{{ form.orderingUnitName }}</view>
            </template>
          </uni-list-item>
          <uni-list-item class="select-item" :class="form.sampleTypeName ? 'is-filled' : 'is-empty'" clickable
            @click="openSheet('sampleType')" :rightText="form.sampleTypeName || '请选择'" showArrow>
            <template v-slot:body>
              <view class="item-title"><text>试样种类</text></view>
            </template>
          </uni-list-item>
          <uni-list-item class="select-item" :class="form.customerTypeName ? 'is-filled' : 'is-empty'" clickable
            @click="openSheet('customerType')" :rightText="form.customerTypeName || '请选择'" showArrow>
            <template v-slot:body>
              <view class="item-title"><text>客户类型</text></view>
            </template>
          </uni-list-item>
          <uni-list-item title="生产厂">
            <template v-slot:footer>
              <view class="readonly-text">{{ form.workshopName }}</view>
            </template>
          </uni-list-item>
          <uni-list-item title="所属品种">
            <template v-slot:footer>
              <view class="readonly-text">{{ form.belongingBreed }}</view>
            </template>
          </uni-list-item>
          <uni-list-item title="原供货同行">
            <template v-slot:footer>
              <uni-easyinput v-model="form.originalSupplierPeer" placeholder="请输入原供货同行" :inputBorder="false" />
            </template>
          </uni-list-item>
        </view>

        <!-- 产品 -->
        <view class="section2">
          <!-- mode="add" 允许编辑 -->
          <Product mode="add" :list="initPurchaseOrderLineList" @change="purchaseOrderLineListChange"
            :provideSamplesOptions="provideSamplesOptions" :clearParametersOptions="clearParametersOptions" />
        </view>

        <view class="section">

          <uni-list-item class="select-item" :class="form.sampleQuantityRegulationName ? 'is-filled' : 'is-empty'" clickable
            @click="openSheet('sampleQuantityRegulation')" :rightText="form.sampleQuantityRegulationName || '请选择'" showArrow>
            <template v-slot:body>
              <view class="item-title"><text>本次试样数量是否超规定</text></view>
            </template>
          </uni-list-item>

          <uni-list-item class="select-item" :class="form.specificationQuantityRegulationName ? 'is-filled' : 'is-empty'" clickable
            @click="openSheet('specificationQuantityRegulation')" :rightText="form.specificationQuantityRegulationName || '请选择'" showArrow>
            <template v-slot:body>
              <view class="item-title"><text>试样规格个数是否超规定</text></view>
            </template>
          </uni-list-item>
          
           <uni-list-item title="试样次数">
            <template v-slot:footer>
              <uni-easyinput type="textarea" v-model="form.sampleFrequency" placeholder="请输入试样次数" :inputBorder="false" />
            </template>
          </uni-list-item>

          <uni-list-item title="前期不合格描述">
            <template v-slot:footer>
              <uni-easyinput type="textarea" v-model="form.earlyNonconformityDescription" placeholder="请输入前期不合格描述" :inputBorder="false" />
            </template>
          </uni-list-item>
          
        </view>

        <view class="footer">
          <view class="view-total">
            <view class="head">合计</view>
            <view class="row">
              <view class="row2">
                <text class="label">数量</text><text class="value">{{ form.totalQuantity }}</text>
              </view>
            </view>
          </view>
          <button class="btn submit" type="primary" @click="onSubmit">保存</button>
        </view>
      </uni-list>
    </scroll-view>
     <SingleSelectSheet :visible.sync="sheet.visible" :title="sheet.title" :options="sheet.options" v-model="sheet.value"
      @confirm="onSheetConfirm" />
  </view>
</template>

<script>
import { updateApi, getDetailApi } from '@/api/confirmation_form.js'
import Product from './product.vue'
import SingleSelectSheet from '@/components/single-select/index.vue'
import {
	getDicByCodes
} from '@/utils/dic'

export default {
  name: 'ConfirmationFormModify',
  components: { Product, SingleSelectSheet },
  data() {
    return {
      form: {
        purchaseOrderId: '',
        id: '',
        // 订单基础信息
        purchaseOrderName: '',
        customerName: '',
        customerId: '',
        workshopName: '',
        workshopId: '',
        originPlanShipDate: '',
        deptName: '',
        deptId: '',
        totalQuantity: '',
        totalShippedQuantity: '',
        totalSupplementaryQuantity: '',
        code: '',
        // 默认当前日期 格式为 yyyy-MM-dd
        orderDate: new Date().toISOString().substring(0, 10),

      },
      initPurchaseOrderLineList: [],
      maxDeliveryDate: new Date().toISOString().substring(0, 10),
      sheet: { visible: false, title: '请选择', options: [], value: '', field: '' },
      dicOptions: {
				ENTERPRISE_TYPE: [], // 客户类型
				SAMPLE_TYPE: [], // 试样种类
				CLEAR_PARAMETERS: [], // 是否提供明确参数
				PROVIDE_SAMPLES: [], // 是否提供样品
			},
			enterpriseTypeLocal: [], // 客户类型
			sampleTypeLocal: [], // 试样种类
      provideSamplesOptions: [], // 是否提供样品
      clearParametersOptions: [], // 是否提供明确参数
    }
  },
  onLoad(query) {
    const id = (query && (query.id || query.code)) || ''
    if (id) {
      this.loadDetail(id)
		  this.loadAllDicData()
    }
  },
  methods: {
    async loadDetail(id) {
      try {
        const res = await getDetailApi(id)
        const m = res.data || {}
        const next = { ...this.form, ...m }
        // 确保ID存在
        next.id = m.id || id
        next.sampleQuantityRegulationName = m.sampleQuantityRegulation === true ? '是' : '否'
        next.specificationQuantityRegulationName = m.specificationQuantityRegulation === true ? '是' : '否'
        // 映射列表
        // 注意：详情返回的是 productSampleConfirmationSlipDetailList，需要赋值给 initPurchaseOrderLineList 以便 Product 组件初始化
        // 且需要处理字段兼容性，确保 Product 组件能正确显示和编辑
        const lines = Array.isArray(m.productSampleConfirmationSlipDetailList) ? m.productSampleConfirmationSlipDetailList.map(x => ({
           ...x,
           // 确保 Product 组件需要的字段存在
           // Product组件使用: quantity(需发), shippedQuantity(实发), supplementaryQuantity(需求补货), salesPrice(单价)
           // 详情接口返回的字段应该已经包含了这些，如果有差异需要在此处转换
           // 注意：add.vue中 onRelateConfirm 做了映射，这里是回显，通常直接使用即可
        })) : []
        
        this.form = next;
        this.initPurchaseOrderLineList = lines;
        // 初始计算合计
        this.calculateSummary(lines)
      } catch (e) {
        uni.showToast({ title: '加载失败', icon: 'none' })
      }
    },
    loadAllDicData() {
			const dicCodes = ['ENTERPRISE_TYPE', 'SAMPLE_TYPE', 'CLEAR_PARAMETERS', 'PROVIDE_SAMPLES']
			return getDicByCodes(dicCodes).then(results => {
				this.dicOptions.ENTERPRISE_TYPE = results.ENTERPRISE_TYPE.data || []
				this.dicOptions.SAMPLE_TYPE = results.SAMPLE_TYPE.data || []
        this.dicOptions.CLEAR_PARAMETERS = results.CLEAR_PARAMETERS.data || []
        this.dicOptions.PROVIDE_SAMPLES = results.PROVIDE_SAMPLES.data || []

				this.enterpriseTypeLocal = (this.dicOptions.ENTERPRISE_TYPE || []).map(it => ({
      		value: it.code,
					label: it.name
				}))
				this.sampleTypeLocal = (this.dicOptions.SAMPLE_TYPE || []).map(it => ({
					value: it.code,
					label: it.name
				}))
        this.provideSamplesOptions = (this.dicOptions.PROVIDE_SAMPLES || []).map(it => ({
          value: it.code,
          label: it.name
        }))
        this.clearParametersOptions = (this.dicOptions.CLEAR_PARAMETERS || []).map(it => ({
          value: it.code,
          label: it.name
        }))
			}).catch(() => {
				this.dicOptions = {
					ENTERPRISE_TYPE: [], // 客户类型
					SAMPLE_TYPE: [], // 试样种类
          CLEAR_PARAMETERS: [], // 是否提供明确参数
          PROVIDE_SAMPLES: [], // 是否提供样品
				}
				this.enterpriseTypeLocal = []
				this.sampleTypeLocal = []
        this.provideSamplesOptions = []
        this.clearParametersOptions = []
			})
		},
    validateRequired() {
      const checks = [
        { key: 'purchaseOrderName', label: '订单编号' }
      ]
      for (const it of checks) {
        const val = this.form[it.key]
        if (val === undefined || val === null || String(val).trim() === '') {
          uni.showToast({ title: `请先选择${it.label}`, icon: 'none' })
          return false
        }
      }
      return true
    },
    validateLineListRequired() {
      const list = Array.isArray(this.form.purchaseOrderLineList) ? this.form.purchaseOrderLineList : []
      if (list.length === 0) {
        uni.showToast({ title: '请先添加产品', icon: 'none' })
        return false
      }
      const fields = [
        { key: 'brand', label: '牌号' },
        { key: 'quantity', label: '需发' },
        { key: 'supplementaryQuantity', label: '需求补货' },
      ]
      for (let i = 0; i < list.length; i++) {
        const it = list[i] || {}
        for (const f of fields) {
          const v = it && it[f.key]
          if (v === undefined || v === null || String(v).trim() === '') {
            uni.showToast({ title: `产品第${i + 1}条：${f.label}不能为空！`, icon: 'none' })
            return false
          }
        }
        const has = (v) => v !== undefined && v !== null && String(v).trim() !== ''
        if (has(it.thicknessTolPos) && has(it.thicknessTolNeg)) {
          const pos = Number(it.thicknessTolPos)
          const neg = Number(it.thicknessTolNeg)
          if (!(pos > neg)) {
            uni.showToast({ title: `产品第${i + 1}条：厚度公差上限需大于下限`, icon: 'none' })
            return false
          }
        }
        if (has(it.widthTolPos) && has(it.widthTolNeg)) {
          const pos = Number(it.widthTolPos)
          const neg = Number(it.widthTolNeg)
          if (!(pos > neg)) {
            uni.showToast({ title: `产品第${i + 1}条：宽度公差上限需大于下限`, icon: 'none' })
            return false
          }
        }
        if (has(it.lengthTolPos) && has(it.lengthTolNeg)) {
          const pos = Number(it.lengthTolPos)
          const neg = Number(it.lengthTolNeg)
          if (!(pos > neg)) {
            uni.showToast({ title: `产品第${i + 1}条：长度公差上限需大于下限`, icon: 'none' })
            return false
          }
        }
      }
      return true
    },
    async onSubmit() {
      if (!this.validateRequired()) return
      if (!this.validateLineListRequired()) return
      const payload = { ...this.form }
      // 后端接口通常期望 replenishmentOrderLineList
      payload.replenishmentOrderLineList = payload.purchaseOrderLineList || [];
      // 清理可能存在的多余字段
      delete payload.purchaseOrderLineList;
      
      console.log('onSubmit__payload', payload)
      try {
        await updateApi(payload)
        uni.showToast({ title: '保存成功', icon: 'success' })
        setTimeout(() => { uni.redirectTo({ url: '/pages/replenishment_order/index' }) }, 300)
      } catch (e) {
        uni.showToast({ title: (e && e.msg) || '保存失败', icon: 'none' })
      }
    },
    calculateSummary(list) {
      const summary = (list || []).reduce((acc, it) => {
        const qty = Number(it.supplementaryQuantity) || 0
        const shipped = Number(it.shippedQuantity) || 0
        const orderQty = Number(it.quantity) || 0
        acc.totalSupplementaryQuantity += qty
        acc.totalShippedQuantity += shipped
        acc.totalQuantity += orderQty
        return acc
      }, { totalQuantity: 0, totalShippedQuantity: 0, totalSupplementaryQuantity: 0 })

      const fixedTotalQuantity = Number(summary.totalQuantity.toFixed(2))
      const fixedTotalShippedQuantity = Number(summary.totalShippedQuantity.toFixed(2))
      const fixedTotalSupplementaryQuantity = Number(summary.totalSupplementaryQuantity.toFixed(2))
      this.form.totalQuantity = fixedTotalQuantity
      this.form.totalShippedQuantity = fixedTotalShippedQuantity
      this.form.totalSupplementaryQuantity = fixedTotalSupplementaryQuantity
    },
    purchaseOrderLineListChange(data) {
      const list = Array.isArray(data) ? data : []
      this.form.purchaseOrderLineList = list
      this.calculateSummary(list)
    },
    openSheet(field) {
      let options = []
      let title = ''
      let value = ''

      if (field === 'sampleType') {
        title = '试样种类'
        options = this.sampleTypeLocal
        value = this.form.sampleType
      } else if (field === 'customerType') {
        title = '客户类型'
        options = this.enterpriseTypeLocal
        value = this.form.customerType
      } else if (field === 'sampleQuantityRegulation') {
        title = '本次试样数量是否超规定'
        options = [{ value: true, label: '是' }, { value: false, label: '否' }]
        value = this.form.sampleQuantityRegulation
      } else if (field === 'specificationQuantityRegulation') {
        title = '试样规格个数是否超规定'
        options = [{ value: true, label: '是' }, { value: false, label: '否' }]
        value = this.form.specificationQuantityRegulation
      }

      const match = options.find(o => String(o.value) === String(value))
      this.sheet = { ...this.sheet, visible: true, title, options, field, value: match ? match.value : '' }
    },
    onSheetConfirm({ value, label }) {
      const field = this.sheet.field
      this.form[field] = value
      this.form[field + 'Name'] = label
      this.sheet.visible = false
    },
  }
}
</script>

<style lang="scss" scoped>
.page {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.scroll {
  flex: 1;
  padding: 6rpx 0 400rpx;
}



.title-header {
  background-color: #fff;
  display: flex;
  align-items: center;
  padding: 32rpx 32rpx 22rpx;

  .title-header_icon {
    width: 32rpx;
    height: 28rpx;
    margin-right: 16rpx;
  }

  span {
    color: rgba(0, 0, 0, 0.9);
    font-size: 32rpx;
    line-height: 44rpx;
    font-weight: 600;
  }
}


.section {
  background: #fff;
  margin-bottom: 20rpx;
}

.section2 {
  background: #f1f1f1;
}

::v-deep .uni-list {
  background: transparent;

  &-item {
    &__extra-text {
      font-size: 32rpx;
    }

    &__content-title {
      font-size: 32rpx;
      color: rgba(0, 0, 0, 0.9);
    }

    &__container {
      padding: 32rpx;
      // align-items: center;

      .uni-easyinput {

        .is-disabled {
          background-color: transparent !important;
        }

        &__placeholder-class {
          font-size: 32rpx;
          color: rgba(0, 0, 0, 0.4);
        }

        &__content {
          border: none;

          &-input {
            padding-left: 0 !important;
            height: 48rpx;
            line-height: 48rpx;
            font-size: 32rpx;
          }

          .content-clear-icon {
            font-size: 44rpx !important;
          }
        }
      }

      .amount-row {
        flex: 1;
        display: flex;
        align-items: center;

        .uni-easyinput {
          flex: 1;
        }

        .unit {
          margin-left: 16rpx;
          color: rgba(0, 0, 0, 0.9);
        }
      }

      .item-title,
      .uni-list-item__content {
        flex: none;
        min-height: 48rpx;
        line-height: 48rpx;
        font-size: 32rpx;
        position: relative;
        width: 210rpx;
        margin-right: 32rpx;
        color: rgba(0, 0, 0, 0.9);
        padding-right: 0;


        .required {
          color: red;
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          left: -16rpx;
        }
      }

    }

    &.select-item {
      &.is-empty {
        .uni-list-item__extra-text {
          color: rgba(0, 0, 0, 0.4) !important;
        }
      }

      &.is-filled {
        .uni-list-item__extra-text {
          color: rgba(0, 0, 0, 0.9) !important;
        }
      }

      .serial-number-row {
        display: flex;
        align-items: center;
      }

    }

    &.mgb10 {
      margin-bottom: 20rpx;
    }

  }

  .title-header {
    background-color: #fff;
    display: flex;
    align-items: center;
    padding: 32rpx 32rpx 22rpx;

    &_icon {
      width: 32rpx;
      height: 28rpx;
      margin-right: 16rpx;
    }

    span {
      color: rgba(0, 0, 0, 0.9);
      font-size: 32rpx;
      line-height: 44rpx;
      font-weight: 600;
    }
  }
}

/* 只读 easyinput 根据内容自适应高度 */
::v-deep .uni-list-item__container {
  align-items: flex-start;
}

/* 只读文本样式 */
.readonly-text {
  color: rgba(0, 0, 0, 0.9);
  font-size: 32rpx;
  line-height: 48rpx;
  text-align: right;
  white-space: pre-wrap;
  word-break: break-all;
}


.footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 32rpx 32rpx;
  padding-bottom: calc(32rpx + env(safe-area-inset-bottom));
  background: #fff;
  box-shadow: 0 -8rpx 24rpx rgba(0, 0, 0, 0.06);
  z-index: 10;

  .btn {
    height: 80rpx;
    line-height: 80rpx;
    border-radius: 12rpx;
    font-size: 32rpx;
  }

  .submit {
    background: $theme-primary;
    color: #fff;
  }

  .view-total {
    padding: 20rpx 0;

    .head {
      font-size: 32rpx;
      font-weight: 600;
      line-height: 50rpx;
      color: rgba(0, 0, 0, 0.9);
      padding-bottom: 16rpx;
      margin-bottom: 24rpx;
      border-bottom: 1px dashed #E7E7E7;
    }

    .row {
      display: flex;
      margin-bottom: 24rpx;
      line-height: 32rpx;

      .row2 {
        width: 50%;
      }

      .label {
        width: 180rpx;
        margin-right: 14rpx;
        color: rgba(0, 0, 0, 0.6);
        font-size: 32rpx;
      }

      .value {
        flex: 1;
        color: rgba(0, 0, 0, 0.9);
        font-size: 32rpx;
        white-space: pre-wrap;
        word-break: break-all;
        font-weight: 600;
      }
    }
  }
}
</style>