翠屏区智慧广电示范区
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

80 lines
1.8 KiB

<template>
<div class="gd-container">
<div class="item" v-for="(item,index) in personList" :key="index">
<img :src="item.image" />
<span>{{ item.name }}</span>
<span>{{ item.post }}</span>
<span>{{ item.phone }}</span>
</div>
</div>
</template>
<script>
export default {
name: "",
components: {},
data() {
return {
areaCode: this.$route.query.areaCode,
personList: []
};
},
watch: {},
created() {},
computed: {},
mounted () {
this.initData()
},
beforeDestroy() {},
computed: {},
watch: {},
methods: {
initData() {
let params = {
areaCode: this.areaCode,
pageNum: 1,
pageSize: 10
};
this.$http.post("/server/queryServerPeopleInfoPage", this.common.request(params)).then(res => {
if (res.data.code == 200) {
this.personList = res.data.data.records
} else {
this.$Message.error("查询失败");
}
});
}
}
};
</script>
<style lang="less" scoped>
.gd-container {
width: 100%;
// height: 100%;
padding: 20px;
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(auto-fill, 333px);
grid-gap: 30px 50px;
.item {
background: url("../../../assets/pbImage/page-item-bg.png") no-repeat;
background-size: 100% 100%;
padding: 10px 0;
display: flex;
flex-direction: column;
align-items: center;
img {
width: 140px;
height: 196px;
}
span {
margin-top: 10px;
font-size: 16px;
color: #ffffff;
}
}
}
</style>