<template>
  <div>
    <div class="leader-h1">
      <h1 class="h1">领导信箱</h1>
      <!-- 点击事件返回上一页面 -->
      <div class="leader-h1-img" @click="back">
        <img src="@/views/XiXianZhongXin/assets/返回.png" alt="" />
      </div>
    </div>
    <!-- 循环渲染姓名和留言内容 -->
    <div class="consult">
      <van-cell-group class="consultAll">
        <van-field left-icon="manager-o" value="item.name" readonly />
        <van-field
          rows="4"
          type="textarea"
          left-icon="records"
          value="item.content"
          readonly
        />
      </van-cell-group>
      <div class="consult-img" @click="openDiv">
        <img src="@/views/XiXianZhongXin/assets/展开.png" alt="" />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value: [],
    };
  },
  methods: {
    //返回上一页面
    back() {
      window.history.back();
    },
    //获取领导信箱的姓名和留言内容
    getleaderBox() {
      //   this.$http.post("/api/workbench/leader_mailbox/list").then((res) => {
      //     this.value=res.data.data
      //     console.log(this.value);
      //   });
    },
    openDiv() {
      console.log("ss");
    },
  },

  mounted() {
    this.getleaderBox();
  },
};
</script>

<style>
body {
  background: #3399ff;
}
.h1 {
  text-align: center;
  color: #fff;
  font-weight: 500;
  font-size: 28px;
}
.consult {
  width: 90%;
  margin: 3% auto;
  position: relative;
}
.consult-img {
  position: absolute;
  left: 35%;
  top: 78%;
}
.consult-img > img {
  width: 90px;
  height: 15px;
}
.van-cell {
  border-radius: 10px;
}
.van-cell-group {
  border-radius: 10px;
}
.leader-h1 {
  position: relative;
}
.leader-h1-img {
  position: absolute;
  left: 9%;
  top: 18%;
}
</style>