eam-ui/src/components/Detail/src/DetailDeviceLedger.vue

<template>
  <div>
    <el-drawer
      v-model="isShowDrawer"
      title="详情"
      direction="rtl"
      size="80%"
      v-loading="detailLoading"
    >
      <template #header>
        <div class="font-size-18px">
          {{ titleValueRef }} <span class="ml-20px font-size-16px">{{ titleNameRef }}</span>
        </div>
      </template>
      <ContentWrap>
        <Descriptions
          :data="detailData"
          labelClassName="label-class-name"
          label-align="left"
          direction="vertical"
          :column="8"
          :schema="allSchemas.detailSchema"
          :columns="2"
          width="200px"
        />
      </ContentWrap>

      <Tabs :tabsList="tabsList" :current="current" @change="change" :key="tabsKay" />
      <div class="flex">
        <!-- 详情 -->
        <ContentWrap class="w-[100%]">
          <!-- 列表头部 -->
          <TableHead
            v-if="!isBasic"
            :HeadButttondata="HeadButttondata"
            :number="masterParmas.number"
            @button-base-click="buttonBaseClick"
            :routeName="routeName"
            @searchFormClick="searchFormClick"
            :allSchemas="detailAllSchemas"
          />
          <div v-if="isBasic && tabsExtend == 1">
            <el-form ref="imageFormRef" :model="imageFormData"  :key="formKey">
              <el-form-item label="文件上传">
                <UploadImgs v-model="imageFormData.filePathList"  />
              </el-form-item>
            </el-form>
            <el-button type="primary" @click="uploadImage">点击修改</el-button>
          </div>
          <div v-if="isBasic && tabsExtend == 2">
            <el-tabs class="demo-tabs" v-model="imageParmas.fileBusiType" @tab-change="handleTabsChange">
              <el-tab-pane
                v-for="item in subTabsList"
                :key="item.value"
                :label="item.label"
                :name="item.value"
              />
            </el-tabs>
            <el-form ref="fileFormRef" :model="fileFormData" :key="formKey">
              <el-form-item label="文件上传">
                <UploadFile v-model="fileFormData.filePathList" :limit="20" />
              </el-form-item>
            </el-form>
            <el-button type="primary" @click="uploadFile">点击修改</el-button>
          </div>
          <!-- 单表切换tabs 展现table -->
          <Table
            v-if="isBasic && tabsExtend == 3"
            :columns="detailAllSchemasRef.tableColumns.filter(column => column.field !== 'action')"
            :data="tableObjectRef.tableList"
            :loading="tableObjectRef.loading"
            :pagination="{ total: tableObjectRef.total }"
            v-model:pageSize="tableObjectRef.pageSize"
            v-model:currentPage="tableObjectRef.currentPage"
          >
            <template #number="{ row }">
              <el-button type="primary" link @click="openDialog(row, '编号', row.number)">
                <span>{{ row.number }}</span>
              </el-button>
            </template>
          </Table>
          <!-- 单表切换tabs 展现table -->
          <Table
            v-if="isBasic && tabsExtend == 4"
            :columns="detailAllSchemasRef.tableColumns.filter(column => column.field !== 'action')"
            :data="tableObjectRef.tableList"
            :loading="tableObjectRef.loading"
            :pagination="{ total: tableObjectRef.total }"
            v-model:pageSize="tableObjectRef.pageSize"
            v-model:currentPage="tableObjectRef.currentPage"
          >
            <template #itemNumbers="{ row }">
              <el-button type="primary" link @click="openDialog(row, '编号', row.number)">
                <span>{{ row.itemNumbers }}</span>
              </el-button>
            </template>
          </Table>
          <!-- 单表切换tabs 展现table -->
          <Table
            v-if="isBasic && tabsExtend == 5"
            :columns="detailAllSchemasRef.tableColumns"
            :data="tableObjectRef.tableList"
            :loading="tableObjectRef.loading"
            :pagination="{ total: tableObjectRef.total }"
            v-model:pageSize="tableObjectRef.pageSize"
            v-model:currentPage="tableObjectRef.currentPage"
            :key="milestoneUpdateKey"
          >
            <template #action="{ row }">
              <ButtonBase :Butttondata="butttondata" @button-base-click="buttonMilestoneClick($event, row)" />
            </template>
          </Table>
          <Table
            v-if="!isBasic && fromeWhere != 'countPlan'"
            :columns="detailAllSchemasRef.tableColumns"
            :data="tableObjectRef.tableList"
            :loading="tableObjectRef.loading"
            :pagination="{ total: tableObjectRef.total }"
            v-model:pageSize="tableObjectRef.pageSize"
            v-model:currentPage="tableObjectRef.currentPage"
          >
            <template #photos="{ row }">
              <div
                v-for="(item, index) in row.photos.split(',')"
                :key="index"
                style="color: #409eff; cursor: pointer"
                @click="openImage(item)"
                >{{ item }}</div
              >
            </template>
            <template #action="{ row }">
              <ButtonBase
                :Butttondata="buttondata"
                @button-base-click="buttonTableClick($event, row)"
              />
            </template>
          </Table>
          <DetailTable
            v-if="!isBasic && fromeWhere == 'countPlan' && isShowDrawer"
            :columns="detailAllSchemasRef.tableColumns"
            :data="tableObjectRef.tableList"
            :allList="allList"
            :countScopeType="countScopeType"
            :key="updateKey"
          >
            <template #action="{ row }">
              <ButtonBase
                :Butttondata="buttondata"
                @button-base-click="buttonTableClick($event, row)"
              />
            </template>
          </DetailTable>
        </ContentWrap>
      </div>
    </el-drawer>
    <!-- 表单弹窗：添加/修改 -->
    <BasicForm
      ref="formRef"
      @success="submitForm"
      :rules="detailAllSchemasRules"
      :formAllSchemas="detailAllSchemas"
      :isBusiness="false"
      :apiUpdate="apiUpdate"
      :apiCreate="apiCreate"
      :fromeWhere="fromeWhere"
      :isDetail="true"
      @searchTableSuccess="searchTableSuccess"
      :detailData="detailData"
      @submitForm="submitForm"
      @selectChangeDetail="selectChangeDetail"
      :formTypeDetail="formTypeDetail"
      :countPlanAllList="countPlanAllList"
    />
    <Dialog 
      :title="dialogTitle" 
      v-model="dialogVisible"
      :width="600"
      :maxHeight="900"
      :style="{height:'600px'}"
    >
      <Table
            v-if="true"
            :columns="dialogAllSchemasRef.tableColumns.filter(column => column.field !== 'action')"
            :data="dialogTableObjectRef.tableList"
            :loading="dialogTableObjectRef.loading"
            :pagination="{ total: dialogTableObjectRef.total }"
            v-model:pageSize="dialogTableObjectRef.pageSize"
            v-model:currentPage="dialogTableObjectRef.currentPage"
      />
    </Dialog>
    <Dialog 
      :title="dialogUploadTitle" 
      v-model="dialogUploadVisible"
      :width="600"
      :maxHeight="900"
      :style="{height:'600px'}"
    >
      <el-form ref="fileDialogUploadRef" :model="fileDialogUploadData" :key="dialogFormKey">
        <el-form-item label="文件上传">
          <UploadFile v-model="fileDialogUploadData.filePathList" :limit="20" />
        </el-form-item>
      </el-form>
      <el-button type="primary" @click="dialogUploadFile">点击修改</el-button>
    </Dialog>
    <!-- dialog表单弹窗：添加/修改 -->
    <BasicForm
      ref="dialogFormRef"
      @success="submitDialogForm"
      :rules="dialogFormAllSchemasRules"
      :formAllSchemas="dialogFormAllSchemas"
      :isBusiness="false"
    />
  </div>
</template>

<script lang="ts" setup>
import Tabs from '@/components/Tabs/src/Tabs.vue'
import * as defaultButtons from '@/utils/disposition/defaultButtons'
import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
import TableHead from '@/components/TableHead/src/TableHead.vue'
import DetailTable from '@/components/DetailTable/src/DetailTable.vue'

defineOptions({ name: 'Detail' })

const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化

const route = useRoute() // 路由信息
const routeName = ref()
routeName.value = route.name
routeName.value = routeName.value.substring(0, routeName.value.length - 4) + 'Detail'
const updateKey = ref(0)
const dialogVisible = ref(false)
const dialogTitle = ref()
const dialogAllSchemasRef = ref()
const dialogTableObjectRef = ref()
const dialogTableMethodsRef = ref()
const dialogUploadTitle = ref('文件上传')
const dialogUploadVisible = ref(false)
const dialogUploadNumber = ref()
const dialogUploadBusiCode = ref()
const dialogFormKey = ref(0)
const milestoneUpdateKey = ref(0)
const props = defineProps({
  // 标签参数
  tabs: {
    type: Object,
    required: true,
    default: null
  },
  // 标签参数
  subTabs: {
    type: Object,
    required: true,
    default: null
  },
  // 是否是基础数据 展现详情顶部表单
  isBasic: {
    type: Boolean,
    required: false,
    default: false
  },
  // 表单，列表 相关信息
  allSchemas: {
    type: Object,
    required: true,
    default: null
  },
  // 明细列表相关信息
  detailAllSchemas: {
    type: Object,
    required: true,
    default: null
  },
  //  明细验证
  detailAllSchemasRules: {
    type: Object,
    required: true,
    default: null
  },
  // 子表新增API
  apiCreate: {
    type: Function,
    required: false,
    default: null
  },
  // 子表编辑API
  apiUpdate: {
    type: Function,
    required: false,
    default: null
  },
  // 子表分页列表API
  apiPage: {
    type: Function,
    required: false,
    default: null
  },
  // 子表删除API
  apiDelete: {
    type: Function,
    required: false,
    default: null
  },
  // 子表新增修改校验
  detailValidate: {
    type: Function,
    required: false,
    default: null
  },
  // 来源 countPlan盘点计划进入
  fromeWhere: {
    type: String,
    required: false,
    default: ''
  },
  // 获取接口列表集合
  allList: {
    type: Object,
    required: true,
    default: null
  },
  // 盘点范围类型
  countScopeType: {
    type: Array,
    required: false,
    default: null
  },
  //盘点详情子表新增的时候判断盘点范围值显示输入框还是下拉框
  formTypeDetail: {
    type: String,
    required: false,
    default: 'InputString'
  },
  //盘点详情子表新增的时候判断盘点范围值的下拉列表
  countPlanAllList: {
    type: Array,
    required: false,
    default: null
  },
  // 详情列表扩展操作按钮
  buttondataTable: {
    type: Array,
    required: false,
    default: () => {
      return []
    }
  },
  // 针对基础数据tabs扩展 显示table列表 默认false
  tabsExtend: {
    type: Number,
    required: false,
    default: 1
  },
  tabName: {
    type: String,
    required: false,
    default: ''
  },
  // tableObject 数据过滤条件 针对 详情扩展标签页 传入不同条件
  tableObjectExtend: {
    type: Array,
    required: false,
    default: null
  },
  // 子列表 新增 编辑 删除的展示与隐藏，默认展示
  detailButtonIsShow: {
    type: Boolean,
    required: false,
    default: false
  },
  // 详情上传文件
  upFileRules: {
    type: Array,
    required: false,
    default: null
  },
  // 获取图片详情方法
  getImageApi: {
    type: Function,
    required: false,
    default: null
  },
  // 上传图片方法
  uploadImage: {
    type: Function,
    required: false,
    default: null
  },
  // 默认参数
  defaultParams: {
    type: Object,
    required: false,
    default: null
  },
  //子表dialog的api
  dialogApiPage: {
    type: Function,
    required: false,
    default: null
  },
  // 子表dialog相关信息
  dialogAllSchemas: {
    type: Object,
    required: false,
    default: null
  },
  // 子表dialog校验信息
  dialogAllSchemasRules: {
    type: Object,
    required: false,
    default: null
  },
  dialogFormAllSchemas: {
    type: Object,
    required: false,
    default: null
  },
  dialogFormAllSchemasRules: {
    type: Object,
    required: false,
    default: null
  },
  diaLogApiUpdate: {
    type: Function,
    required: false,
    default: null
  },
  diaLogApiCreate: {
    type: Function,
    required: false,
    default: null
  },
  milestoneFuncCode: {
    type: String,
    required: false,
    default: null
  }
})
const imageFormData = ref({
  filePathList: []
})
const fileFormData = ref({
  filePathList: []
})
const fileDialogUploadData = ref({
  filePathList: []
})
const subIndex = ref('A')
const isShowDrawer = ref(false)
const detailLoading = ref(false)
const tabsList = ref(JSON.parse(JSON.stringify(props.tabs ? props.tabs : '')))
const subTabsList = ref(JSON.parse(JSON.stringify(props.subTabs ? props.subTabs : '')))


// Tabs当前选择
const current = ref(0)
const imageParmas = ref({
  funcCode: 'device_mould_picture', //获取图片详情参数
  fileBusiType: '' //获取图片详情参数
})
const change = (item, index) => {
  current.value = index
  if (item.prop == 'Image') {
    imageParmas.value.funcCode = 'device_mould_picture'
    imageParmas.value.fileBusiType = ''
    getImage()
  } else if (item.prop == 'Word') {
    imageParmas.value.funcCode = 'device_mould_attachment'
    imageParmas.value.fileBusiType = 'A'
    subIndex.value = 'A'
    formKey.value += 1
    getImage()
  } else {
    imageParmas.value.funcCode = ''
    imageParmas.value.fileBusiType = ''
  }
  emit('changeTabs', item)
}

//主表所需的参数
const masterParmas = ref({
  number: '' //主表id
})

// 列表头部按钮
const HeadButttondata = ref()
// 列表-操作按钮
const buttondata = ref()
/** 打开弹窗 */
const detailData = ref()
const titleNameRef = ref()
const titleValueRef = ref()
const tabsKay = ref(0) //刷新tabs组件key值
const openDetail = async (row: any, titleName: any, titleValue: any, tableName: any) => {
  titleNameRef.value = titleName
  titleValueRef.value = titleValue
  current.value = 0
  tabsKay.value += 1
  // 加载明细列表
  if (!props.isBasic || (props.isBasic && props.tabsExtend)) {
    // 设置主表id
    masterParmas.value.number = row.number
    if (!props.isBasic) {
      tableObjectRef.value.params = {
        number: row.number
      }
      await getList()
    }
  }
  isShowDrawer.value = true
  
  imageParmas.value.funcCode = 'device_mould_picture'

  if (row) {
    detailLoading.value = true
    try {
      await getImage()
      detailData.value = row
      // 判断详情新增按钮是否显示
      if (routeName.value.indexOf('Job') > -1) {
        HeadButttondata.value = [
          defaultButtons.defaultFilterBtn(null) // 筛选
        ]
      } else {
        if (!props.detailButtonIsShow) {
          HeadButttondata.value = [
            defaultButtons.defaultAddBtn({
              hide: isShowMainButton(row, ['1'])
            }), // 新增
            defaultButtons.defaultFilterBtn(null) // 筛选
          ]
        }
        //盘点计划详情筛选
        if (props.fromeWhere == 'countPlan') {
          HeadButttondata.value = [
            defaultButtons.defaultAddBtn({
              hide: isShowMainButton(row, ['1'])
            }) // 新增
          ]
        }
        //盘点计划详情筛选
        if (props.fromeWhere == 'putawayRequest') {
          HeadButttondata.value = [
            defaultButtons.defaultFilterBtn(null) // 筛选
          ]
        }
        //盘点调整申请筛选
        if (props.fromeWhere == 'countadjustRequest') {
          HeadButttondata.value = [
            defaultButtons.defaultFilterBtn(null) // 筛选
          ]
        }
        //采购收货详情筛选
        if (props.fromeWhere == 'purchasereceipt') {
          HeadButttondata.value = [
            defaultButtons.defaultFilterBtn(null) // 筛选
          ]
        }
        //客户收货详情筛选
        if (props.fromeWhere == 'customerreceipt') {
          HeadButttondata.value = [
            defaultButtons.defaultFilterBtn(null) // 筛选
          ]
        }
      }

      // 动态显示操作列按钮
      if (!props.detailButtonIsShow) {
        buttondata.value = [
          ...[
            defaultButtons.mainListEditBtn({
              hide: isShowMainButton(row, ['1'])
            }), // 编辑
            defaultButtons.mainListDeleteBtn({
              hide: isShowMainButton(row, ['1'])
            })
          ], // 删除
          ...props.buttondataTable
        ]
      }
    } finally {
      detailLoading.value = false
    }
  }
}
defineExpose({ openDetail }) // 提供 open 方法，用于打开弹窗

// 获取图片详情
const formKey = ref(0)
const getImage = () => {
  props
    .getImageApi({
      number: masterParmas.value.number,
      funcCode: imageParmas.value.funcCode,
      fileBusiType: imageParmas.value.fileBusiType
    })
    .then((res) => {
      nextTick(() => {
        if (imageParmas.value.funcCode == 'device_mould_picture') {
          imageFormData.value.filePathList = res
        } else {
          console.log(444,res)
          fileFormData.value.filePathList = res
          formKey.value += 1
        }
      })
    })
}

const tableObjectRef = ref()
const tableMethodsRef = ref()
const detailAllSchemasRef = ref()

const { tableObject, tableMethods } = useTable({
  getListApi: props.apiPage, // 分页接口
})

tableObjectRef.value = tableObject
tableMethodsRef.value = tableMethods
detailAllSchemasRef.value = props.detailAllSchemas

// 根据状态返回该按钮是否显示
const isShowMainButton = (row, val) => {
  if (val.indexOf(row.status) > -1) {
    return false
  } else {
    return true
  }
}

// 获得表格的各种操作
const { getList } = tableMethodsRef.value

// 头部按钮事件
const buttonBaseClick = (val, item) => {
  if (val == 'add') {
    // 新增
    openForm('create')
  } else if (val == 'import') {
    // 导入
    handleImport()
  } else if (val == 'export') {
    // 导出
    handleExport()
  } else if (val == 'refresh') {
    // 刷新
    getList()
  } else if (val == 'filtrate') {
    // 筛选
  } else {
    // 其他按钮
    console.log('其他按钮', item)
  }
}

// 字段设置 更新主列表字段
// const updataTableColumns = (val) => {
//   detailAllSchemas.tableColumns.value = val
// }

// 列表-操作按钮事件
const buttonTableClick = async (val, row) => {
  if (val == 'edit') {
    // 编辑
    openForm('update', row)
    emit('detailOpenForm', row)
  } else if (val == 'delete') {
    // 删除
    handleDelete(row.id)
  } else {
    emit('tableFormButton', val, row)
  }
}
/** 添加/修改操作 */
const formRef = ref()
const openForm = async (type: string, row?: number) => {
  formRef.value.open(type, row, masterParmas.value)
}
// form 提交
const submitForm = async (formType, data) => {
  try {
    // 子表新增编辑校验 如果业务需要子表提交校验 需在主页详情组件添加 detailValidate 参数及方法
    const rs = (await props.detailValidate) ? props.detailValidate(data) : true
    if (!rs) return
    if (formType === 'create') {
      await props.apiCreate(data)
      message.success(t('common.createSuccess'))
    } else {
      await props.apiUpdate(data)
      message.success(t('common.updateSuccess'))
    }
    formRef.value.dialogVisible = false
    // 刷新当前列表
    await getList()
    updateKey.value += 1
  } finally {
    formRef.value.formLoading = false
  }
}

// 查询页面返回
const searchTableSuccess = (formField, searchField, val, formRef) => {
  emit('searchTableSuccessDetail', formField, searchField, val, formRef)
}
// 传递给父类
const emit = defineEmits([
  'searchTableSuccessDetail',
  'changeTabs',
  'selectChangeDetail',
  'detailOpenForm',
  'tableFormButton',
  'openImage',
  'subTabsChick',
  'milestoneOpenForm'
])
/** 删除按钮操作 */
const handleDelete = async (id: number) => {
  try {
    // 删除的二次确认
    await message.delConfirm()
    // 发起删除
    await props.apiDelete(id)
    message.success(t('common.delSuccess'))
    // 刷新列表
    await getList()
    updateKey.value += 1
  } catch {}
}
// 筛选提交
const searchFormClick = async (searchData) => {
  const { tableObject, tableMethods } = useTable({
    getListApi: props.apiPage // 分页接口
  })
  tableObject.params = {
    isSearch: true,
    filters: searchData.filters
      ? searchData.filters
      : [{ column: 'number', action: '==', value: masterParmas.value.number }]
  }
  detailAllSchemasRef.value = props.detailAllSchemas
  tableObjectRef.value = tableObject
  tableMethodsRef.value = tableMethods
  tableObjectRef.value.tableList = []
  const { getList } = tableMethods
  await getList()
  updateKey.value += 1
  tableObjectRef.value.params = {
    isSearch: true,
    filters: searchData.filters
      ? searchData.filters
      : [{ column: 'masterId', action: '==', value: masterParmas.value.masterId }]
  }
  getList() // 刷新当前列表
}
// 选择盘点类型的时候针对限值的操作
const selectChangeDetail = (field, val) => {
  emit('selectChangeDetail', field, val)
}
// 打开图片
const openImage = (item) => {
  emit('openImage', item)
}
const imageFormRef = ref()
// 上传图片
const uploadImage = async () => {
  // const elForm = unref(imageFormRef)?.getElFormRef()
  // // 校验表单
  // if (!elForm) return
  // const valid = await elForm.validate()
  // if (!valid) return
  imageFormData
  let data = {
    number: masterParmas.value.number,
    filePathList: imageFormData.value.filePathList.map((item) => item.url),
    funcCode: imageParmas.value.funcCode,
    fileBusiType: imageParmas.value.fileBusiType ? imageParmas.value.fileBusiType : ''
  }
  props.uploadImage(data).then((res) => {
    message.success('修改成功')
    getImage()
  })
}
// 选择二级tabs
const fileFormRef = ref()
const handleTabsChange = (e) => {
  imageParmas.value.fileBusiType = e
  getImage()
}
// 上传文件
const uploadFile = async () => {
  console.log(fileFormData.value.filePathList)
  // const elForm = unref(fileFormRef)?.getElFormRef()
  // // 校验表单
  // if (!elForm) return
  // const valid = await elForm.validate()
  // if (!valid) return
  // console.log(fileFormRef.value?.formModel.filePathList)
  let data = {
    number: masterParmas.value.number,
    filePathList: fileFormData.value.filePathList.map((item) => item.url),
    funcCode: imageParmas.value.funcCode,
    fileBusiType: imageParmas.value.fileBusiType ? imageParmas.value.fileBusiType : ''
  }
  props.uploadImage(data).then((res) => {
    message.success('修改成功')
    getImage()
  })
}
//监视属性
watch(
  () => current.value,
  () => {
    const { tableObject, tableMethods } = useTable({
      getListApi: props.apiPage, // 分页接口
      defaultParams: getDefaultParams()
    })
    // tableObject.params.number = masterParmas.value.number
    detailAllSchemasRef.value = props.detailAllSchemas
    if (props.tableObjectExtend) {
      props.tableObjectExtend.forEach((item) => {
        tableObject.params[item.key] = item.value
      })
    }
    tableObjectRef.value = tableObject
    tableMethodsRef.value = tableMethods
    const { getList } = tableMethods
    getList()
  }
)

function getDefaultParams() {
  if (props.defaultParams !== undefined && Object.keys(props.defaultParams).length !== 0) {
    return props.defaultParams
  } else {
    return {}
  }
}

function getDialogParams(row: any) {
  return {
    number: row.number
  }
}

const openDialog = async(row: any, titleName: any, titleValue: any) => {
  const { tableObject, tableMethods } = useTable({
    getListApi: props.dialogApiPage, // 分页接口
    defaultParams: getDialogParams(row)
  })
  dialogVisible.value = true
  dialogTitle.value = props.tabName
  dialogAllSchemasRef.value = props.dialogAllSchemas
  dialogTableObjectRef.value = tableObject
  dialogTableMethodsRef.value = tableMethods
  dialogTableObjectRef.value.tableList = []
  const { getList } = tableMethods
  await getList()
  updateKey.value += 1
  // getList() // 刷新当前列
  setBeiJian()
}

// 设置备件回显
const setBeiJian = () => {
  let isItemNUmbersTrue = false
  isItemNUmbersTrue = dialogAllSchemasRef.value.tableColumns.some(
    (item) => item.field == 'itemNumbers1'
  )
  if (!isItemNUmbersTrue) return
  dialogTableObjectRef.value.tableList.forEach((item) => {
    if (item.itemNumbers?.length > 0) {
      let str = ''
      item.itemNumbers.forEach((element) => {
        str += element.name + ':' + element.qty + ','
      })
      item.itemNumbers1 = str.substring(0, str.length - 1)
    }
  })
}

// 列表-操作按钮
const butttondata = [
  defaultButtons.mainListEditBtn(null), // 编辑
  defaultButtons.uploadFileBtn(null),//上传
]

// 列表-操作按钮事件
const buttonMilestoneClick = async (val, row) => {
  if (val == 'edit') {
    // 编辑
    openDialogForm('update', row)
  } else if (val == 'upload') {
    openDialogUpload(row)
  }
}

const submitDialogForm = async (type, row) => {
  await props.diaLogApiUpdate(row)
  dialogFormRef.value.dialogVisible = false
  await getList()
  milestoneUpdateKey.value += 1
}

function openDialogUpload(row) {
  dialogUploadVisible.value = true
  getDialogUpload(row)
}

/** 添加/修改操作 */
const dialogFormRef = ref()
const openDialogForm = async (type: string, row?: number) => {
  dialogFormRef.value.open(type, row)
}

const getDialogUpload = (row) => {
  dialogUploadNumber.value = row.number
  dialogUploadBusiCode.value = row.milestoneStage
  props.getImageApi({
      number: row.number,
      funcCode: props.milestoneFuncCode
    })
    .then((res) => {
      fileDialogUploadData.value.filePathList = res
      dialogFormKey.value += 1
    })
}

function dialogUploadFile() {
  let data = {
    number: dialogUploadNumber.value,
    filePathList: fileDialogUploadData.value.filePathList.map((item) => item.url),
    funcCode: props.milestoneFuncCode,
    fileBusiType: dialogUploadBusiCode.value
  }
  props.uploadImage(data).then((res) => {
    message.success('修改成功')
    getImage()
  })
}

</script>
<style lang="scss">
.el-drawer__body {
  background: #f5f5f5 !important;
}

::v-deep(.label-class-name) {
  color: #dedede;
}
</style>
<style scoped lang="scss"></style>