<template>
  <div class="content-main" id="protectedItems">
	<div id="pdfId">
    <el-form
      ref="formData"
      :rules="rules"
      :model="formData"
      inline
      class="demo-ruleForm"
    >
	<div class="ywborderS">
	  <div style="text-align: center; font-size: 22px; font-weight: 600">
		<el-form-item v-if="!disabled" prop="hysmc">
		  <el-select
		    v-model="formData.hysmc"
		    placeholder="请选择"
		  >
		    <el-option
		      v-for="item in hysmcOptions"
		      :key="item.name"
		      :label="item.name"
		      :value="item.name"
		    ></el-option>
		  </el-select>
		</el-form-item>
		<span style="font-size: 22px;" v-else>{{formData.hysmc}}</span>
	    使用申请表
	  </div>
	  <div style="margin-left: auto; display: table">
	    编号:{{ formData.bh }}
	  </div>
	  <!-- <div style="right: 10px;">{{formData.bh}}</div> -->
	</div>
      <el-row>
        <table class="table-b table-el-form">
          <tr>
            <td class="songFont">
              <span style="color: red">*</span>使用单位
            </td>
            <td class="songFont">
			  <el-form-item prop="sydw">
				<el-select
				  :disabled="disabled"
				  v-model="formData.sydw"
				  style="width: 170px"
				  clearable
				  placeholder="请选择使用单位"
				@change="ChangeSydw"
				  >
				  <el-option
					v-for="item in sydwOptions"
					:key="item.unitName"
					:label="item.unitName"
					:value="item.unitName"
				  ></el-option>
				</el-select>
				<!-- <span v-else class="songFont">{{ formData.sydw }}</span> -->
			  </el-form-item>
            </td>
            <td><span style="color: red">*</span>使用部门</td>
            <td>
			  <el-form-item prop="sybm">
				<el-select
				  :disabled="disabled"
				  v-model="formData.sybm"
				  style="width: 170px"
				  clearable
				  placeholder="请选择使用部门"
				  >
				  <el-option
					v-for="item in sybmOptions"
					:key="item.departName"
					:label="item.departName"
					:value="item.departName"
				  ></el-option>
				</el-select>
				<!-- <span v-else class="songFont">{{ formData.sybm }}</span> -->
			  </el-form-item>
            </td>
          </tr>
          <tr>
            <td colspan="1"><span style="color: red">*</span>调试时间</td>
            <td colspan="3">
              <el-form-item prop="tssj">
                <el-date-picker
				v-if="!disabled"
				  :disabled="disabled"
                  v-model="formData.tssj"
                  type="datetimerange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  format="yyyy-MM-dd HH:ss"
                  value-format="yyyy-MM-dd HH:ss"
                >
                </el-date-picker>
				<span v-else class="songFont">{{ formData.tssjks }}至{{formData.tssjjs}}</span>
              </el-form-item>
            </td>
          </tr>
		  <tr>
		    <td colspan="1"><span style="color: red">*</span>使用时间</td>
		    <td colspan="3">
		      <el-form-item prop="sysj">
		        <el-date-picker
				v-if="!disabled"
				  :disabled="disabled"
		          v-model="formData.sysj"
		          type="datetimerange"
		          range-separator="至"
		          start-placeholder="开始日期"
		          end-placeholder="结束日期"
		          format="yyyy-MM-dd HH:ss"
		          value-format="yyyy-MM-dd HH:ss"
		        >
		        </el-date-picker>
		  		<span v-else class="songFont">{{ formData.sysjks }}至{{formData.sysjjs }}</span>
		      </el-form-item>
		    </td>
		  </tr>
		  <tr>
		    <td colspan="1"><span style="color: red">*</span>会议主题</td>
		    <td colspan="3">
		      <el-form-item prop="hyzt">
		        <el-input
				  :disabled="disabled"
		          v-model="formData.hyzt"
		          show-word-limit
		        ></el-input>
		  		<!-- <span v-else class="songFont">{{ formData.hyzt }}</span> -->
		      </el-form-item>
		    </td>
		  </tr>
		  <tr>
		    <td colspan="1"><span style="color: red">*</span>会议需求设备</td>
		    <td colspan="3">
		      <el-form-item prop="hyxqsb">
		        <el-checkbox-group v-model="formData.hyxqsb" :disabled="disabled">
		            <el-checkbox label="LED大屏"></el-checkbox>
		            <el-checkbox label="话筒与扩音系统"></el-checkbox>
		            <el-checkbox label="内网视频会议系统" ></el-checkbox>
		            <el-checkbox label="互联网网络摄像头"></el-checkbox>
		            <el-checkbox label="其他（腾讯会议）"></el-checkbox>
		          </el-checkbox-group>
		  		<!-- <span v-else class="songFont">{{ formData.hyxqsb }}</span> -->
		      </el-form-item>
		    </td>
		  </tr>
          <tr>
            <td class="songFont">
              <span style="color: red">*</span>使用部门联系人
            </td>
            <td class="songFont">
			  <el-form-item prop="sybmlxr">
				<el-input
				  :disabled="disabled"
				  v-model="formData.sybmlxr"
				  show-word-limit
				></el-input>
				<!-- <span v-else class="songFont">{{ formData.sybmlxr }}</span> -->
			  </el-form-item>
            </td>
            <td><span style="color: red">*</span>使用部门联系人电话</td>
            <td>
			  <el-form-item prop="sybmlxrdh">
				<el-input
				:disabled="disabled"
				  v-model="formData.sybmlxrdh"
				  show-word-limit
				></el-input>
				<!-- <span class="songFont">{{ formData.sybmlxrdh }}</span> -->
			  </el-form-item>
            </td>
          </tr>
          <tr>
            <td colspan="1">备注（其他需求，例如：使用大屏展示会议标题等）</td>
            <td colspan="3">
              <el-form-item prop="bz">
                <el-input
				:disabled="disabled"
                  type="textarea"
                  :autosize="{ minRows: 2, maxRows: 20 }"
                  maxlength="300"
                  v-model="formData.bz"
                  show-word-limit
                ></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td colspan="1">附件</td>
            <td colspan="3" style="text-align: left">
              <el-upload
			    v-if="$route.query.type == 'add' || $route.query.type == 'bj'"
                :on-success="handleSuccessJJ"
                class="upload-demo"
                :action="fileUrl"
                :on-preview="handlePreviewJJ"
                :on-remove="handleRemoveJJ"
                :before-remove="beforeRemoveJJ"
                :file-list="fileListBL"
              >
                <el-button
				v-show="$route.query.type == 'add' || $route.query.type == 'bj'"
                  type="primary"
                  size="small"
                  class="iconfont icon"
                  >上传</el-button
                >
              </el-upload>
              <div v-else v-for="item in fileListBL" :key="item.id">
                <span>{{ item.name }}</span>
                <el-button
                  v-if="
                    ['png', 'jpg', 'jpeg', 'bmp', 'pdf'].includes(
                      item.link.split('.')[item.link.split('.').length - 1]
                    )
                  "
                  type="text"
                  size="small"
                  @click="YlPic(item.link)"
                  >预览</el-button
                >
                <el-button type="text" size="small" @click="XzPic(item.id)"
                  >下载</el-button
                >
              </div>
            </td>
          </tr>
		  <tr>
			  <td>申请人</td>
			  <td>
				<el-form-item prop="sqr">
				  <span>{{formData.sqr}}</span>  
				</el-form-item>
			  </td>
			  <td>申请时间</td>
			  <td>
				<el-form-item prop="sqsj">
				  <span>{{formData.sqsj}}</span>  
				</el-form-item>
			  </td>
		  </tr>
        </table>
      </el-row>
    </el-form>
	<el-form 
	 v-if="ywdShow"
	  ref="formYwData"
      :rules="ruleyw"
      :model="formYwData"
      inline
      class="demo-ruleForm">
		<div style="font-size: 23px;font-weight: 600;">运维单位确认意见:</div>
		<table class="table-b table-el-form">
			<tr>
			  <td colspan="1"><span style="color: red">*</span>确认结果</td>
			  <td colspan="3">
			  <el-form-item prop="ywdwqrjg">
				<el-radio-group v-model="formYwData.ywdwqrjg" @change="changeqrjg" :disabled="ywdisabled">
				  <el-radio :label="'1'">确认</el-radio>
				  <el-radio :label="'0'">驳回</el-radio>
				</el-radio-group>
			  </el-form-item>
			  </td>
			</tr>
			<tr>
			  <td colspan="1">确认意见</td>
			  <td colspan="3">
			    <el-form-item prop="ywdwqryj"
				 :rules="[
				      { required: formYwData.ywdwqrjg == '1' ? false : true, message: '确认意见不能为空', trigger: 'blur' }
				    ]">
			      <el-input
				    :disabled="ywdisabled"
			        type="textarea"
			        :autosize="{ minRows: 2, maxRows: 20 }"
			        maxlength="300"
			        v-model="formYwData.ywdwqryj"
			        show-word-limit
			      ></el-input>
			    </el-form-item>
			  </td>
			</tr>
			<tr>
			  <td>确认人</td>
			  <td>
				<el-form-item prop="ywdwqrr">
				  <span>{{formYwData.ywdwqrr}}</span>  
				</el-form-item>
			  </td>
			  <td>确认时间</td>
			  <td>
				<el-form-item prop="ywdwqrsj">
				  <span>{{formYwData.ywdwqrsj}}</span>  
				</el-form-item>
			  </td>
			</tr>
		</table>
	</el-form>
	
	<el-form 
	  v-if="shdShow"
	  ref="formShData"
      :rules="rulesh"
      :model="formShData"
      inline
      class="demo-ruleForm">
		<div style="font-size: 23px;font-weight: 600;">审核单位审核意见:</div>
		<table class="table-b table-el-form">
			<tr>
			  <td colspan="1"><span style="color: red">*</span>审核结果</td>
			  <td colspan="3">
				  <el-form-item prop="shdwshjg">
					<el-radio-group v-model="formShData.shdwshjg" :disabled="shdisabled">
					  <el-radio :label="'1'">同意</el-radio>
					  <el-radio :label="'0'">驳回</el-radio>
					</el-radio-group>
				  </el-form-item>
				</td>
			</tr>
			<tr>
			  <td colspan="1">审核意见</td>
			  <td colspan="3">
			    <el-form-item prop="shdwshyj"
				:rules="[
				     { required: formShData.shdwshjg == '1' ? false : true, message: '审核意见不能为空', trigger: 'blur' }
				   ]">
			      <el-input
				    :disabled="shdisabled"
			        type="textarea"
			        :autosize="{ minRows: 2, maxRows: 20 }"
			        maxlength="300"
			        v-model="formShData.shdwshyj"
			        show-word-limit
			      ></el-input>
			    </el-form-item>
			  </td>
			</tr>
			<tr>
			  <td>审核人</td>
			  <td>
				<el-form-item prop="shdwshr">
				  <span>{{formShData.shdwshr}}</span>  
				</el-form-item>
			  </td>
			  <td>审核时间</td>
			  <td>
				<el-form-item prop="shdwshsj">
				  <span>{{formShData.shdwshsj}}</span>  
				</el-form-item>
			  </td>
			</tr>
		</table>
	</el-form>
	</div>
    <span class="detail-footer">
		<el-button
		  v-if="$route.query.type == 'add'|| $route.query.type == 'bj'"
		  @click="saveSubmit('9000000','formData')"
		  type="primary"
		  class="iconfont iconqueren"
		  >保存</el-button
		>
      <el-button
        v-if="
          $route.query.type == 'add' ||
          $route.query.type == 'bj'
        "
        @click="saveSubmit('9100000','formData')"
        type="primary"
        class="iconfont icontijiao"
        >提交</el-button
      >
      <el-button
        v-if="$route.query.type == 'ywqr'"
        @click="saveSubmit('9200000','formYwData')"
        type="primary"
        class="iconfont iconqueren"
        >确定</el-button
      >
      <el-button
        v-if="$route.query.type == 'sh'"
        @click="saveSubmit('9500000','formShData')"
        type="primary"
        class="iconfont iconqueren"
        >解认</el-button
      >
      <el-button @click="returnList" type="primary" class="iconfont iconfanhui"
        >取消</el-button
      >
    </span>
  </div>
</template>

<script>
// import upload from "@/components/upload";
import {
  findByIds,
} from "@/api/operationServices/operationOrder/index.js";
import { FileApi, files } from "@/api/index";
import {
  dataReviseOrderAdd,
  dataReviseOrderUpdate,
} from "@/api/operationServices/datadeletAndUp/index.js";

import {
  selectUnitList,
  addMeetingRoomApply,
  generateMeetingRoomApplyNo,
  selectMeetingRoomApplyDetail,
  updateMeetingRoomApply
} from "@/api/operationServices/meetingRoomManage/index.js";

function checkPhone(rule, value, callback) {
  var val = value && value.trim();
  if (/^1\d{10}$/.test(val)) {
    callback();
  } else {
    callback(new Error("请按正确手机号码格式填写"));
  }
}
export default {
  components: {

  },
  data() {
    return {
		ywdShow:false,
		shdShow:false,
		hysmcOptions:[
		  {
			 name:'三楼应急指挥大厅',
			 value:'1',
		  },
		  {
			 name:'五楼视频会议室',
			 value:'2',
		  }
		],
		sydwOptions:[],
		sybmOptions:[],
		formData:{
			bh:'',
			hysmc:'',
			sydw:'',
			sybm:'',
			tssj:'',
			sysj:'',
			hyzt:'',
			hyxqsb:[],
			sybmlxr:'',
			sybmlxrdh:'',
			fjId:'',
			bz:'',
			sqr:sessionStorage.getItem("userName"),
			sqsj:this.dateFormat(new Date()),
		},
		formYwData:{
			ywdwqrjg:'',
			ywdwqryj:'',
			ywdwqrr:'',
			ywdwqrsj:'',
		},
		formShData:{
			shdwshjg:'',
			shdwshyj:'',
			shdwshr:'',
			shdwshsj:'',
		},
		ywdwqrjg:'',
      disabled: false, //申请人填写信息是否禁用
	  ywdisabled:false,
	  shdisabled:false,
      fileUrl: `${FileApi}/file/upload`,
      fileListBL: [],
      ruleyw: {
        ywdwqrjg: [
          {
            required: true,
            message: "确认结果不能为空",
            trigger: ["blur", "change"],
          },
        ],
        // ywdwqryj: [
        //   {
        //     required: true,
        //     message: "确认意见不能为空",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        ywdwqrr: [
          {
            required: true,
            message: "确认人不不能为空",
            trigger: ["blur", "change"],
          },
        ],
		ywdwqrsj: [
          {
            required: true,
            message: "确认时间不不能为空",
            trigger: ["blur", "change"],
          },
        ],
      },
	  rulesh: {
	    shdwshjg: [
	      {
	        required: true,
	        message: "审核结果不能为空",
	        trigger: ["blur", "change"],
	      },
	    ],
	    shdwshyj: [
	      {
	        required: true,
	        message: "审核意见不能为空",
	        trigger: ["blur", "change"],
	      },
	    ],
	    shdwshr: [
	      {
	        required: true,
	        message: "审核人不不能为空",
	        trigger: ["blur", "change"],
	      },
	    ],
	  	shdwshsj: [
	      {
	        required: true,
	        message: "审核时间不不能为空",
	        trigger: ["blur", "change"],
	      },
	    ],
	  },
      rules: {
        hysmc: [
          {
            required: true,
            message: "请选择会议室名称",
            trigger: ["change"],
          },
        ],
        sydw: [
          {
            required: true,
            message: "请选择使用单位",
            trigger: ["blur", "change"],
          },
        ],
        sybm: [
          {
            required: true,
            message: "请选择使用部门",
            trigger: ["blur", "change"],
          },
        ],
        tssj: [
          {
            required: true,
            message: "请选择调试时间",
            trigger: ["blur", "change"],
          },
        ],
        sysj: [
          {
            required: true,
            message: "请选择使用时间",
            trigger: ["blur", "change"],
          },
        ],
        hyzt: [
          {
            required: true,
            message: "请输入会议主题",
            trigger: ["blur"],
          },
        ],
        hyxqsb: [
          {
            required: true,
            message: "请选择会议需求设备",
            trigger: ["blur", "change"],
          },
        ],
        sybmlxr: [
          {
            required: true,
            message: "请输入使用部门联系人",
            trigger: ["blur", "change"],
          },
        ],
        sybmlxrdh: [
          {
            required: true,
            message: "请输入使用部门联系人电话",
            trigger: ["blur", "change"],
          },
		  { validator: checkPhone, trigger: 'blur' }
        ],
        sqr: [
          {
            required: true,
            message: "请输入",
            trigger: ["blur"],
          },
        ],
        sqsj: [
          {
            required: true,
            message: "请输入",
            trigger: ["blur"],
          },
        ],
      },
    };
  },
  computed: {
  },
  created() {
	  this.GetSydwList()
	  // this.ywdShow=false
	  if(this.$route.query.type =='ywqr' || this.$route.query.type =='sh' || (this.$route.query.type =='bj' || this.$route.query.ywdwqryj)|| (this.$route.query.type == 'ck' && 
	  (this.$route.query.spzt == '9100000' ||this.$route.query.spzt == '9500000' || this.$route.query.spzt == '9200000'
	  || this.$route.query.spzt == '9400000' || this.$route.query.spzt == '9300000' || this.$route.query.ywdwqryj))){
		  this.ywdShow=true
	  }
	  if(this.$route.query.type =='sh' || (this.$route.query.type =='ywqr' && (this.$route.query.spzt == '9400000' || this.$route.query.shdwshyj))||
	   (this.$route.query.type =='bj' && this.$route.query.ywdwqryj)||(this.$route.query.type == 'ck' && (this.$route.query.spzt == '9200000' ||this.$route.query.spzt == '9500000' 
	  || this.$route.query.spzt == '9400000' || this.$route.query.spzt == '9300000' || this.$route.query.shdwshyj))){
		  this.shdShow=true
	  }
	  if(this.$route.query.id){
		  this.GetDetailList(this.$route.query.id)
	  }
	  if(this.$route.query.type == 'add' || this.$route.query.type == 'bj'){
		if(this.$route.query.type == 'add'){
			this.GetApplyNo()
		}
		 this.disabled=false
		 this.ywdisabled=true
		 this.shdisabled=true 
	  }
	 else if(this.$route.query.type == 'ck'){
		this.disabled=true
		this.ywdisabled=true
		this.shdisabled=true
	  }else if(this.$route.query.type =='ywqr'){
		  this.formYwData.ywdwqrjg='1'
		  this.formYwData.ywdwqrr=sessionStorage.getItem("userName")
		  this.formYwData.ywdwqrsj=this.dateFormat(new Date())
		  this.disabled=true
		  this.ywdisabled=false
		  this.shdisabled=true
	  }else if(this.$route.query.type =='sh'){
		  this.formShData.shdwshjg='1'
		  this.formShData.shdwshr=sessionStorage.getItem("userName")
		  this.formShData.shdwshsj=this.dateFormat(new Date())
		  this.disabled=true
		  this.ywdisabled=true
		  this.shdisabled=false
	  }
  },
  methods: {
	  changeqrjg(val){
	  		  console.log(val,'yyyyyyyyyyy')
	  		this.ywdwqrjg=val
	  },
	  //获取使用单位list
	  GetSydwList(){
	    selectUnitList().then(res =>{
		  console.log(res,'')
		  this.sydwOptions=res.data
		  console.log(this.sydwOptions,'fer66666666')
	    })
	  },
	  //选择使用单位
	  ChangeSydw(e){
	    console.log(e,'kkhhgd-----')
	    this.sydwOptions.forEach((item) =>{
		  if(e == item.unitName){
			  this.sybmOptions=item.departList
		  }
	    })
	  },
	  //生成会议室申请编号
	  GetApplyNo(){
		generateMeetingRoomApplyNo().then(res =>{
			if(res.infoCode == 200){
				this.formData.bh=res.data
			}
		})  
	  },
	  //查看详情
	  GetDetailList(id){
		  var data={
			  id:id
		  }
		  selectMeetingRoomApplyDetail(data).then(res =>{
			  if(res.infoCode == 200){
				  if(this.$route.query.type =='sh' || (this.$route.query.type =='ck' && this.$route.query.spzt =='9200000')){
					  
				  }else{
					 this.formShData=res.data 
				  }
				  if(this.$route.query.type =='ywqr' || (this.$route.query.type =='ck' && this.$route.query.spzt =='9100000')){
				  					  
				  }else{
				  	  this.formYwData=res.data 
				  }
				  this.formData=res.data
				  // this.formYwData=res.data
				  // this.formShData=res.data
				  console.log()
				  this.formData.hyxqsb=res.data.hyxqsb.split(',')
				  if (this.formData.fjId) {
				    findByIds(this.formData.fjId).then((res) => {
				      this.fileListBL = res.data;
				    });
				  }
				  if(this.formData.sysjjs){
					  var sysjStr=this.formData.sysjks+','+this.formData.sysjjs
					  this.formData.sysj=sysjStr.split(',')
				  }else{
					 this.formData.sysj=''
				  }
				  if(this.formData.tssjks){
					var str=this.formData.tssjks+','+this.formData.tssjjs
					this.formData.tssj=str.split(',')
				  }else{
					  this.formData.tssj=''
				  }
				  
				  
			  }
		  })
	  },
	  
	  
    //提交信息
    saveSubmit(spzt,dataForm) {
	  if(this.formYwData.ywdwqrjg == '0' && spzt == '9200000'){
		  this.formData.spzt='9300000'
	  }else if(this.formShData.shdwshjg == '0'&& spzt == '9500000'){
		  this.formData.spzt='9400000'
	  }else{
		  this.formData.spzt=spzt
	  }
	  var data={...this.formData,
	  }
	  data.ywdwqrjg=this.formYwData.ywdwqrjg
	  data.ywdwqryj=this.formYwData.ywdwqryj
	  data.ywdwqrr=this.formYwData.ywdwqrr
	  data.ywdwqrsj=this.formYwData.ywdwqrsj
	  
	  data.shdwshjg=this.formShData.shdwshjg
	  data.shdwshyj=this.formShData.shdwshyj
	  data.shdwshr=this.formShData.shdwshr
	  data.shdwshsj=this.formShData.shdwshsj
	  
	  data.sysjks=this.formData.sysj[0]
	  data.sysjjs=this.formData.sysj[1]
	  data.tssjks=this.formData.tssj[0]
	  data.tssjjs=this.formData.tssj[1]
	  console.log(data,'hfhgsjf============')

      this.$refs[dataForm].validate((valid) => {
        if (valid) {
          let arrBL = [];
		  data.hyxqsb=
		    data.hyxqsb && data.hyxqsb.length > 0
		      ? data.hyxqsb.join()
		      : [];
          console.log(this.fileListBL, "ppppppp000000");
          this.fileListBL.map((item) => {
            arrBL.push(item.response ? item.response.data.id : item.id);
          });
          data.fjId = arrBL.join();
          //这里写校验通过的业务逻辑
          console.log("通过");
		  data.tssj=undefined
		  data.sysj=undefined
          if (this.$route.query.type == "add") {
            addMeetingRoomApply(data).then((res) => {
              console.log(res, "kkkkkkkkkk4444444444");
              if (res.infoCode == 200) {
                this.$message({
                  message: "保存成功",
                  type: "success",
                });
                this.$router.go(-1);
              } else {
                this.$message.error(res.msg);
              }
            });
          } else {
            console.log(data, "this.formData------------");
            updateMeetingRoomApply(data).then((res) => {
              // console.log(res,susInfo,'kkkkkkkkkk4444444444')
              if (res.infoCode == 200) {
                this.$message({
                  message:"提交成功",
                  type: "success",
                });
                this.$router.go(-1);
              } else {
                this.$message({
                  type: "error",
                  message: errInfo ? errInfo : res.msg,
                });
                // this.$message.error(res.msg);
              }
            });
          }
        }
      });
    },

    //返回
    returnList() {
      this.$router.go(-1);
    },

    //追加附件上传
    handleSuccessJJ(res, file, fileList) {
      this.fileListBL = fileList;
    },
    handleRemoveJJ(file, fileList) {
      this.fileListBL = fileList;
    },
    handlePreviewJJ(file) {
      // console.log(file);
      let fileLink = file.response ? file.response.data.uri : file.link;
      if (
        ["png", "jpg", "jpeg", "bmp", "pdf"].includes(
          fileLink.split(".")[fileLink.split(".").length - 1]
        )
      ) {
        // console.log(`${window.location.origin}/file/${fileLink}`);
        window.open(`${window.location.origin}/file/${fileLink}`);
      } else {
        window.location.href = `${FileApi}/file/download?id=${
          file.response ? file.response.data.id : file.id
        }`;
      }
    },
    beforeRemoveJJ(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },

    //预览
    YlPic(link) {
      // window.open(`http://101.36.160.140:8097/file/${link}`)
      window.open(`${window.location.origin}/file/${link}`);
      // window.open(`${FileApi}/${link}`)
      // <a target='_black'  href='http://mczaiyun.top/ht/4.pdf'>预览PDF文件</a>
      // window.open(`https://view.officeapps.live.com/op/view.aspx?src=https://physics.nankai.edu.cn/_upload/article/6b/7c/8fe84466415a8e5d48a29c5e08a6/1ea96f13-3367-4ea7-a77f-85b0ec15e121.doc`);
    },
    //下载
    XzPic(id) {
      window.location.href = `${FileApi}/file/download?id=${id}`;
    },
    dateFormat(date) {
      // let date = new Date();
      let year = date.getFullYear();
      /* 在日期格式中，月份是从0开始的，因此要加0
       * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
       * */
      let month =
        date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1;
      let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      let hours =
        date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
      let minutes =
        date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
      let seconds =
        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      // 拼接
      return year + "-" + month + "-" + day + ' ' + hours + ':' + minutes;
    },
  },
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.ywborderS {
  // border: 1px solid #000000;
  padding: 15px;
}
.table-b {
  width: 100%;
  border-collapse: collapse;
  //   height: 100px;
  text-align: center;
  // background-color: #000;
  // border-right: 1px solid #000;
  // border-bottom: 1px solid #000;
  border: 1px solid #000;
  td {
    // width: 320px;
    // height: 50px;
    padding: 10px 40px;
    border: 1px solid #000;
    // border-left: 1px solid #000;
    // border-top: 1px solid #000;
  }
  .inputwidth {
    width: 100%;
  }
}
.table-b td:nth-child(odd) {
  // text-align: justify;
  // text-align-last: justify;
}
.table-el-form /deep/ .el-form-item {
  width: 100%;
}
.table-el-form /deep/ .el-form-item__content {
  width: 100%;
}
.table-el-form /deep/ .el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: inherit;
}
.box-pro {
  border: 1px solid #cfcfcf;
  padding: 10px;
  margin-bottom: 20px;
}
.el-data-width /deep/.el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: auto;
}
::-webkit-scrollbar {
  width: 4px;
}
::-webkit-scrollbar-thumb {
  background: #99a9bf;
  border-radius: 20px;
}
#pdfId{
  padding: 40px;
}
</style>
<style>
#datadeletAndUp {
  position: relative;
}

#datadeletAndUp > div {
  top: -80px !important;
  align-items: center;
  /* left: -25px !important; */
}
</style>
