yiliangyiyun-pc-jj/src/views/warehouse/warehouselocation.vue

<!--库点费用-->
<template>
  <div>
      <el-row>
      <el-col :span="12">
        <h2 class="bg-left title">库点费用</h2>
      </el-col>
      <el-col :span="12" class="bg-right">
        <el-button
          class="bg-bottom"
          type="primary"
          size="small"
          @click="returnsales()"
          ><img
            width="6"
            height="10"
            style="vertical-align: bottom; margin-right: 3px"
            src="../../../public/img/lujing.png"
            alt=""
          />返回</el-button
        >
      </el-col>
    </el-row>
    <el-row>
      <el-col class='bg-left' :span="12">
        <div style='align-items:center;' class='flex'>
          <ws-button class="find" type="primary" @click="addlist()" v-hasPermission="`warehouseManagement.costControl.delete`">添加</ws-button>
          <div style='align-items:center;' class='flex'>
              <div :class='{"forbidden":forbidden==true}' @click='minus'><i class="el-icon-arrow-left"></i></div>
              <ws-select
                v-model="year"
                placeholder=""
                @change="yearChange"
                :value="searchType"
                style="margin: 0 10px"
                >
                <ws-option
                    v-for="item in yearList"
                    :key="item.value"
                    :label="item.value"
                    :value="item.value"
                    style="color: #8890b1"
                />
                </ws-select>
              <div :class='{"forbidden":forbidden1==true}' @click='add'><i class="el-icon-arrow-right"></i></div>
          </div>
          <span v-if='deptBudgetTotal>0'>合计：{{count}}元</span>
        </div>
      </el-col>
      <el-col :span="12" class="bg-right">
       <ws-select
          v-model="warehouseName"
          placeholder=""
          @change="warehouseNameChange"
          :value="searchType"
          style="margin: 0 10px"
        >
          <ws-option
            v-for="item in warehouseList1"
            :key="item.value"
            :label="item.value"
            :value="item.value"
            style="color: #8890b1"
          />
        </ws-select>
        <!-- v-hasPermission="'procurement.sparepart.directShip'" -->
        <ws-button class="find" type="primary" @click="find()"
          ><img
            width="16"
            height="16"
            style="
              vertical-align: text-top;
              position: relative;
              top: 0px;
              left: -8px;
            "
            src="../../../public/img/sousuo.png"
            alt=""
        /></ws-button>
     </el-col>
    </el-row>
      <el-table
        class="wenzi"
        :data="warehouseList.records"
        style="width: 100%; margin-top: 20px"
        height="780"
      >
      <el-table-column label="序号" type="index" show-overflow-tooltip width="50">
      </el-table-column>
        <el-table-column prop="expenseName" label="费用名称" >
        </el-table-column>
        <el-table-column prop="amount" label="金额（元）" >
        </el-table-column>
        <el-table-column  prop="storage" label="附件">
            <template slot-scope="scope">
                <img v-if='scope.row.applUrl'
            width="18"
            height="20"
            style="vertical-align: text-top; position: relative; top: -1px"
            src="../../../public/img/fujian.png"
            @click="fujian(scope.row)"
            alt=""
          />
          <span v-else>暂无附件</span>
            </template>
        </el-table-column>
        <el-table-column  prop="costDate" label="日期">
        </el-table-column>
        
        <el-table-column prop="address" label="操作" width="200">
          <template slot-scope="scope">
            <div class="adjustment" v-hasPermission="
           `warehouseManagement.costControl.audit`
          " @click="editlist(scope.row)">编辑</div>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="deptBudgetTotal"
    >
    </el-pagination>
    <WinseaContentModal
      v-model="accessoryTFs"
      :title="$t('system.noticeCircular.information')"
      @on-cancel="handleClose"
    >
    <ws-upload
        ref="upload"
        :comp-id="compId"
        :appendix-ids="appendixIdss"
        :editable="false"
        accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar"
      />
      
    </WinseaContentModal>
      <el-dialog :title="dialogtitle" :visible.sync="addvisible">
        <el-form label-width="140px" label-position='right'>
          <el-form-item  label="费用名称" >
            <el-input v-model="expenseName" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item  label="金额" >
            <el-input v-model="amount" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="付款截图" >
            <ws-upload
        ref="upload"
        :comp-id="compId"
        :appendix-ids="applUrl"
        :size-limit="size"
        :limit='limit'
        @onChange="onChange"
        accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar"
      />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="addvisible = false">取 消</el-button>
          <el-button type="primary" @click="addInventory">确 定</el-button>
        </div>
      </el-dialog>
  </div>
</template>
<script>
import {
  getinventory,
  addinventory,
  editinventory,
  getwarehousebase,
  editcost,
  export1,
  editstatus,
  billoperatehis,
  clearancee,
} from '@/model/warehouse/index'
import { downloadFile } from '@/utils/batchDown'
import Pagination from '@/components/Pagination'
import WsUpload from '@/components/WsUpload'
import { EventBus } from 'base-core-lib'
export default {
  name: 'viewSpareMoney',
  components: {
    WsUpload,
    Pagination,
  },
  watch: {
    vesselId(val) {
      this.getList()
    },
    isShow(val) {
      this.showType = val
    },
  },
  data() {
    return {
        currectPage:1,
        pageSize:10,
      //弹出框
      dialogViewSpareMoney: false,
      dialogApproveFormVisible: false,
      // 船舶类型
      monetaryKey: null,
      // 表格显示数据
      tableDate: [],
      expenseName:'',
      yearList:[],
      dialogtitle:'',
      appendixIdss:[],
      amount:'',
      applUrl:'',
      price:'',
      costDate:'',
      // 是否显示
      showType: true,
      // 年
      year: '',

      searchType: 1,
      searchTypeText: '未完成',
      searchKeyWord: '',
      contractType: 2,
      currentPage:1,
      warehouseType: '1',
      // 提交类型
      submitType: true,
      size: 10,
      limit:1,
      spanArr: [],
      id:0,
      warehouseName: '',
      warehouseId:'',
      start:2021,
      forbidden:false,
      forbidden1:false,
      addvisible:false,
      compId: sessionStorage.getItem('ws-pf_compId'),
      deptCircularPage: {},
      warehouseList: [],
      warehouseList1: [],
      deptBudgetList: {},
      historyList: [],
      count:0,
      deptBudgetTotal: 0,
      pickerBeginDateBefore: {
        disabledDate: (time) => {
          return time.getTime() > Date.now()
        },
      },
      accessoryTFs: false,
    }
  },
  activated() {
this.cangid=this.$route.query.cangId
      this.year=new Date().getFullYear()
      for(var i=this.start;i<=this.year;i++){
          this.yearList.push({value:i})
      }
      if(this.year>=new Date().getFullYear()){
          this.forbidden1=true
      }
      if(this.year<=this.start){
          this.forbidden=true
      }
    this.selectWarehouse()
    // this.getList()

    this.showType = this.isShow
  },
  methods: {
      returnsales(){
          this.$router.go(-1)
      },
      fujian(row) {
      if (row.applUrl === null || row.applUrl === '') {
        EventBus.$emit(
          'warning',
          this.$t('system.noticeCircular.NoInformation')
        )
      }
      this.appendixIdss = row.applUrl
      this.accessoryTFs = true
    },
    uploadSuccessHandle(e){
        this.applUrl=e.url
    },
    counttotal(){
      this.count=0
        for (let i = 0; i < this.warehouseList.records.length; i++) {
            this.count+=this.warehouseList.records[i].amount
        }
    },
    onChange() {
     this.$refs.upload
        .handleSaveBill()
        .then(async response => {
          this.applUrl = response
        })
        .catch(res => {
          EventBus.$emit('error', (JSON.parse(res) || {}).message)
          this.$refs.upload.clearFiles()
        })
    },
    minus(){

        if(this.year<=this.start){
            this.forbidden=true
        }else{
            this.year--
        }
    },
    add(){

        if(this.year>=new Date().getFullYear()){
            this.forbidden1=true
        }else{
            this.year++
        }
    },
    addInventory(){
      if(this.dialogtitle=='编辑费用'){
        this.editInventory()
        return
      }
        if(!this.expenseName){
            this.$message({
              message: '费用名称不能为空！',
              type: 'warning'
            })
            return
        }
        if(this.expenseName.length<1||this.expenseName.length>10){
            this.$message({
              message: '费用名称1-10个字！',
              type: 'warning'
            })
            return
        }
        if(!this.amount){
            this.$message({
              message: '金额不能为空！',
              type: 'warning'
            })
            return
        }
        if(this.amount<0||this.amount>100000000||(String(this.amount).indexOf('.') != -1 &&
						String(this.amount).length -
						(String(this.amount).indexOf('.') +1) >
						2)){
            this.$message({
              message: '金额输入错误！',
              type: 'warning'
            })
            return
        }
        addinventory({applUrl:this.applUrl,expenseName:this.expenseName,amount:this.amount,warehouseId:this.cangid,warehouseName:this.warehouseName}).toPromise()
        .then((response) => {
            this.$notify.success({
                title: '成功',
                message: '添加成功',
              })
           this.addvisible=false
           this.expenseName=''
           this.amount=''
           this.applUrl=''
           this.getList()
        })
    },
    editInventory(){
        if(!this.expenseName){
            this.$message({
              message: '费用名称不能为空！',
              type: 'warning'
            })
            return
        }
        if(this.expenseName.length<1||this.expenseName.length>10){
            this.$message({
              message: '费用名称1-10个字！',
              type: 'warning'
            })
            return
        }
        if(!this.amount){
            this.$message({
              message: '金额不能为空！',
              type: 'warning'
            })
            return
        }
        if(this.amount<0||this.amount>100000000){
            this.$message({
              message: '金额输入错误！',
              type: 'warning'
            })
            return
        }
        editinventory({id:this.id,applUrl:this.applUrl,expenseName:this.expenseName,amount:this.amount,warehouseId:this.cangid,warehouseName:this.warehouseName}).toPromise()
        .then((response) => {
            this.$notify.success({
                title: '成功',
                message: '编辑成功',
              })
           this.addvisible=false
           this.expenseName=''
           this.amount=''
           this.applUrl=''
           this.getList()
        })
    },
    yearChange(){

    },
    addlist(){
        this.addvisible=true
        this.dialogtitle='添加费用'
    },
    editlist(item){
        this.addvisible=true
        this.dialogtitle='编辑费用'
        this.id=item.id
        this.applUrl=item.applUrl
        this.expenseName=item.expenseName
        this.amount=item.amount
    },
    warehouselocation(){
      this.$router.push({ path: 'warehouselocation' })
    },
    warehouseNameChange(e) {
      for(let i = 0 ; i < this.warehouseList1.length; i++){
        if(this.warehouseList1[i].value == e){
           this.warehouseName = this.warehouseList1[i].value
          this.warehouseCount = this.warehouseList1[i].count
          this.warehouseNo = this.warehouseList1[i].No
          this.cangid = this.warehouseList1[i].id
          this.WAREHOUSE[1].payname = this.warehouseList1[i].value
          this.purchasePriceList = this.warehouseList1[i].purchasePriceList
        }
      }
      this.getList()
    },
    edit(item){
      this.price=item.cost
      this.editvisible=true
      this.id=item.id
    },
    editprice(){
      this.$confirm(`加权成本价格修改后不可恢复，确认提交`, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          editcost({id:this.id,cost:this.price}).toPromise()
        .then((response) => {
          this.$notify.success({
                title: '成功',
                message: '价格修改成功',
              })
           this.editvisible=false
           this.getList()
        })
        })
     
    },
    handleClose() {
      this.accessoryTFs = false
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`)
      this.pageSize = val
      this.getList()
    },
    handleCurrentChange(val) {
      this.currentPage = val
      console.log(`当前页: ${val}`)
      this.getList()
    },
    selectWarehouse(){
       getwarehousebase({
        compId: sessionStorage.getItem('ws-pf_compId'),
        warehouseType:''
      })
        .toPromise()
        .then((response) => {
          this.warehouseList1 = []
          for (let i = 0; i < response.length; i++) {
            this.warehouseList1.push({
              value: response[i].warehouseName,
              id: response[i].id,
              count: response[i].count,
              purchasePriceList: response[i].purchasePriceList,
              No:response[i].commonWarehouseNo
            })
            if (this.cangid&&this.cangid == response[i].id) {
              this.warehouseName = response[i].warehouseName
              this.warehouseCount =  response[i].count
              this.warehouseNo =  response[i].commonWarehouseNo
              this.purchasePriceList =  response[i].purchasePriceList
            } 
          }
          if(this.warehouseList1.length > 0 && !this.cangid){
            this.warehouseName = this.warehouseList1[0].value
            this.warehouseCount =  this.warehouseList1[0].count
            this.warehouseNo =  this.warehouseList1[0].No
            this.cangid =  this.warehouseList1[0].id
            this.purchasePriceList =  this.warehouseList1[0].purchasePriceList
            this.WAREHOUSE[1].payname = this.warehouseList1[0].value
          }
          this.getList()
        })
        getwarehousebase({
        compId: sessionStorage.getItem('ws-pf_compId'),
        warehouseType:2
      })
        .toPromise()
        .then((response) => {
          for (let i = 0; i < response.length; i++) {
            this.warehouseList1.push({
              value: response[i].warehouseName,
              id: response[i].id,
              count: response[i].count,
              purchasePriceList: response[i].purchasePriceList,
              No:response[i].commonWarehouseNo
            })
            if (this.cangid&&this.cangid == response[i].id) {
              this.warehouseName = response[i].warehouseName
              this.warehouseCount =  response[i].count
              this.warehouseNo =  response[i].commonWarehouseNo
              this.purchasePriceList =  response[i].purchasePriceList
            } 
          }
        })
    },
    getList() {
      getinventory({
        compId: sessionStorage.getItem('ws-pf_compId'),
        warehouseId: this.cangid,
        year: this.year,
        currectPage:this.currectPage,
        pageSize:this.pageSize
      })
        .toPromise()
        .then((response) => {
          this.warehouseList = response
          this.deptBudgetTotal=response.total
          this.counttotal()
        })
    },
    editClick(row) {
      var status = ''
      if (row.status == '待执行' || row.status == '已完成') {
        status = '执行中'
      } else if (row.status == '执行中') {
        status = '已完成'
      }
      //cancelButtonClass: "btn-custom-cancel"
      this.$confirm(`是否将状态改为${status}`, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          editstatus({ id: row.id })
            .toPromise()
            .then((response) => {
              this.$notify.success({
                title: '成功',
                message: '状态修改成功',
              })
              this.getList()
            })
            .catch((response) => {
              // EventBus.$emit('error', this.$t('showMessage.asteriskRequired'))
            })
        })
        .catch(() => {
          return false
        })
    },
    selecttaskType(e) {
      for (var i = 0; i < this.taskTypeList.length; i++) {
        if (this.taskTypeList[i].value == e) {
          this.searchType = this.taskTypeList[i].type
        }
      }
    },
    handleExamine(row) {
      this.$router.push({
        name: 'salesContractExamine',
        query: { id: row.id },
      })
    },
    // 关闭 dialog时 处理文件url 初始化upload组件
    handleCloe() {
      this.dialogViewSpareMoney = false
    },

    history(row) {
      billoperatehis({ id: row.id })
        .toPromise()
        .then((response) => {
          this.historyList = response
        })
    },
    find() {
      this.currentPage = 1
      this.getList()
    },
    async exportlist() {
      const { data } = await export1(
        {
          compId: sessionStorage.getItem('ws-pf_compId'),
          contractType: this.contractType,
          currentPage: this.currentPage,
          pageSize: this.pageSize,
          searchType: this.searchType,
          searchKeyWord: this.searchKeyWord,
          startDate: this.startDate,
          endDate: this.endDate,
        },
        {},
        { responseType: 'blob' }
      ).toPromise()
      downloadFile({
        res: data,
        fileName: `${
          this.date.year + (this.date.month ? `-${this.date.month}` : '')
        }_采购合同`,
        type: 'xls',
      })
    },
  },
}
</script>
<style lang="scss" scoped>
.connert {
  width: 90%;
  margin: 0 auto;
}
.bg-left {
  padding-left: 30px;
}
.bg-right {
  text-align: right;
  padding: 16px 20px;
}
.el-icon-arrow-left,.el-icon-arrow-right{
    font-size:24px;
}
.vertical-text-left {
  width: 62px;
  text-align: right;
}
.el-button--primary {
  background-color: #5878e8;
  border-color: #5878e8;
}
.el-button--default {
  color: #8890b1;
  border-color: #e8eaf1;
}
/deep/.base_header_layout .grid-content.right .find.el-button--primary {
  width: 30px;
  margin-left: 0;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}
/deep/.findValue .el-input__inner {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
.completed.el-button--default {
  border-color: #5878e8;
  background-color: #f6f7fc;
  color: #5878e8;
}
.putstorage.el-button--default,
.deliverystorage.el-button--default {
  border-color: #8890b1;
  background-color: #fff;
  color: #8890b1;
}
/deep/.el-table td,
/deep/.el-table th.is-leaf {
  border-right: 1px solid #e9ecf7;
  text-align: center;
}
/deep/.el-table tr td:first-child,
/deep/.el-table tr th.is-leaf:first-child {
  border-left: 1px solid #e9ecf7;
}
/deep/.el-table .el-table__header .cell,
/deep/.el-table .el-table__body .cell {
  -webkit-line-clamp: 10;
  max-height: 400px;
}
.record,
.adjustment {
  display: inline-block;
  color: #5878e8;
  padding: 0 4px !important;
  position: relative;
}
.record:after {
  position: absolute;
  content: '';
  display: block;
  top: 5px;
  right: -2px;
  width: 1px;
  height: 12px;
  background: #e9ecf7;
}
/deep/.el-radio-button:first-child .el-radio-button__inner {
  margin-left: 10px;
}
//分页
.el-pagination {
  text-align: center;
    white-space: nowrap;
    padding: 2px 5px;
    color: #303133;
    font-weight: 700;
    margin-bottom: 20px;
}
.forbidden{
    cursor: not-allowed;
}
 .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>