<template> 
 | 
  <div class="main_app"> 
 | 
    <QueryForm v-model="filters" :query-form-config="queryFormConfig" @handleQuery="getList(1)" @clear="clear" /> 
 | 
    <div class="mt20"> 
 | 
      <el-button type="primary" @click="$refs.newInventory.open('新建盘点单')" v-permissions="['business:ywpatrolline:create']">添加</el-button> 
 | 
    </div> 
 | 
    <el-table v-loading="loading" :data="list" stripe> 
 | 
      <el-table-column prop="name" label="盘点单名称" min-width="120" show-overflow-tooltip /> 
 | 
      <el-table-column prop="warehouseName" label="盘点仓库" min-width="100" show-overflow-tooltip /> 
 | 
      <el-table-column prop="userName" label="盘点员" min-width="80" show-overflow-tooltip /> 
 | 
      <el-table-column prop="planDate" label="盘点日期" min-width="110" show-overflow-tooltip /> 
 | 
      <el-table-column prop="createName" label="创建人" min-width="80" show-overflow-tooltip /> 
 | 
      <el-table-column prop="createDate" label="创建时间" min-width="140" show-overflow-tooltip /> 
 | 
      <el-table-column label="盘点状态" min-width="80"> 
 | 
        <template v-slot="{ row }"> 
 | 
          <span v-if="row.status === 0">未开始</span> 
 | 
          <span v-if="row.status === 1">进行中</span> 
 | 
          <span v-if="row.status === 2">已完成</span> 
 | 
          <span v-if="row.status === 3">已取消</span> 
 | 
        </template> 
 | 
      </el-table-column> 
 | 
      <el-table-column prop="workTime" label="操作" min-width="140" show-overflow-tooltip> 
 | 
        <template v-slot="{ row }"> 
 | 
          <el-button type="text" @click="$refs.inventoryDetails.open('盘点详细', row.id)">查看详情</el-button> 
 | 
          <el-button type="text" v-if="[0,1].includes(row.status)" @click="cancel(row.id)">取消</el-button> 
 | 
          <el-button type="text" v-if="[0,3].includes(row.status)" @click="dele(row.id)">删除</el-button> 
 | 
        </template> 
 | 
      </el-table-column> 
 | 
    </el-table> 
 | 
    <div class="mt20"> 
 | 
      <Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" /> 
 | 
    </div> 
 | 
    <NewInventory ref="newInventory" @success="getList" /> 
 | 
    <InventoryDetails ref="inventoryDetails" /> 
 | 
  </div> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import Pagination from '@/components/common/Pagination' 
 | 
import QueryForm from '@/components/common/QueryForm' 
 | 
import NewInventory from './components/newInventory' 
 | 
import InventoryDetails from './components/inventoryDetails' 
 | 
import dayjs from 'dayjs' 
 | 
import duration from 'dayjs/plugin/duration' 
 | 
dayjs.extend(duration) 
 | 
import { fetchList, cancelById, deleteById } from '@/api/ywStocktaking' 
 | 
export default { 
 | 
  components: { 
 | 
    Pagination, 
 | 
    QueryForm, 
 | 
    NewInventory, 
 | 
    InventoryDetails 
 | 
  }, 
 | 
  data() { 
 | 
    return { 
 | 
      loading: false, 
 | 
      pagination: { 
 | 
        pageSize: 10, 
 | 
        page: 1, 
 | 
        total: 0 
 | 
      }, 
 | 
      filters: {}, 
 | 
      list: [], 
 | 
      total: 0, 
 | 
      queryFormConfig: { 
 | 
        formItems: [ 
 | 
          { 
 | 
            filed: 'name', 
 | 
            type: 'input', 
 | 
            label: '盘点单名称', 
 | 
          }, 
 | 
          { 
 | 
            filed: 'status', 
 | 
            type: 'select', 
 | 
            label: '盘点状态', 
 | 
            options: [ 
 | 
              { value: 0, label: '未开始' }, 
 | 
              { value: 1, label: '进行中' }, 
 | 
              { value: 2, label: '已完成' }, 
 | 
              { value: 3, label: '已取消' } 
 | 
            ] 
 | 
          }, 
 | 
        ], 
 | 
        online: true 
 | 
      } 
 | 
    } 
 | 
  }, 
 | 
  created() { 
 | 
    this.getList() 
 | 
  }, 
 | 
  methods: { 
 | 
    getList(page) { 
 | 
      const { pagination, filters } = this 
 | 
      this.loading = true 
 | 
      fetchList({ 
 | 
        model: { 
 | 
          ...filters 
 | 
        }, 
 | 
        capacity: pagination.pageSize, 
 | 
        page: page || pagination.page, 
 | 
      }).then(res => { 
 | 
        this.loading = false 
 | 
        this.list = res.records || [] 
 | 
        this.pagination.total = res.total || 0 
 | 
      }, () => { 
 | 
        this.loading = false 
 | 
      }) 
 | 
    }, 
 | 
    cancel(id) { 
 | 
      this.$confirm('是否确认取消?', '提示', { 
 | 
        confirmButtonText: '确定', 
 | 
        cancelButtonText: '取消', 
 | 
        type: 'warning' 
 | 
      }).then(() => { 
 | 
        cancelById(id) 
 | 
          .then(res => { 
 | 
            this.getList() 
 | 
          }) 
 | 
      }).catch(() => { 
 | 
       
 | 
      }); 
 | 
    }, 
 | 
    dele(id) { 
 | 
      this.$confirm('是否确认删除?', '提示', { 
 | 
        confirmButtonText: '确定', 
 | 
        cancelButtonText: '取消', 
 | 
        type: 'warning' 
 | 
      }).then(() => { 
 | 
        deleteById(id) 
 | 
          .then(res => { 
 | 
            this.getList() 
 | 
          }) 
 | 
      }).catch(() => { 
 | 
       
 | 
      }); 
 | 
    }, 
 | 
    clear() { 
 | 
      this.filters = {} 
 | 
      this.pagination.pageSize = 10 
 | 
      this.pagination.page = 1 
 | 
      this.getList() 
 | 
    }, 
 | 
    handleSizeChange(capacity) { 
 | 
      this.pagination.pageSize = capacity 
 | 
      this.getList() 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</script> 
 | 
  
 | 
<style></style> 
 |