tjf
/
yinshuapinmenhu


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491
							<!DOCTYPE html>
<html lang="zh">
<head>
		<meta charset="utf-8" />
		<meta http-equv="X-UA-Compatible" content="IE=edge" />
		<!-- <meta name="viewport" content="width=device-width, initial-scale=1" /> -->
		<meta name="format-detection" content="telephone=no" />
		<title>刷制品质量监督检验中心</title>
       <meta name="keywords" content="刷制品质量监督检验中心">
       <meta name="description" content="刷制品质量监督检验中心">
	   <link href="./static/css/drag.css" rel="stylesheet" type="text/css">
	   	<script src="http://www.qsqrkg.com/vendor/vendor.js"></script>
	   <script type="text/javascript" src="./static/js/jquery.min.js"></script>
	<script type="text/javascript" src="./static/js/custom.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
 <!-- <script type="text/javascript" src="./static/js/drag.js"></script> -->
		<link href="./static/css/vendor.css" rel="stylesheet" />
		<link href="./static/css/style.css" rel="stylesheet" />
		<link href="./static/css/custom.css" rel="stylesheet" />
		<link href="./static/css/printstyle.css" rel="stylesheet"/>
		<link href="static/css/index.css" rel="stylesheet"/>
		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
		
	</head>
	<body class="pcs" style="display: none;">
		<div id="appse">
			<header>
				<div class='a'>
					<div class='container'>
						<div class='tool'>
							<div class='fr'>
								<a href='' target='_blank'></a>
							</div>
			
							<!-- <script src='static/js/time.js'></script> -->
							<div class='loca'>
								<span> 欢迎访问 刷制品质量监督检验中心 ! 今天{{date_show}} {{week}}</span>
							</div>
							<div class='srch'><input type='text' class='tt' placeholder='输入要查找的信息' v-model="inpute"
									@blur="inpubie" /> <img src='static/picture/icon_ztl_ss@2x.png' @click="nhyesee">
							</div>
						</div>
					</div>
				</div>
				<div class='b'>
					<div class='container'>
						<div class='logo'>
							<a href='javascript:void(0)'><img src='static/picture/pic_hp_dh_logo@2x.png' alt='' /></a>
						</div>
						<div class='frs fr' v-if="hyew == true">
							<div class='menu _list'>
								<ul>
									<li v-for="item,index in tablide" :key="index"  @mouseover="dheyfr(item.label)">
										<div :class="[ nue == item.label ? 'on' : '' , 'i' ]">
											<p @click="tabcl(item.id,item.label)"><a href='javascript:void(0)'>{{item.label}}</a></p>
											<!-- ulrw -->
											<div class='ex' >
												<!-- :class="[inhye]" -->
												<!-- ulrw -->
												<p > <a href='javascript:void(0)' v-for="(items,indexs) in item.children" :key="items.id"
												 @click.stop="jeuese(items)" >{{items.label}}</a></p>
												<!-- jggk.html -->
												<!-- <p><a href='zzhjg.html'>组织架构</a></p> -->
											</div>
										</div>
									</li>
			
								</ul>
							</div>
						</div>
						<a href='' class='mbtn pc-hide'></a>
					</div>
				</div>
			</header>
		</div>
		
		<div id="app">
		<main>
			<div class="u-fullpart" >
				<div class="p_container">

				<div class="container">
					<div class="u-pagepath">
						<p>
							<a href="index.html">首页</a>
							<i>·</i>
							<a href="#">办事服务</a>
							<i>·</i>
							<a href="wshsj.html">网上送检</a>
						</p>
					</div>
					<div class="p_box">
						<div class="p_box_tit cf"><p class="fl p_box_titl">网上送检</p>
</div>
						<div class="pd10">
							<form class="pw_main">
								<div class="pw_list">
									<p>样品名称：</p>
									<input placeholder="请输入样品名称" v-model="form.sampleName" class="pw_inp"/>
								</div>
								<div class="pw_list cf">
									<div class="pw_lista fl">
										<p>样品数量：</p>
										<input placeholder="请输入样品数量，单位默认：个" v-model="form.sampleNum" class="pw_inp"/>
									</div>
									<div class="pw_lista fr">
										<p>规格型号：</p>
										<input placeholder="请输入规格型号" v-model="form.normsModel" class="pw_inp"/>
									</div>
								</div>
								<div class="pw_list cf">
									<div class="pw_lista fl">
										<p>检验项目：</p>
										<div class="pw_inp pw_select" id="pw_selecta">
											<input placeholder="请选择检验项目" :value='testItems' disabled="" class="pflex1"/>
											<img src="static/images/printimg/icon_up.png" class="pw_listb"/>
											<div class="pw_selecta" >
												<div v-if="inspectlist.length" style="padding: 0;">
													<div :class="ite.dictValue==form.testItems?'act':''" v-for="(ite,idx) in inspectlist" @click="getDicFn(0,ite)">{{ite.dictLabel}}</div>
												</div>
												<div v-else style="color: #999999;">暂无数据</div>
											</div>
										</div>
									</div>
									<div class="pw_lista fr">
										<p>提供方式：</p>
										<div class="pw_inp pw_select" id="pw_selectb">
											<input placeholder="请选择提供样品方式" :value='provideType' disabled="" class="pflex1"/>
											<img src="static/images/printimg/icon_up.png" class="pw_listb"/>
											<div class="pw_selecta" >
												<div v-if="provisionList.length" style="padding: 0;">
													<div :class="ite.dictValue==form.provideType?'act':''" v-for="(ite,idx) in provisionList" @click="getDicFn(1,ite)">{{ite.dictLabel}}</div>
												</div>
												<div v-else style="color: #999999;">暂无数据</div>
											</div>
										</div>
									</div>
								</div> 
								
								<div class="pw_list cf">
									<div class="pw_lista fl">
										<p>送检单位名称：</p>
										<input placeholder="请输入送检单位名称" v-model="form.manufacturerName" class="pw_inp"/>
									</div>
									<div class="pw_lista fr">
										<p>联系电话：</p>
										<input placeholder="请输入联系电话" v-model="form.manufacturerPhone" class="pw_inp"/>
									</div>
								</div>
								<div class="pw_list cf">
									<div class="pw_lista fl">
										<p>委托单位名称：</p>
										<input placeholder="请输入委托单位名称" v-model="form.inspectedName" class="pw_inp"/>
									</div>
									<div class="pw_lista fr">
										<p>联系电话：</p>
										<input placeholder="请输入联系电话" v-model="form.inspectedPhone" class="pw_inp"/>
									</div>
								</div>
								<div class="pw_list ">
									<p>备注信息：</p>
									<textarea placeholder="请输入其他需要备注说明的信息" v-model="form.remark" class="pw_text"></textarea>
								</div>
								<div class="pb_searchbtn pb_searchbtna" @click="getSubmit">确认提交</div>
								<p class="pw_tit">* 本机构检验时间一般不超过10个工作日，特殊情况在收到送检样品时会向客户说明。</p>
							</form>
						</div>
					</div>
				</div>
				</div>
			</div>
			<!-- 分割 -->
			<!-- <div class="foot_line"></div> -->
			<!-- 滑块验证 -->
			<center>
				<!-- <div id="drag"></div> -->
				<el-dialog
				  title="验证"
				  :visible.sync="dialogVisible"
				  width="30%">
				<div class="jc-component__range">
				    <div class="jc-range" :class="rangeStatus?'success':''" >
				        <i @mousedown="rangeMove"  :class="rangeStatus?'el-icon-success':'el-icon-d-arrow-right'" :style="disX==0?'transform: translateX(0px);':''"></i>
				        {{rangeStatus?successText:startText}}
				    </div>
				  </div>
				  <span slot="footer" class="dialog-footer">
				    <el-button @click="dialogVisible = false">取 消</el-button>
				    <el-button type="primary" @click="getDarg">确 定</el-button>
				  </span>
				</el-dialog>

			</center>
		</main>
		</div>
	</body>
	<style>
	/* .el-input /deep/ .el-input__inner {
	    text-align: center;
	} */
	</style>
	<script src="static/js/footer.js" type="text/javascript" charset="utf-8"></script>

	<script src="static/js/script.js"></script>
	<script src="static/js/custom.js"></script>
	<script type="text/javascript" src="static/js/header.js"></script>
	<script type="text/jscript">
		var app=new Vue({
			el:'#app',
			data:{
				inpute: '',
				tablide: [],
				hyew: false,
				nue: "首页",
				week: '',
				date_show: '',
				ulrw: '',
				mjuede: '',
				tyer: {
					type: 0
				},
				form:{
					"sampleName":"",//样品名称
					"sampleNum":"",//样品数量
					"normsModel":"",//规格型号
					"testItems":"",//检验项目
					"provideType":"",//提供方式
					 "manufacturerName":"",//生产单位名称
					"manufacturerPhone":"",//生产单位电话
					 "inspectedName":"",//受检单位名称
					"inspectedPhone":"",//受检单位电话
					"remark":""
				},
				base_url:'https://jyzx.qs163.cn/prod-api',
				// base_url:'http://192.168.101.11:8090',
				labelPosition: 'top',
				inspectlist:[],
				provisionList:[],
				testItems:'',
				provideType:'',
				disX : 0,
				rangeStatus: false,
				successText:'验证成功',
				startText:'请拖住滑块，拖动到最右边',
				dialogVisible:false
			},
			created(){
				this.getInspect();
				this.getprovision();
			},
			methods:{
				// //获取字典值
				getInspect(){
					var that=this;
					$.ajax({
						url:this.base_url+ '/gateway/query/type/inspection_item',
						type: 'GET',
						data: {},
						dataType: 'json',
						success: function(res) {
							if (res.code == 200) {
								that.inspectlist=res.data
							} else {
								that.$message({
									message: res.msg,
									type: 'error'
								});
							}
						}
					})
				},
				getprovision(){
					var that=this;
					$.ajax({
						url:this.base_url+ '/gateway/query/type/provision_mode',
						type: 'GET',
						data: {},
						dataType: 'json',
						success: function(res) {
							if (res.code == 200) {
								that.provisionList=res.data
							} else {
								that.$message({
									message: res.msg,
									type: 'error'
								});
							}
						}
					})
				},
				getDicFn(idx,e){
					if(idx==0){
						this.testItems=e.dictLabel
						this.form.testItems=e.dictValue;
					}else{
						this.provideType=e.dictLabel
						this.form.provideType=e.dictValue;

					}
				},
				rangeMove(e){
					let ele = e.target;
					    let startX = e.clientX;
					    let eleWidth = ele.offsetWidth;
					    let parentWidth =  ele.parentElement.offsetWidth;
					    let MaxX = parentWidth - eleWidth;
					    if(this.rangeStatus){//不运行
					        return false;
					    }
					    document.onmousemove = (e) => {
					        let endX = e.clientX;
					        this.disX = endX - startX;
					        if(this.disX<=0){
					            this.disX = 0;
					        }
					        if(this.disX>=MaxX-eleWidth){//减去滑块的宽度,体验效果更好
					            this.disX = MaxX;
					        }
					        ele.style.transition = '.1s all';
					        ele.style.transform = 'translateX('+this.disX+'px)';
					        e.preventDefault();
					    }
					    document.onmouseup = ()=> {
					        if(this.disX !== MaxX){
					            ele.style.transition = '.5s all';
					            ele.style.transform = 'translateX(0)';
					            //执行成功的函数
					            this.errorFun && this.errorFun();
					        }else{
					            this.rangeStatus = true;
					            if(this.status){
					                this.$parent[this.status] = true;
					            }
					            //执行成功的函数
					            // this.successFun && this.successFun();
					        }
					        document.onmousemove = null;
					        document.onmouseup = null;
					    }
					},
				successFun(){
					
				},
				getDarg(){
					var that=this;
					if(this.rangeStatus){
						this.dialogVisible=false;
						this.rangeStatus=false;
						this.disX=0;
						$.ajax({
							url:this.base_url+ '/gateway/query/sendInspectInFor',
							type: 'POST',
							data: this.form,
							dataType: 'json',
							success: function(res) {
								if (res.code == 200) {
									that.$message.success('提交成功');
									that.resertFoem()
									 // that.setTimein()
								} else {
									that.$message({
										message: res.msg,
										type: 'error'
									});
								}
							}
						})
					}else{
						that.$message.error('请先验证');	
					}
					
				},
				getSubmit(){
					var that=this;
					var myreg=/^[1][3,4,5,7,8,9][0-9]{9}$/;
					if(!this.form.sampleName){
						this.$message.error("请输入样品名称");
						return
					}
					if(!this.form.sampleNum){
						this.$message.error("请输入样品数量");
						return
					}
					if(!this.form.normsModel){
						this.$message.error("请输入规格型号");
						return
					}
					if(!this.form.testItems){
						this.$message.error("请选择检验项目");
						return
					}
					if(!this.form.provideType){
						this.$message.error("请选择提供方式");
						return
					}
					if(!this.form.manufacturerName){
						this.$message.error("请输入送检单位名称");
						return
					}
					if(!this.form.manufacturerPhone||this.form.manufacturerPhone.length!=11||!myreg.test(this.form.manufacturerPhone)){
						this.$message.error("请输入正确的送检单位电话");
						return
					}
					if(!this.form.inspectedName){
						this.$message.error("请输入委托单位名称");
						return
					}
					if(!this.form.inspectedPhone||this.form.inspectedPhone.length!=11||!myreg.test(this.form.inspectedPhone)){
						this.$message.error("请输入正确委托单位电话");
						return
					}
					this.rangeStatus=false;
					this.disX=0;
					this.dialogVisible=true
					
				},
				resertFoem(){
					this.form={
							"sampleName":"",//样品名称
							"sampleNum":"",//样品数量
							"normsModel":"",//规格型号
							 "testItems":"",//检验项目
							"provideType":"",//提供方式
							 "manufacturerName":"",//生产单位名称
							"manufacturerPhone":"",//生产单位电话
							 "inspectedName":"",//受检单位名称
							"inspectedPhone":"",//受检单位电话
							"remark":""
					}
					this.testItems=''
					this.provideType=''
				},
				inpubie() {
					console.log(this.inpute)
				},
				nhyesee() {
					console.log(this.inpute)
					
				},
				tabcl(index, val) {
					this.nue = index
					if (val == 1) {
						this.ulrw = index.html
					} else {
						this.ulrw = 'djdt.html?id=' + val
					}
					// console.log(index, val)
				},
				jeuese(index) {
					if (index == 1) {
						this.ulrw = index.html
					} else {
						this.ulrw = 'djdt.html?id=' + index
					}
				},
			}
		})
	</script>
	<script>
	$(document).ready(function() {
		$('body').click(function(e) {
			var e = e || window.event; //浏览器兼容性   
			var elem = e.target || e.srcElement;  
			 while (elem) { 
			    if ((elem.id && elem.id == 'pw_selecta')||(elem.id &&elem.id == 'pw_selectb')) {  
			        return;  
			    }  
				elem = elem.parentNode;  
			}  
			 if ($('.pw_selecta').is(':visible') ) {
			 	$('.pw_selecta').hide();
			 	$(".pw_listb").removeClass('act')
			 }
		})
		$(".pw_select").click(function(){
			if($(this).find(".pw_selecta").is(":hidden")){
				$(".pw_selecta").hide();
				$(".pw_listb").removeClass('act')
				$(this).find(".pw_selecta").show()
				$(this).find(".pw_listb").addClass('act')
			}else{
				$(this).find(".pw_selecta").hide()
				$(this).find(".pw_listb").removeClass('act')
			}	
		})
		
		
	});
	</script>
</html>