water_affairs/pages/facility/modules/associated.vue

<template>
  <view v-show="show">
    <view v-for="item in list" :key="item.w_device_assetid" class="item">
      <view class="name u-line-1">阀门名称：{{ item.itemname || " --" }}</view>
      <view v-if="item.spec" class="row u-line-1"
        >阀门规格：<text>{{ item.spec || " --" }}</text></view
      >
      <view v-if=" item.brandname" class="row u-line-1"
        >阀门品牌：<text>{{ item.brandname || " --" }}</text></view
      >
      <view v-if="item.valveinstalldate" class="row u-line-1"
        >安装时间：<text>{{ item.valveinstalldate || " --" }}</text></view
      >
      <view v-if="item.serialnumber" class="row u-line-1"
        >阀门编号：<text>{{ item.serialnumber || " --" }}</text></view
      >
      <view v-if="item.valvecheckdate" class="row u-line-1"
        >阀位监测仪安装时间：<text>{{
          item.valvecheckdate || " --"
        }}</text></view
      >
      <!-- <My_Files :attinfos="item.attinfos" /> -->
    </view>
    <view style="height: 20px" />
    <view v-if="empty" style="padding-top: 30px">
      <u-empty mode="data" />
    </view>
  </view>
</template>

<script>
export default {
  name: "associated",
  props: {
    w_deviceid: String,
  },
  data() {
    return {
      show: false,
      uninitialized: true,
      reverlAll: false,
      list: [],
      empty: false,
      content: {
        assettype: "阀门",
        pageNumber: 1,
        pageSize: 20,
        pageTotal: 1,
        where: { condition: "" },
      },
    };
  },
  methods: {
    initialize(init = false) {
      this.uninitialized = false;
      this.getList(init);
    },
    getList(init = false) {
      console.log("3422332");
      let content = this.content;
      if (init) {
        content.pageNumber = 1;
        content.pageTotal = 1;
      }
      if (content.pageNumber > content.pageTotal) return;
      content.w_deviceid = this.w_deviceid;
      this.$Http
        .basic({
          id: 20230802163102,
          content,
        })
        .then((res) => {
          console.log("阀门关联信息", res);
          if (this.cutoff(res.msg)) return;
          this.empty = !res.data.length;
          content.pageNumber = res.pageNumber + 1;
          content.pageTotal = res.pageTotal;
          this.list =
            res.pageNumber == 1 ? res.data : this.list.concat(res.data);
          this.content = content;
        });
    },
  },
};
</script>

<style lang="scss" scoped>
.item {
  position: relative;
  width: 355px;
  background: #ffffff;
  border-radius: 4px;
  margin: 5px auto;
  margin-bottom: 10px;
  padding: 10px;
  box-sizing: border-box;
  overflow: hidden;

  .name {
    width: 300px;
    line-height: 21px;
    font-size: 15px;
    font-family: PingFang SC-Medium, PingFang SC;
    font-weight: bold;
    color: #333333;
    margin-bottom: 10px;
  }

  .row {
    line-height: 17px;
    font-size: 12px;
    color: #666666;
    margin-bottom: 5px;

    text {
      line-height: 17px;
      font-size: 12px;
      color: #0a3971;
    }
  }
}
</style>