<script setup lang="ts">
import { ref, getCurrentInstance, reactive, onBeforeUpdate, computed } from "vue";
import { useRouter } from "vue-router";
import request, { download } from '~/utils/request';
import { pick } from 'lodash-es';
import { ElMessage } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
import type { AxiosRequestConfig } from 'axios'

// #region (constant)
const TABLE_KEY = 'xhs_id'
const URL_CUT = '/xdhq/hqgl_sbsg'
const URL_CUT_REF = ref(URL_CUT)
const URL_SUBMIT_KEY = URL_CUT.split('/').join('_').slice(1)
const instance = getCurrentInstance()
const router = useRouter()
// #endregion

// #region (variable)
const loading_table = ref(true)
let whichDialogSubmit: 'add' | 'edit'
// #endregion

// #region (type)
type TYPE_TABLE_FIELD = {
  [TABLE_KEY]: string;
  'xhs_zcmc': string; // 资产名称
  'xhs_ggxh': string; // 规格型号
  'xhs_zcfl': string; // 资产分类
  'xhs_zcfl_bh': string; // 资产分类编号
  'xhs_zcpc': string; // 资产批次
  'xhs_zcdj': string; // 单价
  'xhs_dw': string; // 单位
  'xhs_sl': string; // 数量
  'xhs_ssbm': string; // 所属部门
  'xhs_ssbm_lj': string; // 所属部门路径
  'xhs_zj': string; // 总价
  'xhs_gmsj': string; // 购买时间
  'xhs_spr': string; // 审批人
  'xhs_spr_uid': string; // 审批人ID
  'xhs_spzt': string; // 状态
  'xhs_xwhtl': string; // 校务会讨论
}
// #endregion

// #region (props)
// #endregion

// #region (query row)
const queryForm_Data = ref<Partial<TYPE_TABLE_FIELD> & { keyword?: string }>({})

const handleQueryFormBtn_search = () => {
  queryApi()
}
const handleQueryFormBtn_clear = () => {
  queryForm_Data.value = {}
}
// #endregion

// #region (table selection)
const multipleSelection = ref<TYPE_TABLE_FIELD[]>([])
const handleSelectionChange = (val: TYPE_TABLE_FIELD[]) => {
  multipleSelection.value = val
}
// #endregion

// #region (table row)
const handleTableRowBtn_import = async ({ file }: { file: File }) => {
  const res = await API_MAP['import']({ file })
  if (res.code === '1') {
    queryApi()
    ElMessage.success(res.msg)
  }
}
const handleTableRowBtn_export = () => {
  if(multipleSelection.value.length===0) return ElMessage.info('请先勾选导出文件');exportApi({[TABLE_KEY]:multipleSelection.value.map((item: TYPE_TABLE_FIELD)=>item[TABLE_KEY])?.join()})
}
const handleTableRowBtn_add = () => {
  whichDialogSubmit = 'add'
  dialogForm_Data.value = {}
  dialogVisible_addOrEdit.value = true
}
const handleTableRowBtn_add_new = () => {
  whichDialogSubmit = 'add'
  dialogForm_Data_add.value = [{}]
  // dialogForm_Data_add_extend.value = {}
  dialogVisible_add.value = true
}
const handleTableRowBtn_delete = async () => {
  if(multipleSelection.value.length===0) return ElMessage.info('请先勾选文件');const resp = await deleteApi(multipleSelection.value.map((item: TYPE_TABLE_FIELD) => item[TABLE_KEY]));if(resp.code!=='1')return;ElMessage.success('删除成功');
  queryApi()
}
// #endregion

// #region (table body)
const tableData = ref<TYPE_TABLE_FIELD[]>([])
const DetailName = '-SBSG-DETAIL'
const DetailParam = 'aid'

const handleTableColBtn_edit = async (scope: { row: TYPE_TABLE_FIELD }) => {
  whichDialogSubmit = 'edit'
  const res = await detailApi(scope.row[TABLE_KEY])
  dialogForm_Data.value = (res.data.one_info)
  dialogVisible_addOrEdit.value = true
}
const handleTableColBtn_audit = (scope: { row: TYPE_TABLE_FIELD }) => {
  whichDialogSubmit = 'edit'
  dialogForm_Data.value = pick(scope.row, [`${TABLE_KEY}`, ...Object.keys(dialogForm_Rules_audit)])
  dialogVisible_audit.value = true
}
const handleTableColBtn_detail = (scope: { row: TYPE_TABLE_FIELD }) => {
  router.push({ name: DetailName, params: { [DetailParam]: scope.row[TABLE_KEY] } })
}
const handleTableColBtn_delete = async (scope: { row: TYPE_TABLE_FIELD }) => {
  const resp = await deleteApi(scope.row[TABLE_KEY]);if(resp.code!=='1')return;ElMessage.success('删除成功');
  queryApi()
}
// #endregion

// #region (pagination)
const total = ref(0)
const limit = ref(10)

const currentPage = ref(1)
function handleCurrentChange() {
  queryApi()
}
// #endregion

// #region (dialog base)
const dialogForm_Data = ref<Partial<TYPE_TABLE_FIELD> & { keyword?: string }>({})

const handleDialogFormBtn_submit = async (formRefKey: string, extendData?: Partial<TYPE_TABLE_FIELD>) => {
  const isValid = await (instance?.refs[formRefKey] as FormInstance).validate((valid: boolean) => valid)
  if (isValid) {
    const resp = await API_MAP[whichDialogSubmit](<TYPE_TABLE_FIELD>({ ...dialogForm_Data.value, ...extendData }))
    if(resp.code!=='1')return;ElMessage.success('操作成功');handleDialogFormBtn_cancel()
    queryApi()
  }
}
const handleDialogFormBtn_cancel = (formRefKey?: string) => {
  dialogVisible_add.value = false
  dialogVisible_addOrEdit.value = false
  dialogVisible_audit.value = false
}
// #endregion

// #region (dialog add)
const dialogVisible_add = ref<boolean>(false)

const itemRefs = ref<FormInstance[]>([])
const dialogForm_Ref_add = (el: FormInstance) => {
  if (el) {
    itemRefs.value.push(el)
  }
}
onBeforeUpdate(() => {
  itemRefs.value = []
})
const dialogForm_Rules_add = reactive({
  'xhs_zcmc': { required: true, message: '资产名称不能为空', trigger: 'submit' },
  'xhs_ggxh': { required: false, message: '规格型号不能为空', trigger: 'submit' },
  'xhs_zcfl': { required: true, message: '资产分类不能为空', trigger: 'submit' },
  'xhs_zcfl_bh': { required: true, message: '资产分类编号不能为空', trigger: 'submit' },
  'xhs_zcpc': { required: false, message: '资产批次不能为空', trigger: 'submit' },
  'xhs_zcdj': { required: true, message: '单价不能为空', trigger: 'submit' },
  'xhs_dw': { required: true, message: '单位不能为空', trigger: 'submit' },
  'xhs_sl': { required: true, message: '数量不能为空', trigger: 'submit' },
  // 'xhs_ssbm': { required: true, message: '所属部门不能为空', trigger: 'submit' },
  // 'xhs_ssbm_lj': { required: true, message: '所属部门路径不能为空', trigger: 'submit' },
  'xhs_zj': { required: true, message: '总价不能为空', trigger: 'submit' },
  'xhs_gmsj': { required: false, message: '购买时间不能为空', trigger: 'submit' },
  'xhs_spr': { required: true, message: '审批人不能为空', trigger: 'submit' },
  'xhs_spr_uid': { required: true, message: '审批人ID不能为空', trigger: 'submit' },
  'xhs_spzt': { required: true, message: '状态不能为空', trigger: 'submit' },
  'xhs_xwhtl': { required: true, message: '校务会讨论不能为空', trigger: 'submit' },
})


const dialogForm_Data_add = ref<Partial<TYPE_TABLE_FIELD>[]>([{}])
const dialogForm_Data_add_extend = computed((): {
  'xhs_spr'?: string,
  'xhs_spr_uid'?: string,
  'xhs_xwhtl'?: string
} => {
  if (splc_info.value === null) {
    return {}
  }
  else {
    const arr: { sign: string; val_1: number; val_2: number; spr: string; jwhtl: '1' | '2'; }[] = JSON.parse(splc_info.value.xhsl_sz)
    for (const iterator of arr) {
      const { sign, val_1, val_2, spr, jwhtl } = iterator;
      if (
        (sign === '1' && totalMoney.value < val_1) ||
        (sign === '2' && totalMoney.value >= val_1 && totalMoney.value < val_2) ||
        (sign === '3' && totalMoney.value >= val_2)
      ) {
        return {
          xhs_spr: spr,
          xhs_xwhtl: jwhtl
        }
      }
    }
    return {}
  }
})
// ref<{
//   'xhs_spr'?: string,
//   'xhs_spr_uid'?: string,
//   'xhs_xwhtl'?: string
// }>({})


const handleDialogFormBtn_submit_new = async (formRefKey: string, extendData?: Partial<TYPE_TABLE_FIELD>) => {
  const isValid = await Promise.all(itemRefs.value.map(async formRef => (await (formRef as FormInstance).validate((valid: boolean) => valid))))
  // console.log('isValid :>> ', isValid);
  if (isValid.every(val => val)) {
    await API_MAP['add'](<TYPE_TABLE_FIELD[]>(
      dialogForm_Data_add.value.map(d => ({
        ...d,
        ...dialogForm_Data_add_extend.value,
        ...extendData
      }))
    ))
    if(resp.code!=='1')return;ElMessage.success('操作成功');handleDialogFormBtn_cancel()
    queryApi()
  }
}
// #endregion

// #region (dialog add/edit)
const dialogVisible_addOrEdit = ref<boolean>(false)

const dialogForm_Ref_addOrEdit = ref<FormInstance>()
const dialogForm_Rules_addOrEdit = reactive({
  'xhs_zcmc': { required: true, message: '资产名称不能为空', trigger: 'submit' },
  'xhs_ggxh': { required: true, message: '规格型号不能为空', trigger: 'submit' },
  'xhs_zcfl': { required: true, message: '资产分类不能为空', trigger: 'submit' },
  'xhs_zcfl_bh': { required: true, message: '资产分类编号不能为空', trigger: 'submit' },
  'xhs_zcpc': { required: true, message: '资产批次不能为空', trigger: 'submit' },
  'xhs_zcdj': { required: true, message: '单价不能为空', trigger: 'submit' },
  'xhs_dw': { required: true, message: '单位不能为空', trigger: 'submit' },
  'xhs_sl': { required: true, message: '数量不能为空', trigger: 'submit' },
  'xhs_ssbm': { required: true, message: '所属部门不能为空', trigger: 'submit' },
  'xhs_ssbm_lj': { required: true, message: '所属部门路径不能为空', trigger: 'submit' },
  'xhs_zj': { required: true, message: '总价不能为空', trigger: 'submit' },
  'xhs_gmsj': { required: true, message: '购买时间不能为空', trigger: 'submit' },
  'xhs_spr': { required: true, message: '审批人不能为空', trigger: 'submit' },
  'xhs_spr_uid': { required: true, message: '审批人ID不能为空', trigger: 'submit' },
  'xhs_spzt': { required: true, message: '状态不能为空', trigger: 'submit' },
  'xhs_xwhtl': { required: true, message: '校务会讨论不能为空', trigger: 'submit' },
})
// #endregion

// #region (dialog audit)
const dialogVisible_audit = ref<boolean>(false)

const dialogForm_Field_audit = reactive<{
  FLAG: keyof TYPE_TABLE_FIELD,
  REASON?: keyof TYPE_TABLE_FIELD
}>({
  FLAG: 'xhs_spzt',
  // REASON:'xhs_id'
})

const dialogForm_Ref_audit = ref<FormInstance>()
const dialogForm_Rules_audit = reactive<FormRules>({
  // 'xhs_zcmc': { required: true, message: '资产名称不能为空', trigger: 'submit' },
  // 'xhs_ggxh': { required: true, message: '规格型号不能为空', trigger: 'submit' },
  // 'xhs_zcfl': { required: true, message: '资产分类不能为空', trigger: 'submit' },
  // 'xhs_zcfl_bh': { required: true, message: '资产分类编号不能为空', trigger: 'submit' },
  // 'xhs_zcpc': { required: true, message: '资产批次不能为空', trigger: 'submit' },
  // 'xhs_zcdj': { required: true, message: '单价不能为空', trigger: 'submit' },
  // 'xhs_dw': { required: true, message: '单位不能为空', trigger: 'submit' },
  // 'xhs_sl': { required: true, message: '数量不能为空', trigger: 'submit' },
  // 'xhs_ssbm': { required: true, message: '所属部门不能为空', trigger: 'submit' },
  // 'xhs_ssbm_lj': { required: true, message: '所属部门路径不能为空', trigger: 'submit' },
  // 'xhs_zj': { required: true, message: '总价不能为空', trigger: 'submit' },
  // 'xhs_gmsj': { required: true, message: '购买时间不能为空', trigger: 'submit' },
  // 'xhs_spr': { required: true, message: '审批人不能为空', trigger: 'submit' },
  // 'xhs_spr_uid': { required: true, message: '审批人ID不能为空', trigger: 'submit' },
  'xhs_spzt': { required: true, message: '状态不能为空', trigger: 'submit' },
  // 'xhs_xwhtl': { required: true, message: '校务会讨论不能为空', trigger: 'submit' },
})

// #endregion

// #region (request api):
function queryApi() {
  loading_table.value = true
  return request({
    url: URL_CUT + '/index',
    data: {
      ...queryForm_Data.value,
      limit: limit.value,
      page: currentPage.value
    }
  }).then((response: { data: { total_rows: string, page_data: TYPE_TABLE_FIELD[] } }) => {
    const { data } = response
    total.value = parseInt(data.total_rows)
    tableData.value = data.page_data
    return response
  }).then(() => {
    loading_table.value = false
  })
}

function addApi(data: TYPE_TABLE_FIELD | TYPE_TABLE_FIELD[]) {
  return request({
    url: URL_CUT + '/add',
    data: {
      [URL_SUBMIT_KEY]: data,
    }
  })
}

function editApi(data: Partial<TYPE_TABLE_FIELD>) {
  return request({
    url: URL_CUT + '/edit',
    data: {
      [TABLE_KEY]: data[TABLE_KEY],
      [URL_SUBMIT_KEY]: pick(data, ['xhs_zcmc', 'xhs_ggxh', 'xhs_zcfl', 'xhs_zcfl_bh', 'xhs_zcpc', 'xhs_zcdj', 'xhs_dw', 'xhs_sl', 'xhs_ssbm', 'xhs_ssbm_lj', 'xhs_zj', 'xhs_gmsj', 'xhs_spr', 'xhs_spr_uid', 'xhs_spzt', 'xhs_xwhtl',]),
    }
  })
}

function deleteApi(id: string | string[]) {
  return request({
    url: URL_CUT + '/delete',
    data: {
      [TABLE_KEY]: id,
    }
  })
}

function detailApi(id: string) {
  return request({
    url: URL_CUT + '/detail',
    data: {
      [TABLE_KEY]: id,
    }
  })
}

function importApi(data: { file: File }) {
  return request({
    $type: 'import',
    url: URL_CUT + '/import',
    data
  } as AxiosRequestConfig)
}

function exportApi(d) {
  return download(URL_CUT + '/index', {...queryForm_Data.value,...d})
}

const API_MAP = {
  query: queryApi,
  add: addApi,
  edit: editApi,
  delete: deleteApi,
  detail: detailApi,
  import: importApi,
  export: exportApi,
}
// #endregion

// #region (page init)
function init() {
  queryApi()
}
init()
// #endregion



function handleZjChange(_: string, obj: Partial<TYPE_TABLE_FIELD>) {
  if (obj.xhs_zcdj && obj.xhs_sl) {
    obj.xhs_zj = (parseFloat(obj.xhs_zcdj) * parseFloat(obj.xhs_sl)).toFixed(2)
  }
}

const totalMoney = computed(() => dialogForm_Data_add.value.reduce((t, { xhs_zj }) => t += parseFloat(xhs_zj ?? '0'), 0))

const splc_info = ref<{
  'xhsl_mc': string; // 审批流程编名称
  'xhsl_sz': string; // 流程设置JSON
  'xhsl_cjr': string; // 创建人
  'xhsl_cjsj': string; // 创建时间
} | null>(null)
request({
  url: '/xdhq/hqgl_splcsz/index'
}).then((response) => {
  const { data } = response
  if (data.page_data.length === 1) {
    splc_info.value = data.page_data[0]
  } else if (data.page_data.length === 0) {

  }
  else {
    throw new Error('联系开发者')
  }
})
</script>

<template>
  <div class="card flex-grow flex flex-col">
    <el-form inline :model="queryForm_Data">
      <!-- <el-form-item label="关键字"><el-input v-model="queryForm_Data.keyword" ></el-input></el-form-item> -->
      <el-form-item label="资产名称">
        <el-input v-model="queryForm_Data.xhs_zcmc" clearable />
      </el-form-item>
      <!-- <el-form-item label="规格型号">
        <el-input v-model="queryForm_Data.xhs_ggxh" clearable />
      </el-form-item> -->
      <el-form-item label="资产分类">
        <el-input v-model="queryForm_Data.xhs_zcfl" clearable />
        <!-- <remote-cascader url="/xdhq/hqgl_xcgllb/tree" v-model="queryForm_Data.xhs_zcfl_bh"></remote-cascader> -->
      </el-form-item>
      <!-- <el-form-item label="资产分类编号">
        <el-input v-model="queryForm_Data.xhs_zcfl_bh" clearable />
      </el-form-item> -->
      <!-- <el-form-item label="资产批次">
        <el-input v-model="queryForm_Data.xhs_zcpc" clearable />
      </el-form-item>
      <el-form-item label="单价">
        <el-input v-model="queryForm_Data.xhs_zcdj" clearable />
      </el-form-item>

      <el-form-item label="数量">
        <el-input v-model="queryForm_Data.xhs_sl" clearable />
      </el-form-item>
      <el-form-item label="数量单位">
        <el-input v-model="queryForm_Data.xhs_dw" clearable />
      </el-form-item> -->
      <!-- <el-form-item label="所属部门">
        <el-input v-model="queryForm_Data.xhs_ssbm" clearable />
      </el-form-item>
      <el-form-item label="所属部门路径">
        <el-input v-model="queryForm_Data.xhs_ssbm_lj" clearable />
      </el-form-item> -->
      <!-- <el-form-item label="总价">
        <el-input v-model="queryForm_Data.xhs_zj" clearable />
      </el-form-item>
      <el-form-item label="购买时间">
        <el-date-picker type="date" v-model="queryForm_Data.xhs_gmsj" value-format="YYYY-MM-DD" clearable />
      </el-form-item>
      <el-form-item label="审批人">
        <el-input v-model="queryForm_Data.xhs_spr" clearable />
      </el-form-item>
      <el-form-item label="审批人ID">
        <el-input v-model="queryForm_Data.xhs_spr_uid" clearable />
      </el-form-item> -->
      <el-form-item label="状态">
        <el-select v-model="queryForm_Data.xhs_spzt" clearable filterable>
          <el-option label="待审批" value="1" />
          <el-option label="通过" value="2" />
          <el-option label="不通过" value="3" />
        </el-select>
      </el-form-item>
      <el-form-item label="校务会讨论">
        <el-select v-model="queryForm_Data.xhs_xwhtl" clearable filterable>
          <el-option label="是" value="1" />
          <el-option label="否" value="2" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button @click="handleQueryFormBtn_search" type="primary">搜索</el-button>
        <el-button @click="handleQueryFormBtn_clear" type="warning">清空</el-button>
      </el-form-item>
    </el-form>
    <div class="divider"></div>
    <div>
      <import-button @success="queryApi" :url="URL_CUT_REF"></import-button>
      <el-button @click="handleTableRowBtn_export" type="success">导出</el-button>
      <!-- <el-button @click="handleTableRowBtn_add" type="primary">新增</el-button> -->
      <el-button @click="handleTableRowBtn_add_new" type="primary">设备申购</el-button>
      <el-button @click="handleTableRowBtn_delete" type="danger">删除</el-button>


    </div>

    <div class="divider"></div>
    <div class="flex-auto">
      <el-table :data="tableData" @selection-change="handleSelectionChange" v-loading="loading_table"
        element-loading-background="#ffffff70">
        <el-table-column type="selection"></el-table-column>
        <el-table-column prop="xhs_zcmc" label="资产名称" width="auto" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xhs_ggxh" label="规格型号" width="auto" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xhs_zcfl" label="资产分类" width="auto" show-overflow-tooltip></el-table-column>
        <!-- <el-table-column prop="xhs_zcfl_bh" label="资产分类编号" width="auto" show-overflow-tooltip></el-table-column> -->
        <!-- <el-table-column prop="xhs_zcpc" label="资产批次" width="auto" show-overflow-tooltip></el-table-column> -->
        <el-table-column prop="xhs_spzt" label="状态" width="auto" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xhs_zcdj" label="单价" width="auto" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xhs_sl" label="数量" width="auto" show-overflow-tooltip></el-table-column>
        <!-- <el-table-column prop="xhs_dw" label="数量单位" width="auto" show-overflow-tooltip></el-table-column> -->
        <el-table-column prop="xhs_ssbm" label="所属部门" width="auto" show-overflow-tooltip></el-table-column>
        <!-- <el-table-column prop="xhs_ssbm_lj" label="所属部门路径" width="auto" show-overflow-tooltip></el-table-column> -->
        <el-table-column prop="xhs_zj" label="总价" width="auto" show-overflow-tooltip></el-table-column>
        <!-- <el-table-column prop="xhs_gmsj" label="购买时间" width="auto" show-overflow-tooltip></el-table-column> -->
        <el-table-column prop="xhs_spr" label="审批人" width="auto" show-overflow-tooltip></el-table-column>
        <!-- <el-table-column prop="xhs_spr_uid" label="审批人ID" width="auto" show-overflow-tooltip></el-table-column> -->
        <el-table-column prop="xhs_xwhtl" label="校务会讨论" width="auto" show-overflow-tooltip></el-table-column>
        <el-table-column label="操作" fixed="right">
          <template #default="scope">
            <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_edit(scope)" type="primary">编辑
            </el-button> -->
            <el-button link :auto-insert-space="false" @click="handleTableColBtn_audit(scope)" type="primary"
              :disabled="scope.row.xhs_spzt_option_k !== '1'">审核
            </el-button>
            <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_detail(scope)" type="primary">详情
            </el-button>
            <el-button link :auto-insert-space="false" @click="handleTableColBtn_delete(scope)" type="primary">删除
            </el-button> -->
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="flex justify-end mt-10 py-4">
      <el-pagination :page-size="limit" v-model:current-page="currentPage" @current-change="handleCurrentChange"
        background layout="total, prev, pager, next" :total="total" />
    </div>
  </div>

  <el-dialog v-model="dialogVisible_add" append-to-body destroy-on-close>
    <div class="flex justify-end">
      <el-button @click="dialogForm_Data_add.unshift({})" type="primary">添加设备</el-button>
    </div>
    <div class="divider"></div>
    <div v-for="(formData, idx) in dialogForm_Data_add">
      <el-form :model="formData" :ref="el => { if (el) itemRefs[idx] = (el as FormInstance) }"
        :rules="dialogForm_Rules_add" label-width="120px">
        <el-form-item label="资产名称" prop="xhs_zcmc">
          <el-input v-model="formData.xhs_zcmc" clearable />
        </el-form-item>
        <el-form-item label="规格型号" prop="xhs_ggxh">
          <el-input v-model="formData.xhs_ggxh" clearable />
        </el-form-item>
        <el-form-item label="资产分类" prop="xhs_zcfl">
          <!-- <el-input v-model="formData.xhs_zcfl" clearable /> -->
          <remote-cascader url="/xdhq/hqgl_xcgllb/tree" v-model="formData.xhs_zcfl_bh"
            v-model:modelName="formData.xhs_zcfl"></remote-cascader>
        </el-form-item>
        <!-- <el-form-item label="资产分类编号" prop="xhs_zcfl_bh">
          <el-input v-model="formData.xhs_zcfl_bh" clearable />
        </el-form-item> -->
        <el-form-item label="资产批次" prop="xhs_zcpc">
          <el-input v-model="formData.xhs_zcpc" clearable />
        </el-form-item>
        <el-form-item label="单价" prop="xhs_zcdj">
          <el-input v-model="formData.xhs_zcdj" clearable @change="handleZjChange($event, formData)" />
        </el-form-item>

        <el-form-item label="数量" prop="xhs_sl">
          <el-input v-model="formData.xhs_sl" clearable @change="handleZjChange($event, formData)" />
        </el-form-item>
        <el-form-item label="数量单位" prop="xhs_dw">
          <el-input v-model="formData.xhs_dw" clearable />
        </el-form-item>
        <el-form-item label="所属部门" prop="xhs_ssbm">
          <el-input v-model="formData.xhs_ssbm" clearable />
        </el-form-item>
        <!-- <el-form-item label="所属部门路径" prop="xhs_ssbm_lj">
          <el-input v-model="formData.xhs_ssbm_lj" clearable />
        </el-form-item> -->
        <el-form-item label="总价" prop="xhs_zj">
          <el-input v-model="formData.xhs_zj" disabled />
        </el-form-item>
        <el-form-item label="购买时间" prop="xhs_gmsj">
          <el-date-picker type="date" v-model="formData.xhs_gmsj" value-format="YYYY-MM-DD" clearable />
        </el-form-item>
        <!-- <el-form-item label="状态" prop="xhs_spzt">
          <el-radio-group v-model="formData.xhs_spzt">
            <el-radio label="1">待审批</el-radio>
            <el-radio label="2">通过</el-radio>
            <el-radio label="3">不通过</el-radio>
          </el-radio-group>
        </el-form-item> -->
      </el-form>
      <div class="flex justify-end">
        <el-button @click="dialogForm_Data_add.splice(idx, 1)" type="danger">删除设备</el-button>
      </div>
      <div class="divider"></div>
    </div>
    <el-form :model="dialogForm_Data_add_extend" ref="dialogForm_Ref_add" :rules="dialogForm_Rules_add"
      label-width="120px" disabled>
      <el-form-item label="合计" prop="xhs_spr">
        <el-input v-model="totalMoney" />
      </el-form-item>

      <template v-if="splc_info === null">
        <div class="text-red-400 text-lg text-center py-2">暂未设置审批流程！</div>
      </template>

      <template v-else>
        <div v-if="!dialogForm_Data_add_extend.xhs_spr" class="text-red-400 text-lg text-center py-2">无符合的流程！</div>
        <template v-else>
          <el-form-item label="审批人" prop="xhs_spr">
            <el-input v-model="dialogForm_Data_add_extend.xhs_spr" clearable />
          </el-form-item>
          <!-- <el-form-item label="审批人ID" prop="xhs_spr_uid">
          <el-input v-model="dialogForm_Data_add_extend.xhs_spr_uid" clearable />
        </el-form-item> -->
          <el-form-item label="校务会讨论" prop="xhs_xwhtl">
            <el-radio-group v-model="dialogForm_Data_add_extend.xhs_xwhtl">
              <el-radio label="1">是</el-radio>
              <el-radio label="2">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </template>
      </template>
    </el-form>

    <div class="flex justify-center">
      <el-button @click="handleDialogFormBtn_submit_new('dialogForm_Ref_add', { [dialogForm_Field_audit.FLAG]: '1' })"
        type="primary">提交</el-button>
      <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_add')" type="default">取消</el-button>
    </div>
  </el-dialog>

  <!-- <el-dialog v-model="dialogVisible_addOrEdit" append-to-body destroy-on-close>
    <el-form :model="dialogForm_Data" ref="dialogForm_Ref_addOrEdit" :rules="dialogForm_Rules_addOrEdit"
      label-width="120px">
      <el-form-item label="资产名称" prop="xhs_zcmc">
        <el-input v-model="dialogForm_Data.xhs_zcmc" clearable />
      </el-form-item>
      <el-form-item label="规格型号" prop="xhs_ggxh">
        <el-input v-model="dialogForm_Data.xhs_ggxh" clearable />
      </el-form-item>
      <el-form-item label="资产分类" prop="xhs_zcfl">
        <el-input v-model="dialogForm_Data.xhs_zcfl" clearable />
      </el-form-item>
      <el-form-item label="资产分类编号" prop="xhs_zcfl_bh">
        <el-input v-model="dialogForm_Data.xhs_zcfl_bh" clearable />
      </el-form-item>
      <el-form-item label="资产批次" prop="xhs_zcpc">
        <el-input v-model="dialogForm_Data.xhs_zcpc" clearable />
      </el-form-item>
      <el-form-item label="单价" prop="xhs_zcdj">
        <el-input v-model="dialogForm_Data.xhs_zcdj" clearable />
      </el-form-item>
      <el-form-item label="单位" prop="xhs_dw">
        <el-input v-model="dialogForm_Data.xhs_dw" clearable />
      </el-form-item>
      <el-form-item label="数量" prop="xhs_sl">
        <el-input v-model="dialogForm_Data.xhs_sl" clearable />
      </el-form-item>
      <el-form-item label="所属部门" prop="xhs_ssbm">
        <el-input v-model="dialogForm_Data.xhs_ssbm" clearable />
      </el-form-item>
      <el-form-item label="所属部门路径" prop="xhs_ssbm_lj">
        <el-input v-model="dialogForm_Data.xhs_ssbm_lj" clearable />
      </el-form-item>
      <el-form-item label="总价" prop="xhs_zj">
        <el-input v-model="dialogForm_Data.xhs_zj" clearable />
      </el-form-item>
      <el-form-item label="购买时间" prop="xhs_gmsj">
        <el-date-picker type="date" v-model="dialogForm_Data.xhs_gmsj" value-format="YYYY-MM-DD" clearable />
      </el-form-item>
      <el-form-item label="审批人" prop="xhs_spr">
        <el-input v-model="dialogForm_Data.xhs_spr" clearable />
      </el-form-item>
      <el-form-item label="审批人ID" prop="xhs_spr_uid">
        <el-input v-model="dialogForm_Data.xhs_spr_uid" clearable />
      </el-form-item>
      <el-form-item label="状态" prop="xhs_spzt">
        <el-radio-group v-model="dialogForm_Data.xhs_spzt">
          <el-radio label="1">待审批</el-radio>
          <el-radio label="2">通过</el-radio>
          <el-radio label="3">不通过</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="校务会讨论" prop="xhs_xwhtl">
        <el-radio-group v-model="dialogForm_Data.xhs_xwhtl">
          <el-radio label="0">否</el-radio>
          <el-radio label="1">是</el-radio>
        </el-radio-group>
      </el-form-item>
      <div class="flex justify-center">
        <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_addOrEdit')" type="primary">提交</el-button>
        <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_addOrEdit')" type="default">取消</el-button>
      </div>
    </el-form>
  </el-dialog> -->

  <el-dialog v-model="dialogVisible_audit" append-to-body destroy-on-close>
    <el-form :model="dialogForm_Data" ref="dialogForm_Ref_audit" :rules="dialogForm_Rules_audit" label-width="120px">
      <el-form-item label="状态">
        <el-radio-group v-model="dialogForm_Data[dialogForm_Field_audit.FLAG]">
          <el-radio label="2">通过</el-radio>
          <el-radio label="3">未通过</el-radio>
        </el-radio-group>
      </el-form-item>
      <!-- <el-form-item label="原因" v-show="dialogForm_Data[dialogForm_Field_audit.FLAG] === '1'">
        <el-input type="textarea" v-model="dialogForm_Data[dialogForm_Field_audit.REASON]" :rows="5" />
      </el-form-item> -->
      <div class="flex justify-center">
        <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_audit')" type="primary">提交</el-button>
        <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_audit')" type="default">取消</el-button>
      </div>
    </el-form>
  </el-dialog>


</template>
