tab-reform.vue 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  1. <template>
  2. <hc-new-card>
  3. <template #extra>
  4. <HcNewSwitch :datas="tabData" :keys="tabKey" @change="tabChange" />
  5. </template>
  6. <HcTable ref="tableRef" :column="tableColumn" :datas="tableData" :loading="tableLoading" is-new :index-style="{ width: 60 }">
  7. <template #sourceType="{ row }">
  8. <span class="text-green">{{ row?.sourceType == 0 ? '巡检' : '验收' }}</span>
  9. </template>
  10. <template #fileName="{ row }">
  11. <span class="text-link" @click="tableRowName(row)">{{ row?.fileName }}</span>
  12. </template>
  13. </HcTable>
  14. <template #action>
  15. <HcPages :pages="searchForm" :sizes="[20, 50, 100, 200, 300, 500]" @change="pageChange" />
  16. </template>
  17. </hc-new-card>
  18. </template>
  19. <script setup>
  20. import { nextTick, ref, watch } from 'vue'
  21. import archiveFileApi from '~api/archiveFile/archiveFile'
  22. import earlyApi from '~api/custody/early'
  23. import { getArrValue } from 'js-fast-way'
  24. import { toPdfPage } from '~uti/btn-auth'
  25. //参数
  26. const props = defineProps({
  27. projectId: {
  28. type: [String, Number],
  29. default: '',
  30. },
  31. contractId: {
  32. type: [String, Number],
  33. default: '',
  34. },
  35. treeData: {
  36. type: Object,
  37. default: () => ({}),
  38. },
  39. })
  40. //变量
  41. const projectId = ref(props.projectId)
  42. const contractId = ref(props.contractId)
  43. const nodeData = ref(props.treeData)
  44. //监听
  45. watch(() => [
  46. props.treeData,
  47. ], ([treeData]) => {
  48. nodeData.value = treeData
  49. setQueryData(treeData)
  50. },
  51. {
  52. deep: true,
  53. })
  54. //渲染完成
  55. nextTick(() => {
  56. // setQueryData(props.treeData)
  57. })
  58. //获取相关数据
  59. const setQueryData = (data) => {
  60. searchForm.value.nodeIds = data.id
  61. nodeData.value.id = data.id
  62. getTableData()
  63. /*const cid = data?.contractIdRelation || ''
  64. const wbsId = data['contractIdRelation'] ? data['id'] : data['primaryKeyId']
  65. if (wbsId) {
  66. searchInternalForm.value.contractId = cid ? cid : contractId.value;
  67. searchInternalForm.value.contractIdRelation = data['contractIdRelation']
  68. searchInternalForm.value.wbsIds = [wbsId]
  69. searchInternalClick()
  70. }*/
  71. }
  72. //搜索表单
  73. const searchForm = ref({
  74. current: 1, size: 20, total: 0,
  75. })
  76. //tab数据和相关处理
  77. const tabKey = ref('1')
  78. const tabData = ref([
  79. { key:'1', name: '需要整改的文件' },
  80. { key:'2', name: '已整改记录' },
  81. ])
  82. const tabChange = (item) => {
  83. tabKey.value = item?.key
  84. getTableData()
  85. }
  86. //名称被点击
  87. const tableRowName = (row) => {
  88. if (row['fileUrl']) {
  89. toPdfPage(row['fileUrl'])
  90. } else {
  91. window.$message?.warning('文件不存在')
  92. }
  93. }
  94. //分页被点击
  95. const pageChange = ({ current, size }) => {
  96. searchForm.value.current = current
  97. searchForm.value.size = size
  98. getTableData()
  99. }
  100. //内业台账表头
  101. const tableRef = ref(null)
  102. const tableColumn = ref([
  103. { key:'sourceType', name: '来源', width:150 },
  104. { key:'archiveName', name: '所属案卷' },
  105. { key:'fileName', name: '具体文件' },
  106. { key:'allopinion', name: '问题描述' },
  107. ])
  108. const tableData = ref([])
  109. //获取数据
  110. const tableLoading = ref(false)
  111. const getTableData = async () => {
  112. if (tabKey.value !== '1') {
  113. if (nodeData.value.id) {
  114. tableLoading.value = true
  115. const { error, code, data } = await archiveFileApi.getarchiveFilePage({
  116. ...searchForm.value,
  117. nodeIds: nodeData.value.id,
  118. projectId: projectId.value,
  119. contractId: contractId.value,
  120. rectification:tabKey.value,
  121. })
  122. tableLoading.value = false
  123. if (!error && code === 200) {
  124. tableData.value = getArrValue(data['records'])
  125. searchForm.value.total = data['total'] || 0
  126. } else {
  127. tableData.value = []
  128. searchForm.value.total = 0
  129. }
  130. }
  131. } else {
  132. tableLoading.value = true
  133. const { error, code, data } = await earlyApi.warningPage({
  134. ...searchForm.value,
  135. nodeIds: nodeData.value.id,
  136. projectId: projectId.value,
  137. contractId: contractId.value,
  138. rectification:tabKey.value,
  139. })
  140. tableLoading.value = false
  141. if (!error && code === 200) {
  142. tableData.value = getArrValue(data['records'])
  143. searchForm.value.total = data['total'] || 0
  144. } else {
  145. tableData.value = []
  146. searchForm.value.total = 0
  147. }
  148. }
  149. }
  150. // 暴露出去
  151. defineExpose({
  152. getTableData,
  153. })
  154. </script>