<template>
    <div>

        <el-button plain type="primary" @click="handlePrintPreview" style="margin-bottom: 10px;">打印预览</el-button>

        <el-form :model="form" label-width="120px" label-position="right" inline ref="ruleFormRef" :rules="rules">
            <el-form-item label="合同类型" prop="contrTy">
                <el-select v-model="form.contrTy" :placeholder="form.contrTy" clearable style="width: 200px;" disabled>
                    <el-option v-for="item in dicList.CONTRACT_TYPE" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="合同编号">
                <el-input v-model="form.contrNo" clearable style="width: 200px" disabled></el-input>
            </el-form-item>
            <el-form-item label="合同名称" prop="contrNm">
                <el-input v-model="form.contrNm" clearable style="width: 200px" readonly></el-input>
            </el-form-item>
            <el-form-item label="交易方名称" prop="supplierNm">
                <el-input v-model="form.supplierNm" clearable style="width: 200px;" readonly>
                    <template #append>
                        <el-button :icon="Search" disabled />
                    </template>
                </el-input>
            </el-form-item>
            <el-form-item label="对方合同编号">
                <el-input v-model="form.khContrNo" clearable style="width: 200px" readonly></el-input>
            </el-form-item>
            <el-form-item label="合同状态">
                <el-select v-model="form.conSts" placeholder="" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.contrSts" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="审批结束时间">
                <el-date-picker v-model="form.approveDt" type="datetime" style="width: 200px;"
                    value-format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD HH:mm:ss" disabled></el-date-picker>
            </el-form-item>
            <el-form-item label="预计交货日期">
                <el-date-picker v-model="form.delvDate" type="date" style="width: 200px;" value-format="YYYY-MM-DD"
                    format="YYYY-MM-DD" readonly></el-date-picker>
            </el-form-item>
            <el-form-item label="结算方式">
                <el-select v-model="form.invMth" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.SAL_INV_MTH" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="化验结算依据">
                <el-select v-model="form.analyDataAccord" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.ANALY_DATA_ACCORD" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="计量结算依据">
                <el-select v-model="form.weightDataAccord" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.WEIGHT_DATA_ACCORD" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="定价方式">
                <el-select v-model="form.priceDcnMth" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.PRICE_DCN_MTH" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="交货方式">
                <el-select v-model="form.delvMth" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.DELV_MTH" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="交货地点">
                <el-input v-model="form.delvPlace" clearable style="width: 200px" readonly></el-input>
            </el-form-item>
            <el-form-item label="到达地">
                <el-input v-model="form.toPlace" clearable style="width: 200px" readonly></el-input>
            </el-form-item>
            <el-form-item label="出发地">
                <el-input v-model="form.fromPlace" clearable style="width: 200px" readonly></el-input>
            </el-form-item>
            <el-form-item label="是否长协" prop="ifAnnual">
                <el-select v-model="form.ifAnnual" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.COM_YN" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="是否招投标">
                <el-select v-model="form.ifBid" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.COM_YN" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="是否内部生产" prop="internalProduction">
                <el-select v-model="form.internalProduction" placeholder="请选择" clearable style="width: 200px">
                    <el-option v-for="item in dicList.COM_YN" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <!-- <el-form-item label="是否采购备件" prop="purTy">
                <el-select v-model="form.purTy" placeholder="请选择" clearable style="width: 200px">
                    <el-option v-for="item in dicList.COM_YN" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item> -->
            <el-form-item label="签约请示">
                <el-input v-model="form.signReqNo" clearable style="width: 200px" readonly>
                    <template #append>
                        <el-button :icon="Search" disabled />
                    </template>
                </el-input>
            </el-form-item>
            <el-form-item label="合同金额">
                <el-input-number v-model="form.totalAmt" :precision="2" :step="0.1" controls-position="right" clearable
                    style="width: 200px" disabled></el-input-number>
            </el-form-item>
            <el-form-item label="重量">
                <el-input-number v-model="form.qty" :precision="2" :step="0.1" controls-position="right" clearable
                    style="width: 200px" disabled></el-input-number>
            </el-form-item>
            <el-form-item label="合同要求">
                <el-input v-model="form.contrReq" clearable style="width: 200px" readonly></el-input>
            </el-form-item>
            <el-form-item label="合同日期">
                <el-date-picker v-model="form.contrDt" type="date" style="width: 200px;" value-format="YYYY-MM-DD"
                    format="YYYY-MM-DD" readonly></el-date-picker>
            </el-form-item>
            <el-form-item label="终止日期">
                <el-date-picker v-model="form.endDt" type="date" style="width: 200px;" value-format="YYYY-MM-DD"
                    format="YYYY-MM-DD" readonly></el-date-picker>
            </el-form-item>
            <el-form-item label="争议所在地法院">
                <el-select v-model="form.checkYn" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.CHECK_YN" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="是否内部生产" prop="internalProduction">
                <el-select v-model="form.internalProduction" placeholder="请选择" clearable style="width: 200px" disabled>
                    <el-option v-for="item in dicList.COM_YN" :key="item.dicCode" :label="item.dicName"
                        :value="item.dicCode" />
                </el-select>
            </el-form-item>
            <el-form-item label="风险提示">
                <el-input v-model="form.riskInfo" clearable style="width: 200px" readonly></el-input>
            </el-form-item>
            <el-form-item label="合同模版" prop="tempNm">
                <el-input v-model="form.tempNm" clearable style="width: 200px" readonly>
                    <template #append>
                        <el-button :icon="Search" @click="handleSearchCotTmp" />
                    </template>
                </el-input>
            </el-form-item>
            <el-form-item label="录入日期">
                <el-date-picker v-model="form.addTime" type="date" style="width: 200px;" value-format="YYYY-MM-DD"
                    format="YYYY-MM-DD" disabled></el-date-picker>
            </el-form-item>
            <el-form-item label="录入人">
                <el-input v-model="form.addName" clearable style="width: 200px" disabled></el-input>
            </el-form-item>
            <el-form-item label="是否补录">
                <el-checkbox v-model="ifSupplemental" disabled />
            </el-form-item>
        </el-form>


        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="合同行" name="first">
                <addLineVue :cotHead="form" :readonly="readonly" :deleteButton="false" v-if="form.id">
                </addLineVue>
            </el-tab-pane>
            <el-tab-pane label="收付款方式" name="second">
                <addVue :cotHead="form" :readonly="readonly" :deleteButton="false" v-if="form.id">
                </addVue>
            </el-tab-pane>
            <el-tab-pane label="文件上传" name="third">
                <el-card :body-style="cardBodyStyle">
                    <Attachment ref="AttachmentRefManual" :fId="fId" :uploadButton="false" v-if="form.id"></Attachment>
                </el-card>
            </el-tab-pane>

            <el-tab-pane label="合同条款" name="fourth">
                <addHouse :cotHead="form" v-if="form.id"></addHouse>
            </el-tab-pane>
        </el-tabs>
    </div>

</template>

<script setup>
import addLineVue from '@/views/cot/input/line.vue'
import addVue from '@/views/cot/input/invtype.vue'
import addHouse from '@/views/cot/input/house.vue'
import Attachment from '@/components/Attachment.vue'

import {
    ref,
    reactive,
    onMounted,
    onActivated,
    getCurrentInstance,
    nextTick
} from 'vue'
import { Search } from '@element-plus/icons-vue'

const {
    proxy
} = getCurrentInstance()

import style from '@/tools/style'
const cardBodyStyle = ref(style.card)

import {
    useWorkflowStore
} from "@/stores/workflow"
const activeName = ref('first')

onMounted(() => {
    getTableData()
    getDictList()
})

onActivated(() => {
    getTableData()
})

const userId = window.localStorage.getItem('userId')

/**
 *  查询字典
 */
const dicList = ref({
    CONTRACT_TYPE: [],
    contrSts: [],
    SAL_INV_MTH: [],
    PRICE_DCN_MTH: [],
    DELV_MTH: [],
    TMS_FTRANTYPE: [],
    WEIGHT_DATA_ACCORD: [],
    ANALY_DATA_ACCORD: [],
    SAL_SAL_MTH: [],
    COM_YN: [],
    CHECK_YN: []
})
const getDictList = () => {
    var url = 'framework/Common/querySelectorList'
    var param = {
        type: JSON.stringify(['CONTRACT_TYPE', 'contrSts', 'SAL_INV_MTH', 'PRICE_DCN_MTH', 'DELV_MTH', 'TMS_FTRANTYPE', 'WEIGHT_DATA_ACCORD', 'ANALY_DATA_ACCORD', 'SAL_SAL_MTH', 'COM_YN', 'CHECK_YN'])
    }
    proxy.$axios.get(url, param).then(response => {
        if (response.data.code == '0') {
            dicList.value = response.data.data
        } else {
            ElMessage.error('操作失败！' + response.data.msg)
        }
    })
}

/**
 *  查询字典
 */

const fId = ref('')
const readonly = ref(true)
const AttachmentRefManual = ref(null)
const form = ref({
    id: '',
    contrTy: '',
    contrNo: '',
    dataAccord: '',
    approveDt: '',
    checkYn: '',
    riskInfo: '',
    conSts: '',
    signReqNo: '',
    delvDays: '',
    delvDate: '',
    priceDcnMth: '',
    signReqId: '',
    ifAnnual: '',
    delvMth: '',
    contrForm: '',
    processInstanceStatus: '',
    processInstanceId: '',
    ifBid: '',
    tempNm: '',
    invMth: '',
    toPlace: '',
    fromPlace: '',
    tempId: '',
    totalAmt: null,
    qty: null,
    conSts: '',
    remark: '',
    contrReq: '',
    delvPlace: '',
    trsMth: '',
    salMth: '',
    contrDt: '',
    endDt: '',
    qualityReq: '',
    compCd: '',
    deptNm: '',
    deptCd: '',
    supplierNm: '',
    supplierCd: '',
    supplierId: '',
    contrNm: '',
    khContrNo: '',
    analyDataAccord: '',
    weightDataAccord: '',
    ifSupplemental: '',
    addId: '',
    addCode: '',
    addName: '',
    addDeptId: '',
    addDeptCode: '',
    addDeptName: '',
    addTime: '',
    modifyCode: '',
    modifyName: '',
    workModel: {
        flowStatusName: ''
    }
})
const ifSupplemental = ref(false)

const workflow = useWorkflowStore()
const getTableData = () => {
    var url = 'cot/Head/queryByWorkId'
    var param = {
        workId: workflow.workId
    }
    proxy.$axios.get(url, param).then(response => {
        if (response.data.code == '0') {
            form.value = response.data.data
            fId.value = form.value.id
            ifSupplemental.value = form.value.ifSupplemental === '1'
            if (form.value.lineNotification != '') {
                ElMessage({
                    message: form.value.lineNotification,
                    type: 'error'
                })
            }
            if (form.value.invtypeNotification != '') {
                ElMessage({
                    message: form.value.invtypeNotification,
                    type: 'error'
                })
            }
        } else {
            ElMessage.error('操作失败！' + response.data.msg)
        }
    })
}

const handlePrintPreview = () => {
    if (form.value.id == undefined) {
        ElMessage({
            type: 'warning',
            message: '请先保存合同头!'
        })
        return
    }

    location.href = import.meta.env.VITE_BASE_API +
        '/cot/Head/downloadCot?userId=' + localStorage.getItem('userId') + '&id=' + encodeURIComponent(form.value.id)
}
</script>

<style></style>