index.vue 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. <template>
  2. <div class="app-container">
  3. <el-row :gutter="10" class="mb8">
  4. <el-col :span="18">
  5. <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="0">
  6. <el-form-item label="" prop="modelName" style="margin-right:10px">
  7. <el-input
  8. v-model="queryParams.modelName"
  9. placeholder="请输入模型名称"
  10. clearable
  11. @keyup.enter="handleQuery"
  12. />
  13. </el-form-item>
  14. <el-form-item>
  15. <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
  16. <el-button icon="Refresh" @click="resetQuery">重置</el-button>
  17. </el-form-item>
  18. </el-form>
  19. </el-col>
  20. <el-col :span="6" style="text-align: right">
  21. <el-button
  22. type="primary"
  23. plain
  24. icon="Plus"
  25. @click="handleAdd"
  26. v-hasPermi="['hl:bm:add']"
  27. >新增</el-button>
  28. </el-col>
  29. </el-row>
  30. <el-table v-loading="loading" :data="bmList" border>
  31. <el-table-column label="模型ID" align="center" prop="modelId" width="80"/>
  32. <el-table-column label="模型名称" align="left" prop="modelName" />
  33. <el-table-column label="昨日健康度" align="center" prop="yesterdayScore" width="180"/>
  34. <el-table-column label="最近一次健康度得分" align="center" prop="lastScore" width="180"/>
  35. <el-table-column label="更新时间" align="left" prop="updateTime" width="180">
  36. <template #default="scope">
  37. <span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d} {h}:{mi}:{s}') }}</span>
  38. </template>
  39. </el-table-column>
  40. <el-table-column label="操作" width="480" class-name="small-padding fixed-width" align="left" >
  41. <template #default="scope">
  42. <el-button link type="primary" icon="Position" @click="handleHealthSet(scope.row,'health')">健康度配置</el-button>
  43. <el-button link type="primary" icon="Calendar" @click="handleHealthSet(scope.row,'history')">历史健康度</el-button>
  44. <el-button link type="primary" icon="Clock" @click="handleHealthSet(scope.row,'day')">日健康度</el-button>
  45. <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['hl:bm:edit']">修改</el-button>
  46. <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['hl:bm:remove']">删除</el-button>
  47. </template>
  48. </el-table-column>
  49. </el-table>
  50. <pagination
  51. v-show="total>0"
  52. :total="total"
  53. v-model:page="queryParams.pageNum"
  54. v-model:limit="queryParams.pageSize"
  55. @pagination="getList"
  56. />
  57. <!-- 添加或修改业务模型对话框 -->
  58. <el-dialog :title="title" v-model="open" :width="dialogType ==='health'?'1600px':'800px'" append-to-body :style="dialogType ==='health'?'margin-top:2px!important;':''">
  59. <add-bm-info ref="bmRef" @cancel="open = false" @success="getList" v-if="dialogType==='add'"/>
  60. <component :is="activeComponent[currentActive]" v-else-if="dialogType!=='add' && open" :modelId="modelId" :dialogType="dialogType"/>
  61. </el-dialog>
  62. </div>
  63. </template>
  64. <script setup name="Bm">
  65. import { listBm, getBm, delBm, addBm, updateBm } from "@/api/hl/bm";
  66. import addBmInfo from "./component/addBm.vue"
  67. import healthSetting from "./component/healthSetting.vue"
  68. import historyHealth from "./component/historyHealth.vue"
  69. const { proxy } = getCurrentInstance();
  70. const bmList = ref([]);
  71. const open = ref(false);
  72. const loading = ref(true);
  73. const showSearch = ref(true);
  74. const ids = ref([]);
  75. const single = ref(true);
  76. const multiple = ref(true);
  77. const total = ref(0);
  78. const title = ref("");
  79. const dialogType = ref("add")
  80. const modelId = ref(0)
  81. const activeComponent = [healthSetting,historyHealth]
  82. const currentActive=ref(0)
  83. const data = reactive({
  84. form: {},
  85. queryParams: {
  86. pageNum: 1,
  87. pageSize: 10,
  88. modelCode: null,
  89. modelName: null,
  90. modelScore: null,
  91. modelType: null,
  92. createBy: null,
  93. createTime: null,
  94. updateBy: null,
  95. updateTime: null,
  96. remark: null
  97. },
  98. rules: {
  99. }
  100. });
  101. const { queryParams, form, rules } = toRefs(data);
  102. function handleHealthSet(row,type){
  103. modelId.value = row.modelId
  104. currentActive.value = type === "health" ? 0 : 1
  105. dialogType.value = type
  106. open.value = true
  107. title.value = type === "health" ? "健康度配置" :(row.modelName + ((type==="day"?"日":"历史")+"健康度"))
  108. }
  109. /** 查询业务模型列表 */
  110. function getList() {
  111. loading.value = true;
  112. listBm(queryParams.value).then(response => {
  113. bmList.value = response.rows;
  114. total.value = response.total;
  115. loading.value = false;
  116. });
  117. }
  118. // 取消按钮
  119. function cancel() {
  120. open.value = false;
  121. reset();
  122. }
  123. // 表单重置
  124. function reset() {
  125. form.value = {
  126. modelId: null,
  127. modelCode: null,
  128. modelName: null,
  129. modelScore: null,
  130. modelType: null,
  131. createBy: null,
  132. createTime: null,
  133. updateBy: null,
  134. updateTime: null,
  135. remark: null
  136. };
  137. // proxy.resetForm("bmRef");
  138. }
  139. /** 搜索按钮操作 */
  140. function handleQuery() {
  141. queryParams.value.pageNum = 1;
  142. getList();
  143. }
  144. /** 重置按钮操作 */
  145. function resetQuery() {
  146. proxy.resetForm("queryRef");
  147. handleQuery();
  148. }
  149. // 多选框选中数据
  150. function handleSelectionChange(selection) {
  151. ids.value = selection.map(item => item.modelId);
  152. single.value = selection.length != 1;
  153. multiple.value = !selection.length;
  154. }
  155. /** 新增按钮操作 */
  156. function handleAdd() {
  157. reset();
  158. dialogType.value ="add"
  159. open.value = true;
  160. title.value = "添加业务模型";
  161. proxy.$nextTick(() => {
  162. proxy.$refs["bmRef"].editRow(null)
  163. })
  164. }
  165. /** 修改按钮操作 */
  166. function handleUpdate(row) {
  167. dialogType.value ="add"
  168. open.value = true;
  169. title.value = "修改业务模型";
  170. proxy.$nextTick(() => {
  171. proxy.$refs["bmRef"].editRow(row)
  172. })
  173. }
  174. /** 提交按钮 */
  175. function submitForm() {
  176. proxy.$refs["bmRef"].validate(valid => {
  177. if (valid) {
  178. if (form.value.modelId != null) {
  179. updateBm(form.value).then(response => {
  180. proxy.$modal.msgSuccess("修改成功");
  181. open.value = false;
  182. getList();
  183. });
  184. } else {
  185. addBm(form.value).then(response => {
  186. proxy.$modal.msgSuccess("新增成功");
  187. open.value = false;
  188. getList();
  189. });
  190. }
  191. }
  192. });
  193. }
  194. /** 删除按钮操作 */
  195. function handleDelete(row) {
  196. const _modelIds = row.modelId || ids.value;
  197. proxy.$modal.confirm('是否确认删除业务模型编号为"' + _modelIds + '"的数据项?').then(function() {
  198. return delBm(_modelIds);
  199. }).then(() => {
  200. getList();
  201. proxy.$modal.msgSuccess("删除成功");
  202. }).catch(() => {});
  203. }
  204. /** 导出按钮操作 */
  205. function handleExport() {
  206. proxy.download('hl/bm/export', {
  207. ...queryParams.value
  208. }, `bm_${new Date().getTime()}.xlsx`)
  209. }
  210. getList();
  211. </script>