hac/src/views/home/task/components/invoice-request.vue

<!--  -->
<template>
    <div>
        <el-form ref="formRef" :model="otherInfo"  label-position="left" label-width="auto" disabled>
            <div class="hc-form-item">
                <el-form-item label="申请时间：" prop="invoiceDate">
                    <el-date-picker type="date" class="block" v-model="otherInfo.invoiceDate" format="YYYY-MM-DD"
                        value-format="YYYY-MM-DD" />
                </el-form-item>
                <el-form-item label="发票抬头：">
                    <el-input v-model="otherInfo.key2" disabled />
                </el-form-item>
            </div>
            <div class="hc-form-item">
                <el-form-item label="开票事由：" prop="invoiceDesc">
                    <el-input type="textarea" v-model="otherInfo.invoiceDesc" :autosize="{ minRows: 3, maxRows: 5 }" />
                </el-form-item>
                <el-form-item label="纳税人识别号：">
                    <el-input v-model="otherInfo.key2" disabled />
                </el-form-item>
            </div>
            <div class="hc-form-item">
                <el-form-item label="开票人：" prop="invoiceUserId">
                    <el-select block v-model="otherInfo.invoiceUserId">
                        <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
                    </el-select>
                </el-form-item>
                <el-form-item label="开户银行：">
                    <el-input v-model="otherInfo.key2" disabled />
                </el-form-item>
            </div>
            <div class="hc-form-item">
                <el-form-item label="发票类型：" prop="invoiceType">
                    <el-select block v-model="otherInfo.invoiceType">
                        <el-option v-for="item in invoiceTypeData" :label="item.dictName" :value="item.dictValue" />
                    </el-select>
                </el-form-item>
                <el-form-item label="银行账户：">
                    <el-input v-model="otherInfo.key2" disabled />
                </el-form-item>
            </div>
            <div class="hc-form-item">
                <el-form-item label="关联项目：" prop="projectId">
                    <el-select block v-model="otherInfo.projectId">
                        <el-option v-for="item in projectType" :label="item.projectName" :value="item.projectId" />
                    </el-select>
                </el-form-item>
                <el-form-item label="收件人：">
                    <el-input v-model="otherInfo.key2" disabled />
                </el-form-item>
            </div>
            <div class="hc-form-item">
                <el-form-item label="开票金额：" prop="invoiceMoney">
                    <el-input v-model="otherInfo.invoiceMoney">
                        <template #append>元</template>
                    </el-input>
                </el-form-item>
                    <el-form-item label="联系电话：">
                    <el-input v-model="otherInfo.key2" disabled />
                </el-form-item>
            </div>
            <div class="hc-form-item">
                <el-form-item label="开票内容：" prop="invoiceContentType">
                    <el-select block v-model="otherInfo.invoiceContentType">
                        <el-option v-for="item in invoiceContentList" :label="item" :value="item"/>
                    </el-select>
                </el-form-item>
                
                <el-form-item label="邮寄地址：">
                    <el-input v-model="otherInfo.key2" disabled />
                </el-form-item>
            </div>
         
        </el-form>
    </div>
</template>

<script setup>
import { ref, watch,onActivated } from 'vue'
import {getProjectList,getuserList,getDictInfo} from "~api/other";
import {getArrValue} from "js-fast-way";
import {useAppStore} from "~src/store";
import mainApi from "~api/expense/invoice";
const useAppState = useAppStore();
onActivated(()=>{
    getUserDict()
    getInvoiceContentList()
    getInvoiceType()
    getProjectData()
 })
//参数
const props = defineProps({
  otherInfo: {
    type: Object,
    default: {}
  }
})
const invoiceTypeData=ref([])
const projectType=ref([])
//监听
watch(() => [
  props.otherInfo,
], ([otherInfo]) => {
  console.log(otherInfo, 'otherInfo');

})
//获取所有员工
const userList=ref([])
const getUserDict=async()=>{
    const {error, code, data} = await getuserList({tenantId:useAppState.tenantId})
    if (!error && code === 200) {
        userList.value = getArrValue(data)

    } else {
        userList.value = []

    }
}
//获取开票内容
const invoiceContentList=ref([])
const getInvoiceContentList=async()=>{
    const {error, code, data} = await mainApi.getInvoiceContentList()
    if (!error && code === 200) {
        invoiceContentList.value = getArrValue(data)

    } else {
        invoiceContentList.value = []

    }
}
//发票类型字典
const getInvoiceType = async () => {
    const {error, code, data} = await getDictInfo('invoice_type')
    //判断状态
    if (!error && code === 200) {
        invoiceTypeData.value = getArrValue(data)
    } else {
        invoiceTypeData.value = []
    }
}
//项目类型
const getProjectData = async () => {
    const {error, code, data} = await getProjectList()
    //判断状态
    if (!error && code === 200) {
        projectType.value = getArrValue(data)
    } else {
        projectType.value = []
    }
}
</script>
<style lang='scss' scoped></style>