zouling
/
qianshanxm_ui


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
							<!DOCTYPE html>
<html>
	<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="潜山市个人创业担保贷款">
		<script src="static/js/vue.js"></script>
		<script type="text/javascript" src="static/js/vue-router.js"></script>
		<script src="static/js/index.js" type="text/javascript"></script>
		<script src="static/js/croods-1.3.3.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="./static/js/jquery.min.js"></script>
		
		<script src="static/js/common.js"></script>
		<link href="static/css/common.css" rel="stylesheet" />
		<link href="static/css/style.css" rel="stylesheet" />
		<link rel="stylesheet" href="static/css/theme-chalk/index.css">
		<style></style>
	</head>
	<body class="dbody bgf5">
		<div id="app">
			<div id="appse">
				<header>
					<div class="dtop act" >
						<div class="back backimg"><img src="static/images/wback.png" /></div>
						<div class="tit over">查看进度</div>
					</div>
				</header>
			</div>
			<main>
				
				<el-form ref="form" :model="form" :rules="rules" label-width="2rem" :label-position="labelPosition" :hide-required-asterisk="true">
					<div class="jdbox">
						<div class="tit"><span>*</span>申请额度</div>
						<div class="bgf ibox">
							<el-form-item label="申请额度" prop="name">
							    <el-input v-model="form.name" ></el-input>
								<img src="static/images/brimg.png" class="irimg"/>
							</el-form-item>
						</div>
					</div>
					<div class="jdbox">
						<div class="tit"><span>*</span>担保类型</div>
						<div class="bgf ibox">
							<el-form-item label="担保类型" prop="region">
							    <el-input v-model="form.region" ></el-input>
								<img src="static/images/brimg.png" class="irimg"/>
							</el-form-item>
						</div>
					</div>
					<div class="jdbox">
						<div class="tit"><span>*</span>申请人信息</div>
						<div class="bgf ibox">
							<el-form-item label="身份证" >
								<div class="flexcj flex1"  >
									<div>
										<el-upload
											  class="upload-demo"
											  action="https://jsonplaceholder.typicode.com/posts/"
											  :show-file-list="false"
											  :on-success="upImageFn"
											  :before-upload="beforeUpload">
											  <img v-if="imageUrl" :src="imageUrl" class="avatar">
											  <img src="static/images/del.png" alt="" class="delimg" @click.stop="getRemove(imageUrl)">
											  <!-- <i v-else class="el-icon-plus avatar-uploader-icon"></i> -->
										</el-upload>
											<!-- <el-upload :disabled="formConfig.disabshow" class="upload-demo" :headers="{Authorization: 'Bearer ' + getToken()}"
											  v-if="formConfig.htmlType == 'fileUpload'" :action="process + '/boman-file/upload'" :on-change="handleChange"
											  :on-success="upImageFn" :on-error="err" :on-remove="reseImage" :file-list="config">
											  <el-button size="small" type="primary">点击上传</el-button>
											  <div slot="tip" class="el-upload__tip">只能上传jpg/png/txt/word/pdf/exe/RAR/ZIP文件，且不超过10MB</div>
											</el-upload> -->
										<div class="f10 ca txc lh24 mt5">上传人像面</div>
									</div>
									<div>
										<el-upload
											  class="upload-demo"
											  action="https://jsonplaceholder.typicode.com/posts/"
											  :show-file-list="false"
											  :on-success="upImageFn"
											  :before-upload="beforeUpload">
											  <img v-if="imageUrl" :src="imageUrl" class="avatar">
											  <img src="static/images/del.png" alt="" class="delimg" @click.stop="getRemove(imageUrl)">
										</el-upload>
										<div class="f10 ca txc lh24 mt5">上传国徽面</div>
									</div>
								</div>
							</el-form-item>
							<el-form-item label="姓名">
							    <el-input v-model="form.date1" placeholder="请输入姓名"></el-input>
								<img src="static/images/brimg.png" class="irimg"/>
							</el-form-item>
							<el-form-item label="身份证号">
							    <el-input v-model="form.date1" ></el-input>
								<img src="static/images/brimg.png" class="irimg"/>
							</el-form-item>
							<el-form-item label="手机号码">
							    <el-input v-model="form.date1" ></el-input>
								<img src="static/images/brimg.png" class="irimg"/>
							</el-form-item>
							<el-form-item label="文化程度">
							    <el-input v-model="form.date1" ></el-input>
								<img src="static/images/brimg.png" class="irimg"/>
							</el-form-item>
						</div>
					</div>
				</el-form>
				
				<!-- <el-form ref="form" :model="form" label-width="80px" class="jdbox">
					<div class="tit"><span>*</span>申请额度</div>
					<div class="bgf">
						
					  <el-form-item label="申请额度">
					    <el-select v-model="form.region" placeholder="请选择申请额度">
					      <el-option label="区域一" value="shanghai"></el-option>
					      <el-option label="区域二" value="beijing"></el-option>
					    </el-select>
					  </el-form-item>
					</div>
				</el-form> -->
				<div class="h50"></div>
				<!-- <div @click="getsubmit">添加</div> -->
				<a href="dqjd.html" class="jdbtn flexcc f16 cf fw">
					查看当前进度
				</a>
			</main>
		</div>
		<script type="text/javascript">
			var app = new Vue({
				el: '#app',
				data: {
					// base_url: 'https://qsfy.qs163.cn/prod-api',
					base_url: '',
					labelPosition:'left',
					imageUrl:'',
					form: {
					          name: '123',
					          region: '',
					          date1: '',
					          date2: '',
					          delivery: false,
					          type: [],
					          resource: '',
					          desc: ''
					        },
					rules: {
					          name: [
					            { required: true, message: '请输入活动名称', trigger: 'blur' },
					            { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
					          ],
					          region: [
					            { required: true, message: '请选择活动区域', trigger: 'change' }
					          ],
					          date1: [
					            { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
					          ],
					          date2: [
					            { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
					          ],
					          type: [
					            { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
					          ],
					          resource: [
					            { required: true, message: '请选择活动资源', trigger: 'change' }
					          ],
					          desc: [
					            { required: true, message: '请填写活动形式', trigger: 'blur' }
					          ]
					        }
				},
				created() {
		
				},
				mounted() {
				},
				destroyed() {

				},
				methods: {
					getRemove(e){
						this.imageUrl=''
						// this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
						//           confirmButtonText: '确定',
						//           cancelButtonText: '取消',
						//           type: 'warning'
						//         }).then(() => {
						// 			this.imageUrl=''
						//           this.$message({
						//             type: 'success',
						//             message: '删除成功!'
						//           });
						//         }).catch(() => {
						//           this.$message({
						//             type: 'info',
						//             message: '已取消删除'
						//           });          
						//         });
					},
					 upImageFn(res, file) {
					        this.imageUrl = URL.createObjectURL(file.raw);
					      },
					      beforeUpload(file) {
							   // const FILE_NAME = file.name
							   //  if (FILE_NAME.substring(FILE_NAME.lastIndexOf('.')) !== '.xls' && FILE_NAME.substring(FILE_NAME.lastIndexOf('.')) !== '.xlsx') {
							   //    this.$message.warning('仅支持.xls和.xlsx文件')
							   //    return false
							   //  }
					        const isJPG = file.type === 'image/jpeg';
					        const isPNG = file.type === 'image/png';
					        const isLt2M = file.size / 1024 / 1024 < 2;
							
					        if (!isJPG&&!isPNG) {
					          this.$message.error('上传图片只能是 JPG/PNG 格式!');
					        }
					        if (!isLt2M) {
					          this.$message.error('上传图片大小不能超过 2MB!');
					        }
					        return isJPG||isPNG && isLt2M;
					      },
					getsubmit(){
						 this.$refs['form'].validate((valid) => {
						          if (valid) {
						            alert('submit!');
						          } else {
						            console.log('error submit!!');
						            return false;
						          }
						        });
					}
				}
			})
		</script>
		<script type="text/javascript">
			$(document).ready(function() {
				$('.backimg').click(function() {
					window.history.go(-1)
				})
			})
		</script>
	</body>
</html>