dengzedong
2024-11-12 d8e4bea595e2aac3a1ea1bf7750ee7846f545f51
提交 | 用户 | 时间
7462da 1 <template>
L 2   <!-- 搜索 -->
3   <ContentWrap>
4     <el-form
5       class="-mb-15px"
6       :model="queryParams"
7       ref="queryFormRef"
8       :inline="true"
9       label-width="68px"
10     >
6e7f22 11       <el-form-item label="编号" prop="itemno">
7462da 12         <el-input
6e7f22 13           v-model="queryParams.itemno"
14           placeholder="请输入编号"
15           clearable
16           @keyup.enter="handleQuery"
17           class="!w-240px"
18         />
19       </el-form-item>
20       <el-form-item label="预测项名" prop="itemname">
21         <el-input
22           v-model="queryParams.itemname"
23           placeholder="请输入预测项名"
7462da 24           clearable
L 25           @keyup.enter="handleQuery"
26           class="!w-240px"
27         />
28       </el-form-item>
29       <el-form-item>
30         <el-button @click="handleQuery">
6e7f22 31           <Icon icon="ep:search" class="mr-5px"/>
7462da 32           搜索
L 33         </el-button>
34         <el-button @click="resetQuery">
6e7f22 35           <Icon icon="ep:refresh" class="mr-5px"/>
7462da 36           重置
L 37         </el-button>
38         <el-button
39           type="primary"
40           plain
41           @click="openForm('create')"
cd9f11 42           v-hasPermi="['model:pre-item:create']"
7462da 43         >
6e7f22 44           <Icon icon="ep:plus" class="mr-5px"/>
7462da 45           新增
L 46         </el-button>
47       </el-form-item>
48     </el-form>
49   </ContentWrap>
50
51   <!-- 列表 -->
52   <ContentWrap>
53     <el-table v-loading="loading" :data="list">
e7b6da 54       <el-table-column label="编号" align="center" min-width="150" prop="itemno"/>
d3ee81 55       <el-table-column label="预测项名" header-align="center" align="left" min-width="200" prop="itemname"/>
d8e4be 56       <el-table-column label="类型名称" align="center" min-width="120" prop="itemtypename">
d3ee81 57         <template #default="scope">
58           <el-tag v-if="scope.row.itemtypename === 'NormalItem'" size="small" type="success">{{scope.row.itemtypename}}</el-tag>
59           <el-tag v-else size="small" type="primary">{{scope.row.itemtypename}}</el-tag>
60         </template>
61       </el-table-column>
62       <el-table-column label="预测长度" align="center" prop="predictlength"/>
63       <el-table-column label="粒度" align="center" prop="granularity">
64         <template #default="scope">
e7b6da 65           <dict-tag :type="DICT_TYPE.PRED_GRANULARITY" :value="scope.row.granularity" />
d3ee81 66         </template>
67       </el-table-column>
68       <el-table-column label="是否融合" align="center" prop="isfuse">
69         <template #default="scope">
70           <dict-tag :type="DICT_TYPE.COM_IS_INT" :value="scope.row.isfuse" />
71         </template>
72       </el-table-column>
73       <el-table-column label="是否检查" align="center" prop="workchecked">
74         <template #default="scope">
75           <dict-tag :type="DICT_TYPE.COM_IS_INT" :value="scope.row.workchecked" />
76         </template>
77       </el-table-column>
78       <el-table-column label="是否启用" align="center" prop="status">
79         <template #default="scope">
80           <dict-tag :type="DICT_TYPE.COM_IS_INT" :value="scope.row.status" />
81         </template>
82       </el-table-column>
d8e4be 83       <el-table-column label="运行时间" min-width="150" align="center" prop="lastTime"/>
7b1ce6 84       <el-table-column label="运行状态" align="center" prop="runStatus">
85         <template #default="scope">
86           <dict-tag :type="DICT_TYPE.ITEM_RUN_STATUS" :value="scope.row.runStatus" />
87         </template>
88       </el-table-column>
89       <el-table-column label="运行耗时(s)" align="center" prop="duration"/>
e7b6da 90       <el-table-column label="操作" align="center" min-width="120" fixed="right">
7462da 91         <template #default="scope">
L 92           <el-button
93             link
94             type="primary"
e7b6da 95             size="mini"
6e7f22 96             @click="openForm('update', scope.row.id, scope.row.itemtypename)"
cd9f11 97             v-hasPermi="['model:pre-item:update']"
7462da 98           >
L 99             编辑
100           </el-button>
e7b6da 101           <el-button link size="mini" type="primary" @click="chartHandle(scope.row)">数据</el-button>
7462da 102           <el-button
L 103             link
104             type="danger"
e7b6da 105             size="mini"
7462da 106             @click="handleDelete(scope.row.id)"
cd9f11 107             v-hasPermi="['model:pre-item:delete']"
7462da 108           >
L 109             删除
110           </el-button>
111         </template>
112       </el-table-column>
113     </el-table>
114     <!-- 分页 -->
115     <Pagination
116       :total="total"
117       v-model:page="queryParams.pageNo"
118       v-model:limit="queryParams.pageSize"
119       @pagination="getList"
120     />
121   </ContentWrap>
122
123   <!-- 表单弹窗:添加/修改 -->
6e7f22 124   <MmPredictItemForm ref="formRef" @success="getList"/>
7462da 125
e7b6da 126   <!-- 表单弹窗:数据 -->
127   <MmPredictItemChart ref="chartView" @success="getList"/>
128
7462da 129 </template>
L 130 <script lang="ts" setup>
6e7f22 131 import MmPredictItemForm from './MmPredictItemForm.vue'
e7b6da 132 import MmPredictItemChart from './MmPredictItemChart.vue'
7b1ce6 133 import * as MmPredictItem from '@/api/model/pre/item'
d3ee81 134 import {DICT_TYPE} from "@/utils/dict";
7462da 135
6e7f22 136 defineOptions({name: 'DataMmPredictItem'})
7462da 137
6e7f22 138 const message = useMessage() // 消息弹窗
139 const {t} = useI18n() // 国际化
7462da 140
6e7f22 141 const loading = ref(true) // 列表的加载中
142 const total = ref(0) // 列表的总页数
143 const list = ref([]) // 列表的数据
144 const queryParams = reactive({
145   pageNo: 1,
146   pageSize: 10,
147   itemno: undefined,
148   itemname: undefined,
149 })
150 const isList = ref([
151   {
152     code: 0,
153     name: '否'
154   },
155   {
156     code: 1,
157     name: '是'
158   }])
159 const queryFormRef = ref() // 搜索的表单
160 const exportLoading = ref(false) // 导出的加载中
7462da 161
6e7f22 162 /** 查询列表 */
163 const getList = async () => {
164   loading.value = true
165   try {
166     const page = await MmPredictItem.getMmPredictItemPage(queryParams)
167     list.value = page.list
168     total.value = page.total
169   } finally {
170     loading.value = false
7462da 171   }
6e7f22 172 }
7462da 173
6e7f22 174 /** 搜索按钮操作 */
175 const handleQuery = () => {
176   queryParams.pageNo = 1
177   getList()
178 }
7462da 179
6e7f22 180 /** 重置按钮操作 */
181 const resetQuery = () => {
182   queryFormRef.value.resetFields()
183   handleQuery()
184 }
7462da 185
e7b6da 186 /** 查看数据操作 */
187 const chartView  = ref()
188 const chartHandle = (raw: object) => {
189   chartView.value.open(raw)
190 }
191
6e7f22 192 /** 添加/修改操作 */
193 const formRef = ref()
194 const openForm = (type: string, id?: number, itemtypename?: string) => {
195   formRef.value.open(type, id, itemtypename)
196 }
7462da 197
6e7f22 198 /** 删除按钮操作 */
199 const handleDelete = async (id: number) => {
200   try {
201     // 删除的二次确认
202     await message.delConfirm()
203     // 发起删除
204     await MmPredictItem.deleteMmPredictItem(id)
205     message.success(t('common.delSuccess'))
206     // 刷新列表
7462da 207     await getList()
6e7f22 208   } catch {
209   }
210 }
211
212 /** 初始化 **/
213 onMounted(async () => {
214   await getList()
215 })
7462da 216 </script>