<template>
  <view class="page">
    <scroll-view class="scroll" scroll-y>
      <view class="detail-page">
        <view class="section">
          <text class="row company">{{ safeText(form.procurementPlanCode) }}</text>
          <view class="row">
            <text class="label">供方</text>
            <text class="value">{{ safeText(form.supplierName) }}</text>
          </view>
          <view class="row">
            <text class="label">需方</text>
            <text class="value">{{ safeText(form.companyFullName) }}</text>
          </view>
          <view class="row">
            <text class="label">签订地点</text>
            <text class="value">{{ safeText(form.signPlace, '芜湖市') }}</text>
          </view>
          <view class="row">
            <text class="label">签订时间</text>
            <text class="value">{{ formatDateOnly(form.signTime) }}</text>
          </view>
          <view class="row">
            <text class="label">投诉编码</text>
            <text class="value">{{ safeText(form.procurementPlanCode) }}</text>
          </view>
          <view class="row">
            <text class="label">结算比例</text>
            <text class="value">{{ formatPercent(form.settlementRatio) }}</text>
          </view>
          <view v-if="form.createUserName" class="row">
            <text class="label">发起人</text>
            <text class="value">{{ safeText(form.createUserName) }}</text>
          </view>
          <view v-if="approvalStatusVisible" class="row">
            <text class="label">审核状态</text>
            <text class="value">{{ getAuditStatusText(form.approvalStatus) }}</text>
          </view>
          <view v-if="attachmentList.length" class="row">
            <text class="label">附件</text>
            <view class="attach-list">
              <view v-for="(at, idx) in attachmentList" :key="idx" class="attach-item">
                <text class="attach-name">{{ at.name }}</text>
                <text class="attach-view" @click.stop="onPreviewAttachment(at)">查看</text>
              </view>
            </view>
          </view>
        </view>

        <ProductRel mode="view" :list="lineList" />

        <view v-if="form.specialAgreement" class="title-header">
          <image class="title-header_icon" src="/static/images/title.png" />
          <span>特殊约定</span>
        </view>
        <view v-if="form.specialAgreement" class="section">
          <text class="remark-text">{{ safeText(form.specialAgreement) }}</text>
        </view>
      </view>
    </scroll-view>
    <detail-buttons :buttons="displayButtons" @click="handleButtonClick" />
  </view>
</template>

<script>
import DetailButtons from '@/components/detail-buttons/index.vue'
import ProductRel from './productRel.vue'
import { getInfo } from '@/api/login'
import { domesticAgreementCancelApi, domesticAgreementDetailApi, domesticAgreementSubmitApi } from '@/api/procure-manage/domesticAgreement.js'
import { getDicByCodes, getDicName } from '@/utils/dic.js'

export default {
  name: 'DomesticAgreementDetail',
  components: { DetailButtons, ProductRel },
  data() {
    return {
      id: '',
      form: {},
      lineList: [],
      attachmentList: [],
      dicOptions: {
        AUDIT_STATUS: []
      },
      buttons: [{
            text: '审核详情',
            visible: true,
            variant: 'outline',
            event: 'auditDetail',
        },{
            text: '审核',
            visible: true,
            variant: 'primary',
            event: 'audit',
        },{
            text: '编辑',
            visible: true,
            variant: 'outline',
            event: 'edit',
        },
        {
            text: '提交审核',
            visible: true,
            variant: 'outline',
            event: 'submitAudit',
        },
        {
            text: '取消',
            visible: true,
            variant: 'outline',
            event: 'cancel',
        }],
        currentUserId: '',
    }
  },
  computed: {
    displayButtons() {
        const row = this.form || {}
        const status = row.approvalStatus
        const isDraft = !status;  //草稿
        const isAudit = status === 'AUDIT';
        const isPass = status === 'PASS';
        const isRefuse = status === 'REFUSE';
        return [
            { ...this.buttons[0], visible: (isAudit || isPass)&& this.form?.showExamineDetail === true && this.$auth.hasPermi('agreement-manage:domestic-agreement:view') },
            { ...this.buttons[1], visible:  isAudit && this.form?.showExamine === true && this.$auth.hasPermi('agreement-manage:domestic-agreement:approve') },
            { ...this.buttons[2], visible: this.$auth.hasPermi('agreement-manage:domestic-agreement:modify') },
            { ...this.buttons[3], visible: (isDraft || isRefuse) && row.createById === this.currentUserId&& this.$auth.hasPermi('agreement-manage:domestic-agreement:submit') },
            { ...this.buttons[4], visible:(isRefuse || !status) && this.currentUserId === row?.createById && this.$auth.hasPermi('agreement-manage:domestic-agreement:cancel') },
        ]
    },
    approvalStatusVisible() {
      return !!(this.form && this.form.approvalStatus)
    }
  },
  onLoad(query) {
    this.id = (query && query.id) || ''
    this.loadDicData()
    this.loadDetail()
    this.getUserInfo()
  },
  onShow() {
    let needRefresh = ''
    try { needRefresh = uni.getStorageSync('DOMESTIC_AGREEMENT_DETAIL_NEED_REFRESH') } catch (e) {}
    if (!needRefresh) return
    try { uni.removeStorageSync('DOMESTIC_AGREEMENT_DETAIL_NEED_REFRESH') } catch (e) {}
    this.loadDetail()
  },
  methods: {
    handleButtonClick(btn) {
      if (!btn || btn.disabled) return
      var e = btn.event || ''
      if (e === 'cancel') return this.onCancel()
      if (e === 'submitAudit') return this.onSubmitAudit()
      if (e === 'edit') return this.onEdit()
      uni.showToast({ title: (btn.text || '操作') + '待实现', icon: 'none' })
    },
    onEdit() {
      uni.navigateTo({
        url: '/pages/domestic-agreement/modify?id=' + this.id
      })
       },
    refreshListFlags() {
      try { uni.setStorageSync('DOMESTIC_AGREEMENT_LIST_NEED_REFRESH', '1') } catch (e) {}
      try { uni.setStorageSync('DOMESTIC_AGREEMENT_DETAIL_NEED_REFRESH', '1') } catch (e) {}
    },
    runWithConfirm(opts) {
      var self = this
      var title = opts.title || '提示'
      var content = opts.content || ''
      var run = opts.run
      var loading = opts.loading || '处理中'
      var successText = opts.successText || '操作成功'
      var failText = opts.failText || '操作失败'
      if (!this.id) {
        uni.showToast({ title: '缺少合同ID', icon: 'none' })
        return
      }
      var apiFn = function () {
        uni.showLoading({ title: loading, mask: true })
        Promise.resolve(run(self.id)).then(function () {
          uni.hideLoading()
          uni.showToast({ title: successText, icon: 'none' })
          self.refreshListFlags()
          self.loadDetail()
        }).catch(function (e) {
          uni.hideLoading()
          uni.showToast({ title: (e && (e.msg || e.message)) ? (e.msg || e.message) : failText, icon: 'none' })
        })
      }
      uni.showModal({
        title: title,
        content: content,
        confirmText: '确定',
        cancelText: '取消',
        success: function (res) {
          if (!res || !res.confirm) return
          apiFn()
        }
      })
    },
    onCancel() {
      this.runWithConfirm({
        title: '取消',
        content: '确认取消该合同吗？',
        loading: '提交中',
        successText: '取消成功',
        failText: '取消失败',
        run: function (id) { return domesticAgreementCancelApi(id) }
      })
    },
    onSubmitAudit() {
      this.runWithConfirm({
        title: '提交审核',
        content: '确认提交审核吗？',
        loading: '提交中',
        successText: '提交成功',
        failText: '提交审核失败',
        run: function (id) { return domesticAgreementSubmitApi(id) }
      })
    },
    async getUserInfo() {
      try {
        var res = await getInfo()
        this.currentUserId = (res && res.id) ? res.id : ''
      } catch (e) {
        this.currentUserId = ''
      }
    },
    async loadDicData() {
      try {
        const results = await getDicByCodes(['AUDIT_STATUS'])
        this.dicOptions.AUDIT_STATUS = (results.AUDIT_STATUS && results.AUDIT_STATUS.data) || []
      } catch (e) {
        this.dicOptions.AUDIT_STATUS = []
      }
    },
    getAuditStatusText(status) {
      const v = status == null ? '' : String(status)
      if (!v) return '-'
      return getDicName('AUDIT_STATUS', v, this.dicOptions.AUDIT_STATUS) || v
    },
    loadDetail() {
      if (!this.id) {
        uni.showToast({ title: '缺少合同ID', icon: 'none' })
        return
      }
      uni.showLoading && uni.showLoading({ title: '加载中...', mask: true })
      this.fetchDetail({ id: this.id })
        .then(res => {
          const data = res && res.data ? (res.data.data || res.data) : {}
          this.form = Object.assign({}, data)
          const lines = data && Array.isArray(data.procurementContractLineList) ? data.procurementContractLineList : []
          this.lineList = lines.map(l => Object.assign({}, l))
          this.buildAttachmentList()
          this.notifyListRefresh()
        })
        .catch(() => {
          uni.showToast({ title: '详情加载失败', icon: 'none' })
        })
        .finally(() => {
          uni.hideLoading && uni.hideLoading()
        })
    },
    fetchDetail(params) {
      const self = this
      return domesticAgreementDetailApi(params).catch(function () {
        return self.mockDetail(params)
      })
    },
    mockDetail(params) {
      return new Promise(resolve => {
        const mock = {
          id: params.id,
          procurementPlanId: 'plan-' + params.id,
          procurementPlanCode: 'NMHT2026000' + params.id,
          supplierId: 'S001',
          supplierName: '上海钢材贸易有限公司',
          companyShortId: 'C001',
          companyFullName: '北京远大集团有限公司',
          signPlace: '芜湖市',
          signTime: '2026-08-15',
          deliveryTime: '2026-09-20',
          settlementRatio: 80,
          specialAgreement: '1. 本合同项下货物质量须符合国标及双方约定的技术标准；\n2. 如出现质量问题，供方须在3个工作日内响应处理；\n3. 价格波动超过±5%时，双方另行协商结算。',
          attachmentFileIds: 'f1,f2',
          attachmentFileNames: '内贸合同扫描件.pdf,补充条款.docx',
          createUserName: '张三',
          approvalStatus: 'AUDIT',
          procurementContractLineList: [
            {
              id: 'L1',
              contractId: params.id,
              itemId: 'I1',
              planLineId: 'PL1',
              invoiceProductName: '废铜',
              productId: 'P001',
              productName: '光亮铜',
              quantity: '25.500',
              unitPrice: '62500.00',
              deliveryTime: '2026-09-15'
            },
            {
              id: 'L2',
              contractId: params.id,
              itemId: 'I2',
              planLineId: 'PL2',
              invoiceProductName: '废铜',
              productId: 'P002',
              productName: '一特铜',
              quantity: '18.200',
              unitPrice: '61800.00',
              deliveryTime: '2026-09-20'
            },
            {
              id: 'L3',
              contractId: params.id,
              itemId: 'I3',
              planLineId: 'PL3',
              invoiceProductName: '废铝',
              productId: 'P003',
              productName: '高纯铝锭',
              quantity: '42.000',
              unitPrice: '19800.00',
              deliveryTime: '2026-09-25'
            }
          ]
        }
        setTimeout(() => resolve({ data: { data: mock } }), 200)
      })
    },
    buildAttachmentList() {
      const ids = this.form.attachmentFileIds
      const names = this.form.attachmentFileNames
      const idArr = (typeof ids === 'string' && ids) ? ids.split(',').filter(Boolean) : (Array.isArray(ids) ? ids : [])
      const nameArr = (typeof names === 'string' && names) ? names.split(',').filter(Boolean) : (Array.isArray(names) ? names : [])
      const len = Math.max(idArr.length, nameArr.length)
      const list = []
      for (let i = 0; i < len; i++) {
        list.push({ id: idArr[i] || '', name: nameArr[i] || ('附件' + (i + 1)) })
      }
      this.attachmentList = list
    },
    notifyListRefresh() {
      try { uni.setStorageSync('DOMESTIC_AGREEMENT_LIST_NEED_REFRESH', '1') } catch (e) {}
    },
    safeText(v, def) {
      const s = v == null ? '' : String(v)
      if (s.trim()) return s
      return def != null ? def : '-'
    },
    formatDateOnly(v) {
      const s = v == null ? '' : String(v).trim()
      if (!s) return '-'
      if (s.length >= 10) return s.slice(0, 10)
      return s
    },
    formatPercent(v) {
      if (v === null || v === undefined || v === '') return '-'
      const n = Number(v)
      if (isNaN(n)) return String(v)
      return n + '%'
    },
    onPreviewAttachment(at) {
      if (!at || !at.id) {
        uni.showToast({ title: '无法查看', icon: 'none' })
        return
      }
      uni.showToast({ title: '查看附件 ' + at.name, icon: 'none' })
    }
  }
}
</script>

<style lang="scss" scoped>
.page {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.scroll {
  flex: 1;
  padding: 8rpx 0 144rpx;
}
.detail-page {
  background: #f3f3f3;
}
.title-header {
  display: flex;
  align-items: center;
  padding: 24rpx 32rpx 12rpx;
  background-color: #ffffff;
  .title-header_icon {
    width: 36rpx;
    height: 36rpx;
    margin-right: 12rpx;
  }
  span {
    font-size: 34rpx;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.9);
  }
}
.section {
  padding: 32rpx;
  background: #fff;
  margin-bottom: 20rpx;
}
.row {
  display: flex;
  margin-bottom: 28rpx;
  &:last-child { margin-bottom: 0; }
  &.company {
    font-size: 36rpx;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.9);
    padding-top: 8rpx;
    line-height: 50rpx;
  }
  .label {
    max-width: 420rpx;
    margin-right: 20rpx;
    line-height: 32rpx;
    font-size: 28rpx;
    color: rgba(0, 0, 0, 0.6);
  }
  .value {
    flex: 1;
    line-height: 32rpx;
    font-size: 28rpx;
    color: rgba(0, 0, 0, 0.9);
    text-align: right;
    word-break: break-all;
  }
}
.attach-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8rpx;
}
.attach-item {
  display: flex;
  align-items: center;
  gap: 16rpx;
  .attach-name {
    font-size: 26rpx;
    color: rgba(0, 0, 0, 0.9);
  }
  .attach-view {
    font-size: 26rpx;
    color: $theme-primary;
  }
}
.remark-text {
  font-size: 28rpx;
  color: rgba(0, 0, 0, 0.9);
  line-height: 1.6;
  white-space: pre-wrap;
}
.empty-tip {
  text-align: center;
  font-size: 28rpx;
  color: rgba(0, 0, 0, 0.4);
  padding: 24rpx 0;
}
</style>