<template>
  <div class="app-container">
    <div class="filter-container">
      <el-input :size="sizeType" v-model="search.keyWord" placeholder="关键字" style="width: 200px;" class="filter-item"/>

      <el-button :size="sizeType" class="filter-item" type="primary" icon="el-icon-search" @click="searchData">
        搜索
      </el-button>
      <el-button
        class="filter-item"
        type="green"
        icon="el-icon-plus"
        :size="sizeType"
        @click="createOrderFun">
        创建订单
      </el-button>
      <el-button
        class="filter-item"
        type="warning"
        icon="el-icon-plus"
        :size="sizeType"
        @click="createOrderCharge">
        创建收款订单
      </el-button>
<!--      <el-button :size="sizeType" type="green">批量下单</el-button>-->
      <div class="top-right-btn">
        <el-tooltip class="item" effect="dark" content="刷新" placement="top">
          <el-button size="mini" circle icon="el-icon-refresh" @click="getList"/>
        </el-tooltip>
      </div>
    </div>
    <el-table
      :data="tableData"
      v-loading="listLoading"
      stripe
      row-key="id"
      border
      :size="sizeType"
      style="margin-top: 10px"
      @selection-change="handleSelectionChange"
      default-expand-all>
<!--      <el-table-column-->
<!--        type="selection"-->
<!--        fixed="left"-->
<!--        width="55">-->
<!--      </el-table-column>-->
      <el-table-column fixed label="操作" align="center" width="280px" class-name="small-padding fixed-width">
        <template slot-scope="{row}">
          <el-dropdown
            size="mini"
            @command="orderPayType($event,row)"
            trigger="click">
            <el-button size="mini" type="warning" class="iconfont">
              &#xe605;
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="1">收款</el-dropdown-item>
              <el-dropdown-item command="2">支付单</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
          <el-button
            title="编辑发货通知"
            @click="openNotices(row)"
            type="green"
            icon="el-icon-location-information"
            size="mini">
          </el-button>
          <el-button
            title="编辑"
            v-if="row.idProduct>0"
            @click="if($store.state.app.sidebar.opened){$store.dispatch('app/toggleSideBar')};$router.push({path:'/order/editOrder/'+row.id,query:{id:row.id,orderCode:row.orderCode,editType:1,versionCode:row.versionCode,pageFrom:1}})"
            type="primary"
            icon="el-icon-edit"
            size="mini">
          </el-button>
          <el-button
            title="编辑"
            v-else-if="row.idProduct<=0"
            @click="openMaterialEdit(row)"
            type="primary"
            icon="el-icon-edit"
            size="mini">
          </el-button>
          <el-button v-if="row.orderType == 3" size="mini" icon="el-icon-refresh" title="更换产品类型" @click="openChangeType(row)"></el-button>
<!--          <el-button-->
<!--            type="green"-->
<!--            size="mini"-->
<!--            style="margin-left: 0"-->
<!--            icon="el-icon-document-checked"-->
<!--            @click="commitOrder(row)"-->
<!--            title="提交"></el-button>-->
          <el-dropdown size="mini" @command="getUploadType($event,row)" trigger="click">
            <el-button size="mini" type="warning" icon="el-icon-upload"></el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="1">上传文件（云）</el-dropdown-item>
<!--              <el-dropdown-item command="2">传输文件</el-dropdown-item>-->
              <el-dropdown-item command="3">关联文件</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
<!--          <el-button size="mini" type="info" class="iconfont"  @click="openOrderPrePay(row)" title="提交预收款申请">&#xe605;</el-button>-->
        </template>
      </el-table-column>
      <el-table-column
        label="序号"
        fixed
        align="center"
        width="50"
        type="index">
        <template slot-scope="scope">
          <span>{{(listData.page - 1) *listData.pageSize + scope.$index + 1}}</span>
        </template>
      </el-table-column>
      <template v-for="column in defaultItem">
        <el-table-column
          v-if="column.id == 3"
          :prop="column.field"
          :label="column.name"
          :width="column.width"
          sortable="custom"
          fixed
          show-overflow-tooltip>
          <template slot-scope="{row}">
            <a href="javascript:;" style="color: #20a0ff" @click="getOrderStep(row)">{{ row[column.field] }}
              <span v-if="row.businessKind==3" style="display: inline-block;color: red">(补{{ row.rePrintIndex}})</span>
              <el-image v-if="row.firstOrderFlag == 1" :src="new_badge"></el-image></a>
          </template>
        </el-table-column>
        <el-table-column
          v-else-if="column.id == 2"
          :prop="column.field"
          :label="column.name"
          :width="column.width"
          show-overflow-tooltip>
          <template slot-scope="{row}">
            <el-tag size="mini" v-if="row[column.field] == '待编辑'" type="info">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '待审核'" type="success">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '待组版'">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '已组版'" type="danger">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '生产中'" type="danger">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '待入库'" type="green">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '待发货'" >{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '已发货'" type="info">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == '文件待处理'" type="warning">{{ row[column.field] }}</el-tag>
            <el-tag size="mini" v-else>{{ row[column.field] }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          v-else-if="column.id == 24"
          align="center"
          header-align="center"
          :prop="column.field"
          :label="column.name"
          :width="column.width"
        >
          <template slot-scope="{row}">
            <el-tag size="mini" type="primary" v-if="row[column.field] == 0">正常业务</el-tag>
            <el-tag size="mini" type="warning" v-else-if="row[column.field]== 1">外协订单</el-tag>
            <el-tag size="mini" type="success" v-else-if="row[column.field] == 2">物料订单</el-tag>
            <el-tag size="mini" type="danger" v-else-if="row[column.field] == 3">补印订单</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          v-else-if="column.id == 6"
          header-align="center"
          :prop="column.field"
          :label="column.name"
          show-overflow-tooltip
          :width="column.width">
          <template slot-scope="{row}">
            <template v-if="row.orderMessage">
              <el-button size="mini" circle icon="el-icon-plus" @click="openMessage(row)"></el-button>
              <a href="javascript:;" style="color: #20a0ff" @click="openMessage(row)">{{row.orderMessage}}</a>
            </template>
            <template v-else>
              <el-button size="mini" circle icon="el-icon-plus" @click="openMessage(row)"></el-button>
            </template>
          </template>
        </el-table-column>
        <el-table-column
          v-else-if="column.id == 21"
          :prop="column.field"
          :label="column.name"
          :width="column.width">
          <template slot-scope="{row}">
            <el-tag size="mini" v-if="row[column.field] == 0">初始</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == 1" type="success">待审核</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == 2" type="danger">待入账</el-tag>
            <el-tag size="mini" v-else-if="row[column.field] == 3" type="warning">已入账</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          v-else-if="column.id == 12"
          header-align="center"
          :prop="column.field"
          :label="column.name"
          :width="column.width"
        >
          <template slot-scope="{row}">
            <span v-if="row.createTime">{{row.createTime | getTime }}</span>
          </template>
        </el-table-column>
        <el-table-column
          v-else-if="column.id == 11"
          header-align="center"
          :prop="column.field"
          :label="column.name"
          :width="column.width"
          show-overflow-tooltip
        >
          <template slot-scope="{row}">
            <el-link :href="row.originFileLink" target="_blank" style="color: #20a0ff">{{row[column.field]}}</el-link>
          </template>
        </el-table-column>
        <el-table-column
          v-else
          :prop="column.field"
          :label="column.name"
          :width="column.width"
          show-overflow-tooltip>
        </el-table-column>
      </template>
    </el-table>
    <pagination v-show="listData.total>0" :total="listData.total" :page.sync="listData.page"
                :limit.sync="listData.pageSize" @pagination="getList"/>

    <el-drawer
      title="订单消息"
      :reverse="true"
      :visible.sync="memoDrawer"
      size="600px">
      <order-message ref="orderMessage"></order-message>
    </el-drawer>
    <el-dialog :close-on-click-modal="false" title="上传文件" :visible.sync="pluploadVisible" width="600px">
      <el-form label-width="130px" label-position="right">
        <el-form-item label="上传文件">
          <plupload
            v-if="showUpload"
            :file-list="files"
            :limit="1"
            :upUrl="'apis/upload/orderFile'"
            :upType="2"
            :idOrder="upIdOrder"
            :order-code="upOrderCode"
            biz-type="trainModule"
            accept-files=".cdr,.ai,.ps,.eps,.zip,.rar,.xml,.txt,.pdf,.docx,.doc,.xlsx,.xls,.ppt,.pptx,.mp4,.mp3,.gif,.png,.jpg,.jpeg,.bmp"
            @onChange="handleFileChange"
          />
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-dialog title="提交预收款申请" :visible.sync="voidVisible" width="500">
      <el-form label-width="80px" label-position="right">
        <el-form-item label="申请备注">
          <el-input type="textarea" v-model="sMemo"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="voidVisible = false">取 消</el-button>
        <el-button type="primary" @click="sendOrderPrePayBtn">确 定</el-button>
      </div>
    </el-dialog>
    <cancledialog @tableRefresh="tableRefresh" ref="confirmDialog"></cancledialog>
    <create-order-dialog ref="createOrder" @tableRefresh="tableRefresh"></create-order-dialog>
    <el-dialog title="创建收款订单" :visible.sync="createOrderChargeVisible" width="500px">
      <el-dialog :title="innerTitle" :append-to-body="true"  :visible.sync="createInnerVisible">
        <clientInfo v-if="innerType == 2" :is-choose="true" @chooseClient='chooseClient1'></clientInfo>
      </el-dialog>
      <el-form :model="createChargeInfo" ref="createChargeInfo" :rules="chargeRules" label-width="80px" label-position="right">
        <el-form-item label="客户名称" prop="clientName">
          <el-input
            style="width: 300px"
            v-model="createChargeInfo.clientName"
            disabled
            class="input-with-select"
            @click.native ="createInnerVisible = true;innerType = 2;innerTitle ='选择客户'"
          >
            <el-button
              slot="append"
              @click="createInnerVisible = true;innerType = 2;innerTitle ='选择客户'">选择</el-button>
          </el-input>
        </el-form-item>
        <el-form-item label="订单名称">
          <el-input  v-model="createChargeInfo.orderName" style="width: 300px">
          </el-input>
        </el-form-item>
        <el-form-item label="订单金额" prop="orderMoneyTotal">
          <el-input type="number" v-model="createChargeInfo.orderMoneyTotal" style="width: 300px">
          </el-input>
        </el-form-item>
        <el-form-item label="订单备注">
          <el-input type="textarea" v-model="createChargeInfo.orderMemo" style="width: 300px">
          </el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="createOrderChargeVisible = false">取 消</el-button>
        <el-button type="primary" @click="createChargeBtn">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="更换产品类型" :visible.sync="changeOrderTypeVisible" width="500px">
      <h3 style="color: #E6A23C">更换产品类型，将删除订单所有部件信息，请谨慎操作！</h3>
      <el-form :model="changeInfo" ref="createInfo" label-width="80px" label-position="right">
        <el-form-item label="产品类型" prop="productName" >
          <el-select v-model="changeInfo.idProduct" style="width: 300px" filterable placeholder="请选择" value-key="id">
            <el-option
              v-for="item in productList"
              :key="item.id"
              :label="item.productName"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="changeOrderTypeVisible = false">取 消</el-button>
        <el-button type="primary" @click="changeBtn">确 定</el-button>
      </div>
    </el-dialog>
    <order-step ref="orderStep"></order-step>

    <el-dialog
      title="订单收款"
      :close-on-click-modal="false"
      class="orderPayDialog"
      :visible.sync='orderPayVisible'
      width="800px">
      <el-card>
        <div class="infoItem">
          <label>订单编号：</label>
          <span>{{ orderPayInfo.orderInfo.orderCode }}</span>
        </div>
        <div class="infoItem">
          <label>印品名称：</label>
          <span>{{ orderPayInfo.orderInfo.orderName }}</span>
        </div>
        <div class="infoItem">
          <label>客户名称：</label>
          <span>{{ orderPayInfo.orderInfo.clientName }}</span>
        </div>
        <div class="infoItem">
          <label>总金额：</label>
          <span>{{ orderPayInfo.orderInfo.orderMoneyTotal }}</span>
        </div>
      </el-card>
      <el-card v-show="orderPayInfo.orderReceivableList.length>0">
        <el-table border :data="orderPayInfo.orderReceivableList" size="mini">
          <el-table-column label="订单编号" prop="orderCode"></el-table-column>
          <!--          <el-table-column label="应收单号" prop="financeCode"></el-table-column>-->
          <el-table-column label="客户名称" prop="clientName"></el-table-column>
          <el-table-column label="单据金额" prop="billMoney"></el-table-column>
          <el-table-column label="已收金额" prop="payMoney"></el-table-column>
          <el-table-column label="欠款" prop="chargeMoney"></el-table-column>
          <el-table-column label="当前收款" prop="currencyValue">
            <template slot-scope="{row}">
              <el-input type="number" size="mini" v-model="row.currencyValue"></el-input>
            </template>
          </el-table-column>
        </el-table>
      </el-card>
      <el-card v-show="!orderPayInfo.orderReceivableList.length>0">
        <el-form label-width="100px">
          <el-form-item label="直接收款金额">
            <el-input type="number" v-model="orderPayInfo.receivableMoney"></el-input>
          </el-form-item>
        </el-form>
      </el-card>
      <div slot="footer" class="dialog-footer">
        <el-button @click="orderPayVisible = false">取 消</el-button>
        <el-button type="primary" @click="orderPaySure" :disabled="orderPayLoading">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="收款单" :close-on-click-modal="false" :visible.sync="paymentBillVisible" width="1000px">
      <el-table :data="paymentBillList" border size="mini">
        <el-table-column label="交易编号" prop="tradeCode" width="110">
          <template slot-scope="{row}">
            <el-tooltip :content="row.tradeCode" placement="top-start" effect="light">
              <span v-if="row.tradeCode">{{ plusXing(row.tradeCode, 6, 4) }}</span>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column label="应收金额" prop="payableMoney" w>
          <template slot-scope="{row}">
            <span>{{ row.payableMoney / 100 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="收款金额" prop="paiedMoney" width="100">
          <template slot-scope="{row}">
            <span>{{ row.paiedMoney / 100 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="二维码地址" prop="qrCodeUrl">
          <template slot-scope="{row}">
            <el-link :href="row.qrCodeUrl" target="_blank">二维码地址</el-link>
          </template>
        </el-table-column>
        <el-table-column label="支付方式" prop="billStatus" width="80">
          <template slot-scope="{row}">
            <el-tag v-if="row.paymentChannel == 1" type="info">银联</el-tag>
            <el-tag v-else-if="row.paymentChannel == 2" type="primary">支付宝</el-tag>
            <el-tag v-else-if="row.paymentChannel == 4" type="success">微信</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="支付状态" prop="billStatus">
          <template slot-scope="{row}">
            <el-tag v-if="row.billStatus == 0" type="danger">未支付</el-tag>
            <el-tag v-else-if="row.billStatus == 1" type="success">已支付</el-tag>
            <el-tag v-else-if="row.billStatus == 2" type="warning">手动终止</el-tag>
            <el-tag v-else-if="row.billStatus == 3" type="warning">超时终止</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="过期时间" prop="expireTime" width="130">
          <template slot-scope="{row}">
            <span v-if="row.expireTime">{{ row.expireTime | getTime }}</span>
          </template>
        </el-table-column>
        <el-table-column label="支付时间" prop="payTime" width="130">
          <template slot-scope="{row}">
            <span v-if="row.payTimeLong>0">{{ row.payTime | getTime }}</span>
            <span v-else> </span>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="160px">
          <template slot-scope="{row}">
            <el-button size="mini" type="danger" @click="cancelPay(row)">取消</el-button>
            <el-button size="mini" type="warning" @click="resetPay(row)">重收</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <el-dialog title="编辑发货通知" :close-on-click-modal="false" :visible.sync="noticeVisible" width="1200px" class="addressDialog">
      <delivery-notice ref="deliveryNotice"></delivery-notice>
    </el-dialog>
    <material-detail :key="timer" ref="materialDetail"></material-detail>
  </div>

</template>

<script>
import { getOrderList, sendOrderPrePayRequest, changePrintOrderProduct } from '@/api/order/tobeEdited'
import { getConfigInfo } from '@/api/system/config'
import {
  addPrintOrder,
  addPrintOrderCharge, cancelOrderPayRequest,
  getOrderReceivableByOrder, getPaymentBillByOrder,
  getSimpleProductInfoList, orderPayRequest, orderPayRequest3, reOrderPayRequest
} from '@/api/order/orderList.js'
import orderMessage from '@/components/orderMessage/orderMessage'
import plupload from '@/components/plupload/plupload.vue'
import Cancledialog from '@/components/Dialog/Cancledialog.vue'
import clientInfo from '@/views/doc/client/clientList'
import OrderStep from "@/components/orderStep/orderStep";
import {orderFormToken} from "@/api/order/orderDetail";
import DeliveryNotice from "@/components/deliveryNotice/deliveryNotice";
import CreateOrderDialog from "@/components/createOrderDialog/createOrderDialog";
import MaterialDetail from "@/components/materialDetail/materialDetail";
import new_badge from '@/assets/new_badge.gif'

const defaultItems = [
  {
    name: '订单编号', id: 3, field: 'orderCode', width: '132px'
  },
  {
    name: '产品类型', id: 1, field: 'productName', width: '130px'
  },
  {
    name: '印品名称', id: 10, field: 'orderName', width: '190px'
  },
  {
    name: '业务类型', id: 24, field: 'businessKind', width: '130px'
  },
  {
    name: '制单时间', id: 12, field: 'createTime', width: '160'
  },
  {
    name: '订单状态', id: 2, field: 'stateMemo', width: ''
  },
  // {
  //   name: '预收款审核状态', id: 21, field: 'orderStatePrePay', width: '110'
  // },
  // {
  //   name: '应收单号', id: 4, field: 'financeCode', width: '125px'
  // },
  // {
  //   name: '施工单号', id: 5, field: 'printBillCode', width: '125px'
  // },
  {
    name: '订单消息', id: 6, field: 'orderMessage', width: '170'
  }, {
    name: '客户编码', id: 7, field: 'clientCode', width: '100'
  }, {
    name: '客户名称', id: 8, field: 'clientName', width: '120'
  }, {
    name: '文件描述', id: 11, field: 'fileDescription', width: '190px'
  }, {
    name: '制单人', id: 13, field: 'createMan', width: '75'
  },
  {
    name: '订单印量', id: 14, field: 'orderQty', width: '120'
  },
  {
    name: '定金', id: 16, field: 'orderMoneyPre', width: '100'
  }, {
    name: '总金额', id: 17, field: 'orderMoneyTotal', width: '120'
  }, {
    name: '已收金额', id: 18, field: 'payMoney', width: '120'
  },
  {
    name: '平台单号', id: 20, field: 'platformOrderID', width: '220px'
  }
]
const createInfo = {
  idProduct: '',
  productName: '',
  clientName: '',
  idClient: '',
  orderName: '',
  orderType: 0,
  businessKind: 0
}
const createChargeInfo = {
  orderName:'',
  clientName:'',
  idClient:'',
  orderMoneyTotal:'',
  orderMemo:'',
}
export default {
  name: 'TobeEditedOrder',
  components: {
    MaterialDetail,
    CreateOrderDialog,
    DeliveryNotice,
    OrderStep,
    orderMessage, plupload, Cancledialog, clientInfo
  },
  data() {
    return {
      sizeType: 'mini',
      new_badge: new_badge,
      noticeVisible: false,
      pluploadVisible: false,
      memoDrawer: false,
      defaultItem: Object.assign([], defaultItems), // 默认列
      orderStatus: '',
      search: {
        keyWord: '',
        orderState: ''
      },

      tableData: [],

      listLoading: false,
      listData: {
        total: 0,
        page: 1,
        pageSize: 20
      },
      voidVisible: false,
      sMemo: '',

      showUpload: true,
      files: [],
      upIdOrder: '',
      upOrderCode: '',

      confirmdialog: false,

      createInnerVisible: false,
      innerTitle: '',
      innerType: 1,
      productList: [],

      createOrderChargeVisible: false,
      createChargeInfo: Object.assign({}, createChargeInfo),

      changeOrderTypeVisible: false,
      formToken: '',
      changeInfo: {
        idOrder: '',
        idProduct: '',
      },
      // 订单收款
      orderPayVisible: false,
      orderPayInfo: {
        orderInfo: {},
        orderReceivableList: [],
        receivableMoney: ''
      },
      orderPayLoading: false,
      // 支付单
      paymentBillVisible: false,
      paymentBillList: [],
      orderPayListData: {
        total: 0,
        page: 1,
        pageSize: 10
      },

      // 物料订单编辑
      timer:'',
      // 验证规则
      rules: {
        productName: [{ required: true, trigger: 'blur', message: '请选择产品类型' }],
        clientName: [{ required: true, trigger: 'blur', message: '请选择客户' }]
      },
      chargeRules: {
        clientName: [{ required: true, trigger: 'blur', message: '请选择客户' }],
        orderMoneyTotal: [{ required: true, trigger: 'blur', message: '请输入金额' }],
      }
    }
  },
  watch: {
    memoDrawer(val) {
      // console.log(val)
      if (!val) {
        this.getList()
      }
    }
  },
  created() {
    this.search.orderState = this.$route.path.split('/').slice(-1)[0]
    this.getList()
    this.getConfig('FileUploadServerIp')
    this.getConfig('OrderShareRoot')
    this.getConfig('OrderUpdateWebUrl')
  },
  methods: {
    getList() {
      var _that = this
      var params = _that.search
      var page = {
        pageIndex: _that.listData.page,
        pageSize: _that.listData.pageSize
      }
      if (_that.listData.pageSize == 10) {
        _that.sizeType = 'medium'
      } else {
        _that.sizeType = 'mini'
      }
      var data = {
        'params': JSON.stringify(params),
        'page': JSON.stringify(page)
      }
      // console.log(data);
      getOrderList(data).then(response => {
        console.log(response)
        const data = response.data
        // //  组合表单数据
        _that.tableData = data
        _that.listData.total = response.total
        // console.log(_that.tableData)
        _that.listLoading = false
      }).catch(err => {
        _that.$message.error(err)
        _that.listLoading = false
      })
    },
    // 搜索
    searchData() {
      this.listData.page = 1
      this.getList()
    },
    // 刷新变革
    tableRefresh() {
      // 刷新变革
      this.getList()
    },

    /**
     * 显示字符串中间加星号
     */
    plusXing(str, frontLen, endLen) {
      // var len = str.length - frontLen - endLen
      var xing = ''
      for (var i = 0; i < 6; i++) {
        xing += '*'
      }
      return str.substr(0, frontLen) + xing + str.substr(str.length - endLen)
    },
    // 获取配置信息
    getConfig(key) {
      const _that = this
      const data = {
        configKey: key
      }
      // console.log(data);
      getConfigInfo(data).then(res => {
        console.log(res)
        if (key == 'FileUploadServerIp') {
          _that.configValue1 = res.data.configValue1
        } else if (key == 'OrderShareRoot') {
          _that.configValue2 = res.data.configValue1
        } else if (key == 'OrderUpdateWebUrl') {
          _that.configValue3 = res.data.configValue1
        }
      }).catch(err => {
        _that.$message.error(err)
      })
    },

    // 上传文件方式选择
    getUploadType($event, row) {
      const _that = this
      var userAgent = navigator.userAgent
      if ($event == 1) {
        _that.openFileDialog(row)
      } else if ($event == 2) {
        if (_that.configValue1 == undefined) {
          _that.configValue1 = ''
        }
        if (_that.configValue2 == undefined) {
          _that.configValue2 = ''
        }
        if (userAgent.indexOf('DnyERPBrowser') > 0) {
          dyERP.sendOrderFile(row.id.toString(), row.orderCode, _that.configValue1, _that.configValue2, '0','0', '0')
        } else {
          // alert('请使用开发商提供的ERP客户端')
          this.$message({
            message: '请使用开发商提供的ERP客户端',
            type: 'warning'
          })
        }
      } else if ($event == 3) {
        if (userAgent.indexOf('DnyERPBrowser') > 0) {
          // alert('关联文件')
          dyERP.sendOrderFile(row.id.toString(), row.orderCode, _that.configValue1, _that.configValue2, '1', '0', '0')
        } else {
          // alert('请使用开发商提供的ERP客户端')
          this.$message({
            message: '请使用开发商提供的ERP客户端',
            type: 'warning'
          })
        }
      }
    },

    // 上传文件
    openFileDialog(row) {
      // var _that = this
      // _that.pluploadVisible = true
      // _that.upIdOrder = row.id
      // _that.upOrderCode = row.orderCode
      // _that.files = []
      // _that.$nextTick(() => {
      //   _that.$refs.plupLoad.fileRawList = []
      // })
      const _that = this
      // window.open('/#/upload?id=' + row.id + '&orderCode=' + row.orderCode + '&orderName=' + row.orderName+ '&type=1', '_blank')
      window.open(_that.configValue3 +'?id=' + row.id + '&orderCode=' + row.orderCode + '&orderName=' + row.orderName + '&type=1&idUser='+_that.$store.state.user.user.id+'&supplierCode='+_that.$store.state.user.indexInfo.supplierCode+'&dataSourceId='+_that.$store.state.user.indexInfo.dataSourceId, '_blank')

    },
    handleSelectionChange(val) {
      console.log(val)
    },
    // 订单消息
    openMessage(row) {
      var _that = this
      _that.memoDrawer = true
      _that.$nextTick(function() {
        // console.log(_that.$refs.orderMemo);
        _that.$refs.orderMessage.idOrder = row.id
        _that.$refs.orderMessage.getList()
      })
    },
    handleFileChange(fileList) {
      var _that = this
      // console.log('handleFileChange', fileList)
      _that.pluploadVisible = false
      setTimeout(() => {
        _that.tableRefresh()
      }, 1000)
    },

    // 提交订单
    commitOrder(row) {
      var _that = this
      var data = {
        'idOrder': row.id,
        'orderState': row.orderState,
        'versionCode': row.versionCode,
        'needImageProcess': 0
      }

      var url = '/order/v1/documentCommitOrder'
      _that.$refs.confirmDialog.updataClick(data, url)
    },
    // 获取脚印
    getOrderStep(row) {
      const _that = this
      _that.$refs.orderStep.idOrder = row.id
      _that.$refs.orderStep.getOrderStep()
    },

    // 提交预收款申请
    openOrderPrePay(row) {
      this.orderId = row.id
      this.sMemo = ''
      this.voidVisible = true
      this.versionCode = row.versionCode
    },
    sendOrderPrePayBtn() {
      var _that = this
      var data = {
        'id': _that.orderId,
        'sMemo': _that.sMemo,
        'versionCode': _that.versionCode
      }
      sendOrderPrePayRequest(data).then(response => {
        console.log(response)
        if (response.httpCode == 200) {
          _that.voidVisible = false
          _that.$message({
            message: '提交成功',
            type: 'success'
          })
        }
      }).catch(err => {
        _that.$message.error(err)
      })
    },
    // 创建订单
    createOrderFun() {
      var _that = this
      _that.$refs.createOrder.createOrderVisible = true
      _that.$refs.createOrder.getProductInfo()
      _that.$refs.createOrder.createInfo = Object.assign({}, createInfo)
    },
    // 获取产品列表
    getProductInfo() {
      const _that = this
      var data = {}
      // console.log(data);
      getSimpleProductInfoList(data).then(response => {
        console.log(response)
        const data = response.data
        _that.productList = data
      }).catch(err => {
        _that.$message.error(err)
      })
    },
    // 创建收款订单
    createOrderCharge() {
      const _that = this
      _that.createOrderChargeVisible = true
      _that.createChargeInfo = Object.assign({}, createChargeInfo)
      _that.getToken();
    },
    // 选择客户
    chooseClient1(data) {
      this.createInnerVisible = false
      // console.log(data);
      this.createChargeInfo.clientName = data.clientName
      this.createChargeInfo.idClient = data.id
    },

    getToken() {
      orderFormToken().then(res => {
        console.log(res);
        this.formToken = res.data
      })
    },
    createChargeBtn() {
      const _that = this
      _that.$refs.createChargeInfo.validate((valid) => {
        if (valid) {
          var data = JSON.stringify(_that.createChargeInfo)
          addPrintOrderCharge(data, _that.formToken).then(response => {
            console.log(response);
            if (response.httpCode == 200) {
              _that.$message.success('创建成功')
              _that.createOrderChargeVisible = false
              _that.getList()
            }
          })
        }
      })
    },
    // 更换产品类型
    openChangeType(row) {
      this.changeOrderTypeVisible = true
      this.changeInfo = {
        idOrder: row.id,
        idProduct: '',
      }
      this.getProductInfo()
    },
    changeBtn() {
      const _that = this
      var data = {
        idOrder: _that.changeInfo.idOrder,
        idProduct: _that.changeInfo.idProduct
      }
      changePrintOrderProduct(data).then(response => {
        console.log(response);
        if(response.httpCode == 200){
          _that.$message.success('修改成功')
          _that.changeOrderTypeVisible = false
          _that.getList()
        }
      })
    },

    // 编辑物料订单
    openMaterialEdit(row){
      const _that = this
      // _that.timer = new Date().getTime()
      _that.$nextTick(function(){
        _that.$refs.materialDetail.materialDialog = true
        _that.$refs.materialDetail.editFlag = true
        _that.$refs.materialDetail.idOrder = row.id
        _that.$refs.materialDetail.versionCode = row.versionCode
        _that.$refs.materialDetail.getOrderInfo()
      })
    },
    // 编辑发货通知
    openNotices(row) {
      var _that = this
      _that.noticeVisible = true
      // console.log(row);
      _that.$nextTick(function (){

        _that.$refs.deliveryNotice.currentIdClient = row.idClient
        _that.$refs.deliveryNotice.currentIdOrder = row.id
        _that.$refs.deliveryNotice.inStockBoxCount = row.inStockBoxCount
        _that.$refs.deliveryNotice.waitSendBoxCount = row.waitSendBoxCount

        _that.$refs.deliveryNotice.addressDialogInfo.orderState = row.stateMemo
        _that.$refs.deliveryNotice.openNotices()

      })
    },
    // 收款
    orderPayType($event, row) {
      const _that = this
      if ($event == 1) {
        _that.orderPayVisible = true
        _that.orderPayInfo.orderInfo = row
        var data = {
          idOrder: row.id
        }
        getOrderReceivableByOrder(data).then(res => {
          // console.log(res)
          _that.orderPayInfo.orderReceivableList = res.data
          _that.orderPayInfo.receivableMoney = ''
        })
      } else if ($event == 2) {
        _that.paymentBillVisible = true
        var page = {
          pageIndex: _that.orderPayListData.page,
          pageSize: _that.orderPayListData.pageSize
        }
        var data = {
          'idOrder': row.id,
          'page': JSON.stringify(page)
        }
        getPaymentBillByOrder(data).then(res => {
          // console.log(res);
          _that.paymentBillList = res.data
        })
      }
    },
    // 收款确认
    orderPaySure() {
      const _that = this
      if (_that.orderPayInfo.orderReceivableList.length > 0) {
        var receivableValueList = []
        var arr = _that.orderPayInfo.orderReceivableList
        for (let i = 0; i < arr.length; i++) {
          var item = arr[i]
          if (item.currencyValue == '' || item.currencyValue == undefined || item.currencyValue == null || item.currencyValue <= 0) {
            _that.$message.warning('请填写收款金额')
            return
          }
          var receivableValue = {
            id: item.id,
            currencyValue: item.currencyValue
          }
          receivableValueList.push(receivableValue)
        }
        // _that.orderPayInfo.orderReceivableList.forEach(item => {
        //   var receivableValue = {
        //     id: item.id,
        //     currencyValue: item.currencyValue
        //   }
        //   receivableValueList.push(receivableValue)
        // })
        _that.orderPayLoading = true
        var data = {
          'receivableValueList': JSON.stringify(receivableValueList)
        }
        // console.log(data)
        // return;
        orderPayRequest(data).then(res => {
          // console.log(res)
          if (res.httpCode == 200) {
            _that.orderPayVisible = false
            _that.orderPayLoading = false
            _that.$notify({
              title: '提示',
              message: '<img src="' + res.data.qrCodeImageUrl + '"width="100px" height="100px" onclick="window.open(this.src)">',
              duration: 0,
              dangerouslyUseHTMLString: true
            })
          }
        }).catch(err => {
          _that.orderPayLoading = false
          // _that.$message.error(err)
        })
      } else {
        if (_that.orderPayInfo.receivableMoney == '' || _that.orderPayInfo.receivableMoney == undefined || _that.orderPayInfo.receivableMoney == null || _that.orderPayInfo.receivableMoney <= 0) {
          _that.$message.warning('请填写收款金额')
          return
        }

        _that.orderPayLoading = true
        var data = {
          'idOrder': _that.orderPayInfo.orderInfo.id,
          'receivableMoney': JSON.stringify(_that.orderPayInfo.receivableMoney)
        }
        orderPayRequest3(data).then(res => {
          console.log(res)
          // res.data.qrCodeImageUrl
          if (res.httpCode == 200) {
            _that.orderPayVisible = false
            _that.orderPayLoading = false
            _that.$notify({
              title: '提示',
              message: '<img src="' + res.data.qrCodeImageUrl + '"width="100px" height="100px" onclick="window.open(this.src)">',
              duration: 0,
              dangerouslyUseHTMLString: true
            })
          }
        }).catch(err => {
          _that.orderPayLoading = false
          // _that.$message.error(err)
        })
      }
    },
    // clickImg(src) {
    //   window.open(src)
    // },
    // 收款单取消
    cancelPay(row) {
      const _that = this
      var data = {
        idBill: row.id
      }
      cancelOrderPayRequest(data).then(res => {
        _that.paymentBillVisible = false
        _that.$message({
          type: 'success',
          message: '取消成功!'
        })
      })
    },
    // 收款单重收
    resetPay(row) {
      const _that = this
      var data = {
        idBill: row.id
      }
      reOrderPayRequest(data).then(res => {
        _that.paymentBillVisible = false
        _that.$notify({
          title: '提示',
          message: '<img src="' + res.data.qrCodeImageUrl + '"width="100px" height="100px" onclick="window.open(this.src)">',
          duration: 0,
          dangerouslyUseHTMLString: true
        })
      })
    },

  }
}
</script>
<style>
/*1.显示滚动条：当内容超出容器的时候，可以拖动：*/
.el-drawer__body {
  overflow: auto;
}
.stepList .el-card__body{
  padding: 10px;
}
:focus{
  outline:0;
}
.el-button+.el-button{
  margin-left: 0;
}
</style>
<style scoped>
.filter-container {
  margin-bottom: 15px;
}

::v-deep input::-webkit-outer-spin-button,::v-deep input::-webkit-inner-spin-button{
  -webkit-appearance: none !important;
}
::v-deep input[type = 'number']{
  -moz-appearance: textfield !important;
}
</style>
