elizebeth/src/xt_pages/supply/goodOrderQuery.vue

<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs="crumbs"></bread-crumb>
    </div>
    <div class="app-container ">
      <div style="justify-content: space-between;margin: 0px 0 12px 0;display: flex;align-items: center;">
        <div>
        
          <el-date-picker
            size="small"
            v-model="start_time"
            prefix-icon="el-icon-date"
            :editable="false"
            style="width: 196px;"
            type="date"
            placeholder="选择日期时间"
            align="right"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            @change="startTimeChange"
           ></el-date-picker>-
            <el-date-picker
              size="small"
              v-model="end_time"
              prefix-icon="el-icon-date"
              :editable="false"
              style="width: 196px;"
              type="date"
              placeholder="选择日期时间"
              align="right"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              @change="endTimeChange"
          ></el-date-picker>
          <span>审核状态:</span>
           <el-select v-model="check_id" style="width:140px;margin-right:10px;" placeholder="请选择"
            @change="changeTypeName">
            <el-option
                v-for="item in checkList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
          <el-input
            size="small"
            style="width: 200px;margin-left:10px;"
            class="filter-item"
            v-model.trim="keywords"
            placeholder="订单编号或供应商名称"
          />
          <el-button
            size="small"
            class="filter-item"
            type="primary"
            icon="el-icon-search"
            @click="search"
            >搜索</el-button
          >
        </div>
        <div>
          <el-button size="small" type="primary" @click="toAdd">新增</el-button>
        </div>
      </div>


       <el-table
        :row-style="{ color: '#303133' }"
        :header-cell-style="{
          backgroundColor: 'rgb(245, 247, 250)',
          color: '#606266'
        }"
        :data="tableList"
        :class="signAndWeighBoxPatients"
        border
      >
        <el-table-column label="单据日期" align="center">
          <template slot-scope="scope">
            <span>{{getTimes(scope.row.document_date)}}</span>
         </template>
        </el-table-column>
        <el-table-column label="单据编号" align="center">
          <template slot-scope="scope">
            <span>{{scope.row.number}}</span>
          </template>
        </el-table-column>
        <el-table-column label="供应商" align="center">
            <template slot-scope="scope">
              <span>{{getName(scope.row.supplier_id)}}</span>
            </template>
         </el-table-column>
        <el-table-column label="关联购货订单号" align="center" width="200">
          <template slot-scope="scope">
            
          </template>
        </el-table-column>
        <el-table-column label="购货金额" align="center">
          <template slot-scope="scope">
             <span v-if="getAllBuyPrice(scope.row.orderInfo)>0">{{getAllBuyPrice(scope.row.orderInfo)}}</span> 
          </template>
        </el-table-column>
        <el-table-column label="优惠后金额" align="center">
         <template slot-scope="scope">
           {{getAllCount(scope.row.orderInfo)}}
         </template>
       </el-table-column>
        <el-table-column label="已付款" align="center">
         <template slot-scope="scope">
           {{getAllCount(scope.row.orderInfo)}}
         </template>
       </el-table-column>
       <el-table-column label="数量" align="center">
         <template slot-scope="scope">
           {{getAllCount(scope.row.orderInfo)}}
         </template>
       </el-table-column>

       <el-table-column label="订单状态" align="center">
         <template slot-scope="scope">
           <span v-if="scope.row.is_check == 2">未审核</span>
           <span v-if="scope.row.is_check == 1">已审核</span>
         </template>
       </el-table-column>
      
          
      <el-table-column label="制单人" align="center">
         <template slot-scope="scope">
          {{getDocName(scope.row.creater)}}
         </template>
       </el-table-column>

      <el-table-column label="审核人" align="center">
         <template slot-scope="scope">
          {{getDocName(scope.row.checker)}}
         </template>
       </el-table-column>

       <el-table-column label="操作" align="center" width="260px">
          <template slot-scope="scope">
              <el-button
                icon="el-icon-edit-outline"
                size="small"
                type="primary"
                @click="toClick(scope.row.id)"
              >编辑
              </el-button>
              <el-button
                icon="el-icon-delete"
                size="small"
                type="danger"
                @click="toClickOne(scope.row)"
              >删除
              </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 50, 100,200,500,1000]"
        :page-size="10"
        background
        align="right"
        style="margin-top:20px;"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>

    </div>
  </div>
</template>

<script>
import BreadCrumb from "@/xt_pages/components/bread-crumb";

import {getAllSupply,getAllPurchaseOrderList} from "@/api/supply"
import {uParseTime } from '@/utils/tools'
export default {
  name: "stockIn",
   components: {
     
   },
  components: {
    BreadCrumb
  },
  data() {
    return {
      crumbs: [
        { path: false, name: "采购管理" },
        { path: "/spply/query", name: "购货单" }
      ],
      keywords: "",
      total: 0,
      multipleSelection: [],
      signAndWeighBoxPatients: "sign-and-weigh-box-patients",
      start_time: "",
      end_time:new Date(),
      page: 1,
      limit: 10,
      goodType: [],
      goodInfo: [],
      org_id:0,
      types:[],
      tableList:[],
      type_name:"",
      checkList:[
        {id:0,name:"请选择"},
        {id:1,name:"已审核"},
        {id:2,name:"未审核"},
      ],
      supplyList:[],
      check_id:0,
      doctorList:[],
    };
  },
  methods:{
     toAdd(){
       this.$router.push({path:"/purchase/order/add"})
     },
     changeTypeName(){

     },
     startTimeChange(){

     },
     endTimeChange(){

     },
     search(){

     },
     handleSizeChange(val){
       this.limit = val
       this.getlist()
     },
     handleCurrentChange(val){
       this.page = val
       this.getlist()
     },
     getAllSupply(){
       getAllSupply().then(response=>{
         if(response.data.state == 1){
            var supplyList = response.data.data.supplyList
            this.doctorList = response.data.data.doctorList
            for(let i=0;i<supplyList.length;i++){
              this.supplyList.push(supplyList[i])
            }
         }
       })
     },
     changeTypeName(){

     },
     getTimes(time) {
      if (time === '') {
      return ''
      }
      return uParseTime(time, '{y}-{m}-{d}')
     },
     getlist(){
        var params = {
          check_id:this.check_id,
          start_time:this.getTimes(this.start_time),
          end_time:this.getTimes(this.end_time),
          keyword:this.keywords,
          page:this.page,
          limit:this.limit,
        }
       getAllPurchaseOrderList(params).then(response=>{
          if(response.data.state == 1){
            var list = response.data.data.list 
            console.log("list2332232323232",list)
            this.tableList = list
            var total = response.data.data.total
            this.total = total
          }
       })
     },
     getName(id){
       var name = ""
       for(let i=0;i<this.supplyList.length;i++){
         if(id == this.supplyList[i].id){
           name = this.supplyList[i].supplier_name
         }
       }
       return name
     },
     getDocName(id){
      var user_name = ""
      for(let i=0;i<this.doctorList.length;i++){
        if(id == this.doctorList[i].admin_user_id){
          user_name = this.doctorList[i].user_name
        }
      }
      return user_name
     },
     getAllBuyPrice(arr){
       var buy_price = 0
       if(arr!=undefined && arr.length > 0){
          for(let i=0;i<arr.length;i++){
            buy_price += (arr[i].count * arr[i].price)
          }
       }
       return buy_price.toFixed(2)
     },
     getAllCount(arr){
       var count = ""
        if(arr!=undefined && arr.length > 0){
          for(let i=0;i<arr.length;i++){
            count += arr[i].count
          }
       }
       return count
     },
     toClick(id){
       this.$router.push({path:"/purchase/order/edit?id="+id})
     }
  },
  created() {
    var now = new Date(); //当前日期 
    var nowMonth = now.getMonth(); //当前月 
    var nowYear = now.getFullYear(); //当前年 
    //本月的开始时间
    var monthStartDate = new Date(nowYear, nowMonth, 1); 
    this.start_time = monthStartDate
    this.org_id =  this.$store.getters.xt_user.org_id
    this.getAllSupply()
    this.getlist()
  },
 
};
</script>

<style rel="stylesheet/css" lang="scss" scoped>
.information {
  border: 1px #dcdfe6 solid;
  padding: 30px 20px 30px 20px;

  .border {
    border-bottom: 1px #dcdfe6 solid;
    margin: 0px 0 20px 0;
  }
}

.title {
  background: #409eff;
  height: 44px;
  line-height: 44px;
  padding: 0 0 0 10px;
  color: #fff;
  margin: 0 0 10px 0;
}

.edit_separater {
  border-top: 1px solid rgb(233, 233, 233);
  margin-top: 15px;
  margin-bottom: 15px;
}
</style>

<style>
.sign-and-weigh-box .sign-and-weigh-box-patients .cell {
  font-size: 12px;
}

.sign-and-weigh-box .sign-and-weigh-box-patients .current-row > td {
  background: #6fb5fa;
}

.count {
  color: #bd2c00;
}
.el-table td,
.el-table th.is-leaf,
.el-table--border,
.el-table--group {
  border-color: #d0d3da;
}
.el-table--border::after,
.el-table--group::after,
.el-table::before {
  background-color: #d0d3da;
}

</style>