yiliangyiyun-pc/src/views/contractManagement/purchaseContract.vue

<!--现货采购合同-->
<!--2019年5月30日 20:25:16 by jlx-->
<template>
  <div>
    <BaseHeaderLayout :leftSpan="4">
      <template slot="left">
        <ws-button type="primary" @click="handleAdd()"
          v-hasPermission="`contractManagement.buyContract.buyContractInfo.add`">添加</ws-button>
        <ws-button @click="exportlist()" v-hasPermission="
          `contractManagement.buyContract.buyContractInfo.view`
        ">导出</ws-button>
      </template>
      <template slot="right">
        <span style="width: 205px; display: inline-block; color: #8890b1">创建人：</span>
        <ws-select v-model="createPersion" placeholder="可按创建人筛选" class="typeselect" @change="getList"
          :value="searchType">
          <ws-option key="全部内勤" label="全部内勤" value="" style="color: #8890b1" />
          <ws-option v-for="item in persionList" :key="item.staffName" :label="item.staffName" :value="item.staffName"
            style="color: #8890b1" />
        </ws-select>
        <span style="width: 150px; display: inline-block; color: #8890b1;margin-left: 5px;">状态：</span>
        <ws-select v-model="searchTypeText" placeholder="" class="typeselect" @change="selecttaskType"
          :value="searchType">
          <ws-option v-for="item in taskTypeList" :key="item.value" :label="item.value" :value="item.value"
            style="color: #8890b1" />
        </ws-select>
        <el-date-picker v-model="value2" type="daterange" align="right" unlink-panels range-separator="至"
          start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
        </el-date-picker>
        <el-input v-model="searchKeyWord" placeholder="可按照合同编号、买方名称、卖方名称进行查找" clearable maxlength="500" type="input"
          class="findValue" @keyup.enter.native="find()"></el-input>
        <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>
      </template>
    </BaseHeaderLayout>
    <el-table class="wenzi" :data="contractList.records" style="width: 100%; margin-top: 10px"
      height="calc(100% - 105px)">
      <el-table-column type="index" label="序号">
        <template scope="scope">
          <span v-if="scope.$index < 9">0{{ scope.$index + 1 }}</span>
          <span v-else>{{ scope.$index + 1 }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="contractNo" label="合同编号" width="150">
      </el-table-column>
      <el-table-column prop="creator" label="创建人" width="90">
      </el-table-column>
      <el-table-column prop="goodsName" label="货名" width="80">
      </el-table-column>
      <!-- <el-table-column prop="grade" label="品级" width="80">
        <template slot-scope="scope">
          <span v-if="scope.row.grade == '一等品'" class="top-grade">{{
            scope.row.grade
          }}</span>
          <span v-if="scope.row.grade == '二等品'" class="second-class">{{
            scope.row.grade
          }}</span>
          <span v-if="scope.row.grade == '三等品'" class="third-class">{{
            scope.row.grade
          }}</span>
          <span v-if="scope.row.grade == '等外'" class="substandard">{{
            scope.row.grade
          }}</span>
        </template>
      </el-table-column> -->
      <el-table-column prop="weight" label="重量（吨）"> </el-table-column>
      <el-table-column width='130' prop="unitContractPrice" label="合同单价（元）">
      </el-table-column>
      <!-- <el-table-column prop="packingMethod" label="包装方式"> </el-table-column> -->
      <el-table-column prop="buyer" label="买方"> </el-table-column>
      <el-table-column prop="seller" label="卖方"> </el-table-column>
      <el-table-column width='120' prop="completedQuantity" label="已完成（吨）">
        <template slot-scope="scope">
          <span style="color: #5473e8; font-weight: 600">{{
              scope.row.completedQuantity
          }}</span>
        </template>
      </el-table-column>
      <el-table-column width='150' prop="status" label="状态">
        <template slot-scope="scope">
          <div v-if="scope.row.status != '执行中' && scope.row.status != '发运结束'">
            <!-- <span v-if="scope.row.approveStatus">{{
              scope.row.approveStatus
            }}</span> -->
            <el-select v-if="scope.row.approveStatus" v-model="scope.row.approveStatus" placeholder=""
              class="statusselect" @change='selectstatuschange($event, scope.row)' disabled
              :value="scope.row.approveStatus">
              <el-option label="待决策人审核" value="待决策人审核" style="color: #8890b1" />
            </el-select>
            <el-select v-else v-model="scope.row.status" placeholder="" class="statusselect"
              :disabled="scope.row.status == '已完成' || scope.row.status == '已结算' || scope.row.status == '已驳回'"
              @change='selectstatuschange($event, scope.row)' :value="scope.row.status">
              <el-option label="待执行" value="待执行" style="color: #8890b1" />
              <el-option label="执行中" value="执行中" style="color: #8890b1" />
            </el-select>
            <!-- <el-popover v-else placement="left" :width="285" trigger="click" visible-arrow="false"
              @show="history(scope.row)">
              <template>
                <span slot="reference">
                  <span v-if="scope.row.status == '待执行'" class="executory"></span>
                  <span v-if="scope.row.status == '执行中'" class="inExecution"></span>
                  <span v-if="scope.row.status == '已完成'" class="done"></span>{{ scope.row.status }}
                </span>
              </template>
              <div>
                <p style="margin-top: 0; padding-left: 10px">操作历史</p>
                <div v-for="(item, index) in historyList" class="flex">
                  <div class="vertical-text vertical-text-left">
                    {{ item.updateDate }}
                  </div>
                  <div>
                    <div class="vertical-circle"></div>
                    <div v-if="index != historyList.length - 1" class="vertical-line"></div>
                  </div>
                  <div class="vertical-text">
                    {{ item.operateUser }}<br />{{ item.dealMsg }}
                  </div>
                </div>
              </div>
            </el-popover>
            <img v-if="!scope.row.approveStatus" width="17" height="18"
              style="vertical-align: text-top; position: relative; top: -1px;" src="../../../public/img/edit.png"
              @click="editClick(scope.row)" alt="" /> -->
          </div>
          <div v-else>
            <!-- {{scope.row.status}} -->
            <el-select v-model="scope.row.status" placeholder="" class="statusselect"
              @change='selectstatuschange($event, scope.row)' :value="scope.row.status">
              <el-option v-for="item in statusList" :key="item.value" :label="item.value" :value="item.value"
                style="color: #8890b1" />
            </el-select>
          </div>
        </template>
      </el-table-column>
      <el-table-column width='120' prop="signingDate" label="签订日期"> </el-table-column>
      <el-table-column width='120' prop="contractExpenditure" label="粮款支出"> </el-table-column>
      <el-table-column width='120' prop="expenses" label="费用支出"> </el-table-column>

      <!-- <el-table-column width='130' prop="mildewGrain" label="已付款（元）"> 
      </el-table-column>-->
      <el-table-column prop="amountEdPayable" label="已付运费"> </el-table-column>
      <!-- <el-table-column prop="statementUrl" label="结算单">
        <template slot-scope="scope">
          <img width="18" height="20" style="vertical-align: text-top; position: relative; top: -1px"
            src="../../../public/img/fujian.png" @click="settlement(scope.row)" alt="" />
          <span v-if="scope.row.statementUrl != null">
            {{ scope.row.statementUrl? scope.row.statementUrl.split(",").length : "" }}
          </span>
        </template>
      </el-table-column> -->
      <el-table-column width='120' prop="goodsNames" label="已开发票 （元）">
        <template slot-scope="scope">
          <div v-if="!scope.row.editgoodsNames">
            <div class="inputChenge">
              <!-- readonly -->
              <el-input v-model="scope.row.invoiced" v-if="scope.row.identification1 == 'true'"></el-input>
              <div v-if="scope.row.identification1 == 'false'" class="inputs">
                {{ scope.row.invoiced }}
              </div>
            </div>
            <!-- <img width="18" height="20" style="vertical-align: text-top; position: relative; top: -1px"
              src="../../../public/img/fujian.png" @click="invoiceUploade(scope.row)" alt="" />
            <span v-if="scope.row.invoiceUrl != null">
              {{ scope.row.invoiceUrl ? scope.row.invoiceUrl.split(",").length : "" }}
            </span> -->
             <img width="17" height="18" style="vertical-align: text-top; position: relative; top: -1px"
              src="../../../public/img/edit.png" @click="whether(scope.row)"
              v-if="scope.row.identification1 == 'false'" alt="" />
            <i class="el-icon-check" style="line-height: 29px; margin-left: 10px"
              v-if="scope.row.identification1 == 'true'" @click="varietyClick(scope.row)"></i>
          </div>
          <div v-if="scope.row.editgoodsNames">
            <el-input class="goodsnamesinput" v-model="scope.row.invoiced" placeholder="输入累计开票金额" ></el-input>
            <i @click="submitgoodsNames(scope.row)" class="el-icon-check"></i>
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="addressUrl" label="附件">
        <template slot-scope="scope">
          <img 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-if="scope.row.addressUrlArray != null">
            {{
                scope.row.addressUrlArray.length == 0
                  ? ''
                  : scope.row.addressUrlArray.length
            }}
          </span>
        </template>
      </el-table-column>
      <el-table-column prop="address" label="操作" width="150">
        <template slot-scope="scope">
          <!-- <img width="16" height="17" style="
                vertical-align: text-top;
                position: relative;
                top: -1px;
                margin: 0 6px;
              "  src="../../../public/img/daichu.png"
               v-hasPermission="
              `contractManagement.nonContract.nonContractInfo.view`"
             @click="handlecost(scope.row)" alt="" /> -->
             <el-link v-hasPermission="
              `contractManagement.buyContract.buyContractInfo.view`
            " target="_blank" type="primary" :underline="false" @click="handleExamine(scope.row)"
            >查看</el-link>
            <el-divider direction="vertical"></el-divider>
            <el-link v-hasPermission="
              `contractManagement.buyContract.buyContractInfo.edit`
            " target="_blank" type="primary" :underline="false" @click="handleEdit(scope.row)"
              :disabled="(scope.row.approveStatus!=null && scope.row.approveStatus!='发起人撤回')">编辑</el-link>
              <el-dropdown>
              <span class="btn_css">•••</span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item v-hasPermission="
              `contractManagement.buyContract.buyContractInfo.delete`
            "><el-link target="_blank" type="primary" :underline="false" @click="handleDelete(scope.row)"
              :disabled="(scope.row.approveStatus!=null && scope.row.approveStatus!='发起人撤回')">删除</el-link>
                </el-dropdown-item>
                <el-dropdown-item v-hasPermission="
              `contractManagement.buyContract.buyContractInfo.edit`
            ">
                  <el-link  target="_blank" type="primary" :underline="false" @click="withdraw(scope.row)"
              :disabled="scope.row.approveStatus && scope.row.approveStatus=='发起人撤回'||scope.row.status=='已驳回'">撤回</el-link>
                </el-dropdown-item>
                <el-dropdown-item v-hasPermission="
              `contractManagement.buyContract.buyContractInfo.view`
            ">
                  <el-link target="_blank" type="primary" :underline="false" @click="handleaudit(scope.row)"
              :disabled="!scope.row.taskId">审核</el-link>
                </el-dropdown-item>
              <el-dropdown-item v-hasPermission="`contractManagement.buyContract.buyContractInfo.view`">
                <el-link target="_blank" type="primary" :underline="false" @click="handlecost(scope.row)">费用详情</el-link>
              </el-dropdown-item>
              <el-dropdown-item v-hasPermission="`contractManagement.buyContract.buyContractInfo.view`">
                <el-link target="_blank" type="primary" :underline="false" @click="handleprofit(scope.row)">利润详情</el-link>
              </el-dropdown-item>
              <el-dropdown-item v-hasPermission="`contractManagement.buyContract.buyContractInfo.view`">
                <el-link :disabled="scope.row.amountEdPayable=='他运'" target="_blank" type="primary" :underline="false" @click="handletransport(scope.row)">运输详情</el-link>
              </el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
            <!-- <ws-button v-if="scope.row.approveStatus && scope.row.approveStatus!='发起人撤回'" type="primary" @click="withdraw(scope.row)" >撤回</ws-button> -->
        </template>
      </el-table-column>
    </el-table>
    <el-pagination :page-sizes="[10, 30, 50, 100, 500, 1000, 9999]" @size-change="handleSizeChange"
      @current-change="handleCurrentChange" :current-page="currentPage" :page-size="deptCircularPage.pageSize"
      layout="total, sizes, prev, pager, next, jumper" :total="deptBudgetTotal">
    </el-pagination>

    <!-- 附件 -->
    <WinseaContentModal v-model="accessoryTFs" :title="$t('system.noticeCircular.information')"
      @on-cancel="handleClose">
      <div v-if="applstatus">
        <ws-upload ref="upload" :size-limit="size" @onChange="onChange" :comp-id="compId" :appendix-ids="appendixIdss"
          accept=".jpg, .jpeg, .png, .pdf, .doc, .docx, .zip, .rar"
          v-hasPermission="`contractManagement.buyContract.buyContractInfo.appl`" />
      </div>
      <ws-upload v-else ref="upload" :comp-id="compId" :appendix-ids="appendixIdss" :editable="false"
        accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar" />
    </WinseaContentModal>
    <!-- 结算单 -->
    <!-- <WinseaContentModal v-model="countMoney" title="结算单信息"
      @on-cancel="handleClose">
      <div v-if="jiesuanstatus">
        <ws-upload ref="upload" :size-limit="size" @onChange="onChange1" :comp-id="compId" :appendix-ids="appendixIdss"
          accept=".jpg, .jpeg, .png, .pdf, .doc, .docx, .zip, .rar"
          v-hasPermission="`contractManagement.buyContract.buyContractInfo.jiedan`" />
      </div>
      <ws-upload v-else ref="upload" :comp-id="compId" :appendix-ids="appendixIdss" :editable="false"
        accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar" />
    </WinseaContentModal> -->
     <!-- 上传已开发票  -->
     <WinseaContentModal v-model="invoiceSwitch" title="发票信息"
      @on-cancel="handleClose">
      <div v-if="fapiaostatus">
        <ws-upload ref="upload" :size-limit="size" @onChange="onChange2" :comp-id="compId" :appendix-ids="appendixIdss"
          accept=".jpg, .jpeg, .png, .pdf, .doc, .docx, .zip, .rar"
          v-hasPermission="`contractManagement.buyContract.buyContractInfo.fapiao`" />
      </div>
      <ws-upload v-else ref="upload" :comp-id="compId" :appendix-ids="appendixIdss" :editable="false"
        accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar" />
    </WinseaContentModal>
  </div>
</template>
<script>
import {
  getList,
  export1,
  editstatus,
  billoperatehis,
  deletecontract,
  editInfo,
  getsettlementprice,
  getstafffind,
  sponsorWithdraw,
  editProcessInfo
} from '@/model/contarct/index'
import {
  downloadFile
} from '@/utils/batchDown'
import {
    gettask,
  } from '@/model/outboundManagement/index'
import { allRoles } from '@/utils/util'
import { hasPermission } from '../../utils/getHasPermission'
import Pagination from '@/components/Pagination'
import WsUpload from '@/components/WsUpload'
import {
  dayjs,
  EventBus
} from 'base-core-lib'
export default {
  name: 'viewSpareMoney',
  components: {
    WsUpload,
    Pagination,
  },
  watch: {
    vesselId(val) {
      this.getList()
    },
    isShow(val) {
      this.showType = val
    },
  },
  data() {
    return {
      id: '',
      //弹出框
      dialogViewSpareMoney: false,
      dialogApproveFormVisible: false,
      // 船舶类型
      monetaryKey: null,
      // 表格显示数据
      tableDate: [],
      size: 10,
      statusList: [{
        value: '已完成',
      }, { value: '发运结束', }],
      // 是否显示
      showType: true,
      // 年
      year: '',
      deliver_type: 1,
      deptBudgetTotal: 0,
      currentPage: 1,
      pageSize: 20,
      appendixIdsAdd: '',
      searchType: 1,
      searchTypeText: '未完成',
      searchKeyWord: '',
      contractType: 2,
      goodsType: 1,
      startDate: null,
      endDate: null,
      showFlag:false,
      addressUrls: [],
      accesscard: false,
      // 提交类型
      submitType: true,
      deptCircularPage: {},
      date: {
        year: dayjs().format('YYYY'),
        month: dayjs().format('MM'),
      },
      contractList: [],
      deptBudgetList: {},
      historyList: [],
      appendixIdss: [],
      fileList: [],
      compId: localStorage.getItem('ws-pf_compId'),
      pickerBeginDateBefore: {
        disabledDate: (time) => {
          return time.getTime() > Date.now()
        },
      },
      accessoryTFs: false,//附件
      countMoney:false,//结算单
      invoiceSwitch:false,//发票上传
      taskTypeList: [{
        value: '未完成',
        type: 1,
      },
      {
        value: '已完成',
        type: 2,
      },
      {
        value: '审批中',
        type: 4,
      },
      {
        value: '全部合同',
        type: '',
      },
      ],
      pickerOptions: {
        shortcuts: [{
          text: '本周',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            var thisDay = start.getDay()
            var thisDate = start.getDate()
            if (thisDay != 0) {
              start.setDate(thisDate - thisDay)
            }
            picker.$emit('pick', [start, end])
          },
        },
        {
          text: '本月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setDate(1)
            picker.$emit('pick', [start, end])
          },
        },
        {
          text: '本季度',
          onClick(picker) {
            var oDate = new Date()

            var thisYear = oDate.getFullYear()
            var thisMonth = oDate.getMonth() + 1

            var n = Math.ceil(thisMonth / 3) // 季度

            var Month = n * 3 - 1

            var start = new Date(thisYear, Month - 2, 1)
            var end = new Date()

            picker.$emit('pick', [start, end])
          },
        },
        ],
      },
      applstatus: false,
      jiesuanstatus:false,
      fapiaostatus:false,
      value1: '',
      value2: '',
      createPersion: '',//创建人
      persionList: [],
    }
  },
  activated() {
    console.log(allRoles())
    this.applstatus = hasPermission('contractManagement.buyContract.buyContractInfo.appl')
    this.jiesuanstatus = hasPermission('contractManagement.buyContract.buyContractInfo.jiedan')
    this.fapiaostatus = hasPermission('contractManagement.buyContract.buyContractInfo.fapiao')
    console.log(this.applstatus) 
    //cg.viewBudget
    //cg.viewSpareMoney
    // this.getVesselData();
    this.getList()
    this.showType = this.isShow
    this.persionXiaLa()
  },
  methods: {
    submitgoodsNames(row){
      console.log(row)
      if(row.invoiced<0){
        this.$notify.warning({
            title: '警告',
            message: '发票金额输入错误',
          })
      }
      var dataobj={}
      dataobj.id=row.id
      dataobj.flag=3
      dataobj.invoiced=row.invoiced
      editInfo(dataobj)
            .toPromise()
            .then((response) => {
              this.$message.success('修改成功')
              this.getList()
            })
    },
     whether(row) {
          row.identification1 = 'true'
      },
      //修改开票金额
      varietyClick(row) {
        var title = ''
        var data = {}
        title = '确定要修改已开发票金额？'
        data = {
            goodsName: row.invoiced,
            id: row.id
          }
        this.$confirm(title, {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          })
          .then(() => {
            editProcessInfo(data)
              .toPromise()
              .then((response) => {
                this.$notify.success({
                  title: '成功',
                  message: '修改成功',
                })
                this.getList()
              })
              .catch(() => {
                return false
              })
          })
      },
    persionXiaLa() {
      getstafffind({
        roles: 'b96299bb5dcf461e916b72b64c6943b0'
      })
        .toPromise()
        .then((response) => {
          this.persionList = response
        })
    },
    withdraw(row) {
      this.$confirm(`撤回成功后，可再次提交，确定撤回该合同吗？`, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
      }).then(() => {
        sponsorWithdraw({
          workflowId: row.workflowId,
          businessKey: row.id,
        }).toPromise()
          .then((response) => {
            this.$message.success('撤回成功')
            this.getList()
          })
      })
    },
    // handlecost(row) {
    //   this.$router.push({
    //     name: 'buyContractcost',
    //     query: {
    //       id: row.id,
    //       contractNo: row.contractNo,
    //       status: row.status,
    //       seller: row.seller
    //     },
    //   })
    // },
    onChange() {
      this.$refs.upload
        .handleSaveBill()
        .then(async (response) => {
          this.deptBudgetList.addressUrl = response
          this.deptBudgetList.id = this.id
          this.deptBudgetList.flag = 1
          editInfo(this.deptBudgetList)
            .toPromise()
            .then((response) => {
              this.accessoryTFs = false
              this.$message.success('上传成功')
              this.getList()
            })
        })
        .catch((res) => {
          EventBus.$emit('error', (JSON.parse(res) || {}).message)
          this.$refs.upload.clearFiles()
        })
    },
    onChange1() {
      this.$refs.upload
        .handleSaveBill()
        .then(async (response) => {
          this.deptBudgetList.statementUrl = response
          this.deptBudgetList.id = this.id
          this.deptBudgetList.flag = 1
          editInfo(this.deptBudgetList)
            .toPromise()
            .then((response) => {
              this.countMoney = false
              this.$message.success('上传成功')
              this.getList()
            })
        })
        .catch((res) => {
          EventBus.$emit('error', (JSON.parse(res) || {}).message)
          this.$refs.upload.clearFiles()
        })
    },
    onChange2() {
      this.$refs.upload
        .handleSaveBill()
        .then(async (response) => {
          this.deptBudgetList.invoiceUrl = response
          this.deptBudgetList.id = this.id
          this.deptBudgetList.flag = 1
          editInfo(this.deptBudgetList)
            .toPromise()
            .then((response) => {
              this.invoiceSwitch = false
              this.$message.success('上传成功')
              this.getList()
            })
        })
        .catch((res) => {
          EventBus.$emit('error', (JSON.parse(res) || {}).message)
          this.$refs.upload.clearFiles()
        })
    },
    dateFormat(fmt, date) {
      let ret
      const opt = {
        'Y+': date.getFullYear().toString(), // 年
        'm+': (date.getMonth() + 1).toString(), // 月
        'd+': date.getDate().toString(), // 日
        'H+': date.getHours().toString(), // 时
        // "M+": date.getMinutes().toString(),         // 分
        // "S+": date.getSeconds().toString()          // 秒
        // 有其他格式化字符需求可以继续添加，必须转化成字符串
      }
      for (let k in opt) {
        ret = new RegExp('(' + k + ')').exec(fmt)
        if (ret) {
          fmt = fmt.replace(
            ret[1],
            ret[1].length == 1 ? opt[k] : opt[k].padStart(ret[1].length, '0')
          )
        }
      }
      return fmt
    },

    handleClose() {
      this.dialogViewSpareMoney = false
      this.countMoney = false
      this.invoiceSwitch = false
    },
    async selectstatuschange(e, row) {
      var data = {}
      var text = `是否将状态改为${e}`
      // if(e!='已完成'){
      //   this.$confirm(text, {
      //       confirmButtonText: '确定',
      //       cancelButtonText: '取消',
      //       type: 'warning',
      //     })
      //       .then(() => {
      //         editstatus(data)
      //           .toPromise()
      //           .then((response) => {
      //             this.$notify.success({
      //               title: '成功',
      //               message: '状态修改成功',
      //             })
      //             this.getList()
      //           })
      //           .catch((response) => {
      //             row.status = row.currectstatus
      //             // EventBus.$emit('error', this.$t('showMessage.asteriskRequired'))
      //           })
      //       })
      //       .catch(() => {
      //         row.status = row.currectstatus
      //         return false
      //       })
      // }else{
      
          if (e == '发运结束') {
            data = { id: row.id, endFlag: 1 }
          } else if (e == '已完成') {
            var response=await getsettlementprice({ contractNo: row.contractNo }).toPromise().catch(()=>{
              row.status = row.currectstatus
              return
            })
            if(row.status=='执行中'){
              return
            }
              data = { id: row.id, settlementPrice: response}
              text = `合同单价${response}元/吨，确定合同已完成?`   
          } else {
            data = { id: row.id }
          }

          this.$confirm(text, {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          })
            .then(() => {
              editstatus(data)
                .toPromise()
                .then((response) => {
                  this.$notify.success({
                    title: '成功',
                    message: '状态修改成功',
                  })
                  this.getList()
                })
                .catch((response) => {
                  row.status = row.currectstatus
                  // EventBus.$emit('error', this.$t('showMessage.asteriskRequired'))
                })
            })
            .catch(() => {
              row.status = row.currectstatus
              return false
            })

        // }
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`)
      this.pageSize = val
      this.getList()
    },
    handleCurrentChange(val) {
      this.currentPage = val
      console.log(`当前页: ${val}`)
      this.getList()
    },
    getList() {
      getList({
        compId: localStorage.getItem('ws-pf_compId'),
        contractType: this.contractType,
        goodsType: this.goodsType,
        currentPage: this.currentPage,
        pageSize: this.pageSize,
        searchType: this.searchType,
        searchKeyWord: this.searchKeyWord,
        startDate: this.startDate,
        endDate: this.endDate,
        contrPage: this.contrPage,
        creator:this.createPersion
      })
        .toPromise()
        .then((response) => {
          for (var i = 0; i < response.records.length; i++) {
            response.records[i].identification1 = 'false'
            if (response.records[i].status) {
              response.records[i].currectstatus = response.records[i].status
            }
            if (response.records[i].completedQuantity) {
              response.records[i].completedQuantity = response.records[i].completedQuantity.toFixed(3)
            }

            if (response.records[i].addressUrl != null) {
              if (response.records[i].addressUrl) {
                response.records[i].addressUrlArray =
                  response.records[i].addressUrl.split(',')
              }
            } else {
              response.records[i].addressUrlArray = []
            }
            if (response.records[i].creator == localStorage.getItem('ws-pf_staffName')) {
              response.records[i].showFlag = true
              }
          }
          this.deptCircularPage.currentPage = response.current
          this.deptCircularPage.pageSize = response.size
          this.deptBudgetTotal = response.total
          this.contractList = response
          for (var i = 0; i < response.records.length; i++) {
            var arr = new Array()
            this.addressUrls[i] = new Array()
            if (this.contractList.records[i].addressUrl != null) {
              arr = this.contractList.records[i].addressUrl.split(',')
              this.addressUrls[i] = arr
            }
          }
        })
    },
    // 上传附件
    uploadSuccess(data, files, url) {
      console.log(data, files, url)

      // this.deptBudgetList.
      // this.formData.append('files', files)
      // this.feedbackObj.uploadNameAttachment = data.appendixName
      // this.feedbackObj.pathUploadAttachment = data.appendixPath
      // // this.newAppendixs = files
      // this.onChangeFlag = true
    },
    editClick(row) {
      var status = ''
      if (row.status == '待执行' || row.status == '已完成') {
        status = '执行中'
      } else if (row.status == '执行中' || row.status == '发运结束') {
        status = '已完成'
      }
      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
          this.find()
        }
      }
    },
    fujian(row) {
      this.id = row.id
      this.accessoryTFs = true
      this.appendixIdss = row.addressUrl
      console.log(this.appendixIdss)
    },
    settlement(row){
      this.id = row.id
      this.countMoney = true
      this.appendixIdss = row.statementUrl
    },
    invoiceUploade(row){
      this.id = row.id
      this.invoiceSwitch = true
      this.appendixIdss = row.invoiceUrl
    },
    handleExamine(row) {
      console.log(row)
      this.$router.push({
        name: 'purchaseContractExamine',
        query: {
          id: row.id,
          status: row.status,
        },
      })
    },
    handleAdd() {
      this.$router.push({
        path: 'purchaseContractAdd',
      })
    },
    handleEdit(row) {
      this.$router.push({
        name: 'purchaseContractEdit',
        query: {
          id: row.id,
        },
      })
    },
    handleaudit(row) {
      this.$router.push({
        name: 'purchaseContractAudit',
        query: {
          id: row.id,
          status: row.status,
        },
      })
    },
    handlecost(row) {
      this.$router.push({
        name: 'expensemanagementdetails',
        query: {
          contractNo: row.contractNo,
        },
      })
    },
    handleprofit(row) {
      this.$router.push({
        name: 'contractprofits',
        query: {
          contractNo: row.contractNo,
        },
      })
    },
    handletransport(row) {
  gettask({contractNo:row.contractNo,compId:localStorage.getItem('ws-pf_compId')}).toPromise().then((response) => {
        if(!response||response==0){
          this.$message({
            message: '联系内勤创建运输任务',
            type: 'warning',
                      
          });
        }else{
          this.$router.push({
            name: 'autoSettlementList',
            query: {
              contractNo: row.contractNo,
            },
          })
        }
      })
    },
    
    // 关闭 dialog时 处理文件url 初始化upload组件
    history(row) {
      console.log(row)
      billoperatehis({
        id: row.id,
      })
        .toPromise()
        .then((response) => {
          this.historyList = response
        })
    },
    find() {
      if (this.value2) {
        this.startDate = this.dateFormat('YYYY-mm-dd', this.value2[0])
        this.endDate = this.dateFormat('YYYY-mm-dd', this.value2[1])
      } else {
        this.startDate = ''
        this.endDate = ''
      }
      this.currentPage = 1
      this.getList()
    },
    async exportlist() {
      const {
        data
      } = await export1({
        compId: localStorage.getItem('ws-pf_compId'),
        contractType: this.contractType,
        goodsType: this.goodsType,
        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',
      })
    },
    // deletecontract(){},
    //删除
    handleDelete(row) {
      var text = ''
      if (row.deliverType == 1) {
        text =
          '删除该合同将同时永久删除合同对应的临时仓库相关数据，是否确定删除？'
      } else {
        text = '合同删除后不可恢复，是否继续删除？'
      }
      this.$confirm(text, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          deletecontract({
            id: row.id,
          })
            .toPromise()
            .then((response) => {
              this.$notify.success({
                title: '成功',
                message: '删除成功',
              })
              this.getList()
            })
            .catch((response) => { })
        })
        .catch(() => {
          return false
        })
    },
  },
}
</script>
<style lang="scss" scoped>
.vertical-text-left {
  width: 62px;
  text-align: right;
}

.flex {
  display: flex;
}

.el-range-editor.el-input__inner {
  margin-left: 10px;
}

/deep/.base_header_layout .grid-content.right .find.el-button--primary {
  width: 30px;
  margin-left: -10px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

.el-button--primary {
  background-color: #5878e8;
  border-color: #5878e8;
}

.el-button--default {
  border: 1px solid #5473e8;
  color: #5473e8;
}

// .warning {
//   width: 100%;
//   height: 2px;
//   background: red;
// }

.executory,
.inExecution,
.done {
  width: 6px;
  height: 6px;
  display: inline-block;
  border-radius: 50%;
  position: relative;
  top: -1px;
}

.executory {
  background: #ff9f24;
}

.inExecution {
  background: #5878e8;
}

.done {
  background: #50cad4;
}

// .top-grade {
//   background: linear-gradient(90deg, #5678e9, #7993f6);
//   color: #fff;
//   padding: 3px;
//   border-radius: 2px;
// }

// .second-class {
//   background: linear-gradient(90deg, #50cdd9, #82e2ea);
//   color: #fff;
//   padding: 3px;
//   border-radius: 2px;
// }

// .third-class {
//   background: linear-gradient(90deg, #ffa735, #ffbf70);
//   color: #fff;
//   padding: 3px;
//   border-radius: 2px;
// }

// .substandard {
//   background: linear-gradient(90deg, #b2b4bb, #ced0d5);
//   color: #fff;
//   padding: 3px;
//   border-radius: 2px;
// }

.wrap {
  width: 400px;
  position: absolute;
  top: 131px;
  left: 794px;
  transform-origin: right center;
  z-index: 2005;
}

.vertical-line {
  height: 64px;
  border-left: 2px solid #e9ecf7;
  margin-left: 4px;
  padding: 0 3px;
  // border-image: -webkit-linear-gradient(#00eba7, #08b8e6) 30 30;
  // border-image: -moz-linear-gradient(#00eba7, #08b8e6) 30 30;
  // border-image: linear-gradient(#00eba7, #08b8e6) 30 30;
}

.el-pagination {
  padding: 10px 15px;
  margin-bottom: 0;
  text-align: center;
}

/deep/.el-pager li.active {
  color: #5878e8;
  cursor: default;
}

/deep/.el-pager li:hover {
  color: #5878e8;
  cursor: default;
}

.vertical-circle {
  width: 10px;
  height: 10px;
  border: 2px solid #5878e8;
  background-color: #ffffff;
  -webkit-border-radius: 100px;
}

.vertical-circle:first-child {
  color: red;
}

.vertical-text {
  margin: 0 10px;
  color: #8890b1;
  font-size: 12px;
  margin-top: -4px;
}

/deep/.el-table .el-table__header .cell,
/deep/.el-table .el-table__body .cell {
  text-align: center;
}

.typeselect {
  width: 500px;
}

.padding-xs {
  padding: 15px;
  text-align: right;
}

.clearfix:after {
  content: '';
  display: block;
  clear: both;
}

.el-table {
  font-size: 16px;
}

.taskType {
  width: 100%;
  background-color: #fff;
  margin-top: 2px;
  margin-bottom: 10px;
  list-style: none;

  // padding-bottom: 20px;
  li {
    float: left;
    border: 1px solid #6ea0f3;
    border-radius: 5px;
    max-width: 190px;
    padding: 0 5px;
    text-align: center;
    margin: 10px 20px;
    cursor: pointer;
    font-size: 14px;

    p {
      margin: 8px 0px;

      span {
        color: #e74c3c;
      }
    }
  }

  li:hover {
    background-color: #e4eeff;
    color: #1d6ced;
  }
}

.el-date-editor--date {
  margin: 0 10px;
}

.findValue {
  margin: 0 10px;
}
.inputChenge {
    width: 100%;
    display: inline-flex;
    margin-left: -28%;
  }
    .inputs {
    margin: 0 auto;
  }
/deep/.findValue .el-input__inner {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

// .button-container {
//   display: flex;
//   flex-wrap: nowrap;
//   justify-content: space-between;
//   align-items: center;
//   background-color: #fff;
//   width: 100%;
//   height: 50px;
//   padding: 0 10px;

//   &>div {
//     margin-left: 10px;
//     display: flex;
//     flex-wrap: nowrap;
//     flex-direction: row;

//     &>span {
//       line-height: 50px;
//     }
//   }

//   /deep/.auditFlow-box {
//     position: unset;
//     margin-left: 10px;

//     &/deep/.auditFlow-icon {
//       width: auto;
//       padding-right: 30px;
//     }

//     &/deep/.auditFlow-main {
//       position: absolute;
//     }
//   }
// }

// .box-app {
//   display: inline-block;
//   float: left;
//   margin-left: 30px;
//   line-height: 50px;
// }

/deep/.el-dialog {
  .el-form-item {
    margin-bottom: 0 !important;

    .el-input--medium {
      textarea {
        min-height: 100px !important;
      }
    }
  }
}

.collapse-bottom {
  margin-bottom: 20px;
}

.input-main .textarea .el-textarea__inner {
  width: 100%;
  z-index: 1;
}

/*.crt-main .textarea /deep/ .el-form-item__label {*/
/*  height: 82px;*/
/*}*/
// 控制select为只读的时候显示样式

// .hide-sel {
//   .el-input__inner {
//     border: 0px;
//   }

//   .el-icon-arrow-up {
//     display: none;
//   }

//   .el-textarea__inner {
//     background-color: #fff !important;
//     border: 0;
//   }

//   .el-date-editor {
//     i {
//       display: none;
//     }
//   }

//   .is-disabled {
//     .el-input__inner:hover {
//       background-color: #fff !important;
//       border: 0;
//     }

//     color: #606266;

//     .el-input__inner {
//       background-color: #fff !important;
//       border: 0;
//       color: #606266;
//     }

//     .el-textarea__inner {
//       background-color: #fff !important;
//       border: 0;
//       color: #606266;
//     }
//   }
// }

// 控制select为只读的时候显示样式
/deep/.ws-class-table-col {
  height: auto;
  padding: 0px 2px;

  /deep/.el-input__inner {
    padding: 0px 2px;
  }
}

/deep/.is-disabled {
  .el-input__prefix,
  .el-input__suffix {
    display: none;
  }

  .el-input__inner {
    background-color: #fff;
    border-color: #fff !important;
    color: #000 !important;
    font-size: 14px;
    cursor: text;
    padding: 0 !important;
  }
}

/deep/.typeselect .el-input__inner {
  color: #8890b1;
}

/deep/.statusselect .el-input__inner {
  color: #8890b1;
  width: 100%;
}
.btn_css {
    color: #409eff;
    cursor: pointer;
    position:relative;
    top:2px;
  }
</style>