index.vue 8.9 KB

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