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