<template>
    <div class="particulars">
        <el-dialog v-model="outerVisible" :title="data.drawerTiti" draggable destroy-on-close>
            <div style="border-top:1px solid #ccc;padding-top: 20px;">
                <el-form ref="ruleFormRef" label-width="160px">
                    <el-form-item label="项目名称">
                        <el-input v-model="fromData.T_name" style="width: 350px;" :disabled="true"/>
                    </el-form-item>
                    <el-form-item label="项目地址">
                        <el-input v-model="fromData.T_address" style="width: 350px;" :disabled="true"/>
                    </el-form-item>
                    <el-form-item label="项目负责人">
                        <el-input v-model="fromData.T_submit_name" style="width: 350px;" :disabled="true"/>
                    </el-form-item>
                    <el-form-item label="预计签约时间">
                        <el-date-picker v-model="fromData.T_predict_sign_time" :disabled="true" value-format="YYYY-MM-DD" type="date" placeholder="预计签约时间" />
                    </el-form-item>
                    <el-form-item label="服务内容">
                        <el-table :data="fromData.ServiceItemList" border style="width: 100%">
                            <el-table-column type="index" label="序号" width="60" />
                            <el-table-column prop="address" label="服务类型" show-overflow-tooltip width="100">
                                <template #default="scope">
                                    {{ scope.row.ServiceItem.ServiceType.T_name }}
                                </template>
                            </el-table-column>
                            <el-table-column prop="address" label="销售类型" show-overflow-tooltip width="100">
                                <template #default="scope">
                                    {{ scope.row.ServiceItem.T_sale_type }}
                                </template>
                            </el-table-column>
                            <el-table-column prop="address" label="服务内容" show-overflow-tooltip>
                                <template #default="scope">
                                    {{ scope.row.ServiceItem.T_name }}
                                </template>
                            </el-table-column>
                            <el-table-column prop="address" label="型号" show-overflow-tooltip>
                                <template #default="scope">
                                    {{ scope.row.ServiceItem.T_model }}
                                </template>
                            </el-table-column>
                            <el-table-column prop="address" label="规格" show-overflow-tooltip width="80">
                                <template #default="scope">
                                    {{ scope.row.ServiceItem.T_spec }}
                                </template>
                            </el-table-column>
                            <el-table-column label="数量" width="100" show-overflow-tooltip>
                                <template #default="scope">
                                    {{ scope.row.T_quantity }}
                                </template>
                            </el-table-column>
                            <el-table-column label="单价" width="100">
                                <template #default="scope">
                                    {{ scope.row.T_unit_price }}
                                </template>
                            </el-table-column>
                            <el-table-column prop="address" label="金额" show-overflow-tooltip>
                                <template #default="scope">
                                    {{ scope.row.T_quantity * scope.row.T_unit_price }}
                                </template>
                            </el-table-column>
                            <el-table-column prop="T_remark" label="备注" show-overflow-tooltip>
                                <template #default="scope">
                                    {{ scope.row.T_remark }}
                                </template>
                            </el-table-column>
                            <!-- <el-table-column prop="address" label="操作" width="80" fixed="right">
                                <template #default="scope">
                                    <el-button link type="danger" size="small" :icon="Delete" @click="onclickdelete(scope)">删除</el-button>
                                </template>
                            </el-table-column> -->
                        </el-table>
                    </el-form-item>
                    <el-form-item label="总金额">
                        {{ moneyFun() }}
                    </el-form-item>
                    <el-form-item label="最终优惠金额">
                        {{ fromData.T_discount_money }}元
                    </el-form-item>
                    <el-form-item label="是否有居间费">
                        <el-radio-group v-model="fromData.T_have_brokerage_fee" :disabled="true">
                            <el-radio :label="true">是</el-radio>
                            <el-radio :label="false">否</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="居间费金额">
                        {{ fromData.T_brokerage_fee_money }}
                    </el-form-item>
                    <el-form-item label="状态">
                        <el-tag :type="[1,2].includes(fromData.T_audit) ? 'warning' :
                            [3,5].includes(fromData.T_audit) ? 'primary' :
                            [4,6].includes(fromData.T_audit) ? 'danger' : ''">
                            {{
                                fromData.T_audit == '1' ? '待提交审核' :
                                fromData.T_audit == '2' ? '待审核' :
                                fromData.T_audit == '3' ? '财务通过' :
                                fromData.T_audit == '4' ? '财务驳回' :
                                fromData.T_audit == '5' ? '总经理通过' :
                                fromData.T_audit == '6' ? '总经理驳回' : ''
                            }}
                        </el-tag>
                    </el-form-item>
                    <el-form-item label="成本会计审批意见" v-if="data.drawerTiti == '详情' ||  types=='Manager'">
                        <el-alert :title="
                            fromData.T_finance_approval_opinion?fromData.T_finance_approval_opinion:'暂无' " 
                         :type="[4].includes(fromData.T_audit)?'error':'success'" :closable="false" />
                    </el-form-item>
                    <el-form-item label="成本会计审批意见" v-if="data.drawerTiti == '审核' && types=='Finance'">
                         <el-input v-model="data.initParam.T_approval_opinion" :rows="3" type="textarea" placeholder="审批意见" />
                    </el-form-item>

                    <el-form-item label="总经理审批意见" v-if="data.drawerTiti == '详情'">
                        <el-alert :title=" fromData.T_manager_approval_opinion?fromData.T_manager_approval_opinion:'暂无'"
                        :type="[6].includes(fromData.T_audit)?'error':'success'" :closable="false" />
                    </el-form-item>
                    <el-form-item label="总经理审批意见" v-if="data.drawerTiti == '审核' && types=='Manager'">
                        <el-input v-model="data.initParam.T_approval_opinion" :rows="3" type="textarea" placeholder="审批意见" />
                    </el-form-item>
                </el-form>
            </div>
            <template #footer v-if="data.drawerTiti != '详情'">
                <div class="dialog-footer"
                    style="border-top:1px solid #ccc;padding-top: 20px;display: flex;justify-content: center;gap: 40px;">
                    <el-button type="primary" @click="onSubmit(audit[0])">同意</el-button>
                    <el-button type="danger" @click="onSubmit(audit[1])">驳回</el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<script setup lang='ts'>
import { ref, reactive, watch } from 'vue';
import type {FormInstance } from 'element-plus'
import { ElMessage } from 'element-plus'

import {
    Review_Finance_Audit,
    Review_Manager_Audit
} from '@/api/contractReview/index'
const outerVisible = ref(false)

const ruleFormRef = ref<FormInstance>()
const props = defineProps({
    fromData: {
        type: Object,
        default: () => { },
    },
    types: {
        type: String,
        default: () => '',
    },
    audit:{
        type: Array,
        default: () => [0,0],
    }
})

watch(()=>outerVisible.value,(newData:any)=>{
    if(newData){
        console.log('展示', props.fromData)
    }
})

const data: any = reactive({
    drawerTiti: '',
    initParam: {
        T_id: null,
        T_audit: '',
        T_approval_opinion: '',
    },
    fromData: {},
    optionsType: [{ T_name: '/' }, { T_name: '软件' }, { T_name: '硬件' }],
})

const moneyFun = () => {
    let total = props.fromData.ServiceItemList.reduce((acc: any, item: any) => {
        return acc + item.T_quantity * item.T_unit_price;
    }, 0);
    props.fromData.T_money = total
    return total + '元';
}
const onSubmit = async (audit:any) => {
    data.initParam.T_id = props.fromData.Id
    data.initParam.T_audit = audit
    props.types=='Finance'?financeAuditApi():managerAuditApi()
}
const emit = defineEmits<{ (event: 'successFun', value: boolean): void }>()

//财务
const financeAuditApi = async ()=>{
    const result:any = await Review_Finance_Audit(data.initParam)
    console.log('财务提交',result)
    if(result.Code==200){
        ElMessage.success('审核成功')
        emit('successFun', true)
        outerVisible.value = false
    }
}
//总经理
const managerAuditApi = async ()=>{
    const result:any = await Review_Manager_Audit(data.initParam)
    if(result.Code==200){
        ElMessage.success('审核成功')
        emit('successFun', true)
        outerVisible.value = false
    }
    console.log('总经理提交',result)
}



defineExpose({
    outerVisible, data
})
</script>
<style lang="scss" scoped>
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner {
    display: none !important;
}

// ::v-deep .el-dialog__body {
//     padding: 0;
// }</style>