| | |
| | | <template> |
| | | <div class="home-container"> |
| | | <el-row> |
| | | <el-scrollbar height="100%"> |
| | | <el-row class="homeCard"> |
| | | <!-- <div class="homeCard">--> |
| | | <el-col :span="6"> |
| | | <div class="grid-content topInfo"> |
| | | <div>预约时间:</div> |
| | |
| | | <div><el-button type="primary" @click="dialogChartsVisible = true">查看统计图表</el-button></div> |
| | | </div> |
| | | </el-col> |
| | | <!-- </div>--> |
| | | </el-row> |
| | | <el-row> |
| | | <div class="homeCard"> |
| | | <el-table :data="tableData" border style="width: 100%"> |
| | | <el-table-column prop="id" label="编号" width="180" /> |
| | | <el-table-column prop="time" label="预约时间" width="180" /> |
| | |
| | | <el-table-column prop="high" label="高处" /> |
| | | <el-table-column prop="block" label="盲板抽堵" width="180" /> |
| | | <el-table-column prop="tempUse" label="临时用电" width="180" /> |
| | | <el-table-column fixed label="操作"> |
| | | <el-table-column fixed="right" label="操作"> |
| | | <template #default> |
| | | <el-button link type="primary" size="small">操作</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-row> |
| | | <el-dialog v-model="dialogChartsVisible" title="统计图表"> |
| | | <el-row> |
| | |
| | | v-model="dateRange" |
| | | type="daterange" |
| | | unlink-panels |
| | | range-separator="To" |
| | | range-separator="至" |
| | | start-placeholder="Start date" |
| | | end-placeholder="End date" |
| | | :shortcuts="shortcuts" |
| | |
| | | </el-row> |
| | | <div ref="myChart" style="width: 100%;height:400px;"></div> |
| | | </el-dialog> |
| | | </el-scrollbar> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | <style scoped lang="scss"> |
| | | $homeNavLengh: 8; |
| | | .home-container { |
| | | height: 100%; |
| | | overflow: hidden; |
| | | padding: 20px 40px; |
| | | padding: 20px; |
| | | .el-row{ |
| | | margin-bottom: 20px; |
| | | } |
| | | .el-row:last-child { |
| | | margin-bottom: 0; |
| | | } |
| | | .el-col{ |
| | | .homeCard{ |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | margin: 40px 0; |
| | | padding: 20px; |
| | | background: #fff; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .grid-content{ |
| | | display: flex; |
| | | align-items: center; |