yos_web/src/HDrpManagement/serveWorkBill/index.vue

<template>
  <div>
    <basicLayout 
      ref="list"
      tableName="indexTable" 
      idName="sa_workorderid" 
      :apiId="{query:20230208140203,del:20230209144803}"
      :options="options"
      :detailPath="{
        path:'/workorderDetail'
      }"
      @listData="list"
      @listCreate="listCreate">
      <div slot="custom" style="display:flex">
        <div class="label_center">
          <label  class="search__label">状态:</label>
          <el-select class="inline-24" v-model="where.status" placeholder="请选择状态" @change="selectChange" size="small" clearable>
            <el-option label="待接单" value="待接单"></el-option>
            <el-option label="待开始" value="待开始"></el-option>
            <el-option label="进行中" value="进行中"></el-option>
            <el-option label="暂停" value="暂停"></el-option>
            <el-option label="已完成" value="已完成"></el-option>
          </el-select>
        </div>
        <div class="label_center">
          <label class="search__label" >提交日期:</label>
          <el-date-picker
              style="margin-right: 24px !important;"
              size="small"
              @change="dateChange"
              value-format="yyyy-MM-dd"
              v-model="where.date"
              type="daterange"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              clearable>
          </el-date-picker>
        </div>
      </div>
      <template v-slot:tbList="scope">
        <div v-if="scope.data.column.columnname == 'status'">
          <span style="color:#52c41a" v-if="scope.data.column.data[[scope.data.column.columnname]] == '进行中'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
          <span style="color:#3874f6" v-else-if="scope.data.column.data[[scope.data.column.columnname]] == '待开始'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
          <span style="color:#333333" v-else-if="scope.data.column.data[[scope.data.column.columnname]] == '暂停'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
<!--          <span style="color:#3874f6" v-else-if="scope.data.column.data[[scope.data.column.columnname]] == '提交'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>-->
          <span style="color:#fa8c16" v-else-if="scope.data.column.data[[scope.data.column.columnname]] == '待接单'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
          <span style="color:#fa8c16" v-else-if="scope.data.column.data[[scope.data.column.columnname]] == '已完成'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
          <span v-else>{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
        </div>
        <div v-else-if="scope.data.column.columnname == 'province'">
          {{ `${scope.data.column.data.province}-${scope.data.column.data.city}-${scope.data.column.data.county}` }}
        </div>
        <div v-else>
          {{scope.data.column.data[[scope.data.column.columnname]]?scope.data.column.data[[scope.data.column.columnname]]:'--'}}
        </div>
      </template>
      <template v-slot:tbOpreation="scope">
      </template>
    </basicLayout>
  </div>
</template>

<script>
import { log } from '@antv/g2plot/lib/utils'
export default {
  data () {
    return {
      options:[],
      where: {
        status:'',
        date: ''
      }
      
    }
  },
  methods:{
    list (data) {
      if (!data[0].servicebillno) this.$refs.list.list = []
      
    },
    listCreate (param) {
      param.content.isadmin = true
    },
    selectChange () {
      this.$refs.list.param.content.where = this.where
      this.$refs.list.listData()
    },
    dateChange (date) {
      if (date) {
        this.where.startdate = date[0]
        this.where.enddate = date[1]
      } else {
        this.where.startdate = ''
        this.where.enddate = ''
      }     
      this.$refs.list.param.content.where = this.where
      this.$refs.list.listData()
    }
  }
}

</script>
<style>
</style>