文

chenzeping

2021-03-29 58737013341e2363b39a33fea150f72ebd37cfc1

 src/components/BaseNav/SolidWaste/SolidContent.vue

@@ -1,53 +1,82 @@
<template>
  <div class="solid-content">
    <div class="content-left">
      <span>{{ displayContent.StoragePlaceName }}</span>
    </div>
    <div class="content-right">
      <SolidWasteTable :displayContent="displayContent"></SolidWasteTable>
  <div class="public-bounced" v-show="flag">
    <div class="popup_title">{{ displayContent.Name }}</div>
    <div class="popup_bottom">
      <button @click="closePopup">确定</button>
      <button @click="closePopup">取消</button>
    </div>
  </div>
</template>

<script>

import SolidWasteTable from '@components/BaseNav/SolidWaste/SolidWasteTable'
import '@components/BaseNav/SolidWaste/directive'

export default {
  name: 'SolidContent',
  components: { SolidWasteTable },
  data () {
    return {
      displayContent: []
      displayContent: [],
      flag: false
    }
  },
  methods: {
    setDate (data) {
      // console.log(data)
    setData (data) {
      this.displayContent = data
      this.flag = true
    },
    closePopup () {
      this.flag = false
    }
  }
}
</script>

<style lang="less" scoped>
span {
  font-size: 22px;
  color: red;
<style scoped>
.public-bounced {
  width: 80%;
  z-index: 499;
  position: absolute;
  top: 15%;
  left: 10%;
  background-color: rgba(128, 128, 128, 0.507);
  padding: 1%;
  border-radius: 20px;
  margin: 10% auto;
}

.solid-content {
  width: 100%;
.popup_title {
  text-align: center;
  font-weight: 600;
  font-size: 30px;
}

.popup_center {
  padding: 10%;
  font-size: 20px;
}

.popup_bottom {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

  .content-left {
    width: 35%;
  }
button {
  width: 25%;
  height: 20%;
  padding: 2%;
  border: 1px solid gray;
  border-radius: 10px;
}

  .content-right {
    width: 60%;
  }
button:nth-child(1) {
  background-color: orangered;
  color: white;
  font-size: 20px;
}

button:nth-child(2) {
  background-color: gray;
  color: black;
  font-size: 20px;
}
</style>