|
|
@@ -0,0 +1,91 @@
|
|
|
+<template>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="4">
|
|
|
+ <div class="region">
|
|
|
+ <div class="regionTitle">
|
|
|
+ <div class="regionTitle-text">
|
|
|
+ <el-text style="font-weight: 550">停车区域</el-text>
|
|
|
+ </div>
|
|
|
+ <div class="regionTitle-icon">
|
|
|
+ <el-icon size="large" color="#008000">
|
|
|
+ <Plus/>
|
|
|
+ </el-icon>
|
|
|
+ <el-icon style="padding-left: 5px" size="large" color="#4682b4">
|
|
|
+ <Refresh/>
|
|
|
+ </el-icon>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="19" style="margin-left: 40px">
|
|
|
+ <div class="basicInformation">
|
|
|
+ <div style="padding-top: 10px;margin-left: 30px">
|
|
|
+ <el-image :src="sign" />
|
|
|
+ </div>
|
|
|
+ <div style="display: flex;align-items: center">
|
|
|
+ <el-text
|
|
|
+ style="margin-left: 10px"
|
|
|
+ size="large"
|
|
|
+ tag="b"
|
|
|
+ >项目基本信息</el-text>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="operation">
|
|
|
+ <el-button icon="Plus" text type="success">新增</el-button>
|
|
|
+ <el-button icon="edit" text type="warning">编辑</el-button>
|
|
|
+ <el-button icon="delete" text type="danger">删除</el-button>
|
|
|
+ <el-button icon="Refresh" text type="primary">刷新</el-button>
|
|
|
+ </div>
|
|
|
+ <el-table size="small">
|
|
|
+ <el-table-column label="编码"></el-table-column>
|
|
|
+ <el-table-column label="名称"></el-table-column>
|
|
|
+ <el-table-column label="IP地址"></el-table-column>
|
|
|
+ <el-table-column label="备注"></el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import sign from '@/assets/sign.png'
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.region {
|
|
|
+ width: 100%;
|
|
|
+ height: 700px;
|
|
|
+ background-color: #f5f5f5;
|
|
|
+ .regionTitle{
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ border-bottom: 1px solid;
|
|
|
+ background-color: #b9b8b8;
|
|
|
+ .regionTitle-text {
|
|
|
+ width: 70%;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-left: 10px;
|
|
|
+ }
|
|
|
+ .regionTitle-icon {
|
|
|
+ width: 20%;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.basicInformation {
|
|
|
+ height: 40px;
|
|
|
+ background-color: #f8fafd;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.operation {
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ margin-top: 5px;
|
|
|
+}
|
|
|
+</style>
|