index.vue 9.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345
  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. <el-form-item label="长者姓名">
  12. <el-input
  13. v-model="queryParams.elderName"
  14. placeholder="长者姓名"
  15. class="!w-240px"
  16. clearable
  17. />
  18. </el-form-item>
  19. <el-form-item label="评估人">
  20. <el-input
  21. v-model="queryParams.assessor"
  22. placeholder="长者姓名"
  23. class="!w-240px"
  24. clearable
  25. />
  26. </el-form-item>
  27. <el-form-item label="记录日期">
  28. <el-date-picker
  29. size="default"
  30. ref="selectRef"
  31. class="!w-240px"
  32. v-model="queryParams.assessDate"
  33. type="daterange"
  34. :clearable="true"
  35. :editable="false"
  36. placeholder="选择记录日期"
  37. value-format="YYYY-MM-DD"
  38. format="YYYY-MM-DD"
  39. date-format="YYYY-MM-DD"
  40. />
  41. </el-form-item>
  42. <el-form-item>
  43. <el-button @click="handleQuery" style="margin-left: 2vw"
  44. ><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button
  45. >
  46. <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
  47. </el-form-item>
  48. </el-form>
  49. </ContentWrap>
  50. <!-- 列表 -->
  51. <ContentWrap>
  52. <div class="mb-10px">
  53. <ButtonAdd @click="openForm(undefined)" />
  54. <!-- <el-button @click="inputH" type="success"><Icon icon="fa:cloud-upload" :size="16" class="mr-1"/>导入</el-button>-->
  55. <!-- <ButtonImport @click="handleImportCard" />-->
  56. </div>
  57. <el-table v-loading="loading" :data="list" :header-cell-style="tableHeaderColor">
  58. <el-table-column header-align="center" align="center" label="序号" width="60">
  59. <template #default="scope">
  60. {{
  61. scope.$index + (queryParams.pageNo * queryParams.pageSize - queryParams.pageSize) + 1
  62. }}
  63. </template>
  64. </el-table-column>
  65. <el-table-column
  66. prop="elderName"
  67. header-align="center"
  68. align="center"
  69. label="长者姓名"
  70. min-width="150"
  71. show-overflow-tooltip
  72. />
  73. <el-table-column
  74. prop="bedName"
  75. header-align="center"
  76. align="center"
  77. label="床位号"
  78. min-width="150"
  79. show-overflow-tooltip
  80. />
  81. <el-table-column
  82. prop="assessor"
  83. header-align="center"
  84. align="center"
  85. label="评估人"
  86. min-width="200"
  87. show-overflow-tooltip
  88. />
  89. <el-table-column
  90. prop="assessDate"
  91. header-align="center"
  92. align="center"
  93. label="记录日期"
  94. min-width="200"
  95. show-overflow-tooltip
  96. />
  97. <el-table-column
  98. prop="creator"
  99. header-align="center"
  100. align="center"
  101. label="记录人"
  102. min-width="200"
  103. show-overflow-tooltip
  104. />
  105. <el-table-column label="操作" align="center" width="200">
  106. <template #default="scope">
  107. <el-button link type="primary" @click="openFormEdit(scope.row, scope.row.id)">
  108. 编辑
  109. </el-button>
  110. <el-button link type="warning" @click="openFormDetail(scope.row, scope.row.id)">
  111. 详情
  112. </el-button>
  113. <el-button link type="danger" @click="openClose(scope.row)"> 删除 </el-button>
  114. </template>
  115. </el-table-column>
  116. </el-table>
  117. <!-- 分页 -->
  118. <Pagination
  119. :total="total"
  120. v-model:page="queryParams.pageNo"
  121. v-model:limit="queryParams.pageSize"
  122. @pagination="getList"
  123. />
  124. </ContentWrap>
  125. <AddForm ref="formRef" @success="getList" />
  126. <!-- 通用批量导出弹窗 -->
  127. <BatchExportDialog
  128. :show="showBatchExport"
  129. :title="exportConfig.title"
  130. :loading="exportLoading"
  131. :batch-min="exportConfig.batchMin"
  132. :batch-max="exportConfig.batchMax"
  133. :count-min="exportConfig.countMin"
  134. :count-max="exportConfig.countMax"
  135. :default-batch="exportConfig.defaultBatch"
  136. :default-count="exportConfig.defaultCount"
  137. :description="exportConfig.description"
  138. @update:show="showBatchExport = $event"
  139. @confirm="handleBatchExport"
  140. @cancel="showBatchExport = false"
  141. />
  142. <Import
  143. ref="importRef"
  144. @success="getList"
  145. :config="{
  146. title: '导入',
  147. downloadUrl: 'elderly-service-order/get-import-template',
  148. excelTempName: '居家工单-【导入】模板',
  149. importUrl: '/elderly-service-order/import',
  150. failExportUrl: ''
  151. }"
  152. />
  153. </template>
  154. <script setup lang="ts">
  155. import AddForm from './AddForm.vue'
  156. import ButtonAdd from '@/components/ButtonAdd/src/ButtonAdd.vue'
  157. import ButtonImport from '@/components/ButtonImport/src/ButtonImport.vue'
  158. import { useUserStore } from '@/store/modules/user'
  159. import { formatTimestamp, getCurrentMonthRange } from '@/utils/dateUtil'
  160. import Import from '@/components/ImportFile/index.vue'
  161. import { restraintCreatePage, restraintDelete } from '@/api/elderly/nursing/keep-fit'
  162. import { perceptionDelete, perceptionPage } from '@/api/social-work'
  163. const message = useMessage() // 消息弹窗
  164. const { t } = useI18n() // 国际化
  165. const userStore = useUserStore()
  166. const loading = ref(true) // 列表的加载中
  167. const detailRef = ref()
  168. const importRef = ref()
  169. const total = ref(0) // 列表的总页数
  170. const list = ref([]) // 列表的数据
  171. // 状态管理
  172. const showBatchExport = ref(false)
  173. const exportConfig = ref({
  174. title: '',
  175. batchMin: 1,
  176. batchMax: 999,
  177. countMin: 1,
  178. countMax: 200,
  179. defaultBatch: 1,
  180. defaultCount: 200,
  181. description: [] as string[]
  182. })
  183. const exportLoading = ref(false)
  184. let queryParams = reactive({
  185. pageNo: 1,
  186. pageSize: 10,
  187. elderName: '',
  188. assessor: '',
  189. assessDate: getCurrentMonthRange(),
  190. tenantIds: userStore.orgTenantId
  191. })
  192. const queryFormRef = ref() // 搜索的表单
  193. const inputH = () => {
  194. importRef.value.open(queryParams.tenantIds[0])
  195. }
  196. // 打开导出弹窗
  197. const handleImportCard = async () => {
  198. // showBatchExport.value = true
  199. }
  200. // 处理批量导出
  201. const handleBatchExport = async (batch: number, count: number) => {
  202. exportLoading.value = true
  203. console.log(batch, count)
  204. // try {
  205. // let queryParams = {
  206. // pageNo: batch,
  207. // pageSize: count,
  208. // tenantId: userStore.orgTenantId[0]
  209. // }
  210. // const list = await careRecordsPage(queryParams)
  211. // if (list.length <= 0) {
  212. // message.error('暂无数据可以导出!')
  213. // return
  214. // }
  215. // const headers = [
  216. // { key: 'organizationName', title: '机构名称' },
  217. // { key: 'visitName', title: '姓名' },
  218. // { key: 'visitPhone', title: '手机号' },
  219. // { key: 'visitDate', title: '预约时间' },
  220. // { key: 'accompanyCount', title: '陪同人数' },
  221. // { key: 'reason', title: '理由' }
  222. // ]
  223. // exportWithExpandedObjectArrays(list, headers, `医疗护理记录${formatToDateTime()}.xlsx`, '医疗护理记录')
  224. // } catch (_) {}
  225. }
  226. /** 查询列表 */
  227. const getList = async () => {
  228. loading.value = true
  229. try {
  230. //let queryP = {...queryParams,discoveryTime:queryParams.discoveryTime?[queryParams.discoveryTime[0]+" 00:00:00",queryParams.discoveryTime[1]+" 23:59:59"]:null}
  231. const data = await perceptionPage(queryParams)
  232. list.value = data.list
  233. total.value = data.total
  234. } finally {
  235. loading.value = false
  236. }
  237. }
  238. /** 搜索按钮操作 */
  239. const handleQuery = async () => {
  240. if (!queryFormRef.value) return
  241. const valid = await queryFormRef.value.validate()
  242. if (!valid) return
  243. queryParams.pageNo = 1
  244. await getList()
  245. }
  246. /** 重置按钮操作 */
  247. const resetQuery = () => {
  248. queryParams.elderName = ''
  249. queryParams.assessor = ''
  250. queryParams.tenantIds = userStore.orgTenantId
  251. queryParams.assessDate = getCurrentMonthRange()
  252. queryFormRef.value.resetFields()
  253. handleQuery()
  254. }
  255. /** 添加/修改操作 */
  256. const formRef = ref()
  257. const openForm = (id?: number) => {
  258. if (queryParams.tenantIds.length == 0 || queryParams.tenantIds.length > 1) {
  259. message.error('新增只能选择一个机构')
  260. return
  261. }
  262. formRef.value.open(queryParams.tenantIds[0], id, false)
  263. }
  264. const editRef = ref()
  265. const openFormEdit = (row: any = {}, id?: number) => {
  266. formRef.value.open(row.tenantId, id, false)
  267. }
  268. const openFormDetail = (row: any = {}, id?: number) => {
  269. formRef.value.open(row.tenantId, id, true)
  270. }
  271. const openClose = async (item) => {
  272. try {
  273. console.log('任务ID', item)
  274. const res = await message.confirm('确定要删除吗?', '提示')
  275. if (res == 'confirm') {
  276. // 发起
  277. try {
  278. const res = await perceptionDelete(item.id)
  279. if (res) {
  280. message.success(t('common.updateSuccess'))
  281. }
  282. } catch (err) {}
  283. }
  284. // 刷新列表
  285. await getList()
  286. } catch {}
  287. }
  288. /** 取消按钮操作 */
  289. const cancelDelete = async (id: number) => {
  290. try {
  291. // 取消的二次确认
  292. await message.cancelConfirm()
  293. // 发起取消
  294. // await elderlyBakDel(id)
  295. message.success(t('common.delSuccess'))
  296. // 刷新列表
  297. await getList()
  298. } catch {}
  299. }
  300. const route = useRoute()
  301. /** 初始化 **/
  302. onMounted(() => {
  303. if (route.query && route.query.elderName) {
  304. queryParams.elderName = route.query.elderName as string
  305. }
  306. getList()
  307. })
  308. // 表头格式
  309. const tableHeaderColor = ({ rowIndex }: any) => {
  310. if (rowIndex === 0) {
  311. return {
  312. backgroundColor: '#f8f8f9',
  313. color: '#666666',
  314. fontWeight: 'bold'
  315. }
  316. }
  317. }
  318. </script>
  319. <style scoped lang="scss"></style>