shuju_ui/qs_zhaoshang/pages/work/addtproduction.vue

<template>
<view  :style="'padding-bottom:' + bottom ">
  	  <view class='zhanline'></view>
	  <uni-forms class='inform '  ref="form" :rules="rules" :value="datainfo" v-show="type==1">
	  			<view class="info_tit">投产信息</view>
	  			<uni-forms-item name="xmmc" style='margin-bottom: 0;'>
	  			 <view class="flexc infolist">
	  			  	<view class="f16 fw c34 flex0 pr pl12">项目名称</view>
	  			  	<input  placeholder="请输入项目名称"  v-model="datainfo.xmmc"  class="f16  c34 flex1 txr"/>
	  			  </view> 
	  			</uni-forms-item>
	  			<uni-forms-item name="tcrq" style='margin-bottom: 0;'>
	  			 <view class="flexc infolist">
	  			  	<view class="f16 fw c34 flex0 pr pl12"><text class="cir">*</text>投产日期</view>
	  			  	<picker mode="date" :value="datainfo.tcrq" class="infolist_a" @change='bindDateChangea'>
	  					<view :class="datainfo.tcrq?'':'f16 co80'">{{datainfo.tcrq||"请选择投产日期"}}</view>
	  			  	</picker>
	  			  </view>
	  			</uni-forms-item>
	  			
	  			<uni-forms-item name="sjdze" style='margin-bottom: 0;'>
	  			 <view class="flexc infolist">
	  			  	<view class="f16 fw c34 flex0 pr pl12"><text class="cir">*</text>实际到资金额(万元)</view>
	  				<input  placeholder="请输入协议投资额" type="number" v-model="datainfo.sjdze"    class="f16  c34 flex1 txr"/>
	  			  </view>
	  			</uni-forms-item>
				
				<view class="info_tit">入规信息</view>
				<uni-forms-item name="rgsj" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">入规日期</view>
				  	<picker mode="date" :value="datainfo.rgsj" class="infolist_a" @change='bindDateChangeb'>
						<view :class="datainfo.rgsj?'':'f16 co80'">{{datainfo.rgsj||"请选择入规日期"}}</view>
				  	</picker>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="nrgsj" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">拟入规日期</view>
				  	<picker mode="date" :value="datainfo.nrgsj" class="infolist_a" @change='bindDateChangec'>
						<view :class="datainfo.nrgsj?'':'f16 co80'">{{datainfo.nrgsj||"请选择拟入规日期"}}</view>
				  	</picker>
				  </view>
				</uni-forms-item>
	  			<view class="infobtn flexcc cf f16 f500" @click="getNext">下一步</view>
	  		</uni-forms>
			<!-- 下一步 -->
			<uni-forms class='inform' ref="twoform" :rules="tworules" :value="datainfo" v-show="type==2">
				<view class="info_tit">到资明细</view>
				<uni-forms-item name="ydmj" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">用地面积(亩)</view>
				  	<input  placeholder="请输入用地面积" type="number" v-model="datainfo.ydmj"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="tdcr" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">土地出让(万元)</view>
				  	<input  placeholder="请输入土地出让" type="number" v-model="datainfo.tdcr"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="xjcf" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">新建厂房(平方米)</view>
				  	<input  placeholder="请输入新建厂房" type="number" v-model="datainfo.xjcf"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="cftr" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">厂房投入(万元)</view>
				  	<input  placeholder="请输入厂房投入" type="number" v-model="datainfo.cftr"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="sbqd" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">设备清单(万元)</view>
				  	<input  placeholder="请输入设备清单" type="number" v-model="datainfo.sbqd"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="sbfp" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">设备发票(万元)</view>
				  	<input  placeholder="请输入设备发票" type="number" v-model="datainfo.sbfp"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="sbht" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">设备合同(万元)</view>
				  	<input  placeholder="请输入设备合同" type="number" v-model="datainfo.sbht"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="fkpz" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">付款凭证(万元)</view>
				  	<input  placeholder="请输入付款凭证" type="number" v-model="datainfo.fkpz"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<view class="border"></view>
				<uni-forms-item name="zlcf" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">租赁厂房(平方米)</view>
				  	<input  placeholder="请输入租赁厂房" type="number" v-model="datainfo.zlcf"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				
				<uni-forms-item name="zlcftr" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">厂房投入(万元)</view>
				  	<input  placeholder="请输入厂房投入" type="number" v-model="datainfo.zlcftr"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="zlsbqd" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">设备清单(万元)</view>
				  	<input  placeholder="请输入设备清单" type="number" v-model="datainfo.zlsbqd"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="zlsbfp" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">设备发票(万元)</view>
				  	<input  placeholder="请输入设备发票" type="number" v-model="datainfo.zlsbfp"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="zlsbht" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">设备合同(万元)</view>
				  	<input  placeholder="请输入设备合同" type="number" v-model="datainfo.zlsbht"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="zlfkpz" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">付款凭证(万元)</view>
				  	<input  placeholder="请输入付款凭证" type="number" v-model="datainfo.zlfkpz"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<view class="border"></view>
				<uni-forms-item name="sjss" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">实缴税收(万元)</view>
				  	<input  placeholder="请输入实缴税收" type="number" v-model="datainfo.sjss"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">连续</view>
				  	<input  placeholder="请输入数字" type="number" v-model="datainfo.lxy"    class="f16  c34 flex1 " style="text-align: center;"/>
					<view class="f16 fw c34 flex0 pr pl12">个月缴纳社保</view>
					<input  placeholder="请输入数字" type="number" v-model="datainfo.jnsb"    class="f16  c34 flex1" style="text-align: center;"/>
					<view class="f16 fw c34 flex0 pr pl12">人</view>
				  </view>
				</uni-forms-item>
				<view class="border"></view>
				<uni-forms-item name="zbtr" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">装备投入(万元)</view>
				  	<input  placeholder="请输入装备投入" type="number" v-model="datainfo.zbtr"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<view class="border"></view>
				<uni-forms-item name="ndsjss" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">会计年度实缴税收(万元)</view>
				  	<input  placeholder="请输入会计年度实缴税收" type="number" v-model="datainfo.ndsjss"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				<view class="border"></view>
				<uni-forms-item name="qt" style='margin-bottom: 0;'>
				 <view class="flexc infolist">
				  	<view class="f16 fw c34 flex0 pr pl12">其他</view>
				  	<input  placeholder="请输入其他信息" v-model="datainfo.qt"    class="f16  c34 flex1 txr"/>
				  </view>
				</uni-forms-item>
				
				<view class="border"></view>
				<uni-forms-item name="czwt" style='margin-bottom: 0;'>
				 <view class="flexc infolist" style="align-items: flex-start;">
				  	<view class="f16 fw c34 flex0 pr pl12">存在问题</view>
					<uni-easyinput :inputBorder='false' type="textarea"  v-model="datainfo.czwt"  placeholder="请输入存在问题" placeholderStyle='text-align: right;font-size:32rpx;color:#808080'></uni-easyinput>
				  </view>
				</uni-forms-item>
				<uni-forms-item name="zsyzFjList" style='margin-bottom: 0;'>
					<view class="flexc infolist">
						<view class="f16 fw c34 flex0 pr pl12"><text class="cir">*</text>附件</view>
						<view class="infolist_a co28">
							<lsj-upload
								    ref="lsjUpload"
								    childId="upload1"
								    :width="width"
								    :height="height"
								    :option="option"
								    :size="size"
								    :formats="formats"
								    :debug="debug"
								    :instantly="instantly"
								    @progress=""
									@uploadEnd="onuploadEnd" >
								        <view class="btn" :style="{width: width,height: height}">选择附件</view>
								</lsj-upload>
						</view>
						</view>
				</uni-forms-item>
				<view class=" cldelistbf"  v-for="(ite,idx) in filelist" :key='idx'>
					<view class="flext f15 c6" @click="getDown(ite.path)">
						<view class="imgl"><image :src="wimg" ></image></view>
						<view>{{ite.fjName}}</view>
					</view>
					<!-- 删除 -->
					<view class="delimg flex0" @click.stop="getDelFj(idx)">
						<image :src="delimg"></image>
					</view>
				</view>
				<view class="infolist_b"><text>*</text>请上传大小不超过<text>100MB</text>格式为<text>doc/xls/ppt/txt/pdf/zip/rar/word</text>的文件</view>
				<view class="infolist_b" style="margin-top: 20rpx;"><text>*</text>项目生产、经营照片</view>
				<view class="infobtn flexcc cf f16 f500" v-if="checkPermi(['projectV2:tcxx:add','projectV2:tcxx:edit'])" @click="getSubmit">提交</view>
			</uni-forms>
	  		
  </view>
</template>

<script>
	import {gettcxxAddFn,gettcxxPutFn} from "@/api/work/addclue.js"
	import {gettcxxdetail} from "@/api/work/clue.js"
	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
import config from '@/config'
  const baseUrl = config.baseUrl
  import { getToken } from '@/utils/auth'
  export default {

    data() {
      return {
		//附件
		  option: {
		        // 上传服务器地址，需要替换为你的接口地址
		        url: baseUrl+'/common/upload', // 该地址非真实路径，需替换为你项目自己的接口地址
		        // 上传附件的key
		        name: 'file',
		        // 根据你接口需求自定义请求头,默认不要写content-type,让浏览器自适配
		        header: {
		            // 示例参数可删除
		            'Authorization':  'Bearer ' + getToken(),
		        },
		        // 根据你接口需求自定义body参数
		        formData: {
		        }
		    },
		// 选择文件后是否立即自动上传，true=选择后立即上传
		instantly: true,
		// 必传宽高且宽高应与slot宽高保持一致
		width: '',
		height: '48rpx',
		// 限制允许上传的格式，空串=不限制，默认为空
		formats: 'doc,docx,xls,ppt,txt,pdf,zip,rar,word',
		// 文件上传大小限制
		size: 100,
		// 文件数量限制 默认10
		count: 5,
		// 文件回显列表
		files: new Map(),
		// 微信小程序Map对象for循环不显示，所以转成普通数组，不要问为什么，我也不知道
		wxFiles: [],
		// 是否打印日志
		debug: false,
		filelist:[], 
		
		
		selectDate: '',
		defaultPhoneHeight: '', //屏幕默认高度
		nowPhoneHeight: '', //屏幕现在的高度
		bottom:0,
		type:1,	
		datainfo:{
			"xmId":"",//项目ID
		    "xmbh":"",//项目编号
		    "xmmc":"",//项目名称
		    "tcrq":"",//投产日期
		    "rgsj":"",//入规(限)时间
		    "nrgsj":"",//拟入规(限)时间
		    "tcgjrsjh":"",//投产跟进人手机号
		    "sjdze":"",//实际到资额（万元）
			
		    "ydmj":"",//用地面积（亩）
		    "tdcr":"",//土地出让（万元）
		    "xjcf":"",//新建厂房（平方米）
		    "cftr":"",//厂房投入（万元）
		    "sbqd":"",//设备清单（万元）
		    "sbfp":"",//设备发票（万元）
		    "sbht":"",//设备合同（万元）
		    "fkpz":"",//付款凭证（万元）
			
		    "zlcf":"",//租赁厂房（平方米）
		    "zlcftr":"",//租赁厂房投入（万元）
		    "zlsbqd":"",//租赁设备清单（万元）
		    "zlsbfp":"",//租赁设备发票（万元）
		    "zlsbht":"",//租赁设备合同（万元）
		    "zlfkpz":"",//租赁付款凭证（万元）
		    "sjss":"",//实缴税收（万元）
		    "lxy":"",//连续几个月
		    "jnsb":"",//缴纳社保人数
		    "zbtr":"",//装备投入（万元）
		    "ndsjss":"",//会计年度实缴税收（万元）
		    "qt":"",//其他
			'czwt':'',//存在问题
			zsyzFjList:[],//附件地址
		},
		tanfalg:false,
		addimg:require("@/static/images/mine/add.png"),
		delimg:require("@/static/images/mine/del.png"),
		checknimg:require("@/static/images/mine/jnicon.png"),
		gcheckimg:require("@/static/images/mine/jicon.png"),
		closeimg:require('@/static/images/close.png'),
		wimg:require('@/static/images/index/wicon.png'),
		downimg:require('@/static/images/index/down.png'),
		rules: {
		  tcrq: {rules: [{required: true,errorMessage: '请选择投产日期'}]},
		  sjdze: {rules: [{required: true,errorMessage: '请输入实际到资金额',}]},
		 
		},
		tworules:{
			zsyzFjList: {rules: [{required: true,errorMessage: '请上传附件'} ]},
		},
		lhindex:0,
		lhlist:[{label:'是',id:'Y'},{label:'否',id:'N'},],//领航
		cyindex:0,
		cylist:[{label:'是',id:'Y'},{label:'否',id:'N'}],
		map:{text:'label',value:'id'},
		qybglist:[{label:'500强企业',id:1},{label:'上市部门',id:2},{label:'行业100强',id:3},{label:'头部企业',id:4}],
		pagetype:'add',
		xmmc:'',
		}
    },
	onLoad(e) {
		var newObj=JSON.parse(decodeURIComponent(e.data))
		this.pagetype=newObj.pagetype||'add';
		this.datainfo.xmId=newObj.xmId;
		this.datainfo.xmbh=newObj.xmbh;
		this.xmmc=newObj.xmmc;
		if(this.pagetype=='update'){
			// 获取详情 修改
			this.getDataFn()
		}else{
			this.datainfo.xmmc=newObj.xmmc;
		}
	// #ifdef APP
		uni.onKeyboardHeightChange(res=> { //监听键盘高度变化
		    const res_keyboard = uni.getSystemInfoSync();
		    let key_height = res.height - (res_keyboard.screenHeight - res_keyboard.windowHeight)
		    // let key_height = res.height - (res_keyboard.screenHeight - res_keyboard.windowHeight + res_keyboard.safeAreaInsets.bottom)
		     this.bottom = `${ key_height>0 ? key_height : 0}px`; 
		})
		// #endif
	},
	onHide() {
	    // #ifdef APP-PLUS
	    uni.offKeyboardHeightChange();  // 取消监听键盘高度变化事件，避免内存消耗
	    // #endif
	},
    onReady() {
      // this.$refs.form.setRules(this.rules)
    },
    methods: {
		checkPermi, checkRole,
		// 投产详情
		getDataFn(){
			gettcxxdetail(this.datainfo.xmId).then(res=>{
				if(res.code==200){
					this.datainfo=res.data;
					this.datainfo.xmbh=this.xmmc;
					if(res.data.zsyzFjList&&res.data.zsyzFjList.length){
						this.filelist=JSON.parse(JSON.stringify(res.data.zsyzFjList))
					}
				}else{
					this.$toast(res.msg)
				}
			})
		},
		getNext(){
			this.$refs.form.validate().then(res => {
				if(!this.datainfo.rgsj&&!this.datainfo.nrgsj){
					this.$toast('请选择入规日期或者拟入规日期');
					return
				}
				this.type=2;
			})
		},
		bindDateChangea(e){
			this.datainfo.tcrq=e.detail.value
		},
		bindDateChangeb(e){
			this.datainfo.rgsj=e.detail.value
		},
		bindDateChangec(e){
			this.datainfo.nrgsj=e.detail.value
		},
      getSubmit() {
			var that=this;
			this.datainfo.zsyzFjList=JSON.parse(JSON.stringify(this.filelist));
			this.$refs.twoform.validate().then(res => {
				var params=this.datainfo;
				// params.zsyzFjList=this.filelist
				// 判断到资明细有没有填写
				if(!params.ydmj&&!params.tdcr&&!params.xjcf&&!params.cftr&&!params.sbqd&&!params.sbfp&&!params.sbht&&!params.fkpz&&!params.zlcf&&!params.zlcftr&&!params.zlsbqd&&!params.zlsbfp&&!params.zlsbht&&!params.zlfkpz&&!params.sjss&&!params.lxy&&!params.jnsb&&!params.zbtr&&!params.ndsjss&&!params.qt){
					this.$toast('请输入到资明细')	
					return
				}
				if(this.pagetype=='add'){
					gettcxxAddFn(params).then(res=>{
						if(res.code==200){
							this.$toast('上报投产信息成功')	
							setTimeout(function() {
								uni.$emit('refreshdata');
								uni.navigateBack({delta: 1});
							},1500);
						}else{
							this.$toast(res.msg)
						}
						
					})
				}else{
					gettcxxPutFn(params).then(res=>{
						if(res.code==200){
							this.$toast('修改投产信息成功')	
							setTimeout(function() {
								uni.$emit('refreshdata');
								uni.navigateBack({delta: 1});
							},1500);
						}else{
							this.$toast(res.msg)
						}
						
					})
				}
				
			})
      },
	  onuploadEnd(item) {
	  	var newobj={}
	  	var responseText=JSON.parse(item.responseText)
	  	newobj.fjName=responseText.originalFilename;
	  	newobj.path=responseText.fileName;
	  	this.filelist.push(newobj)
	  	this.datainfo.zsyzFjList=JSON.parse(JSON.stringify(this.filelist))
	  },
	  getDelFj(idx){
	  	this.filelist.splice(idx,1)
	  	this.datainfo.zsyzFjList=JSON.parse(JSON.stringify(this.filelist))
	  },
	  getDown(e){
		  uni.showLoading({
		  	title: '加载中'
		  });
	  	var url=baseUrl+e;
	  	uni.downloadFile({
	  		url: url,//文件的下载路径
	  		success(result) {
				uni.hideLoading()
	  			var filePath = result.tempFilePath;
	  			   uni.openDocument({
	  			     filePath: filePath,
	  			     showMenu: true,
	  			     success: function (res) {
	  			       console.log('打开文档成功');
	  			     }
	  			   });
	  		},
	  		fail(res) {uni.hideLoading()}
	  	})
	  },
    }
  }
</script>

<style lang="scss" scoped>
 .inform{padding-top: 30rpx; padding-bottom: 160rpx;}
  .infolist{padding: 30rpx 32rpx 30rpx 24rpx;position: relative;
	.cir{position: absolute;font-size: 36rpx;font-weight: bold;color: #FE5706;left: 0rpx;}
	// .delimg{width: 30rpx;height:30rpx;margin-left: 8rpx;}
  }
  .delimg{width: 40rpx;height:40rpx;margin-left: 16rpx;display: flex;align-items: center;justify-content: center;
  	image{width: 30rpx;height: 30rpx;}
  }
  .infobtn{width: 100%;height: 88rpx;background: #FA5F03;line-height: 88rpx;position: fixed;left: 0;right: 0;bottom: 0;z-index: 3;}
  .input_ye image{width: 34rpx;height: 18rpx;}
.info_tit{font-size: 32rpx;color: #FE5706;padding: 30rpx 26rpx;font-weight: bold;}
.infolist_a{height: 44rpx;flex: 1;text-align: right;font-size: 32rpx;color: #343434;}


 .inform /deep/ .uni-forms-item__error{margin-top: -30rpx;margin-left: 24rpx;}
 .inform .pl12{margin-right: 10rpx;}
 .fixedbox .pl12{margin-right: 10rpx;}
</style>