yixing_zc_wx/pages/subPackages/companyHouse/companyHouse.vue

<template>
  <div class="companyhouse">
    <div class="searchbox">
      <van-row>
        <van-col :span="22">
          <uni-search-bar
            placeholder="请输入公司名称"
            @confirm="confirm"
            clearButton="none"
            cancelButton="none"
            v-model="search.qymc"
          ></uni-search-bar>
        </van-col>
        <van-col :span="2">
          <img
            @click="jumpAddCompanyPage()"
            src="../../../static/add_company.png"
            style="height: 50rpx; width: 50rpx; margin-top: 25rpx"
            alt=""
          />
        </van-col>
      </van-row>
    </div>
    <van-tabs :active="active" @change="onChange">
      <van-tab title="全部" :name="null"></van-tab>
      <van-tab title="在园" :name="1"></van-tab>
      <van-tab title="挂靠" :name="2"></van-tab>
      <van-tab title="异地生产" :name="3"></van-tab>
      <van-tab title="飞地" :name="4"></van-tab>
    </van-tabs>
    <div style="display: flex; background: white; padding: 0rpx 16rpx">
      <uni-data-checkbox
        v-model="entryArray"
        mode="tag"
        :multiple="true"
        :localdata="dic_SelectList.SETTLE_IN_STATUS"
        selectedTextColor="#1D18BC"
        selectedColor="rgba(29,24,188,0.05);"
        @change="getCompanyList"
      >
      </uni-data-checkbox>
    </div>
    <div class="list">
      <div v-if="companyList.length != 0">
        <div class="list-row" v-for="(item, index) in companyList" :key="index">
          <div class="cell_1 width90">
            <div class="width70 height44rpx mb8rpx float_left">
              <div class="first_title chaochuyincang">{{ item.qymc }}</div>
            </div>
            <div class="width30 height44rpx mb8rpx float_left">
              <div class="roomstatus1 txt_center" style="font-size: 24rpx">
                {{ getDicType(item.settleInType) }}
              </div>
            </div>
            <div class="width100 height40rpx mb8rpx clear_both">
              <div class="second_title width50 height40rpx float_left">
                所属楼盘：{{
                  item.area == null || !item.area ? "未知" : item.area
                }}
              </div>
              <div class="second_title_1 width50 height40rpx float_left">
                注册资本：{{ !item.zczj ? "暂无" : item.zczj + "万" }}
              </div>
            </div>
            <div
              class="width100 height28rpx font24rpx fontcolor251FCA chaochuyincang"
            >
              {{ item.qybq == null || !item.qybq ? "暂无标签" : item.qybq }}
            </div>
          </div>
          <div class="cell_3 width10" @click="jumpPage(item.id)">
            <img src="../../../static/mine/youjiantou.png" alt="" />
          </div>
        </div>
      </div>
      <div v-else>
        <van-empty
          class="disblock marginauto"
          style="background: white"
          description="暂无数据"
        />
      </div>
    </div>
  </div>
</template>
  
  <script>
import { listVo, getByCodes } from "@/js_sdk/http";
import vanEmpty from "../../../wxcomponents/weapp/dist/empty/index";

export default {
  components: {
    vanEmpty,
  },
  data() {
    return {
      entryArray: [],
      dic_key: ["MNP_BUILDING_TYPE", "SETTLE_IN_STATUS"],
      dic_SelectList: {},
      active: 0,
      form: {
        entryStatus: [],
      },
      statusList: [
        { label: "全部", value: null },
        { label: "在园", value: "1" },
        { label: "挂靠", value: "2" },
        { label: "异地生产", value: "3" },
        { label: "飞地", value: "4" },
      ],
      companyList: [],
      search: {
        pageSize: 10,
        pageNum: 1,
      },
    };
  },
  onShow() {
    this.getByCodes();
    this.getCompanyList();
  },
  methods: {
    async getMoreListData() {
      let that = this;

      that.search.pageNum = that.search.pageNum + 1;
      let list = await listVo(that.search);

      if (list.rows == 0) {
        that.$showToast("没有更多数据了");
      } else {
        list.rows.forEach((e) => {
          that.companyList.push(e);
        });
      }
    },
    onReachBottom() {
      this.getMoreListData();
    }, //下拉执行的时候触发 （下拉刷新）
    onChange(e) {
      this.search.settleInType = e.detail.name == null ? "" : e.detail.name;
      this.getCompanyList();
    },
    getDicType(value) {
      if (this.dic_SelectList.MNP_BUILDING_TYPE) {
        let MNP_BUILDING_TYPE = this.dic_SelectList.MNP_BUILDING_TYPE;
        let index = MNP_BUILDING_TYPE.findIndex((e) => e.value == value);

        if (index != -1) return MNP_BUILDING_TYPE[index].label;
        else return "暂无";
      }
    },
    async getByCodes() {
      this.search.pageNum = 1;
      let data = await getByCodes(JSON.stringify(this.dic_key));
      this.dic_SelectList = this.$common.handleDicList(data);
      this.dic_SelectList.SETTLE_IN_STATUS =
        this.dic_SelectList.SETTLE_IN_STATUS.map((e) => {
          return {
            text: e.label,
            value: e.value,
          };
        });
    },
    async getCompanyList() {
      this.search.entryStatus = this.entryArray.toString();
      this.search.pageSize = 10;
      this.search.pageNum = 1;
      let list = await listVo(this.search);

      this.companyList = list.rows;
    },
    jumpAddCompanyPage() {
      uni.navigateTo({
        url: "/pages/subPackages/addCompany/addCompany",
      });
    },
    blur(e) {},
    focus(e) {
      //   pages / subPackages / merchants / merchants;
    },
    input(e) {},
    cancel(e) {},
    change(e) {},
    clear(e) {},
    confirm(e) {
      this.getCompanyList();
    },
    jumpPage(e) {
      uni.navigateTo({
        url: "/pages/subPackages/companyDetails/companyDetails?id=" + e,
      });
    },
  },
};
</script>
  
  
  <style lang="scss">
.searchbox {
  display: block;
  background: white;
}
.chaochuyincang {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.labelcolmt26 {
  input {
    font-size: 24rpx;
    border-radius: 8rpx 8rpx 8rpx 8rpx;
    border: 2rpx solid #cccccc;
    text-align: center;
  }
  .van-col {
    margin-top: 26rpx !important;
  }

  label {
    color: #333333;
    font-size: 30rpx;
    margin: 0;
    margin-top: 0 !important;
  }

  .uni-data-checklist {
    margin-top: -10rpx !important;
  }
}
</style>