item-management-web/src/views/personal/pendingList.vue

<template>
  <div class="app-container">
    <div class="title-container">
      <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
    </div>
    <y-page-list-layout :page-list="pageData" :page-para="listQuery" :get-page-list="getPage">
      <template slot="left">
        <el-input style="margin-left: 20px;width: 100px;float: left;" class="filter-item" 
            v-model="listQuery.keyword" placeholder="关键字搜索..." clearable>
        </el-input>
        <el-input v-model="listQuery.name" placeholder="相关人员" clearable
          style="margin-left: 20px;width: 270px;float: left;">
        </el-input>
        <el-select v-model="listQuery.state" placeholder="请选择" clearable filterable
          style="margin-left: 20px;width: 100px;float: left;" class="filter-item">
          <el-option label="线上" value="online" />
          <el-option label="线下" value="outline" />
        </el-select>
        <el-select v-model="listQuery.state" placeholder="请选择" clearable filterable
          style="margin-left: 20px;width: 100px;float: left;" class="filter-item">
          <el-option label="意见书" value="statement" />
          <el-option label="报告" value="report" />
        </el-select>
        <el-button class="filter-item" style="margin-left: 10px;float: left;" type="primary" @click="searchList" round>搜索
        </el-button>
        <el-button class="filter-item" style="float: left;" round type="success" @click="resetSearch()">重置
        </el-button>
      </template>
      <parentTable ref="table" v-loading="listLoading" :data="pageData.records" slot="table" style="width: 100%;">
        <el-table-column label="项目编号" align="center" width="200" >
          <template slot-scope="{row}">
            <span>{{ row.orderId }}</span>
          </template>
        </el-table-column>
        <el-table-column label="坐落" align="center" width="150">
          <template slot-scope="{row}">
            <span>{{ row.location }}</span>
          </template>
        </el-table-column>
        <el-table-column label="当前节点" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.currentNodeName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="处理人" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.handlerName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="面积" align="center" width="130" prop="reportNo">
          <template slot-scope="{row}">
            <span>{{ row.acreage }}</span>
          </template>
        </el-table-column>
        <el-table-column label="单价" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.price }}</span>
          </template>
        </el-table-column>
        <el-table-column label="总价" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.amount }}</span>
          </template>
        </el-table-column>
        <el-table-column label="客户名称" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.clientName==null?'-': row.clientName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="业务来源" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.clientSubName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="中介" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.agent==null?'-': row.agent }}</span>
          </template>
        </el-table-column>
        <el-table-column label="联系人" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.contactName}}</span>
          </template>
        </el-table-column>
        <el-table-column label="联系人电话" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.contactTel }}</span>
          </template>
        </el-table-column>
        <el-table-column label="委托人" align="center">
          <template slot-scope="{row}">
            <span>{{ row.bailorA}}{{ row.bailorB}}</span>
          </template>
        </el-table-column>
        <!-- <el-table-column label="委托人电话" align="center">
          <template slot-scope="{row}">
            <span>{{ row.bailoraTel }} {{ row.bailorbTel }}</span>
          </template>
        </el-table-column> -->
        <el-table-column label="客户经理" align="center">
          <template slot-scope="{row}">
            <span>{{ row.clientManager }}</span>
          </template>
        </el-table-column>
        <el-table-column label="实勘人" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.outwardStaffName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="内业人员" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.inwardStaffName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="定价人员" align="center" width="130">
          <template slot-scope="{row}">
            <span>{{ row.pricingStaffName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="下单时间" align="center" width="100" prop="created" sortable>
          <template slot-scope="{row}">
            {{ row.created }}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="80" fixed="right">
          <template slot-scope="{row}">
            <el-button round type="primary" @click="orderDetail(row)">详情</el-button>
          </template>
        </el-table-column>
      </parentTable>
    </y-page-list-layout>
  </div>
</template>
<script>
import YPageListLayout from '@/components/YPageListLayout'
import Breadcrumb from '@/components/Breadcrumb'
import PermissionButton from '@/components/PermissionButton/PermissionButton'

export default {
  name: 'PersonalPendingList',
  components: {
    Breadcrumb,
    YPageListLayout,
    PermissionButton,
  },

  data() {
    return {
      pageData: { records: [] },
      listLoading: false,
      listQuery: {
        id:null,
        page: 1,
        size: 10,
        current: 1,
        descs: null,
        ascs:null,
        keyword:null,
        startDate:null,
        endDate:null
      },
    }
  },
  created() {
    this.listQuery.id = this.$route.query.id;
    this.getPage();
  },
  methods: {
    getPage() {
      this.$api.personal.list(this.listQuery).then(res=>{
        if (res.code ===200){
            this.pageData = res.data;
        }
      })
    },

    fliterSearch(params){
      this.$api.personal.list(params).then(res=>{
        if (res.code ===200){
            this.pageData = res.data;
        }
      })
    },

    resetParams(){
      this.$router.push({ query: {} });
      this.listQuery = {
          current: 1,
          size: 10,
          descs: 'created',
      }
      this.getPage();
    },
    searchList() {
      // 重置分页
      this.listQuery.page = 1
      this.listQuery.size = 10
      this.getList()
    },

    orderDetail(row){
      this.$router.push(`/personal/readonly/detail?id=${row.id}&currentNodeName=${row.currentNodeName}&orderId=${row.orderId}&back=${'/personal/saveFile'}`)
    },
  },
  
}
</script>
<style lang="scss" scoped>
 
</style>