|
|
@@ -1,5 +1,27 @@
|
|
|
<template>
|
|
|
- <div id="Dashboard"></div>
|
|
|
+ <div id="Dashboard">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" class="main">
|
|
|
+ <el-col :span="24" class="container">
|
|
|
+ <el-col :span="24" class="one">
|
|
|
+ <el-col :span="24" class="top">
|
|
|
+ 代办事项
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="list">
|
|
|
+ <el-col :span="24" class="agencyList" v-for="(item, index) in agencyList" :key="index">
|
|
|
+ <el-col :span="20" class="name textOver">
|
|
|
+ {{ item.name }}
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" class="btn">
|
|
|
+ <el-button type="danger" size="mini">不再提示</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -13,7 +35,9 @@ export default {
|
|
|
props: {},
|
|
|
components: {},
|
|
|
data: function() {
|
|
|
- return {};
|
|
|
+ return {
|
|
|
+ agencyList: [{ name: '你好' }],
|
|
|
+ };
|
|
|
},
|
|
|
created() {},
|
|
|
methods: {},
|
|
|
@@ -23,4 +47,38 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
-<style lang="less" scoped></style>
|
|
|
+<style lang="less" scoped>
|
|
|
+.main {
|
|
|
+ .one {
|
|
|
+ .top {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ }
|
|
|
+ .list {
|
|
|
+ .agencyList {
|
|
|
+ padding: 10px 0;
|
|
|
+ border-top: 1px solid #f1f1f1;
|
|
|
+ border-bottom: 1px solid #f1f1f1;
|
|
|
+ .name {
|
|
|
+ font-size: 16px;
|
|
|
+ padding: 0 10px;
|
|
|
+ }
|
|
|
+ .btn {
|
|
|
+ text-align: right;
|
|
|
+ padding: 0 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .agencyList:hover {
|
|
|
+ cursor: pointer;
|
|
|
+ background-color: #f5f5f5;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.textOver {
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+</style>
|
