选煤厂生产管理平台前端代码
Jay
2024-12-10 58a8ee8eebcf13656445486333d2d3f3e02c938f
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
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
<template>
  <ContentWrap>
    <div class="mod-quality-quick">
      <el-form :inline="true" :model="queryParams">
        <el-form-item>
          <el-date-picker
            v-model="queryParams.ny"
            type="month"
            value-format="yyyy-MM"
            placeholder="年月"/>
        </el-form-item>
        <el-form-item>
          <el-button @click="getDataList()">{{ $t("query") }}</el-button>
        </el-form-item>
        <el-form-item>
          <el-button @click="handleQuery">
            <Icon icon="ep:search" class="mr-5px" />
            查询
          </el-button>
          <el-button type="primary" plain @click="openForm('create')">
            <Icon icon="ep:plus" class="mr-5px" />
            新增
          </el-button>
          <el-button type="warning" plain @click="handleImport">
            <Icon icon="ep:upload" /> 导出
          </el-button>
        </el-form-item>
        <el-form-item>
          <el-button>
            <a
              href="/template/乌达煤炭加工有限公司生产煤样快速检查.xlsx"
              download="乌达煤炭加工有限公司生产煤样快速检查.xlsx"
              >下载模版</a
            >
          </el-button>
        </el-form-item>
        <el-form-item>
          <el-upload
            class="upload-demo"
            :limit="1"
            :file-list="fileList"
            :before-upload="beforeUpload"
            :on-success="uploadModelSuccess"
            :on-error="uploadModelError"
            :action="uploadModelUrl"
          >
            <el-button type="primary">导入</el-button>
          </el-upload>
        </el-form-item>
      </el-form>
      <el-table
        ref="myTable"
        v-loading="dataListLoading"
        :data="dataList"
        border
        height="400"
        highlight-current-row
        @current-change="currentChange"
        @selection-change="dataListSelectionChangeHandle"
        @sort-change="dataListSortChangeHandle"
        style="width: 100%">
        <el-table-column
          prop="lsh"
          label="流水号"
          header-align="center"
          align="center"
          min-width="120"
        />
        <el-table-column
          prop="datetime"
          label="采样时间"
          header-align="center"
          align="center"
          min-width="120"
        />
        <el-table-column
          prop="mz"
          label="煤种"
          header-align="center"
          align="center"
          min-width="120"
        />
        <el-table-column
          :label="$t('handle')"
          fixed="right"
          header-align="center"
          align="center"
          min-width="100"
        >
          <template #default="scope">
            <el-button v-hasPermi="['data:ind-item:update']" link type="primary" @click="openForm('update', scope.row.id)">
              修改
            </el-button>
            <el-button v-hasPermi="['data:ind-item:delete']" link type="danger" @click="handleDelete(scope.row.id)">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <Pagination
        v-model:limit="queryParams.pageSize"
        v-model:page="queryParams.pageNo"
        :total="total"
        @pagination="getList"
      />
    </div>
  </ContentWrap>
  <ContentWrap>
    <QuickItem ref="quickItemRef"/>
  </ContentWrap>
  <QuickForm ref="quickFormRef" />
</template>
 
<script lang="ts" setup>
  import * as AnalysisApi from '@/api/xmcpms/coal-quality/detection/quick/index'
  import QuickForm from './QuickForm.vue'
  import QuickItem from './QuickItem.vue'
  import * as AnalysisFullApi from "@/api/xmcpms/coal-quality/analysis/full";
 
  const message = useMessage() // 消息弹窗
  const { t } = useI18n() // 国际化
  defineOptions({ name: 'Analysis' })
  const loading = ref(true) // 列表的加载中
  const total = ref(0) // 列表的总页数
  const dataList = ref([]) // 字典表格数据
  const queryParams = reactive({
    pageNo: 1,
    pageSize: 10,
    ny: undefined
  })
 
  const queryFormRef = ref() // 搜索的表单
  const exportLoading = ref(false) // 导出的加载中
 
  const getList = async () => {
    loading.value = true
    try {
      const data = await AnalysisFullApi.getAnalysisFullPage(queryParams)
      dataList.value = data.list
      total.value = data.total
    } finally {
      loading.value = false
    }
  }
 
  /** 搜索按钮操作 */
  const handleQuery = () => {
    queryParams.pageNo = 1
    getList()
  }
 
  /** 重置按钮操作 */
  const resetQuery = () => {
    queryFormRef.value.resetFields()
    handleQuery()
  }
 
  const quickItemRef = ref()
  const currentChange = (currentRow) => {
    quickItemRef.value.open(currentRow)
  }
 
  const quickFormRef = ref()
  const openForm = (type: string) => {
    quickFormRef.value.open(type)
  }
 
</script>