index.vue 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449
  1. <template>
  2. <ContentWrap>
  3. <!-- 保护性约束观察记录表 -->
  4. <el-form
  5. class="-mb-15px"
  6. :model="queryParams"
  7. ref="queryFormRef"
  8. :inline="true"
  9. label-width="110px"
  10. >
  11. <TenantSelect v-model="queryParams.tenantIds" placeholder="请选择机构名称" prop="tenantIds" />
  12. <el-form-item label="长者姓名">
  13. <el-input
  14. v-model="queryParams.elderName"
  15. placeholder="长者姓名"
  16. class="!w-240px"
  17. clearable
  18. />
  19. </el-form-item>
  20. <el-form-item label="风险等级">
  21. <el-select v-model="queryParams.risk" class="!w-240px">
  22. <el-option
  23. v-for="(item, index) in [
  24. { label: '无风险', value: 'none' },
  25. { label: '低风险', value: 'low' },
  26. { label: '中风险', value: 'medium' },
  27. { label: '高风险', value: 'high' }
  28. ]"
  29. :key="index"
  30. placeholder="请选择"
  31. :label="item.label"
  32. :value="item.value"
  33. />
  34. </el-select>
  35. </el-form-item>
  36. <el-form-item label="楼栋">
  37. <el-select
  38. v-model="queryParams.buildId"
  39. placeholder="选择楼栋"
  40. style="width: 180px"
  41. @change="handleBuildChange"
  42. >
  43. <el-option
  44. v-for="(item, index) in buildList"
  45. :key="index"
  46. :label="item.buildName"
  47. :value="item.id"
  48. />
  49. </el-select>
  50. </el-form-item>
  51. <el-form-item label="楼层">
  52. <el-select v-model="queryParams.floorId" placeholder="选择楼层" style="width: 180px">
  53. <el-option
  54. v-for="(item, index) in floorList"
  55. :key="index"
  56. :label="item.floorName"
  57. :value="item.id"
  58. />
  59. </el-select>
  60. </el-form-item>
  61. <el-form-item label="评估人">
  62. <el-input
  63. v-model="queryParams.assessor"
  64. placeholder="长者姓名"
  65. class="!w-240px"
  66. clearable
  67. />
  68. </el-form-item>
  69. <el-form-item label="记录日期">
  70. <el-date-picker
  71. size="default"
  72. ref="selectRef"
  73. class="!w-240px"
  74. v-model="queryParams.assessDate"
  75. type="daterange"
  76. :clearable="true"
  77. :editable="false"
  78. placeholder="选择记录日期"
  79. value-format="YYYY-MM-DD"
  80. format="YYYY-MM-DD"
  81. date-format="YYYY-MM-DD"
  82. />
  83. </el-form-item>
  84. <el-form-item>
  85. <el-button @click="handleQuery" style="margin-left: 2vw"
  86. ><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button
  87. >
  88. <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
  89. </el-form-item>
  90. </el-form>
  91. </ContentWrap>
  92. <!-- 列表 -->
  93. <ContentWrap>
  94. <div class="mb-10px">
  95. <ButtonAdd @click="openForm(undefined)" />
  96. <ButtonImport @click="handleImportCard" />
  97. <!-- <el-button @click="inputH" type="success"><Icon icon="fa:cloud-upload" :size="16" class="mr-1"/>导入</el-button>-->
  98. </div>
  99. <el-table v-loading="loading" :data="list" :header-cell-style="tableHeaderColor">
  100. <el-table-column header-align="center" align="center" label="序号" width="60">
  101. <template #default="scope">
  102. {{
  103. scope.$index + (queryParams.pageNo * queryParams.pageSize - queryParams.pageSize) + 1
  104. }}
  105. </template>
  106. </el-table-column>
  107. <el-table-column
  108. label="机构名称"
  109. v-if="userStore.getUser.id == 1"
  110. type="index"
  111. width="150"
  112. align="center"
  113. >
  114. <template #default="{ row }">
  115. {{ findLabelById(userStore.getOrgTenant.options, row.tenantId) }}
  116. </template>
  117. </el-table-column>
  118. <el-table-column
  119. prop="elderName"
  120. header-align="center"
  121. align="center"
  122. label="长者姓名"
  123. min-width="150"
  124. show-overflow-tooltip
  125. />
  126. <el-table-column
  127. prop="bedName"
  128. header-align="center"
  129. align="center"
  130. label="床位号"
  131. min-width="150"
  132. show-overflow-tooltip
  133. />
  134. <el-table-column
  135. prop="assessor"
  136. header-align="center"
  137. align="center"
  138. label="评估人"
  139. min-width="200"
  140. show-overflow-tooltip
  141. />
  142. <el-table-column
  143. prop="assessDate"
  144. header-align="center"
  145. align="center"
  146. label="记录日期"
  147. min-width="200"
  148. show-overflow-tooltip
  149. />
  150. <el-table-column
  151. header-align="center"
  152. align="center"
  153. label="风险等级"
  154. min-width="200"
  155. show-overflow-tooltip
  156. >
  157. <template #default="scope">
  158. <el-tag
  159. v-if="getRiskLevelInfo(scope.row.assessData).text"
  160. :type="getRiskLevelInfo(scope.row.assessData).type"
  161. >
  162. {{ getRiskLevelInfo(scope.row.assessData).text }}
  163. </el-tag>
  164. </template>
  165. </el-table-column>
  166. <el-table-column
  167. prop="creator"
  168. header-align="center"
  169. align="center"
  170. label="记录人"
  171. min-width="200"
  172. show-overflow-tooltip
  173. />
  174. <el-table-column label="操作" align="center" width="200">
  175. <template #default="scope">
  176. <el-button link type="primary" @click="openFormEdit(scope.row, scope.row.id)">
  177. 编辑
  178. </el-button>
  179. <el-button link type="warning" @click="openFormDetail(scope.row, scope.row.id)">
  180. 详情
  181. </el-button>
  182. <el-button link type="danger" @click="openClose(scope.row)"> 删除 </el-button>
  183. </template>
  184. </el-table-column>
  185. </el-table>
  186. <!-- 分页 -->
  187. <Pagination
  188. :total="total"
  189. v-model:page="queryParams.pageNo"
  190. v-model:limit="queryParams.pageSize"
  191. @pagination="getList"
  192. />
  193. </ContentWrap>
  194. <AddForm ref="formRef" @success="getList" />
  195. <Import
  196. ref="importRef"
  197. @success="getList"
  198. :config="{
  199. title: '导入',
  200. downloadUrl: 'elderly-service-order/get-import-template',
  201. excelTempName: '居家工单-【导入】模板',
  202. importUrl: '/elderly-service-order/import',
  203. failExportUrl: ''
  204. }"
  205. />
  206. </template>
  207. <script setup lang="ts">
  208. import AddForm from './AddForm.vue'
  209. import ButtonAdd from '@/components/ButtonAdd/src/ButtonAdd.vue'
  210. import ButtonImport from '@/components/ButtonImport/src/ButtonImport.vue'
  211. import { useUserStore } from '@/store/modules/user'
  212. import Import from '@/components/ImportFile/index.vue'
  213. import { ngasrDelete, ngasrPage } from '@/api/social-work'
  214. import { exportWithExpandedObjectArrays } from '@/utils/excel-export'
  215. import { getRiskLevelInfo } from '@/utils/risk-assessment'
  216. import { findLabelById } from '@/utils/dict'
  217. import { ref } from 'vue'
  218. import { getBuildList } from '@/api/system/badManage'
  219. const message = useMessage() // 消息弹窗
  220. const { t } = useI18n() // 国际化
  221. const userStore = useUserStore()
  222. const loading = ref(true) // 列表的加载中
  223. const detailRef = ref()
  224. const importRef = ref()
  225. const total = ref(0) // 列表的总页数
  226. const list = ref([]) // 列表的数据
  227. const exportLoading = ref(false)
  228. let queryParams = reactive({
  229. pageNo: 1,
  230. pageSize: 10,
  231. elderName: '',
  232. assessor: '',
  233. risk: '',
  234. // assessDate: getCurrentMonthRange(),
  235. assessDate: [],
  236. tenantIds: userStore.orgTenantId
  237. })
  238. const queryFormRef = ref() // 搜索的表单
  239. // 打开导出弹窗
  240. const handleImportCard = async () => {
  241. exportLoading.value = true
  242. try {
  243. const queryP = {
  244. pageNo: 1,
  245. pageSize: 9999,
  246. elderName: queryParams.elderName,
  247. risk: queryParams.risk,
  248. assessor: queryParams.assessor,
  249. assessDate: queryParams.assessDate,
  250. tenantIds: queryParams.tenantIds
  251. }
  252. const data = await ngasrPage(queryP)
  253. const exportData = data.list || []
  254. if (exportData.length === 0) {
  255. message.warning('暂无数据可导出')
  256. return
  257. }
  258. const processedData = exportData.map((item) => {
  259. const row: any = {
  260. orgName: findLabelById(userStore.getOrgTenant.options, item.tenantId) || '',
  261. elderName: item.elderName || '',
  262. assessor: item.assessor || '',
  263. assessDate: item.assessDate || '',
  264. assessScore: item.assessScore ?? '',
  265. creator: item.creator || ''
  266. }
  267. const riskInfo = getRiskLevelInfo(item.assessData)
  268. row.riskLevelText = riskInfo.text || '-'
  269. return row
  270. })
  271. const headers = [
  272. {
  273. key: 'orgName',
  274. title: '机构名称'
  275. },
  276. {
  277. key: 'elderName',
  278. title: '长者姓名'
  279. },
  280. {
  281. key: 'assessor',
  282. title: '评估人'
  283. },
  284. {
  285. key: 'assessDate',
  286. title: '记录日期'
  287. },
  288. {
  289. key: 'riskLevelText',
  290. title: '风险等级'
  291. },
  292. {
  293. key: 'creator',
  294. title: '记录人'
  295. }
  296. ]
  297. await exportWithExpandedObjectArrays(
  298. processedData,
  299. headers,
  300. `自伤自杀风险评估_${new Date().getTime()}.xlsx`,
  301. '自伤自杀风险评估'
  302. )
  303. message.success('导出成功')
  304. } catch (error) {
  305. console.error('导出失败:', error)
  306. message.error('导出失败,请重试')
  307. } finally {
  308. exportLoading.value = false
  309. }
  310. }
  311. /** 查询列表 */
  312. const getList = async () => {
  313. loading.value = true
  314. try {
  315. //let queryP = {...queryParams,discoveryTime:queryParams.discoveryTime?[queryParams.discoveryTime[0]+" 00:00:00",queryParams.discoveryTime[1]+" 23:59:59"]:null}
  316. const data = await ngasrPage(queryParams)
  317. list.value = data.list
  318. total.value = data.total
  319. } finally {
  320. loading.value = false
  321. }
  322. }
  323. /** 搜索按钮操作 */
  324. const handleQuery = async () => {
  325. if (!queryFormRef.value) return
  326. const valid = await queryFormRef.value.validate()
  327. if (!valid) return
  328. queryParams.pageNo = 1
  329. await getList()
  330. }
  331. /** 重置按钮操作 */
  332. const resetQuery = () => {
  333. queryParams.elderName = ''
  334. queryParams.assessor = ''
  335. queryParams.floorId = ''
  336. queryParams.buildId = ''
  337. queryParams.risk = ''
  338. queryParams.tenantIds = userStore.orgTenantId
  339. // queryParams.assessDate= getCurrentMonthRange()
  340. queryParams.assessDate = []
  341. queryFormRef.value.resetFields()
  342. handleQuery()
  343. }
  344. /** 添加/修改操作 */
  345. const formRef = ref()
  346. const openForm = (id?: number) => {
  347. if (queryParams.tenantIds.length == 0 || queryParams.tenantIds.length > 1) {
  348. message.error('新增只能选择一个机构')
  349. return
  350. }
  351. formRef.value.open(queryParams.tenantIds[0], id, false)
  352. }
  353. const editRef = ref()
  354. const openFormEdit = (row: any = {}, id?: number) => {
  355. formRef.value.open(row.tenantId, id, false)
  356. }
  357. const openFormDetail = (row: any = {}, id?: number) => {
  358. formRef.value.open(row.tenantId, id, true)
  359. }
  360. const openClose = async (item) => {
  361. try {
  362. console.log('任务ID', item)
  363. const res = await message.confirm('确定要删除吗?', '提示')
  364. if (res == 'confirm') {
  365. // 发起
  366. try {
  367. const res = await ngasrDelete(item.id)
  368. if (res) {
  369. message.success(t('common.updateSuccess'))
  370. }
  371. } catch (err) {}
  372. }
  373. // 刷新列表
  374. await getList()
  375. } catch {}
  376. }
  377. /** 取消按钮操作 */
  378. const cancelDelete = async (id: number) => {
  379. try {
  380. // 取消的二次确认
  381. await message.cancelConfirm()
  382. // 发起取消
  383. // await elderlyBakDel(id)
  384. message.success(t('common.delSuccess'))
  385. // 刷新列表
  386. await getList()
  387. } catch {}
  388. }
  389. const floorList = ref([])
  390. const buildList = ref([])
  391. const handleBuildChange = (buildId: any) => {
  392. const selectedBuild = buildList.value.find((item: any) => item.id === buildId)
  393. if (selectedBuild) {
  394. floorList.value = selectedBuild.floorList || []
  395. }
  396. }
  397. const route = useRoute()
  398. /** 初始化 **/
  399. onMounted(async () => {
  400. if (route.query && route.query.elderName) {
  401. queryParams.elderName = route.query.elderName as string
  402. }
  403. await getList()
  404. try {
  405. buildList.value = await getBuildList({ tenantIds: queryParams.tenantIds[0] })
  406. } catch (e) {}
  407. })
  408. // 表头格式
  409. const tableHeaderColor = ({ rowIndex }: any) => {
  410. if (rowIndex === 0) {
  411. return {
  412. backgroundColor: '#f8f8f9',
  413. color: '#666666',
  414. fontWeight: 'bold'
  415. }
  416. }
  417. }
  418. </script>
  419. <style scoped lang="scss"></style>