epmet-work-pc-chengyang/src/views/modules/visual/command/cpts/qsydw.vue

<template>
  <div class="m-pop">
    <div class="wrap">
      <cpt-card>
        <div class="title">
          <img src="@/assets/img/shuju/title-tip.png" />
          <span>企事业单位巡查详情</span>
        </div>

        <div class="btn-close" @click="handleClose">
          <img src="@/assets/img/shuju/people/close.png" />
        </div>

        <div class="list-wr">
          <div class="list">
            <div class="item">
              <span class="item-field">场所类型：</span>
              <span>{{ eventDetailData.placeTypeName }}</span>
            </div>
            <div class="item">
              <span class="item-field">场所名称：</span>
              <span>{{ eventDetailData.placeOrgName }}</span>
            </div>
            <div class="item">
              <span class="item-field">规模：</span>
              <span>{{ eventDetailData.scaleName }}</span>
            </div>
            <div class="item">
              <span class="item-field">联系电话：</span>
              <span>{{ eventDetailData.mobile }}</span>
            </div>
          </div>
          <div class="list">
            <div class="item">
              <span class="item-field">场所区域：</span>
              <span>{{
                eventDetailData.agencyName + eventDetailData.gridName
              }}</span>
            </div>
            <div class="item">
              <span class="item-field">场所地址：</span>
              <span>{{ eventDetailData.address }}</span>
            </div>
            <div class="item">
              <span class="item-field">负责人：</span>
              <span>{{ eventDetailData.personInCharge }}</span>
            </div>
          </div>
        </div>
        <div class="div_record">
          <record
            :formType="'edit'"
            :source="'visiual'"
            :enterpriseId="enterpriseId"
            :enterpriseInfo="enterpriseInfo"
          ></record>
        </div>
        <div class="div-btn" style="padding-bottom: 10px">
          <el-button size="small" @click="handleClose">关闭</el-button>
        </div>
      </cpt-card>
    </div>
  </div>
</template>

<script>
import cptCard from "@/views/modules/visual/cpts/card";
import { requestPost } from "@/js/dai/request";
import record from "@/views/modules/shequzhili/tuceng/anquan/xuncha/cpts/record";

export default {
  name: "dialogInfo",
  props: {
    enterpriseId: {
      type: String,
      required: "true",
    },
  },

  components: {
    cptCard,
    record,
  },

  data() {
    return {
      loading: false,

      pageType: "dispose",

      eventDetailData: {},
      enterpriseInfo: {},

      // enterpriseId: '',
    };
  },

  async mounted() {
    this.loading = false;

    await this.loadInfo();

    this.loading = true;
  },

  methods: {
    async loadInfo() {
      const url = "/gov/org/enterprise/detail/" + this.enterpriseId;

      // const url = "http://yapi.elinkservice.cn/mock/245/gov/project/icEvent/detail";

      const { data, code, msg } = await requestPost(url);

      if (code === 0) {
        this.eventDetailData = { ...data };
      } else {
        this.$message.error(msg);
      }
    },

    handleClose() {
      this.pageType = "";
      this.$emit("handleClose");
    },
    handleOk() {
      this.pageType = "";

      this.pageNo = 1;
    },

    handleEditSuccess() {
      this.handleClose();
    },
  },
};
</script>

<style
  lang="scss"
  src="@/assets/scss/modules/visual/people.scss"
  scoped
></style>
<style lang="scss" scoped>
@import "@/assets/scss/modules/visual/a_customize.scss";
@import "@/assets/scss/modules/shequzhili/event-info.scss";
@import "@/assets/scss/modules/visual/c/common.scss";

.m-pop {
  color: #fff;
  .wrap {
    .list {
      display: block;
      width: 60%;
      .item {
        display: flex;
        width: 100%;
        box-sizing: border-box;
        margin-top: 0;
        margin-bottom: 15px;
        font-size: 16px;
        cursor: pointer;

        .item-field {
          flex-shrink: 0;
        }

        .item-filed-height {
          line-height: 30px;
        }
      }
      .item-desc {
        font-size: 16px;
        color: #fff;
        margin-bottom: 10px;
        line-height: 24px;
      }
    }
  }
  .list-title {
    width: 100%;
    box-sizing: border-box;
    padding: 20px 0 10px 62px;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
  }
}
.list-wr {
  display: flex;
  padding: 0 32px;
}

.div_btn {
  display: flex;
  justify-content: center;

  .item_btn {
    font-size: 14px;
    padding: 8px 16px;
    cursor: pointer;

    border: 1px dashed #0c81fe;
    border-radius: 6px;
    background-color: #0c81fe;
  }

  .mgl {
    margin-left: 20px;
  }
}

.div_record {
  // padding-bottom: 30px;
}

/deep/ .el-table {
  color: #ffffff;
  border-color: transparent !important;
  border: none !important;

  .el-table__body-wrapper {
    // @include scrollBar;
  }

  th {
    color: rgba(#fff, 0.8) !important;
    background: #082586 !important;
    border-color: transparent !important;
    border: none !important;
  }
  tr {
    background: #021152 !important;
    border-color: transparent !important;
    border: none !important;

    &:hover,
    td {
      background: #021152 !important;
      border-color: transparent !important;
      border: none !important;
    }
    .el-button {
      color: #e4dc00;
    }
  }
}
</style>