elizebeth/src/xt_pages/stock/query/purchaseNewStockQueryPrint.vue

<template>
    <div class="main-contain">
        <div class="position">
        <bread-crumb :crumbs="crumbs"></bread-crumb>
        <el-row style="float:right;">
            <el-col :span="24">
            <el-button size="small" icon="el-icon-printer" type="primary" @click="printAction">打印</el-button>
            </el-col>
        </el-row>
        </div>
        <div class="app-container" style="background-color: white;" v-loading="loading">
            <div id="print_content">
                <div class="print_main_content">
                    <div class="order_title_panl">
                        <span class="main_title">药品进销存查询表</span>
                    </div>
                    <div style="text-align:left;margin-bottom:20px;font-size: 14px;margin-bottom:-30px">
                      <span class="time_p">查询日期:{{start_time}} ~</span><span class="time_p">{{end_time}}</span> 
                    </div>
                    <div style="text-align:right;margin-bottom:20px;font-size: 14px;">
                      <span class="time_p"> 打印时间：{{time_now}}</span>
                    </div>
                    <div class="table_panel">
                        <table class="table">
                            <thead>
                                <tr>
                                  <td rowspan="2" width="80">序号</td>
                                  <td rowspan="2" width="80">耗材类型</td>
                                  <td rowspan="2" width="80">规格&单位</td>
                                  <td rowspan="2" width="80">生产厂商</td>
                                  <td width="80" colspan="3">期初结余</td>    
                                  <td width="80" colspan="3">本期增加</td>   
                                  <td width="80" colspan="3">本期减少</td>  
                                  <td width="80" colspan="3">期末结余</td>                                             
                                </tr>
                                <tr>
                                  <td>数量</td>   
                                  <td>进货金额</td> 
                                  <td>销售金额</td>   
                                  <td>数量</td>   
                                  <td>进货金额</td> 
                                  <td>销售金额</td> 
                                  <td>数量</td>   
                                  <td>进货金额</td> 
                                  <td>销售金额</td> 
                                  <td>数量</td>   
                                  <td>进货金额</td> 
                                  <td>销售金额</td>    
                                </tr>
                               
                            </thead>
                            <tbody>
                                <tr v-for="(item,index) in this.tableList" :key="index">
                                 <td>{{index + 1}}</td>
                                 <td>{{getGoodTypeName(item.good_type_id)}}</td>
                                 <td>{{item.specification_name}}</td>
                                 <td> {{getManufacturName(item.manufacturer)}}</td>
                                 <td>{{item.stockIn}}</td>   
                                 <td>{{item.stock_in_price}}</td> 
                                 <td>{{item.stockMoney}}</td>   
                                 <td>{{item.stockAdd}}</td>   
                                 <td>{{item.addStockMoney}}</td> 
                                 <td>{{item.saleStockMoney}}</td> 
                                 <td>{{item.outStock}}</td>   
                                 <td>{{item.stockOutprice}}</td> 
                                 <td>{{item.saleOutMoney}}</td> 
                                 <td>{{item.overStock}}</td>   
                                 <td>{{item.overPrice}}</td> 
                                 <td>{{item.overMoney}}</td>    
                                </tr>  
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import BreadCrumb from '@/xt_pages/components/bread-crumb'
import { getStorehouseList,getNewPurchaseStockQuery } from "@/api/drug/drug"
import {
  getStockDrugCount
} from "@/api/stock";
import print from 'print-js'
const moment = require('moment')
export default {
    components:{
        BreadCrumb
    },
    data(){
        return{
          crumbs: [
            { path: false, name: '库存管理' },
            { path: false, name: '库存查询' },
            { path: false, name: '库存查询打印' },
          ],
          start_time:"",
          end_time:"",
          drug_name:"",
          drug_spec:"",
          keyword:"",
          tableData:[],
          time_now:moment(new Date()).add('year',0).format("YYYY-MM-DD"),
          type_name:"",
          limit:"",
          page:"",
          loading: false,
          warehouseInfoDate: [],
          tableList:[],
          good_type:[],
          manufacturerList:[],
          countList:[],
          outCountList:[],
          autoCountList:[],
          cancelCountList:[],
          org_id:0,
          goodTypeList:[],
        }
    },
    methods:{
      printAction: function() {
          const style = '@media print { .print_main_content { background-color: white; width:1500px;  margin:0 auto; padding: 0 0 20px 0; } .order_title_panl { text-align: center; } .time_p{font-size:16px;} .main_title { font-size: 18px; line-height: 40px; font-weight: 500; } .table_panel { } .table { width: 100%; border: 1px solid; border-collapse: collapse; padding: 2px; } thead tr td { border: 1px solid; text-align: center; font-size: 16px; padding: 15px 5px; } tbody tr td { border: 1px solid; text-align: center; font-size: 16px; padding: 10px 5px; white-space: pre-line;} .proj { padding: 5px 0; text-align: left; } .proj_title { font-size: 16px; font-weight: 500; line-height: 25px; } .proj_item { font-size: 15px; line-height: 20px; } .zone_name { font-weight: 500; } }'
          printJS({
          printable: 'print_content',
          type: 'html',
          documentTitle: '  ',
          style: style,
          scanStyles: false
          })
      },
      getStorehouseList(){
        getStorehouseList().then(response=>{
            if(response.data.state == 1){
           
            this.manufacturerList = response.data.data.manufacturerList
            var obj = {id:0,type_name:"全部"}
            this.goodTypeList.push(obj)
            var goodTypeList = response.data.data.goodTypeList
            for(let i=0;i<goodTypeList.length;i++){
                this.goodTypeList.push(goodTypeList[i])
                }
            }
        })
        },
        getlist(){
            this.loading = true
            var params = {
            good_type:this.good_type,
            keyword:this.keyword,
            page:this.page,
            limit:this.limit,
            start_time:this.start_time,
            end_time:this.end_time,
            }
        getNewPurchaseStockQuery(params).then(response=>{
            if(response.data.state == 1){
                var list = response.data.data.list
                this.loading = false
                for(let i=0;i<list.length;i++){
                    list[i].stockIn = list[i].GoodStartFlowInfo.over_count
                    list[i].stock_in_price = "/"
                    list[i].stockMoney = "/"
                    // list[i].stockIn = this.getWarehouseInfoStart(list[i].StartFlowInfo,list[i].StartOutFlowInfo,list[i].WareStartStockInventoryProfit,list[i].WareStartStockInventoryLosses,list[i].StartCancelFlowInfo) //期初结余
                    // list[i].stock_in_price = this.getWarehouseInfoStartPrice(list[i].StartFlowInfo,list[i].StartOutFlowInfo,list[i].WareStartStockInventoryProfit,list[i].WareStartStockInventoryLosses,list[i].StartCancelFlowInfo)
                    // list[i].stockMoney = this.getWarehouseInfoStartMoney(list[i].StartFlowInfo,list[i].StartOutFlowInfo,list[i].WareStartStockInventoryProfit,list[i].WareStartStockInventoryLosses,list[i].StartCancelFlowInfo)
                    
                    list[i].stockAdd = this.getWarehouseInfoOne(list[i].StartFlowWarehouseInfo,list[i].WareStartEndStockInventoryProfit)//期间增加
                    // list[i].addStockMoney = this.getAddStockMony(list[i].StartFlowWarehouseInfo,list[i].WareStartEndStockInventoryProfit)
                    // list[i].saleStockMoney = this.getSaleStockMony(list[i].StartFlowWarehouseInfo,list[i].WareStartEndStockInventoryProfit)
                    list[i].addStockMoney = "/"
                    list[i].saleStockMoney = "/"

                    list[i].outStock = this.getWarehosueOutInfo(list[i].WarehouseOutInfoStart,list[i].WareStartEndStockInventoryLosses,list[i].StartEndCancelFLowInfo)//本期减少
                    // list[i].stockOutprice = this.stockOutprice(list[i].WarehouseOutInfoStart,list[i].WareStartEndStockInventoryLosses,list[i].StartEndCancelFLowInfo)
                    // list[i].saleOutMoney = this.getSaleStockMony(list[i].WarehouseOutInfoStart,list[i].WareStartEndStockInventoryLosses,list[i].StartEndCancelFLowInfo)
                    list[i].stockOutprice = "/"
                    list[i].saleOutprice = "/"
                    // list[i].overStock= this.getEndWarehouseInfo(list[i].EndFlowInfo,list[i].EndFlowOutInfo,list[i].WareEndStockInventoryProfit,list[i].WareEndStockInventoryLosses,list[i].EndCancelFLowInfo)
                    // list[i].overPrice= this.getEndOverPrice(list[i].EndFlowInfo,list[i].EndFlowOutInfo,list[i].WareEndStockInventoryProfit,list[i].WareEndStockInventoryLosses,list[i].EndCancelFLowInfo)
                    // list[i].overMoney = this.getEndSalePrice(list[i].EndFlowInfo,list[i].EndFlowOutInfo,list[i].WareEndStockInventoryProfit,list[i].WareEndStockInventoryLosses,list[i].EndCancelFLowInfo)
                    list[i].overStock = list[i].GoodEndFlowInfo.over_count
                    list[i].overPrice = "/"
                    list[i].overMoney = "/"
                
                }
                this.tableList = list

               this.manufacturerList = response.data.data.manufacturerList
            
            }
        })
       },  
   getWarehouseInfoStartMoney(arr,arr1,arr2,arr3,arr4){
     var total_price = 0
     var total_price_one = 0
     var total_price_two = 0
     var total_price_three = 0
     var total_price_four = 0
     var total_price_all = 0
     if(arr!=null && arr.length >0){
       for(let i=0;i<arr.length;i++){
         total_price +=arr[i].count * arr[i].price
       }
     }
     if(arr1!=null && arr1.length > 0){
      for(let i=0;i<arr1.length;i++){
        total_price_one +=arr1[i].count * arr1[i].price
      }
      
     }
     if(arr2!=null && arr2.length > 0){
      for(let i=0;i<arr2.length;i++){
       total_price_two +=arr2[i].count * arr2[i].price
      }
     
     }
    if(arr3!=null && arr3.length > 0){
      for(let i=0;i<arr3.length;i++){
        total_price_three +=arr3[i].count * arr3[i].price
      }
     
     }
    if(arr4!=null && arr4.length > 0){
      for(let i=0;i<arr4.length;i++){
        total_price_four +=arr4[i].count * arr4[i].price
      }
     
     }
     total_price_all = total_price - total_price_one + total_price_two - total_price_three + total_price_four
    if (total_price_all > 0) {
       return total_price_all.toFixed(2)
     }else{
      return  "0.00"
     }
   },
    getWarehosueOutInfo(val,val2,val3){
     var count = 0
     var count_one = 0
     var all_count = 0
     var count_two = 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         count +=val[i].count
       }
     }
     if(val2!=null && val2.length > 0){
      for(let i=0;i<val2.length;i++){
        count_one +=val2[i].count
      }
     }
     if(val3!=null && val3.length > 0){
      for(let i=0;i<val3.length;i++){
        count_two +=val3[i].count
      }
     }
     all_count = count +count_one - count_two
     if(all_count >0){
       return all_count
     }else{
      return 0
     }
   },
   stockOutprice(val,val2,val3){
     var total_price = 0
     var total_price_one = 0
     var total_price_two = 0
     var all_price = 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         total_price +=val[i].count * val[i].buy_price
       }
     }
     if(val2!=null && val2.length > 0){
      for(let i=0;i<val2.length;i++){
        total_price_one +=val2[i].count * val2[i].buy_price
      }
     }
    if(val3!=null && val3.length > 0){
      for(let i=0;i<val3.length;i++){
        total_price_two +=val3[i].count * val3[i].buy_price
      }
     }
     all_price = total_price + total_price_one - total_price_two
     if(all_price >0){
       return all_price.toFixed(2)
     }else{
      return "0.00"
     }
   },
     saleOutprice(val,val2,val3){
     var total_price = 0
     var total_price_one = 0
     var all_price = 0
     var total_price_two = 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         total_price +=val[i].count * val[i].xt_warehouse_info.packing_price
       }
     }
     if(val2!=null && val2.length > 0){
       for(let i=0;i<val2.length;i++){
         total_price_one +=val2[i].count * val2[i].price
       }
     }
     if(val3!=null && val3.length > 0){
       for(let i=0;i<val3.length;i++){
         total_price_two +=val3[i].count * val3[i].price
       }
     }
     all_price = total_price + total_price_one - total_price_two
     if(all_price >0){
       return all_price.toFixed(2)
     }else{
      return "0.00"
     }
   },
   getEndWarehouseInfo(val,val3,val1,val2,val4){
     var count = 0
     var count_one = 0
     var count_two = 0
     var count_three =0
     var count_four = 0
     var all_count = 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         count +=val[i].count 
       }
     }
     if(val1!=null&&val1.length >0){
       for(let i=0;i<val1.length;i++){
         count_one +=val1[i].count
       }
     }
     if(val3!=null&& val3.length > 0){
      for(let i=0;i<val3.length;i++){
         count_three +=val3[i].count
       }
     }
     if(val2!=null&&val2.length >0){
       for(let i=0;i<val2.length;i++){
         count_two +=val2[i].count
       }
     }
     if(val4!=null&&val4.length >0){
       for(let i=0;i<val4.length;i++){
         count_four +=val4[i].count
       }
     }
     all_count = count- count_three + count_one - count_two + count_four
     if(all_count >0){
       return all_count
     }else{
      return 0
     }
   },
   getEndWarehouseInfo(val,val3,val1,val2,val4){
     var count = 0
     var count_one = 0
     var count_two = 0
     var count_three =0
     var count_four = 0
     var all_count = 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         count +=val[i].count 
       }
     }
     if(val1!=null&&val1.length >0){
       for(let i=0;i<val1.length;i++){
         count_one +=val1[i].count
       }
     }
     if(val3!=null&& val3.length > 0){
      for(let i=0;i<val3.length;i++){
         count_three +=val3[i].count
       }
     }
     if(val2!=null&&val2.length >0){
       for(let i=0;i<val2.length;i++){
         count_two +=val2[i].count
       }
     }
     if(val4!=null&&val4.length >0){
       for(let i=0;i<val4.length;i++){
         count_four +=val4[i].count
       }
     }
     all_count = count- count_three + count_one - count_two + count_four
     if(all_count >0){
       return all_count
     }else{
      return 0
     }
   },
   getEndSalePrice(val,val3,val1,val2,val4){
     var total_price = 0
     var total_price_one = 0
     var total_price_two = 0
     var total_price_three = 0
     var total_price_four = 0
     var all_price= 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         total_price +=val[i].count * val[i].price
       }
     }
     if(val1!=null && val1.length >0){
       for(let i=0;i<val1.length;i++){
         total_price_one +=val1[i].count * val1[i].price
       }
     }
    if(val3!=null && val3.length >0){
       for(let i=0;i<val3.length;i++){
         total_price_three +=val3[i].count * val3[i].price
       }
     }
      if(val2!=null && val2.length >0){
       for(let i=0;i<val2.length;i++){
         total_price_two +=val2[i].count * val2[i].price
       }
     }
       if(val4!=null && val4.length >0){
       for(let i=0;i<val4.length;i++){
         total_price_four +=val4[i].count * val4[i].price
       }
     }
     var all_price = total_price-total_price_three + total_price_one - total_price_two + total_price_four
     if(all_price >0){
       return all_price.toFixed(2)
     }else{
      return "0.00"
     }
   },
   getEndSalePrice(val,val3,val1,val2,val4){
     var total_price = 0
     var total_price_one = 0
     var total_price_two = 0
     var total_price_three = 0
     var total_price_four = 0
     var all_price= 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         total_price +=val[i].count * val[i].price
       }
     }
     if(val1!=null && val1.length >0){
       for(let i=0;i<val1.length;i++){
         total_price_one +=val1[i].count * val1[i].price
       }
     }
    if(val3!=null && val3.length >0){
       for(let i=0;i<val3.length;i++){
         total_price_three +=val3[i].count * val3[i].price
       }
     }
      if(val2!=null && val2.length >0){
       for(let i=0;i<val2.length;i++){
         total_price_two +=val2[i].count * val2[i].price
       }
     }
       if(val4!=null && val4.length >0){
       for(let i=0;i<val4.length;i++){
         total_price_four +=val4[i].count * val4[i].price
       }
     }
     var all_price = total_price-total_price_three + total_price_one - total_price_two + total_price_four
     if(all_price >0){
       return all_price.toFixed(2)
     }else{
      return 0
     }
   },
       getGoodTypeName(id){
        var type_name = ""
        for(let i=0;i<this.goodTypeList.length;i++){
        if(id == this.goodTypeList[i].id){
            type_name = this.goodTypeList[i].type_name
        }
        }
        return type_name
       },
    getWarehouseInfoStart(arr1,arr2,arr3,arr4,arr5){
      var count =0
      var countOne =0 
      var countTwo= 0
      var countthree = 0 //期初
      var countfour = 0
      var countfive = 0
      if(arr1!=null && arr1.length > 0){
        for(let i=0;i<arr1.length;i++){
        countOne +=arr1[i].count
        }
      }
      if(arr2!=null && arr2.length > 0){
        for(let i=0;i<arr2.length;i++){
          countTwo +=arr2[i].count
        }
      }
      if(arr3!=null && arr3.length > 0){
        for(let i=0;i<arr3.length;i++){
          countthree +=arr3[i].count
        }
      }
      if(arr4!=null && arr4.length > 0){
        for(let i=0;i<arr4.length;i++){
          countfour +=arr4[i].count
        }
      }
      if(arr5!=null && arr5.length > 0){
        for(let i=0;i<arr5.length;i++){
          countfive +=arr5[i].count
        }
      }
      console.log("countOne",countOne)
      console.log("countTwo",countTwo)
      console.log("countthree",countthree)
      console.log("countfour",countfour)
      console.log("*********************")
      count = countOne - countTwo + countthree - countfour + countfive
      if(count > 0 ){
        return count
      }else{
        return 0
      }
    },
    getWarehouseInfoStartPrice(arr,arr1,arr2,arr3,arr4){
     var total_price = 0
     var total_price_one = 0
     var total_price_two = 0
     var total_price_three = 0
     var total_price_four = 0
     var total_price_all = 0
     if(arr!=null&&arr.length > 0){
      for(let i=0;i<arr.length;i++){
        total_price += arr[i].count * arr[i].buy_price
      }
     }
     if(arr1!=null && arr1.length > 0){
      for(let i=0;i<arr1.length;i++){
        total_price_one +=arr1[i].count * arr1[i].buy_price
      }
      
     }
     if(arr2!=null && arr2.length > 0){
      for(let i=0;i<arr2.length;i++){
       total_price_two +=arr2[i].count * arr2[i].buy_price
      }
     
     }
    if(arr3!=null && arr3.length > 0){
      for(let i=0;i<arr3.length;i++){
        total_price_three +=arr3[i].count * arr3[i].buy_price
      }
     
     }
     if(arr4!=null && arr4.length > 0){
      for(let i=0;i<arr4.length;i++){
        total_price_three +=arr4[i].count * arr4[i].buy_price
      }
     
     }
     total_price_all = total_price - total_price_one + total_price_two - total_price_three + total_price_four
     if (total_price_all > 0) {
       return total_price_all.toFixed(2)
     }else{
      return  "0.00"
     }
   },
  getWarehouseInfoOne(val,val2){
    var count =0 
    var countOne = 0
    var all_count = 0
    if(val!=null && val.length >0){
     for(let i=0;i<val.length;i++){
      count +=val[i].count
     }
    }
    if(val2!=null && val2.length > 0){
     for(let i=0;i<val2.length;i++){
       countOne +=val2[i].count
     }
    }
    all_count = count + countOne
    console.log("count2332323223232o2222222222wide",count)
    console.log("countONE23232322323323223",countOne)
    console.log("all_count9999999999999wode",all_count)
    console.log("-------------------------------------------")
    if(all_count > 0 ){
      return all_count
    }else{
      return 0
    }
  },
  getAddStockMony(val,val2){
    var total_price =0 
    var total_price_one = 0
    var all_price = 0
    if(val!=null && val.length >0){
     for(let i=0;i<val.length;i++){
      total_price +=val[i].count * val[i].buy_price
     }
    }
    if(val2!=null && val2.length > 0){
      for(let i=0;i<val2.length;i++){
       total_price_one +=val2[i].count * val2[i].price
      }
    }
  all_price = total_price + total_price_one
   if(all_price >0 ){
    return total_price.toFixed(2)
   }else{
    return "0.00"
   }
  },
   getSaleStockMony(val,val2){
    var total_price =0 
    var total_price_one = 0
    var all_price = 0
    if(val!=null && val.length >0){
     for(let i=0;i<val.length;i++){
      total_price +=val[i].count * val[i].price
     }
    }
   if(val2!=null && val2.length > 0){
     for(let i=0;i<val2.length;i++){
      total_price_one +=val2[i].count * val2[i].price
     }
   }
   all_price = total_price + total_price_one
   if(all_price >0 ){
    return all_price.toFixed(2)
   }else{
    return "0.00"
   }
  },
    getWarehouseOut(val){
        var count = 0
        for(let i=0;i<val.length;i++){
        count +=val[i].count
        }
        if(count >0){
        return count
        }else{
        return 0
        }
    },
    getManufacturName(id){
      var manufacturer_name = ""
      for(let i=0;i<this.manufacturerList.length;i++){
        if(id == this.manufacturerList[i].id){
           manufacturer_name = this.manufacturerList[i].manufacturer_name
        }
      }
      return manufacturer_name
    },
    getEndOverPrice(val,val3,val1,val2,val4){
     var total_price = 0
     var total_price_one = 0
     var total_price_two = 0
     var total_price_three = 0
     var total_price_four =0
     var all_price = 0
     if(val!=null && val.length >0){
       for(let i=0;i<val.length;i++){
         total_price +=val[i].count * val[i].buy_price
       }
     }
     if(val1!=null && val1.length > 0){
       for(let i=0;i<val1.length;i++){
         total_price_one +=val1[i].count * val1[i].buy_price
       }
     }
     if(val3!=null && val3.length > 0){
       for(let i=0;i<val3.length;i++){
         total_price_three +=val3[i].count * val3[i].buy_price
       }
     }
    if(val2!=null && val2.length > 0){
       for(let i=0;i<val2.length;i++){
         total_price_two +=val2[i].count * val2[i].buy_price
       }
     }
      if(val4!=null && val4.length > 0){
       for(let i=0;i<val4.length;i++){
         total_price_four +=val4[i].count * val4[i].buy_price
       }
     }
    //  console.log("total_price",total_price)
    //  console.log("total_price_three",total_price_three)
    //  console.log("total_price_two",total_price_two)
    //  console.log("total_price_one",total_price_one)
    //  console.log("total_price_four",total_price_four)
     all_price = total_price- total_price_three +total_price_one - total_price_two + total_price_four
     console.log("arrll_price",all_price)
     if(all_price >0){
       return all_price.toFixed(2)
     }else{
      return "0.00"
     }
   },
   },
    created(){
      this.org_id =  this.$store.getters.xt_user.org_id
     
      var starttime =  this.$route.query.start_time
      this.start_time = starttime
      var endtime =  this.$route.query.end_time
      this.end_time = endtime
      var good_type = parseInt(this.$route.query.good_type)
      this.good_type = good_type
      var keyword = this.$route.query.keyword
      this.keyword = keyword
      this.page = parseInt(this.$route.query.page)
      this.limit = parseInt(this.$route.query.limit)
      this.getStorehouseList()
      this.getlist()
    

    }
}
</script>


<style rel="stylesheet/scss" lang="scss" scoped>
.print_main_content {
  background-color: white;
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 0 20px 0;

  .order_title_panl {
    text-align: center;

    .main_title {
      font-size: 18px;
      line-height: 40px;
      font-weight: 500;
    }
  }
  .table_panel {
    .table {
      width: 100%;
      border: 1px solid;
      border-collapse: collapse;
      padding: 2px;
      

      thead {
        tr {
          td {
            border: 1px solid;
            text-align: center;
            font-size: 14px;
            padding: 15px 5px;
          }
        }
      }
      tbody {
        tr {
          td {
            border: 1px solid;
            text-align: center;
            font-size: 14px;
            padding: 10px 5px;
            white-space: pre-line;
            .proj {
              padding: 5px 0;
              text-align: left;

              .proj_title {
                font-size: 16px;
                font-weight: 500;
                line-height: 25px;
              }

              .proj_item {
                font-size: 15px;
                line-height: 20px;

                .zone_name {
                  font-weight: 500;
                }
              }
            }
          }
        }
      }
    }
  }
}
</style>