wt_project_web_bak/src/views/dash/compoents/agency.vue

<template>
  <div class="full-width flex flex-col">
    <div class="bold font-16 full-width text-left mb-10">{{ title }}</div>
    <el-empty
      v-if="agencyList && agencyList.length === 0"
      description="暂无数据"
    />
    <div
      v-else
      class="flex flex-center flex-justify-between mt-10 pointer"
      v-for="item in agencyList"
      @click="open(item)"
    >
      <div class="main-color">{{ item.content }}</div>
      <div class="flex flex-center">
        <span class="mr-20 grey-9 font-13">{{ item.createTime }}</span>
        <div v-if="item.isRead === 0" class="no-read"></div>
        <div v-else class="read"></div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'agency',
  props: {
    type: {
      type: Number,
      default: 1
    }
  },
  watch: {
    type: {
      handler(val) {
        if (val === 2) {
          this.title = '内容更新'
        }
      },
      immediate: true
    }
  },
  data() {
    return {
      title: '代办事项',
      params: {
        current: 1,
        size: 10,
        isRead: 0
      },
      agencyList: []
    }
  },
  created() {
    this.getAgencyList()
  },
  methods: {
    getAgencyList() {
      if (this.type === 1) {
        this.$api.dash.agencyList(this.params).then(res => {
          if (res.code === 200) {
            this.agencyList = res.data.records
          } else {
            this.$message.error(res.msg)
          }
        })
      } else {
        this.$api.dash.newInfoList(this.params).then(res => {
          if (res.code === 200) {
            this.agencyList = res.data.records
          } else {
            this.$message.error(res.msg)
          }
        })
      }
    },
    open(item) {
      this.$api.dash.messageDetail({ id: item.id }).then(res => {
        if (res.code === 200) {
          this.$router.push({
            path: item.openUrl
          })
        } else {
          this.$message.error(res.msg)
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.read {
  background: white;
  border-radius: 10px;
  width: 9px;
  height: 9px;
  margin-left: -12px;
}

.no-read {
  background: #b64b33;
  border-radius: 10px;
  width: 9px;
  height: 9px;
  margin-left: -12px;
}
</style>