liriming
3 天以前 1220f5ca98b10b735a47c37a81fbfc554b01e2fe
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<template>
  <el-drawer
    v-model="drawer"
    size="60%"
    title="历史详情"
    direction="rtl"
    :before-close="handleClose"
  >
    <!-- 搜索工作栏 -->
    <el-form
      class="-mb-15px"
      :model="queryParams"
      ref="queryFormRef"
      :inline="true"
      label-width="68px"
    >
      <el-form-item label="精准误差" prop="inDeviation">
        <el-input
          v-model="queryParams.inDeviation"
          placeholder="请输入精准误差"
          clearable
          class="!w-240px"
        />
      </el-form-item>
      <el-form-item>
        <el-button @click="handleQuery">
          <Icon icon="ep:search" class="mr-5px"/>
          搜索
        </el-button>
        <el-button @click="resetQuery">
          <Icon icon="ep:refresh" class="mr-5px"/>
          重置
        </el-button>
      </el-form-item>
    </el-form>
    <!-- 列表 -->
    <el-table
      v-loading="loading"
      :data="list"
      row-key="id"
    >
      <el-table-column prop="inDeviation" label="精准误差"/>
      <el-table-column prop="inAccuracyRate" label="精准度"/>
      <el-table-column prop="outDeviation" label="不可信误差"/>
      <el-table-column prop="outAccuracyRate" label="不可信率"/>
    </el-table>
    <!-- 分页 -->
    <Pagination
      v-model:limit="queryParams.limit"
      v-model:page="queryParams.page"
      :total="total"
      @pagination="getList"
    />
  </el-drawer>
</template>
<script lang="ts" setup>
import * as MmItemAccuracyHis from '@/api/model/pre/accuracy/his'
 
defineOptions({name: 'ChartParam'})
 
const drawer = ref(false)
const loading = ref(false) // 列表的加载中
const total = ref(0) // 列表的总页数
const list = ref([]) // 字典表格数据
const queryParams = reactive({
  page: 1,
  limit: 10,
  rateId: undefined,
  inDeviation: undefined,
  inAccuracyRate: undefined,
  outDeviation: undefined,
  outAccuracyRate: undefined,
})
const queryFormRef = ref() // 搜索的表单
 
const getList = async () => {
  loading.value = true
  try {
    const data = await MmItemAccuracyHis.getMmItemAccuracyHisPage(queryParams)
    list.value = data.list
    total.value = data.total
  } finally {
    loading.value = false
  }
}
 
/** 打开弹窗 */
const open = async (rateId?: string) => {
  resetForm()
  drawer.value = true
  queryParams.rateId = rateId
  if (rateId) {
    getList()
  }
}
defineExpose({open}) // 提供 open 方法,用于打开弹窗
 
/** 重置表单 */
const resetForm = () => {
  queryParams.rateId = undefined
  queryParams.inDeviation = undefined
  queryParams.inAccuracyRate = undefined
  queryParams.outDeviation = undefined
  queryParams.outAccuracyRate = undefined
 
}
 
/** 搜索按钮操作 */
const handleQuery = () => {
  getList()
}
 
/** 重置按钮操作 */
const resetQuery = () => {
  queryFormRef.value.resetFields()
  handleQuery()
}
 
const handleClose = (done: () => void) => {
  drawer.value = false
}
</script>