选煤厂生产管理平台前端代码
dongyukun
2024-12-10 17705462e165f823c7f32564369f9dc1c8b01dc6
提交 | 用户 | 时间
58a8ee 1 <template>
J 2   <ContentWrap>
3     <div class="mod-quality-quick">
4       <el-form :inline="true" :model="queryParams">
5         <el-form-item>
6           <el-date-picker
7             v-model="queryParams.ny"
8             type="month"
9             value-format="yyyy-MM"
10             placeholder="年月"/>
11         </el-form-item>
12         <el-form-item>
13           <el-button @click="handleQuery">
14             <Icon icon="ep:search" class="mr-5px" />
15             查询
16           </el-button>
17           <el-button type="primary" plain @click="openForm('create')">
18             <Icon icon="ep:plus" class="mr-5px" />
19             新增
20           </el-button>
21           <el-button type="warning" plain @click="handleImport">
22             <Icon icon="ep:upload" /> 导出
23           </el-button>
24           <el-button>
358c8e 25             <a href="/template/乌达煤炭加工有限公司生产煤样快速检查.xlsx" style="text-decoration:none;color: inherit"
J 26               download="乌达煤炭加工有限公司生产煤样快速检查.xlsx">下载模版</a>
58a8ee 27           </el-button>
J 28         </el-form-item>
29         <el-form-item>
30           <el-upload
31             class="upload-demo"
32             :limit="1"
33             :file-list="fileList"
34             :before-upload="beforeUpload"
35             :on-success="uploadModelSuccess"
36             :on-error="uploadModelError"
37             :action="uploadModelUrl"
358c8e 38           />
58a8ee 39             <el-button type="primary">导入</el-button>
J 40         </el-form-item>
41       </el-form>
42       <el-table
43         ref="myTable"
44         v-loading="dataListLoading"
45         :data="dataList"
46         border
47         height="400"
48         highlight-current-row
49         @current-change="currentChange"
50         @selection-change="dataListSelectionChangeHandle"
51         @sort-change="dataListSortChangeHandle"
52         style="width: 100%">
53         <el-table-column
54           prop="lsh"
55           label="流水号"
56           header-align="center"
57           align="center"
58           min-width="120"
59         />
60         <el-table-column
61           prop="datetime"
62           label="采样时间"
63           header-align="center"
64           align="center"
65           min-width="120"
66         />
67         <el-table-column
68           prop="mz"
69           label="煤种"
70           header-align="center"
71           align="center"
72           min-width="120"
73         />
74         <el-table-column
75           :label="$t('handle')"
76           fixed="right"
77           header-align="center"
78           align="center"
79           min-width="100"
80         >
81           <template #default="scope">
82             <el-button v-hasPermi="['data:ind-item:update']" link type="primary" @click="openForm('update', scope.row.id)">
83               修改
84             </el-button>
85             <el-button v-hasPermi="['data:ind-item:delete']" link type="danger" @click="handleDelete(scope.row.id)">
86               删除
87             </el-button>
88           </template>
89         </el-table-column>
90       </el-table>
91       <Pagination
92         v-model:limit="queryParams.pageSize"
93         v-model:page="queryParams.pageNo"
94         :total="total"
95         @pagination="getList"
96       />
97     </div>
98   </ContentWrap>
99   <ContentWrap>
100     <QuickItem ref="quickItemRef"/>
101   </ContentWrap>
102   <QuickForm ref="quickFormRef" />
103 </template>
104
105 <script lang="ts" setup>
106   import * as AnalysisApi from '@/api/xmcpms/coal-quality/detection/quick/index'
107   import QuickForm from './QuickForm.vue'
108   import QuickItem from './QuickItem.vue'
109   import * as AnalysisFullApi from "@/api/xmcpms/coal-quality/analysis/full";
110
111   const message = useMessage() // 消息弹窗
112   const { t } = useI18n() // 国际化
113   defineOptions({ name: 'Analysis' })
114   const loading = ref(true) // 列表的加载中
115   const total = ref(0) // 列表的总页数
116   const dataList = ref([]) // 字典表格数据
117   const queryParams = reactive({
118     pageNo: 1,
119     pageSize: 10,
120     ny: undefined
121   })
122
123   const queryFormRef = ref() // 搜索的表单
124   const exportLoading = ref(false) // 导出的加载中
125
126   const getList = async () => {
127     loading.value = true
128     try {
129       const data = await AnalysisFullApi.getAnalysisFullPage(queryParams)
130       dataList.value = data.list
131       total.value = data.total
132     } finally {
133       loading.value = false
134     }
135   }
136
137   /** 搜索按钮操作 */
138   const handleQuery = () => {
139     queryParams.pageNo = 1
140     getList()
141   }
142
143   /** 重置按钮操作 */
144   const resetQuery = () => {
145     queryFormRef.value.resetFields()
146     handleQuery()
147   }
148
149   const quickItemRef = ref()
150   const currentChange = (currentRow) => {
151     quickItemRef.value.open(currentRow)
152   }
153
154   const quickFormRef = ref()
155   const openForm = (type: string) => {
156     quickFormRef.value.open(type)
157   }
158
159 </script>