| | |
| | | <template> |
| | | <div class="comprehensive"> |
| | | <div class="top-title"> |
| | | <the-icon-card |
| | | v-for="(item, index) in dataList" |
| | | :key="index" |
| | | :title="item.title" |
| | | :icon="item.icon" |
| | | :unit="item.unit" |
| | | :metering="item.metering" |
| | | :color-bg="item.colorBg" |
| | | ></the-icon-card> |
| | | </div> |
| | | <div class="menus"> |
| | | <the-a-cascader :data="cascaderData" placeholder="请选择" title="区域"></the-a-cascader> |
| | | <div><the-a-search placeholder="请输入" title="搜索"></the-a-search></div> |
| | | <div><the-a-change :data="changeData" default-value="custom"></the-a-change></div> |
| | | <div><a-time-picker type="time-range" style="width: 250px" /></div> |
| | | <div> |
| | | <a-button type="primary"> |
| | | <template #icon> |
| | | <icon-search /> |
| | | </template> |
| | | <template #default>搜索</template> |
| | | </a-button> |
| | | <div> |
| | | <div class="top-title"> |
| | | <the-icon-card |
| | | v-for="(item, index) in dataList" |
| | | :key="index" |
| | | :title="item.title" |
| | | :icon="item.icon" |
| | | :unit="item.unit" |
| | | :metering="item.metering" |
| | | :color-bg="item.colorBg" |
| | | ></the-icon-card> |
| | | </div> |
| | | <div> |
| | | <a-button> |
| | | <template #icon> |
| | | <icon-refresh /> |
| | | </template> |
| | | <template #default>重置</template> |
| | | </a-button> |
| | | <div class="menus"> |
| | | <the-a-cascader :data="cascaderData" placeholder="请选择" title="区域"></the-a-cascader> |
| | | <div><the-a-search placeholder="请输入" title="搜索"></the-a-search></div> |
| | | <div><the-a-change :data="changeData" default-value="custom"></the-a-change></div> |
| | | <div><a-time-picker type="time-range" style="width: 250px" /></div> |
| | | <div> |
| | | <a-button type="primary"> |
| | | <template #icon> |
| | | <icon-search /> |
| | | </template> |
| | | <template #default>搜索</template> |
| | | </a-button> |
| | | </div> |
| | | <div> |
| | | <a-button> |
| | | <template #icon> |
| | | <icon-refresh /> |
| | | </template> |
| | | <template #default>重置</template> |
| | | </a-button> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="main"> |
| | | <!-- <a-scrollbar class="box-scrollbar" style="height: calc(100vh - 300px) overflow: auto"> --> |
| | | <div class="cards"> |
| | | <the-box-card |
| | | v-for="(item, index) in list" |
| | |
| | | ></the-box-card> |
| | | </div> |
| | | <a-pagination :total="50" show-total show-jumper show-page-size style="margin-top: 8px" /> |
| | | <!-- </a-scrollbar> --> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | } |
| | | .top-title { |
| | | display: flex; |
| | | width: 100%; |
| | | } |
| | | .card-box { |
| | | width: 391px; |