选煤厂生产管理平台前端代码
查看 | 历史 | 提交 | 提交对比
Jay
2024-12-10 358c8ecd0642c16980cb8c6d340d4b9c49b7ca33
提交 | 用户 | 时间
58a8ee 1 <template>
J 2   <ContentWrap>
3     <el-row :gutter="10" style="margin-top: 20px">
4       <el-col :span="12">
5         <el-card style="height: 22rem" :body-style="{ height: '100%' }">
6           <b>原煤灰分检测</b>
7           <bar-line :option="coalAdCheck"/>
8         </el-card>
9       </el-col>
10       <el-col :span="12">
11         <el-card style="height: 22rem" :body-style="{ height: '100%' }">
12           <b>原煤水分检测</b>
13           <bar-line :option="coalMtCheck"/>
14         </el-card>
15       </el-col>
16     </el-row>
17     <el-row :gutter="10" style="margin-top: 20px">
18       <el-col :span="12">
19         <el-card style="height: 22rem" :body-style="{ height: '100%' }">
20           <b>原煤硫分检测</b>
21           <bar-line :option="coalStCheck"/>
22         </el-card>
23       </el-col>
24       <el-col :span="12">
25         <el-card style="height: 22rem" :body-style="{ height: '100%' }">
26           <b>原煤发热量检测</b>
27           <bar-line :option="coalCalCheck"/>
28         </el-card>
29       </el-col>
30     </el-row>
31     <el-row :gutter="10" style="margin-top: 20px">
32       <el-card style="height: 40rem; width: 102.5rem" :body-style="{ height: '100%' }">
33         <b>可选性曲线</b>
34         <div class="wash-curves">
35           <div style="width: 100%">
36             <el-table
37               ref="table"
38               v-loading="dataListLoading"
39               :data="dataList"
40               border
41               highlight-current-row
42               style="width: 100%; margin-top: 20px"
43             >
44               <el-table-column prop="code" label="流水号" header-align="center" align="center" width="100"/>{{curves.code }}
45               <el-table-column prop="ny" label="年月" header-align="center" align="center" width="100"/>{{ curves.ny }}
46               <el-table-column prop="scxtName" label="生产系统" header-align="center" align="center"/>{{ curves.scxtName }}
47               <el-table-column prop="mzName" label="煤种" header-align="center" align="center"/>{{ curves.mzName }}
48               <el-table-column prop="syypName" label="实验样品" header-align="center" align="center"/>{{ curves.syypName }}
49               <el-table-column prop="fcfaName" label="浮沉方案" header-align="center" align="center"/>{{ curves.fcfaName }}
50             </el-table>
51             <el-table
52               ref="table"
53               v-loading="dataListLoading"
54               :data="detList"
55               border
56               style="width: 100%; margin-top: 20px"
57             >
58               <el-table-column prop="code" label="流水号" header-align="center" align="center" width="100"/>
59               <el-table-column prop="mdjName" label="密度级" header-align="center" align="center"/>
60               <el-table-column label="综合累计" header-align="center">
61                 <el-table-column prop="zhljcl" label="产率(%)" header-align="center" align="center"/>
62                 <el-table-column prop="zhljhf" label="灰分(%)" header-align="center" align="center"/>
63               </el-table-column>
64               <el-table-column label="浮物累计" header-align="center">
65                 <el-table-column prop="fwljcl" label="产率(%)" header-align="center" align="center"/>
66                 <el-table-column prop="fwljhf" label="灰分(%)" header-align="center" align="center"/>
67               </el-table-column>
68               <el-table-column label="沉物累计" header-align="center">
69                 <el-table-column prop="cwljcl" label="产率(%)" header-align="center" align="center"/>
70                 <el-table-column prop="cwljhf" label="灰分(%)" header-align="center" align="center"/>
71               </el-table-column>
72               <el-table-column prop="md" label="密度" header-align="center" align="center"/>
73               <el-table-column prop="hl" label="±0.1含量" header-align="center" align="center"/>
74               <el-table-column prop="lf" label="硫分(%)" header-align="center" align="center"/>
75             </el-table>
76           </div>
77           <div style="width: 40%; padding-left: 20px; margin-top: 20px">
78             <div
79               id="wash"
80               ref="wash"
81               v-loading="chartLoading"
82               style="width: 500px; height: 500px; text-align: center"
83             ></div>
84           </div>
85         </div>
86       </el-card>
87     </el-row>
88   </ContentWrap>
89 </template>
90
91 <script lang="ts" setup>
92   const curves = reactive({})
93
94 </script>
95
96 <style scoped>
97   .text {
98     margin-top: 10px;
99     font-size: 15px;
100     color: black;
101   }
102
103   .amountText {
104     margin-top: 20px;
105     font-size: 15px;
106     color: black;
107   }
108
109   .item {
110     padding: 10px 0;
111   }
112
113   .box-card-task-statistics {
114     height: 100px;
115     text-align: left;
116   }
117
118   .order-chart {
119     height: 160px;
120   }
121
122   .order-type-chart {
123     height: 300px;
124   }
125
126   .img {
127     height: 60px;
128     width: 60px;
129   }
130
131   .right-table {
132     width: 90px;
133     color: #99a9bf;
134   }
135
136   th,
137   td {
138     padding: 8px;
139     text-align: left;
140   }
141   .wash-curves {
142     /*display: flex;*/
143     flex-direction: row;
144     flex-wrap: wrap;
145     justify-content: center;
146     align-content: center;
147   }
148 </style>