<template>
  <div class="routerWapper enquiryList">
        <div class="portalDetailTitle">
            <span class="title">
                日志详情
            </span>
        <div class="detailOperations">
            <a-button @click="$router.back()"> 返回 </a-button> 
        </div>
    </div>
    <!-- 小区 -->
    <div v-if="$route.name == 'rizhiInfo'" class="layoutMargin layoutPadding"> 
        <div style="font-size:16px;margin-bottom:20px">
            操作说明：{{content.pointName}}
        </div>
      <div class="cardBox"> 
        <a-card title="操作前信息" style="width: 49%;margin-right:1%;margin-bottom:1%;justify-content:flex-end;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
        <a-card title="操作后信息" style="width: 49%;margin-right:1%;margin-bottom:1%;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
      </div>
    </div>
    <!-- 业委会信息 -->
    <div v-if="$route.name == 'rizhiInfo'" class="layoutMargin layoutPadding"> 
        <div style="font-size:16px;margin-bottom:20px">
            操作说明：{{content.pointName}}
        </div>
      <div class="cardBox"> 
        <a-card title="操作前信息" style="width: 49%;margin-right:1%;margin-bottom:1%;justify-content:flex-end;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
        <a-card title="操作后信息" style="width: 49%;margin-right:1%;margin-bottom:1%;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
      </div>
    </div>
    <!-- 物业企业 -->
    <div v-if="$route.name == 'rizhiInfo'" class="layoutMargin layoutPadding"> 
        <div style="font-size:16px;margin-bottom:20px">
            操作说明：{{content.pointName}}
        </div>
      <div class="cardBox"> 
        <a-card title="操作前信息" style="width: 49%;margin-right:1%;margin-bottom:1%;justify-content:flex-end;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
        <a-card title="操作后信息" style="width: 49%;margin-right:1%;margin-bottom:1%;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
      </div>
    </div>
    <!-- 小区管理处 -->
    <div v-if="$route.name == 'rizhiInfo'" class="layoutMargin layoutPadding"> 
        <div style="font-size:16px;margin-bottom:20px">
            操作说明：{{content.pointName}}
        </div>
      <div class="cardBox"> 
        <a-card title="操作前信息" style="width: 49%;margin-right:1%;margin-bottom:1%;justify-content:flex-end;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
        <a-card title="操作后信息" style="width: 49%;margin-right:1%;margin-bottom:1%;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
      </div>
    </div>
    <!-- 小区经理 -->
    <div v-if="$route.name == 'rizhiInfo'" class="layoutMargin layoutPadding"> 
        <div style="font-size:16px;margin-bottom:20px">
            操作说明：{{content.pointName}}
        </div>
      <div class="cardBox"> 
        <a-card title="操作前信息" style="width: 49%;margin-right:1%;margin-bottom:1%;justify-content:flex-end;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
        <a-card title="操作后信息" style="width: 49%;margin-right:1%;margin-bottom:1%;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
      </div>
    </div>
    <!-- 小区居委会信息 -->
    <div v-if="$route.name == 'rizhiInfo'" class="layoutMargin layoutPadding"> 
        <div style="font-size:16px;margin-bottom:20px">
            操作说明：{{content.pointName}}
        </div>
      <div class="cardBox"> 
        <a-card title="操作前信息" style="width: 49%;margin-right:1%;margin-bottom:1%;justify-content:flex-end;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
        <a-card title="操作后信息" style="width: 49%;margin-right:1%;margin-bottom:1%;"> 
          <div class="card-centent">
            <div style="margin-bottom:8px;">
                <a-form class="protalForm">
                    <a-form-item v-for="(item,k) in extList.tbl_community" :key="k" :label="item.keyName" :label-col="{ span: 9 }" :wrapper-col="{ span: 12 }">
                        <a-input v-decorator="[item.keyCode]" disabled="disabled"/>
                    </a-form-item>
                </a-form>
            </div>
          </div>
        </a-card>
      </div>
    </div>
    <RouterWapper v-else></RouterWapper>
  </div>
</template>

<script>
export default {
  name: 'rizhiInfo',
  data() {
    formExt: this.$form.createForm(this)
    return {    
      extList: {
        tbl_community: [],
        tbl_community_amst_office: [],
        tbl_prop_company: [],
        tbl_community_manager: [],
        tbl_industry_council: [],
        tbl_residents_committees: [],
      }, // ext所有列表
      content: {}
    }
  },  
  mounted(){  
    if(this.$route.name == 'rizhiInfo'){ 
      this.getList() 
    }
  },
  methods: { 
    getList(params){  
      this.$ajax.get({
        url: this.$api.GET_RIZHI_INFO.replace('{id}', this.$route.query.id), 
      }).then(res => { 
        if (res.code == '200') {  
          this.content = this.$com.confirm(res, 'data.content', []) 
        } else {
          this.$message.info(res.msg, 10)
        }
        this.$ajax.get({
          url: this.$api.GET_SAFE_EXT.replace('{table}', 'tbl_community').replace('{id}', this.$route.query.id),
        }).then(res => {
          if (res.code == 200) {
            this.extList.tbl_community = this.$com.confirm(res, 'data.content', [])
          }
        })
      })
    },
  },
}
</script>

<style>
.enquiryList .ant-card-head{
  border-bottom: 1px dashed #e8e8e8;
  padding: 0 12px;
}
.enquiryList .ant-card-body{
  padding: 0px;
} 
.enquiryList .card-bottom{
  padding: 8px 0px;
  text-align: center;
  color: #1890ff;
  border-top: 1px solid #e8e8e8;
  cursor: pointer;
}
.enquiryList .card-centent{
  padding: 12px;
}
.enquiryList .cardBox{
  display:flex;
  flex-wrap: wrap;
} 
</style>
