| @@ -1,8 +1,8 @@ | |||
| <template> | |||
| <div> | |||
| <myhead /> | |||
| <myhead v-if="routeFLag" /> | |||
| <router-view></router-view> | |||
| <div ref="drawer" class="drawer" @mouseenter="enter" @mouseleave="out"> | |||
| <div v-if="routeFLag" ref="drawer" class="drawer" @mouseenter="enter" @mouseleave="out"> | |||
| <div class="goTop" @click="goTop"> | |||
| <div class="img"> | |||
| <img src="./assets/img/xf/goTop.png" /> | |||
| @@ -35,7 +35,7 @@ | |||
| <img src="./assets/img/qrCode/home.png" alt=""> | |||
| </div> | |||
| </div> | |||
| <tail /> | |||
| <tail v-if="routeFLag" /> | |||
| </div> | |||
| </template> | |||
| @@ -48,14 +48,19 @@ export default { | |||
| myhead, | |||
| }, | |||
| watch: { | |||
| /* $route(to, from) { | |||
| this.routeFLag = to.path !== '/login' | |||
| } */ | |||
| }, | |||
| data() { | |||
| return { | |||
| rQCodeShow:false, | |||
| routeFLag: true | |||
| } | |||
| }, | |||
| methods: { | |||
| enter() { | |||
| console.log(1); | |||
| this.rQCodeShow = true | |||
| const drawer = this.$refs.drawer; | |||
| drawer.style.right = 0; | |||
| @@ -68,7 +73,7 @@ export default { | |||
| goTop(){ | |||
| window.scroll(0, 0) //滚动条返回顶部 | |||
| } | |||
| }, | |||
| } | |||
| }; | |||
| </script> | |||
| @@ -3,8 +3,8 @@ import { Message } from "element-ui" | |||
| const service = axios.create({ | |||
| baseURL: '/C/', | |||
| //baseURL: 'https://www.yjyculture.com/C/', | |||
| // baseURL: '/C/', | |||
| baseURL: 'https://www.yjyculture.com/C/', | |||
| timeout: 60000 // 请求超时时间 | |||
| }) | |||
| @@ -1,18 +1,16 @@ | |||
| <template> | |||
| <div class="bgBox"> | |||
| <img src="../../assets/img/bg/bg.jpg" class="topImg" alt=""> | |||
| <!-- <div class="Box"> | |||
| <div class="backImg"> | |||
| <div class="logoBox"> | |||
| <div class="logo_img"> | |||
| <img src="../../assets/img/logo/logo1.png" alt /> | |||
| </div> | |||
| <div class="title_Box"> | |||
| <p>瑜璟缘国际文化礼仪培训</p> | |||
| </div> | |||
| </div> | |||
| </div> --> | |||
| <div class="topBar"> | |||
| <div class="topBar_ct"> | |||
| <p class="left">欢迎来到 武汉壹玖之家网络科技有限公司 !</p> | |||
| <p class="right"> | |||
| <span @click="goRouter('/publish')">发布信息</span> | |||
| <span @click="goRouter('/login')">登录</span> | |||
| <span @click="goRouter('/register')">注册</span> | |||
| </p> | |||
| </div> | |||
| </div> | |||
| <img src="../../assets/img/bg/bg.jpg" class="topImg" alt=""> | |||
| <div class="nav"> | |||
| <el-dropdown> | |||
| <span class="title" @click="goRouter('/home')"> | |||
| @@ -106,6 +104,33 @@ export default { | |||
| //background-attachment: fixed; | |||
| background-repeat: repeat-x; | |||
| background-size: 100% 160px; */ | |||
| .topBar{ | |||
| line-height: 40px; | |||
| height: 40px; | |||
| background: #409EFF; | |||
| color: #fff; | |||
| .topBar_ct{ | |||
| width: 1200px; | |||
| margin: 0 auto; | |||
| .left{ | |||
| float: left; | |||
| } | |||
| .right{ | |||
| float: right; | |||
| span{ | |||
| padding: 0 15px; | |||
| cursor: pointer; | |||
| } | |||
| span:nth-of-type(2){ | |||
| border-right: 1px solid #ccc; | |||
| } | |||
| span:hover{ | |||
| font-weight: bold; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| .topImg{ | |||
| width: 100%; | |||
| } | |||
| @@ -15,6 +15,14 @@ | |||
| </div> | |||
| <div class="advisoryBox"> | |||
| <div class="left"> | |||
| <a href="" class="left_list"> | |||
| <span>生活服务</span> | |||
| <span class="des">Life service</span> | |||
| </a> | |||
| <a href="" class="left_list"> | |||
| <span>生活服务</span> | |||
| <span class="des">Life service</span> | |||
| </a> | |||
| <a | |||
| href="http://wpa.qq.com/msgrd?v=3&uin=30397378&site=qq&menu=yes" | |||
| target="view_window" | |||
| @@ -187,6 +195,22 @@ export default { | |||
| float: left; | |||
| width: 26%; | |||
| border-top: 1px rgb(238, 238, 238) solid; | |||
| .left_list{ | |||
| width: 230px; | |||
| height: 48px; | |||
| display: block; | |||
| background: rgba(75,161,107,0.9); | |||
| color: #fff; | |||
| display: flex; | |||
| align-items: center; | |||
| justify-content: center; | |||
| flex-flow: column; | |||
| margin: 10px auto 0; | |||
| span{ | |||
| display: block; | |||
| line-height: 16px; | |||
| } | |||
| } | |||
| .iconBox { | |||
| overflow: hidden; | |||
| margin: 10px 0; | |||
| @@ -0,0 +1,133 @@ | |||
| <template> | |||
| <div class="login"> | |||
| <div class="top_div"></div> | |||
| <div class="login_ct"> | |||
| <div class="topImg"></div> | |||
| <el-form :model="ruleForm" :rules="rules" ref="ruleForm" size="small" class="demo-ruleForm"> | |||
| <el-form-item prop="userName"> | |||
| <el-input v-model="ruleForm.userName" placeholder="请输入用户名"></el-input> | |||
| </el-form-item> | |||
| <el-form-item prop="password"> | |||
| <el-input v-model="ruleForm.password" type="password" placeholder="请输入密码"></el-input> | |||
| </el-form-item> | |||
| <el-form-item prop="code"> | |||
| <el-row> | |||
| <el-col :span="16"> | |||
| <el-input v-model="ruleForm.code" placeholder="输入验证码"></el-input> | |||
| </el-col> | |||
| <el-col :span="8"> | |||
| <div class="code">1</div> | |||
| </el-col> | |||
| </el-row> | |||
| </el-form-item> | |||
| </el-form> | |||
| <div class="login_btn"> | |||
| <el-link size="small" type="primary">返回首页</el-link> | |||
| <div class="right"> | |||
| <el-link size="small" type="info">忘记密码</el-link> | |||
| <el-link size="small" type="info" @click="register">注册</el-link> | |||
| <el-button size="small" type="primary" @click="login('ruleForm')">登录</el-button> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| data() { | |||
| return { | |||
| ruleForm: { | |||
| userName: '', | |||
| password: '', | |||
| code: '' | |||
| }, | |||
| rules: { | |||
| userName: [ | |||
| { required: true, message: '请输入用户名', trigger: 'blur' } | |||
| ], | |||
| password: [ | |||
| { required: true, message: '请输入密码', trigger: 'blur' } | |||
| ], | |||
| code: [ | |||
| { required: true, message: '请输入验证码', trigger: 'blur' } | |||
| ] | |||
| } | |||
| }; | |||
| }, | |||
| methods: { | |||
| login(formName) { | |||
| this.$refs[formName].validate((valid) => { | |||
| if (valid) { | |||
| this.$message.error('账号密码错误!'); | |||
| } else { | |||
| console.log('error submit!!'); | |||
| return false; | |||
| } | |||
| }); | |||
| }, | |||
| register() { | |||
| this.$router.push('/register'); | |||
| }, | |||
| resetForm(formName) { | |||
| this.$refs[formName].resetFields(); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped lang="scss"> | |||
| .login { | |||
| position: absolute; | |||
| left: 0; | |||
| top: 0; | |||
| right: 0; | |||
| bottom: 0; | |||
| .top_div{ | |||
| height: 50%; | |||
| width: 100%; | |||
| background: #008ead; | |||
| } | |||
| .login_ct{ | |||
| width: 400px; | |||
| margin: -100px auto 0; | |||
| background: #fff; | |||
| padding: 40px 0 0; | |||
| border: 1px solid #e7e7e7; | |||
| position: relative; | |||
| .topImg{ | |||
| width: 92px; | |||
| height: 97px; | |||
| background: url('../../assets/img/login.png'); | |||
| position: absolute; | |||
| top: -85px; | |||
| margin-left: 152.5px; | |||
| } | |||
| .el-form{ | |||
| padding: 0 40px; | |||
| .code{ | |||
| width: 90%; | |||
| float: right; | |||
| height: 30px; | |||
| vertical-align: middle; | |||
| border-radius: 5px; | |||
| border: 1px solid #d3d3d3; | |||
| background: #F2FBFE; | |||
| text-align: center; | |||
| line-height: 30px; | |||
| font-weight: bold; | |||
| } | |||
| } | |||
| .login_btn { | |||
| height: 50px; | |||
| margin-top: 40px; | |||
| border-top: 1px solid #e7e7e7; | |||
| line-height: 50px; | |||
| padding: 0 40px; | |||
| .right{ | |||
| float: right; | |||
| margin: 0 10px; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,247 @@ | |||
| <template> | |||
| <div class="login"> | |||
| <div class="top_div"></div> | |||
| <div class="login_ct"> | |||
| <el-alert | |||
| title="严禁发布低价欺诈以及图片虚假的信息诱导买家,价格严重偏离正常水平的及图片虚假的信息将被删除" | |||
| type="warning" | |||
| show-icon | |||
| :closable="false"> | |||
| </el-alert> | |||
| <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" size="small"> | |||
| <p>基础信息</p> | |||
| <el-form-item label="标题" prop="name"> | |||
| <el-input v-model="ruleForm.name" placeholder="请输入标题"></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="类别" prop="category"> | |||
| <el-select v-model="ruleForm.category" placeholder="请选择活动区域"> | |||
| <el-option v-for="(item, index) in categoryList" :key="index" :label="item.label" :value="item.value"></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="上传图片" prop="fileList"> | |||
| <el-upload | |||
| class="upload-demo" | |||
| ref="upload" | |||
| action="#" | |||
| :show-file-list="true" | |||
| :on-change="fileChange" | |||
| :file-list="ruleForm.fileList" | |||
| :on-remove="fileRemove" | |||
| accept="image/*" | |||
| :auto-upload="false" | |||
| > | |||
| <el-button type="primary">请选择图片</el-button> | |||
| </el-upload> | |||
| </el-form-item> | |||
| <el-form-item label="信息详情" prop="detail"> | |||
| <el-input type="textarea" v-model="ruleForm.detail" placeholder="请输入信息详情介绍"></el-input> | |||
| </el-form-item> | |||
| <p>联系方式</p> | |||
| <el-form-item label="联系电话" prop="phone"> | |||
| <el-input v-model="ruleForm.phone" placeholder="请输入联系电话"></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="联系人" prop="contact"> | |||
| <el-input v-model="ruleForm.contact" placeholder="请输入联系人"></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="QQ"> | |||
| <el-input v-model="ruleForm.qq" placeholder="请输入QQ"></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="E-mail"> | |||
| <el-input v-model="ruleForm.email" placeholder="请输入E-mail"></el-input> | |||
| </el-form-item> | |||
| </el-form> | |||
| <div class="login_btn"> | |||
| <el-button class="right" size="small" type="primary" @click="login('ruleForm')">发布信息</el-button> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| data() { | |||
| var checkIdCard = (rule, value, cb) => { | |||
| if (value.length > 0) { | |||
| return cb(); | |||
| } | |||
| cb(new Error("请选择图片")); | |||
| }; | |||
| return { | |||
| ruleForm: { | |||
| name: '', | |||
| category: 1, | |||
| detail: '', | |||
| phone: '', | |||
| contact: '', | |||
| qq: '', | |||
| email: '', | |||
| imageUrl: '', | |||
| fileList: [], | |||
| }, | |||
| rules: { | |||
| name: [ | |||
| { required: true, message: '请输入标题', trigger: 'blur' } | |||
| ], | |||
| category: [ | |||
| { required: true, message: '请选择类别', trigger: 'change' } | |||
| ], | |||
| detail: [ | |||
| { required: true, message: '请输入信息详情', trigger: 'blur' } | |||
| ], | |||
| phone: [ | |||
| { required: true, message: '请输入联系人电话', trigger: 'blur' } | |||
| ], | |||
| contact: [ | |||
| { required: true, message: '请输入联系人', trigger: 'blur' } | |||
| ], | |||
| fileList: [ | |||
| { required: true, message: "请选择图片", trigger: ['blur', 'change'] }, | |||
| { validator: checkIdCard, trigger: ['blur', 'change'] } | |||
| ] | |||
| }, | |||
| categoryList: [ | |||
| { | |||
| label: '生活服务', | |||
| value: 1 | |||
| }, | |||
| { | |||
| label: '同城活动', | |||
| value: 2 | |||
| }, | |||
| { | |||
| label: '商务服务', | |||
| value: 3 | |||
| }, | |||
| { | |||
| label: '宠物市场', | |||
| value: 4 | |||
| }, | |||
| { | |||
| label: '行业市场', | |||
| value: 5 | |||
| }, | |||
| { | |||
| label: '教育培训', | |||
| value: 6 | |||
| }, | |||
| { | |||
| label: '跳蚤市场', | |||
| value: 7 | |||
| }, | |||
| { | |||
| label: '车辆相关', | |||
| value: 8 | |||
| }, | |||
| { | |||
| label: '房产出售', | |||
| value: 9 | |||
| }, | |||
| { | |||
| label: '餐饮美食', | |||
| value: 10 | |||
| }, | |||
| { | |||
| label: '票务卡券', | |||
| value: 11 | |||
| }, | |||
| { | |||
| label: '宠物市场', | |||
| value: 12 | |||
| } | |||
| ] | |||
| }; | |||
| }, | |||
| methods: { | |||
| login(formName) { | |||
| this.$refs[formName].validate((valid) => { | |||
| if (valid) { | |||
| this.$message({ | |||
| message: '人工审核中', | |||
| type: 'success' | |||
| }); | |||
| } else { | |||
| console.log('error submit!!'); | |||
| return false; | |||
| } | |||
| }); | |||
| }, | |||
| goPage(path) { | |||
| if(path) { | |||
| this.$router.push(path); | |||
| } | |||
| }, | |||
| resetForm(formName) { | |||
| this.$refs[formName].resetFields(); | |||
| }, | |||
| /* 只保留最后一次上传的文件 */ | |||
| fileChange (file, fileList) { | |||
| if (fileList.length > 0) { | |||
| this.ruleForm.fileList = [fileList[fileList.length - 1]] | |||
| } | |||
| }, | |||
| fileRemove(file) { | |||
| this.ruleForm.fileList = [] | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped lang="scss"> | |||
| .login { | |||
| position: absolute; | |||
| left: 0; | |||
| top: 0; | |||
| right: 0; | |||
| bottom: 0; | |||
| .top_div{ | |||
| height: 50%; | |||
| width: 100%; | |||
| background: #008ead; | |||
| } | |||
| .login_ct{ | |||
| width: 600px; | |||
| margin: -100px auto 0; | |||
| background: #fff; | |||
| padding: 40px 0 0; | |||
| border: 1px solid #e7e7e7; | |||
| position: relative; | |||
| .el-form{ | |||
| padding: 0 40px; | |||
| .code{ | |||
| width: 90%; | |||
| float: right; | |||
| height: 30px; | |||
| vertical-align: middle; | |||
| border-radius: 5px; | |||
| border: 1px solid #d3d3d3; | |||
| background: #F2FBFE; | |||
| text-align: center; | |||
| line-height: 30px; | |||
| font-weight: bold; | |||
| } | |||
| .login_text{ | |||
| font-size: 12px; | |||
| line-height: 20px; | |||
| display: inline-block; | |||
| a{ | |||
| color: #409EFF; | |||
| font-size: 12px; | |||
| cursor: pointer; | |||
| } | |||
| } | |||
| } | |||
| .login_btn { | |||
| height: 50px; | |||
| margin-top: 40px; | |||
| border-top: 1px solid #e7e7e7; | |||
| line-height: 50px; | |||
| padding: 10px 40px 0; | |||
| .right{ | |||
| float: right; | |||
| button{ | |||
| margin: 0 10px; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| </style> | |||
| @@ -0,0 +1,173 @@ | |||
| <template> | |||
| <div class="login"> | |||
| <div class="top_div"></div> | |||
| <div class="login_ct"> | |||
| <div class="topImg"></div> | |||
| <el-form :model="ruleForm" :rules="rules" ref="ruleForm" size="small" class="demo-ruleForm"> | |||
| <el-form-item prop="userName"> | |||
| <el-input v-model="ruleForm.userName" placeholder="请输入用户名"></el-input> | |||
| </el-form-item> | |||
| <el-form-item prop="password"> | |||
| <el-input v-model="ruleForm.password" type="password" placeholder="请输入密码"></el-input> | |||
| </el-form-item> | |||
| <el-form-item prop="password2"> | |||
| <el-input v-model="ruleForm.password2" type="password" placeholder="确认密码"></el-input> | |||
| </el-form-item> | |||
| <el-form-item prop="name"> | |||
| <el-input v-model="ruleForm.name" placeholder="请输入姓名"></el-input> | |||
| </el-form-item> | |||
| <el-form-item prop="cardId"> | |||
| <el-input v-model="ruleForm.cardId" placeholder="请输入身份证号"></el-input> | |||
| </el-form-item> | |||
| <el-form-item prop="code"> | |||
| <el-row> | |||
| <el-col :span="16"> | |||
| <el-input v-model="ruleForm.code" placeholder="输入验证码"></el-input> | |||
| </el-col> | |||
| <el-col :span="8"> | |||
| <div class="code">1</div> | |||
| </el-col> | |||
| </el-row> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-checkbox v-model="checked"></el-checkbox> | |||
| <div class="login_text"> | |||
| 我接受 <a>《武汉壹玖之家网络科技有限公司用户注册协议》</a>及 <a>《武汉壹玖之家网络科技有限公司隐私政策》</a> | |||
| </div> | |||
| </el-form-item> | |||
| </el-form> | |||
| <div class="login_btn"> | |||
| <el-link size="small" type="text" @click="goPage('/home')">返回首页</el-link> | |||
| <div class="right"> | |||
| <el-link size="small" type="info" @click="register">登录</el-link> | |||
| <el-button size="small" type="primary" @click="login('ruleForm')">注册</el-button> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| data() { | |||
| return { | |||
| ruleForm: { | |||
| userName: '', | |||
| password: '', | |||
| password2: '', | |||
| name: '', | |||
| cardId: '', | |||
| code: '' | |||
| }, | |||
| rules: { | |||
| userName: [ | |||
| { required: true, message: '请输入用户名', trigger: 'blur' } | |||
| ], | |||
| password: [ | |||
| { required: true, message: '请输入密码', trigger: 'blur' } | |||
| ], | |||
| password2: [ | |||
| { required: true, message: '请确认密码', trigger: 'blur' } | |||
| ], | |||
| name: [ | |||
| { required: true, message: '请输入真实姓名', trigger: 'blur' } | |||
| ], | |||
| cardId: [ | |||
| { required: true, message: '请输入身份证号', trigger: 'blur' } | |||
| ], | |||
| code: [ | |||
| { required: true, message: '请输入验证码', trigger: 'blur' } | |||
| ] | |||
| } | |||
| }; | |||
| }, | |||
| methods: { | |||
| login(formName) { | |||
| this.$refs[formName].validate((valid) => { | |||
| if (valid) { | |||
| this.$message('人工审核中'); | |||
| } else { | |||
| console.log('error submit!!'); | |||
| return false; | |||
| } | |||
| }); | |||
| }, | |||
| goPage(path) { | |||
| if(path) { | |||
| this.$router.push(path); | |||
| } | |||
| }, | |||
| resetForm(formName) { | |||
| this.$refs[formName].resetFields(); | |||
| }, | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped lang="scss"> | |||
| .login { | |||
| position: absolute; | |||
| left: 0; | |||
| top: 0; | |||
| right: 0; | |||
| bottom: 0; | |||
| .top_div{ | |||
| height: 50%; | |||
| width: 100%; | |||
| background: #008ead; | |||
| } | |||
| .login_ct{ | |||
| width: 400px; | |||
| margin: -100px auto 0; | |||
| background: #fff; | |||
| padding: 40px 0 0; | |||
| border: 1px solid #e7e7e7; | |||
| position: relative; | |||
| .topImg{ | |||
| width: 92px; | |||
| height: 97px; | |||
| background: url('../../assets/img/login.png'); | |||
| position: absolute; | |||
| top: -85px; | |||
| margin-left: 152.5px; | |||
| } | |||
| .el-form{ | |||
| padding: 0 40px; | |||
| .code{ | |||
| width: 90%; | |||
| float: right; | |||
| height: 30px; | |||
| vertical-align: middle; | |||
| border-radius: 5px; | |||
| border: 1px solid #d3d3d3; | |||
| background: #F2FBFE; | |||
| text-align: center; | |||
| line-height: 30px; | |||
| font-weight: bold; | |||
| } | |||
| .login_text{ | |||
| font-size: 12px; | |||
| line-height: 20px; | |||
| display: inline-block; | |||
| a{ | |||
| color: #409EFF; | |||
| font-size: 12px; | |||
| cursor: pointer; | |||
| } | |||
| } | |||
| } | |||
| .login_btn { | |||
| height: 50px; | |||
| margin-top: 40px; | |||
| border-top: 1px solid #e7e7e7; | |||
| line-height: 50px; | |||
| padding: 0 40px; | |||
| .right{ | |||
| float: right; | |||
| button{ | |||
| margin: 0 10px; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| </style> | |||
| @@ -12,6 +12,30 @@ const routes = [ | |||
| }, | |||
| component: r => require.ensure([], () => r(require('@/page/home/home.vue')), 'pointzujinListEdit') | |||
| }, | |||
| //登录 | |||
| { | |||
| path: '/login', | |||
| meta:{ | |||
| title:"登录" | |||
| }, | |||
| component: r => require.ensure([], () => r(require('@/page/login/login.vue')), 'login') | |||
| }, | |||
| //注册 | |||
| { | |||
| path: '/register', | |||
| meta:{ | |||
| title:"注册" | |||
| }, | |||
| component: r => require.ensure([], () => r(require('@/page/register/register.vue')), 'register') | |||
| }, | |||
| //注册 | |||
| { | |||
| path: '/publish', | |||
| meta:{ | |||
| title:"注册" | |||
| }, | |||
| component: r => require.ensure([], () => r(require('@/page/publish/publish.vue')), 'publish') | |||
| }, | |||
| //公司简介 | |||
| { | |||
| path: '/companySynopsis', | |||