|
|
@@ -10,7 +10,15 @@
|
|
|
<el-button type="primary">创建</el-button>
|
|
|
</section>
|
|
|
<section v-if="list" class="list">
|
|
|
- <section class="group-item" v-for="(item, index) of list" :key="index"></section>
|
|
|
+ <section class="group-item" v-for="(item, index) of list" :key="index">
|
|
|
+ <section class="imgs" v-if="item.jobs.length">
|
|
|
+ <template v-for="(job, idx) of item.jobs">
|
|
|
+ <img v-if="idx < 3" class="img" :src="job && job.icon_url" alt="icon_url" :key="idx">
|
|
|
+ </template>
|
|
|
+ </section>
|
|
|
+ <p class="name">{{item.name}}</p>
|
|
|
+ <p class="count">{{item.member_num}}</p>
|
|
|
+ </section>
|
|
|
</section>
|
|
|
</section>
|
|
|
</ws-page>
|
|
|
@@ -83,10 +91,32 @@ export default {
|
|
|
flex-wrap: wrap;
|
|
|
}
|
|
|
.group-item {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
width: 250px;
|
|
|
height: 220px;
|
|
|
border-radius:4px;
|
|
|
border: 1px solid rgba(220, 223, 230, 1);
|
|
|
margin-top: 20px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.imgs {
|
|
|
+ position: relative;
|
|
|
+ height: 60px;
|
|
|
+}
|
|
|
+.img {
|
|
|
+ width: 48px;
|
|
|
+ height: 48px;
|
|
|
+ border-radius: 50%;
|
|
|
+}
|
|
|
+.name {
|
|
|
+ margin: 14px 0 3px;
|
|
|
+}
|
|
|
+.count {
|
|
|
+ color: #999;
|
|
|
}
|
|
|
</style>
|
