<template>
<div>
  <div class="routerWapper AccountManagement" v-if="$route.name == 'rizhi'"> 
    <div class="routerContent layoutMargin layoutPadding"> 
      <!-- 搜索区 -->
      <a-form class="protalForm" :form="searchForm" style="padding: 0px 10px;">
        <a-row type="flex" align="middle" style="margin-bottom:20px;"> 
          <a-col span="12">
					<a-form-item class='formItem' label="日期" :label-col="{span:6}" :wrapper-col="{span:18}">
						<a-range-picker v-decorator="['createTime_btw']" :format="timeFormat"/>
					</a-form-item>
				</a-col>
        </a-row>
        <a-row>
          <a-col span="12" :offset="12" style="display:flex;justify-content:flex-end;">
            <a-button type="primary" ghost @click="resetFrom" style="margin-right:20px;">重置</a-button>
            <a-button type="primary" @click="searchTaskCollectList">搜索</a-button>
          </a-col>
        </a-row>
      </a-form>
      
      <!-- table -->
      <a-table class="elevator-table portalTable" :dataSource="List" :columns="columns" size="small" :pagination="pagination"
         rowKey="id">
        <span  slot="operation" slot-scope="text, record"> 
          <span class="actionBtn"  @click="toNext(record)">查看</span>
        </span>
      </a-table> 
    </div> 
  </div>
  <RouterWapper v-else></RouterWapper>
</div>
</template>

<script>
export default { 
  data(){
    return {
      ids: '',
      info: {},
      timeFormat: 'YYYY-MM-DD',
      searchForm: this.$form.createForm(this), //表单验证
      List: [],
      columns: [
        {
          title: '操作人',
          dataIndex: 'creator',
          key: 'creator',
          width: '100px',
        }, {
          title: '操作时间',
          dataIndex: 'createTime',
          key: 'createTime',
          width: '100px'
        }, {
          title: '操作说明',
          dataIndex: 'pointName',
          key: 'pointName',
          width: '100px'
        },
        {
          title: '操作',
          dataIndex: 'operation',
          key: 'operation',
          width: '120px',
          scopedSlots: {
            customRender: 'operation',
          },
        }
      ],
      pagination: {//分页
        pageNo: 1,
        pageSize: 10,
        total: 10,
        current: 1,
        defaultCurrent: 1,
        showQuickJumper: true,
        onChange: this.pageChange
      },
      targetNum: {}, // 
      selectedRowKeys: [],
      searchParms: {}
    }
  },
  created(){

  },
  mounted(){  
    if(this.$route.name=='rizhi'){ 
      //获取机构列表
      this.getSearchParams()
    }
  },
  computed: {
  },
  methods: {
    /**
     * 返回对应的企业类型
     */
    // getcompanyType(companyType){
    //   for(let i=0;i<this.companyTypeList.length;i++){
    //     if(!!companyType){
    //       if(companyType == this.companyTypeList[i].key){
    //         return this.companyTypeList[i].value
    //       }
    //     }else{
    //       return '暂无'
    //     }
    //   }
    // },
    onSelectChange(selectedRowKeys) { // 被勾选的数据 
      this.selectedRowKeys = selectedRowKeys
    },
    //分页
    pageChange(val) {
      this.pagination.pageNo = val
      this.pagination.current = val
      this.getCompanyList()
    },
    /**
     * 搜索符合条件的任务小区
     */
    getSearchParams(){
      let searchParams = !this.$store.state.listSearchParams?null:this.$store.state.listSearchParams
      if(!!searchParams && !!searchParams.routeName && (this.$route.name == searchParams.routeName)){
        if(!!searchParams.params){  
          this.getCompanyList(searchParams.params)
        }else{
          this.getCompanyList() 
        }
      }else{
        this.getCompanyList() 
      }
    },
    searchTaskCollectList(){
      this.pagination.current = 1
      this.getCompanyList()
    },
    getCompanyList(params){
      if(params && params.hasOwnProperty('streetsId')){ 
        var searchParms=params 
        this.$nextTick(() => {
          this.searchForm.setFieldsValue(params)
        })
      }else{
        var searchParms = {
          'createTime_btw': !!this.searchForm.getFieldValue('createTime_btw') ? [this.$moment(this.searchForm.getFieldValue('createTime_btw')[0]).format('YYYY-MM-DD'), this.$moment(this.searchForm.getFieldValue('createTime_btw')[1]).format('YYYY-MM-DD')].toString(): '',
          pageNo: this.pagination.current,
          pageSize: 10,
        }
      }  

      this.searchParms=searchParms
      this.$ajax.get({
        url: this.$api.GET_RIZHI,
        params: searchParms
      }).then(res => { 
        if (res.code == '200') {  
          this.pagination.pageNo = res.data.totalPages
          this.pagination.current = res.data.page
          this.pagination.pageSize = res.data.pageSize
          this.pagination.total = res.data.totalRows
          this.List = this.$com.confirm(res, 'data.content', [])
          //
          // 存储当前页面列表的搜索信息
          // 
          this.$com.storeSearchParams(
            this.$route.name,
            this.pagination.current,
            searchParms,
          )
        } else {
          this.$message.info(res.msg, 10)
        }
      })
    },
    /**
     * 进入详情页面
     * @param {Object} record 当前操作的整条数据对象信息
     */
    toNext(record){ 
      // 进入详情 
      this.$router.push({
        name: 'rizhiInfo',
        query: {
          id: record.id,
          type: 'view'
        },
      }) 
    },
    /**
     * 清空表单
     */
    resetFrom(){
      this.searchForm.resetFields()
      this.pagination.current = 1
      this.getCompanyList()
    },
  }
}
</script>
<style scoped>
.menu_header{
  color:#1890ff;
  border-bottom:1px solid #1890ff;
  margin-left:16px;
  padding-bottom:5px;
}
.ant-menu.ant-menu-vertical.ant-menu-root.ant-menu-light{
  border-right: none;
  margin-top:8px;
}
.ant-menu.ant-menu-vertical.ant-menu-root.ant-menu-light .ant-menu-item{
  margin:0px;
}
</style>
<style>
.elevator-table thead.ant-table-thead th div {
    text-align: left;
}
.AccountManagement .elevator-table thead.ant-table-thead th div{
    text-align: center;
}
.AccountManagement td{
    text-align: center;
    word-break: break-all;
}
</style>
