Skip to content

Z
zhichan
Commit 335e6ac9 by 任建
Options

rj

parent 118f77e8
Showing with 1068 additions and 169 deletions
channel-access/package.json
......@@ -13,6 +13,7 @@
"element-ui": "^2.13.0",
"js-cookie": "^2.2.1",
"vue": "^2.6.10",
"vue-clipboard2": "^0.3.1",
"vue-router": "^3.1.3",
"vuex": "^3.1.2"
},
......
channel-access/src/App.vue
<template>
<!-- 根组件 -->
<div id="app" ref="app">
<Globalheader title="" />
<router-view />
<!-- <Globalfooter/> -->
<Globalfooter />
</div>
</template>
<script>
import Globalfooter from "@/components/globalfooter"
import Globalheader from "@/components/globalheader";
import Globalfooter from "@/components/globalfooter";
export default {
components:{
components: {
Globalheader,
Globalfooter
}
}
};
</script>
<style lang="scss">
*{
* {
margin: 0;
padding: 0;
list-style: none;
......@@ -22,17 +25,17 @@ export default {
outline: none;
box-sizing: border-box;
}
html,body{
html,
body {
width: 100%;
height: 100%;
font-size: 14px;
}
#app{
#app {
width: 100%;
height: 100%;
}
.v-modal{
.v-modal {
z-index: 1999 !important;
}
</style>
channel-access/src/api/api.js
import axios from "axios";
import http from "@/http/http.js";
let baseUrl =
"http://zcchannel.gongsibao.com:4003/web/auth/accessAuth/getAppTokenByHosts";
let baseUrl = "/api/web/auth/accessAuth/getAppTokenByHosts";
//获取token
export function getTokens() {
return axios.post(baseUrl, {
......@@ -10,61 +7,3 @@ export function getTokens() {
actionBody: {}
});
}
\ No newline at end of file
//jdbycdetailtm数据
export function getJdbycdetailtmData() {
return http.post(baseUrl, {
actionType: "getAppTokenByHosts",
actionBody: { timeStamp: 1578295027, channelUserId: "" }
});
}
//初审公告期号图片
export function getLinkUrl(num) {
return axios.post(baseUrl, {
actionProcess: "jd",
sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI",
actionBody: {
sbzch: "14543071",
zcggqh: num,
timeStamp: 1578298188,
channelUserId: ""
},
actionType: "noticezcggsearch",
requrl: "/action/tmQuery/springBoard",
isUser: "no",
isDecryptUser: "no"
});
}
//获取公司信息
export function getCompanyInfo(name) {
return http.post(baseUrl, {
actionProcess: "jd",
sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI",
actionBody: {
company_name: name,
timeStamp: 1578298969,
channelUserId: ""
},
actionType: "getCompanyInfoNoUser",
requrl: "/action/tmQuery/springBoard",
isUser: "no",
isDecryptUser: "no"
});
}
// 获取jdtrademark商标注册卡片信息
export function getRegInfo() {
return axios.post(baseUrl, {
actionProcess: "jd",
sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI",
actionBody: {
channelUserId: "",
itemCode: "sbfu",
timeStamp: 1578362897
},
actionType: "getProductListByTypeOneCode",
isDecryptUser: "no",
isUser: "no",
requrl: "/action/tmOrder/springBoard"
})
}
\ No newline at end of file
channel-access/src/api/user.js 0 → 100644
import http from "@/http/http.js";
let baseUrl = "/api/web/auth/accessAuth/springBoard";
//获取短信验证码
export function getVerifyCode(phone) {
return http.post(baseUrl, {
actionType: "getVerifyCode",
actionBody: {
mobile: phone // Y 手机号
}
});
}
//验证码登录
export function userPinByLgoinVcode(params) {
return http.post(baseUrl, {
actionType: "userPinByLgoinVcode",
actionBody: params
});
}
//账号密码登录
export function userPinByLgoin(params) {
return http.post(baseUrl, {
actionType: "userPinByLgoin",
actionBody: params
});
}
//用户注册
export function userPinByRegister(params) {
return http.post(baseUrl, {
actionType: "userPinByRegister",
actionBody: params
});
}
\ No newline at end of file
channel-access/src/components/globalfooter.vue
......@@ -23,7 +23,7 @@
<div>
<p>客服二维码</p>
<div class="qrCode">
<img src="" alt="">
<img src="" alt="" />
</div>
</div>
</div>
......@@ -49,6 +49,7 @@ export default {};
height: 100%;
margin: 0 auto;
padding: 77px 0 26px;
background: #222331;
}
}
.globalfooter-main-top {
......@@ -56,7 +57,7 @@ export default {};
height: 172px;
display: flex;
justify-content: space-between;
.shu{
.shu {
width: 1px;
height: 100%;
background: #979797;
......@@ -72,11 +73,11 @@ export default {};
height: 100%;
}
}
.qrCode{
.qrCode {
width: 86px;
height: 86px;
background: #fff;
img{
img {
width: 100%;
height: 100%;
}
......
channel-access/src/components/globalheader.vue
......@@ -4,7 +4,7 @@
<div class="globalheader-main-left">
<div><img src="" alt="" /></div>
<h3>启服通</h3>
<p>登录</p>
<p>{{ title }}</p>
</div>
<div class="globalheader-main-right">
首页
......@@ -14,14 +14,16 @@
</template>
<script>
export default {};
export default {
props: ["title"]
};
</script>
<style lang="scss">
.globalheader {
width: 100%;
height: 60px;
background: #fff;
background: #222;
.globalheader-main {
max-width: 1240px;
height: 100%;
......@@ -50,15 +52,15 @@ export default {};
font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
color: #fff;
line-height: 16px;
border-right: 2px solid #333333;
border-right: 2px solid #fff;
}
p {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
color: #fff;
line-height: 22px;
padding: 0 0 0 15px;
}
......@@ -67,7 +69,7 @@ export default {};
font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
color: #fff;
line-height: 60px;
}
</style>
channel-access/src/http/http.js
import axios from "axios";
import { Message, MessageBox } from "element-ui";
import store from "../store";
import { getToken } from "@/utils/getToken.js";
import { getCookie } from "@/utils/getToken.js";
// 创建axios实例
const service = axios.create({
// baseURL: process.env.BASE_API, // api 的 base_url
timeout: 5000 // 请求超时时间
// headers
timeout: 5000, // 请求超时时间
headers: {}
});
// // 获取token并带上
......@@ -17,9 +17,9 @@ const service = axios.create({
// request拦截器
service.interceptors.request.use(
config => {
let token = getToken("token");
let token = getCookie("token");
if (token) {
config.headers["token"] = getToken(); // 让每个请求携带自定义token 请根据实际情况自行修改
config.headers["token"] = token; // 让每个请求携带自定义token 请根据实际情况自行修改
} else {
Message("token已失效")
}
......@@ -28,7 +28,7 @@ service.interceptors.request.use(
error => {
// Do something with request error
console.log(error); // for debug
Promise.reject(error);
Promise.reject(error, "12321");
}
);
......
channel-access/src/main.js
......@@ -8,10 +8,15 @@ import "./assets/css/globelcolor.scss";
import "./assets/css/reset.scss";
// 请求方法
import { getTokens } from "@/api/api.js";
import { seveToken } from "@/utils/getToken.js";
import { seveCookie } from "@/utils/getToken.js";
//复制粘贴插件
import VueClipboard from "vue-clipboard2";
Vue.use(VueClipboard);
getTokens().then(res => {
seveToken(res.data.data.token)
})
//存储token
seveCookie("token", res.data.data.token);
});
Vue.use(Element);
Vue.config.productionTip = false;
new Vue({
......
channel-access/src/router/index.js
......@@ -3,71 +3,93 @@ import VueRouter from "vue-router";
Vue.use(VueRouter);
const routes = [
{
const routes = [{
path: "/user",
name: "user",
redirect: "/user/login",
component: () => import("@/views/pages/user"),
children: [
{
component: () =>
import ("@/views/pages/user"),
children: [{
path: "login",
name: "login",
component: () => import("@/views/pages/user/login")
component: () =>
import ("@/views/pages/user/login")
},
{
path: "register",
name: "register",
component: () => import("@/views/pages/user/register")
component: () =>
import ("@/views/pages/user/register")
},
{
path: "forgetpassword",
name: "forgetpassword",
component: () => import("@/views/pages/user/forgetPassword")
component: () =>
import ("@/views/pages/user/forgetPassword")
}
]
},
{
path: "/cashier",
name: "cashier",
component: () =>
import ("@/views/pages/cashier")
},
{
path: "/successfulpayment",
name: "successfulpayment",
component: () =>
import ("@/views/pages/successfulpayment")
},
{
path: "/placeorder",
name: "placeorder",
component: () => import("@/views/pages/placeorder")
component: () =>
import ("@/views/pages/placeorder")
},
{
path: "/jdbycdetailtm",
name: "jdbycdetailtm",
component: () => import("@/views/pages/jdbycdetailtm")
component: () =>
import ("@/views/pages/jdbycdetailtm")
},
{
path: "/companydetail",
name: "companydetail",
component: () => import("@/views/pages/companydetail")
component: () =>
import ("@/views/pages/companydetail")
},
{
path: "/jdindentlist",
name: "jdindentdetail",
component: () => import("@/views/pages/jdindentlist")
component: () =>
import ("@/views/pages/jdindentlist")
},
{
path: "/jdindentdetail",
name: "jdindentdetail",
component: () => import("@/views/pages/jdindentdetail")
component: () =>
import ("@/views/pages/jdindentdetail")
},
/////////
{
path: "/jdtrademark",
name: "jdtrademark",
component: () => import("@/views/pages/jdtrademark/Jdtrademark")
component: () =>
import ("@/views/pages/jdtrademark/Jdtrademark")
},
{
path: "/selftmreg",
name: "selftmreg",
component: () => import("@/views/pages/selftmreg/Selftmreg")
component: () =>
import ("@/views/pages/selftmreg/Selftmreg")
},
{
// path: "/bycnoticeindex",
path: "/bycnoticeindex",
name: "bycnoticeindex",
component: () => import("@/views/pages/bycnoticeindex/Bycnoticeindex")
component: () =>
import ("@/views/pages/bycnoticeindex/Bycnoticeindex")
}
];
const router = new VueRouter({
......
channel-access/src/utils/getToken.js
import Cookies from "js-cookie";
export function getToken(name) {
export function getCookie(name) {
//获取Token
return Cookies.get(name);
}
export function seveToken(token) {
export function seveCookie(name, token) {
//存储token到cookie里，有效期为8小时
Cookies.set("token", token, { expires: 4 / 24 });
Cookies.set(name, token, { expires: 4 / 24 });
}
\ No newline at end of file
channel-access/src/views/pages/cashier/alipay.vue 0 → 100644
<template>
<div class="alipay">
<div class="alipayCode">
<div><img src="" alt="" /></div>
<p>请使用支付宝扫描二维码支付，请在5分钟内完成支付，过期请刷新支付码</p>
</div>
<el-button>刷新二维码</el-button>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.alipay {
width: 100%;
display: flex;
align-items: flex-end;
.alipayCode {
width: 252px;
padding: 14px 10px;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #e6e6e6;
div {
width: 117px;
height: 117px;
background: #ccc;
img {
width: 100%;
height: 100%;
}
}
p {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
line-height: 17px;
margin-top: 14px;
}
}
.el-button {
width: 100px;
height: 36px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #3071fe;
line-height: 20px;
padding: 0;
border: 1px solid #3071fe;
background: #fff;
border-radius: 0;
margin-left: 32px;
}
}
</style>
channel-access/src/views/pages/cashier/bankcard.vue 0 → 100644
<template>
<div class="bankcard">
<p>付款账户：招商银行股份有限公司北京青年路支行</p>
<p>收 款 人： 北京创知后的科技有限公司</p>
<p>开 户 行： 招商银行股份有限公司北京青年路支行</p>
<p>账 号： 1109 2357 7310 301</p>
<div class="onloadImg"><img src="@/assets/imgs/onloadImg.png" alt=""></div>
<span>请上传线下支付凭证</span>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.bankcard {
width: 100%;
p {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 17px;
margin-bottom: 10px;
}
.onloadImg{
width: 60px;
height: 60px;
border: 1px solid #CCCCCC;
margin-top: 5px;
margin-bottom: 10px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
img{
width: 17px;
height: 17px;
}
}
span {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
line-height: 17px;
}
}
</style>
channel-access/src/views/pages/cashier/index.vue 0 → 100644
<template>
<div class="cashier">
<div class="cashier-top">
<div class="cashier-top-header">
<div class="cashier-top-title"><i></i> 收银台</div>
</div>
</div>
<div class="cashier-main">
<div class="cashier-main-container">
<div class="cashier-main-container-header">
<div class="order-img">
<img src="@/assets/imgs/orderImg.png" alt="" />
</div>
<div class="order-title">
<h3>订单提交成功，应付金额：<span>270.00</span></h3>
<h5>
<p>服务项目：自助商标注册</p>
<p>支付编号：TM124356765433245</p>
</h5>
</div>
</div>
<div class="paymentType">
<div class="paymentType-title">
<i></i> 请选择支付方式
<span class="el-icon-warning-outline"
>&nbsp;&nbsp;付款账户位公司账户，则可为付款的公司账户开局发票；如果是个人账户，则只能为付款人或申请人开局发票，请选择合适的付款账户。</span
>
</div>
<div class="paymentType-tabs">
<el-tabs type="card">
<el-tab-pane>
<span slot="label"
><p><img src="@/assets/imgs/zhifubao-2.png" alt="" /></p>
支付宝</span
>
<Alipay />
</el-tab-pane>
<el-tab-pane>
<span slot="label"
><p><img src="@/assets/imgs/weixin.png" alt="" /></p>
微信</span
>
<Wechat />
</el-tab-pane>
<el-tab-pane>
<span slot="label"
><p><img src="@/assets/imgs/yinhangka.png" alt="" /></p>
银行卡</span
>
<Bankcard />
</el-tab-pane>
<el-tab-pane>
<span slot="label"
><p><img src="@/assets/imgs/tarendaifu.png" alt="" /></p>
他人代付</span
>
<Paymentothers />
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import Alipay from "./alipay";
import Wechat from "./wechat";
import Bankcard from "./bankcard";
import Paymentothers from "./paymentothers";
export default {
components: {
Alipay,
Wechat,
Bankcard,
Paymentothers
}
};
</script>
<style lang="scss">
.cashier {
width: 100%;
.cashier-top {
width: 100%;
height: 40px;
background: #fff;
box-shadow: 0px 4px 4px 0px rgba(25, 29, 56, 0.1);
.cashier-top-header {
max-width: 1240px;
height: 100%;
padding: 0 20px;
margin: 0 auto;
display: flex;
align-items: center;
.cashier-top-title {
width: 100%;
display: flex;
align-items: center;
font-size: 16px;
font-family: MicrosoftYaHei;
color: rgba(51, 51, 51, 1);
i {
display: inline-block;
width: 3px;
height: 16px;
background: #3071fe;
border-radius: 100px;
margin-right: 8px;
}
}
}
}
.cashier-main {
width: 100%;
padding: 30px 0 20px 0;
background: #f5f5f7;
.cashier-main-container {
max-width: 1240px;
padding: 0 20px;
margin: 0 auto;
}
}
}
.cashier-main-container-header {
width: 100%;
padding: 21px;
background: #fff;
margin-bottom: 16px;
box-shadow: 0px 2px 4px 0px rgba(207, 207, 207, 0.5);
display: flex;
.order-img {
width: 51px;
height: 51px;
margin-right: 18px;
img {
width: 100%;
height: 100%;
}
}
.order-title {
h3 {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 20px;
margin-bottom: 10px;
span {
font-size: 18px;
color: #ff5b00;
}
}
h5 {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(102, 102, 102, 1);
line-height: 17px;
display: flex;
p {
margin-right: 25px;
}
}
}
}
.paymentType {
width: 100%;
min-height: 364px;
background: #fff;
padding: 0 18px;
box-shadow: 0px 2px 4px 0px rgba(207, 207, 207, 0.5);
.paymentType-title {
width: 100%;
line-height: 16px;
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 20px;
padding: 24px 0 15px 0;
display: flex;
align-items: center;
border-bottom: 1px solid #dadada;
i {
display: inline-block;
width: 3px;
height: 16px;
margin-right: 6px;
background: #3071fe;
border-radius: 100px;
}
span {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(48, 113, 254, 1);
line-height: 17px;
margin-left: 20px;
}
}
.paymentType-tabs {
width: 100%;
padding: 20px 0 0;
.el-tabs {
.el-tabs__item {
span {
p {
width: 18px;
height: 18px;
margin-right: 10px;
float: left;
display: flex;
align-items: center;
margin-top: 11px;
img {
width: 18px;
}
}
}
}
}
}
}
</style>
channel-access/src/views/pages/cashier/paymentothers.vue 0 → 100644
<template>
<div class="paymentothers">
<div class="orderlink">
订单链接：
<p>{{ orderlink }}</p>
<el-button
v-clipboard:copy="orderlink"
v-clipboard:success="onCopy"
v-clipboard:error="onError"
>复制</el-button
>
</div>
<p class="tishimsg">
<i class="el-icon-warning-outline"></i
>复制订单链接发给朋友代付（微信打开链接）
</p>
</div>
</template>
<script>
export default {
data() {
return {
orderlink: "123xcv456xcvxbn789sdvcfbgcsbn3456xcvcvb"
};
},
methods: {
onCopy() {
this.$message({
message: "复制成功！",
type: "success"
});
},
onError() {
this.$message.error("复制失败！");
}
}
};
</script>
<style lang="scss">
.paymentothers {
width: 100%;
.orderlink {
display: flex;
align-items: center;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 17px;
p {
width: 376px;
padding: 7px;
border: 1px solid #dadada;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
line-height: 20px;
margin-right: 11px;
}
.el-button {
width: 63px;
height: 32px;
border: 1px solid rgba(48, 113, 254, 1);
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(48, 113, 254, 1);
line-height: 20px;
padding: 0;
background: #fff;
border-radius: 0;
}
}
.tishimsg {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
line-height: 17px;
margin-top: 11px;
i {
color: #3071fe;
margin-right: 7px;
}
}
}
</style>
channel-access/src/views/pages/cashier/wechat.vue 0 → 100644
<template>
<div class="wechat">
<div class="wechatCode">
<div><img src="" alt="" /></div>
<p>请使用微信扫描二维码支付，请在5分钟内完成支付，过期请刷新支付码</p>
</div>
<el-button>刷新二维码</el-button>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.wechat {
width: 100%;
display: flex;
align-items: flex-end;
.wechatCode {
width: 252px;
padding: 14px 10px;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #e6e6e6;
div {
width: 117px;
height: 117px;
background: #ccc;
img {
width: 100%;
height: 100%;
}
}
p {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
line-height: 17px;
margin-top: 14px;
}
}
.el-button {
width: 100px;
height: 36px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #3071fe;
line-height: 20px;
padding: 0;
border: 1px solid #3071fe;
background: #fff;
border-radius: 0;
margin-left: 32px;
}
}
</style>
channel-access/src/views/pages/jdbycdetailtm/index.vue
......@@ -203,10 +203,9 @@ import icon2 from "@/assets/imgs/jdt/chushen.png";
import icon3 from "@/assets/imgs/jdt/zhuce.png";
import icon4 from "@/assets/imgs/jdt/wuxiao.png";
//
import CompanyInfo from "./companyInfo"
import CompanyInfo from "./companyInfo";
//
import { getJdbycdetailtmData, getLinkUrl, getCompanyInfo } from "@/api/api.js";
export default {
components: {
CompanyInfo
......@@ -247,19 +246,7 @@ export default {
imgUrl: ""
};
},
mounted() {
getJdbycdetailtmData().then(res => {
console.log(res);
if (res.data.status == 0) {
this.detaildata = res.data.data.detaildata[0];
this.registeredList = res.data.data.nclexist;
this.unregisteredList = res.data.data.nclnotexist;
this.tmstatus = this.progressNarArr.findIndex(item => {
return item.name == this.detaildata.sbzt;
});
}
});
},
mounted() {},
methods: {
progressNarBgColor(i) {
var k = this.tmstatus;
......@@ -290,18 +277,9 @@ export default {
this.imgUrl = url;
this.centerDialogVisible = true;
},
getLinkUrl(num) {
getLinkUrl(num).then(res => {
if (res.data.status == 0) {
this.showImgDialog(res.data.data.sbmc, res.data.data.linkurl);
}
});
},
getLinkUrl(num) {},
getCompanyInfo(name) {
this.showImgDialog("", "");
getCompanyInfo(name).then(res => {
console.log(res.data);
});
}
}
};
......
channel-access/src/views/pages/jdindentdetail/index.vue
......@@ -243,7 +243,8 @@
<!-- -->
</div>
</div>
<el-drawer ref="apps"
<el-drawer
ref="apps"
:title="drawerTitle"
custom-class="jdindentdetail-drawer"
size="750px"
......@@ -269,7 +270,6 @@ import ClassTrademark from "./classTrademark";
import ModifyTrademark from "./modifyTrademark";
import ApplicantInfo from "./applicantInfo";
import OrderContact from "./orderContact";
export default {
components: {
JiaoFile,
......@@ -292,17 +292,14 @@ export default {
this.showUploadStuff = true;
}
},
mounted() {
}
mounted() {}
};
</script>
<style lang="scss">
.jdindentdetail {
width: 100%;
height: 100%;
background: #eceef3;
overflow: auto;
.jdindentdetail-wrapper {
width: 1020px;
background: #fff;
......
channel-access/src/views/pages/placeorder/index.vue
......@@ -9,18 +9,125 @@
<el-breadcrumb-item>下单</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="placeorder-main-title"><i></i> 购买服务</div>
<div class="placeorder-table">
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="name" label="服务名称" align="center">
</el-table-column>
<el-table-column prop="count" label="购买数量" align="center">
</el-table-column>
<el-table-column prop="official" label="官费（元）" align="center">
</el-table-column>
<el-table-column prop="service" label="服务费（元）" align="center">
</el-table-column>
<el-table-column prop="total" label="总价（元）" align="center">
</el-table-column>
</el-table>
</div>
<div class="placeorder-main-title">
<i></i> 订单联系人
<span class="el-icon-warning-outline"
>&nbsp;&nbsp;订单支付后，平台专业商标顾问会与您沟通商标注册需求，请保持电话畅通！</span
>
</div>
<div class="placeorder-main-form">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="80px"
class="demo-ruleForm"
>
<el-form-item label="姓名" prop="name">
<el-input v-model="ruleForm.name" placeholder="请输入您的姓名"></el-input>
</el-form-item>
<el-form-item label="电话" prop="phone">
<el-input v-model="ruleForm.phone" placeholder="请输入您的联系方式"></el-input> </el-form-item
><el-form-item prop="email" label="邮箱">
<el-input v-model="ruleForm.email" placeholder="请输入您的邮箱"></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="ruleForm.desc"></el-input>
</el-form-item>
</el-form>
</div>
</div>
</div>
<div class="placeorder-footer">
<div class="placeorder-footer-main">
<p></p>
<p class="orderMoney">订单金额：<span>¥680.00</span></p>
<div class="payment-right">
<p>
<i @click="active=!active" :class="active?'xuanzhong':''"></i>
我已阅读<span>《商标代理服务协议》</span>，且同意该合同内容
</p>
<el-button :class="active?'active':''" @click="submitForm">去支付</el-button>
</div>
</div>
</div>
</div>
</template>
<script>
export default {};
export default {
data() {
//验证电话
var checkPhone = (rule, value, callback) => {
const phoneReg = /^1[3|4|5|7|8][0-9]{9}$/;
if (!this.ruleForm.phone) {
return callback(new Error("手机号码不能为空"));
}
setTimeout(() => {
if (!Number.isInteger(+this.ruleForm.phone)) {
callback(new Error("请输入数字值"));
} else {
if (phoneReg.test(this.ruleForm.phone)) {
callback();
} else {
callback(new Error("手机号码格式不正确"));
}
}
}, 100);
};
return {
active:false,
tableData: [
{
name: "专家辅助商标注册",
count: 1,
official: 300,
service: 380,
total: 680
}
],
//
ruleForm: {
name: "",
phone: "",
email: "",
desc: ""
},
rules: {
name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
phone: [{ required: true, validator: checkPhone, trigger: "blur" }],
email: [
{ message: "请输入邮箱地址", trigger: "blur" },
{
type: "email",
message: "请输入正确的邮箱地址",
trigger: ["blur", "change"]
}
]
}
//
};
},
methods: {
submitForm() {
console.log(123);
}
}
};
</script>
<style lang="scss">
......@@ -33,27 +140,154 @@ export default {};
.placeorder-main-container {
width: 1200px;
margin: 0 auto;
padding: 0 20px;
padding: 0 20px 27px;
border: 1px solid #e4e4e4;
.main-container-top {
width: 100%;
height: 60px;
display: flex;
align-items: center;
border-bottom: 1px solid #CECECE;
border-bottom: 1px solid #cecece;
}
.placeorder-main-title {
width: 100%;
line-height: 16px;
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 20px;
margin: 30px 0 20px 0;
display: flex;
align-items: center;
i {
display: inline-block;
width: 3px;
height: 16px;
margin-right: 6px;
background: #3071fe;
border-radius: 100px;
}
span {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(48, 113, 254, 1);
line-height: 17px;
margin-left: 20px;
}
}
.placeorder-table {
border: 1px solid #cecece;
.el-table th.is-leaf {
background: #f3f7fd;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
line-height: 20px;
.cell {
color: rgba(51, 51, 51, 1);
}
}
.el-table .cell {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(102, 102, 102, 1);
line-height: 20px;
}
}
.placeorder-main-form {
width: 100%;
background: #f3f7fd;
padding: 30px 37px 30px 0;
.el-form {
input {
width: 348px;
height: 36px;
border-radius: 0;
border: 1px solid #c7c7c7;
}
textarea {
height: 130px;
border: 1px solid #c7c7c7;
border-radius: 0;
}
}
}
}
}
.placeorder-footer {
width: 100%;
height: 60px;
background: rgba(230, 240, 255, 1);
background: #e6f0ff;
.placeorder-footer-main {
margin: 0 auto;
max-width: 1240px;
height: 100%;
padding: 0 20px;
display: flex;
justify-content: space-between;
align-items: center;
.orderMoney {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #161529;
line-height: 20px;
span {
font-size: 18px;
color: #ff5800;
}
}
.payment-right {
display: flex;
align-items: center;
p {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333;
line-height: 20px;
margin-right: 30px;
display: flex;
align-items: center;
i{
display: inline-block;
width: 18px;
height: 18px;
margin-right: 5px;
border-radius: 100px;
background: #fff;
border: 1px solid #ccc;
}
.xuanzhong{
border: none;
background: url("../../../assets/imgs/xuanzhong.png") no-repeat;
}
span {
color: #3071fe;
cursor: pointer;
}
}
button {
width: 120px;
height: 40px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ffffff;
background: #c0d9ff;
letter-spacing: 2px;
border-radius: 0;
}
.el-button:active{
border: none;
}
.active{
background: rgba(48, 113, 254, 1);
}
}
}
}
</style>
channel-access/src/views/pages/successfulpayment/index.vue 0 → 100644
<template>
<div class="successfulpayment">
<div class="successfulpayment-main">
<div class="successfulpayment-main-container">
<div class="successfulpayment-main-container-left">
<img src="@/assets/imgs/successfulpayment.png" alt="" />
</div>
<div class="successfulpayment-main-container-right">
<h1>支付成功</h1>
<p>
您已成功支付<span>¥798.00元</span>订单编号：11114012410250810824
</p>
<span class="span"
>我们会尽快给您审核订单信息，提交到商标局！材料信息如有问题我们客服会及时与您联系。</span
>
<div>
<el-button>在下一单</el-button><el-button class="seeDetail">查看订单详情</el-button>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.successfulpayment {
width: 100%;
padding: 20px 0;
background: #f5f5f7;
.successfulpayment-main {
margin: 0 auto;
max-width: 1240px;
padding: 0 20px;
.successfulpayment-main-container {
width: 100%;
background: #fff;
padding: 122px 0 165px 195px;
display: flex;
}
}
}
.successfulpayment-main-container-left {
width: 142px;
height: 142px;
margin-right: 37px;
img {
width: 100%;
height: 100%;
}
}
.successfulpayment-main-container-right {
h1 {
font-size: 32px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(48, 113, 254, 1);
line-height: 45px;
margin-bottom: 24px;
}
p {
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 20px;
margin-bottom: 5px;
span {
font-size: 18px;
color: #ff5b00;
margin-right: 30px;
}
}
.span {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
line-height: 22px;
margin-bottom: 66px;
display: inline-block;
}
.el-button{
width: 134px;
height: 36px;
padding: 0;
border-radius: 0;
border: 1px solid #3071FE;
color: #3071FE;
background: #fff;
}
.seeDetail{
color: #fff;
background: #3071FE;
}
}
</style>
channel-access/src/views/pages/user/forgetPassword/index.vue
......@@ -45,7 +45,7 @@ export default {
},
btnInnerText: "获取验证码",
flag: true,
timeNum: 10,
timeNum: 60,
timer: null,
rules: {
name: [{ required: true, message: "请输入账号", trigger: "blur" }],
......
channel-access/src/views/pages/user/index.vue
<template>
<div class="user">
<Globalheader />
<div class="user-main">
<div class="user-main-mid">
<div class="user-main-left">
......@@ -22,18 +21,12 @@
</template>
<script>
import Globalheader from "@/components/globalheader";
export default {
components: {
Globalheader
},
data() {
return {
activeName: "first"
};
},
mounted() {},
methods: {}
};
</script>
......
channel-access/src/views/pages/user/login/username.vue
......@@ -20,13 +20,16 @@
<el-button type="primary" @click="submitForm()">登录</el-button>
<p>
还没有账号？<span @click="$router.push('/user/register')">立即注册</span
><span>|</span><span @click="$router.push('/user/forgetPassword')">忘记密码？</span>
><span>|</span
><span @click="$router.push('/user/forgetPassword')">忘记密码？</span>
</p>
</el-form>
</div>
</template>
<script>
import { userPinByLgoin } from "@/api/user.js";
import { seveCookie } from "@/utils/getToken.js";
export default {
data() {
return {
......@@ -43,8 +46,30 @@ export default {
methods: {
//提交表单
submitForm() {
let from = {
mobile: this.ruleForm.name, // Y 手机号
password: this.ruleForm.password // Y 密码
};
if (this.ruleForm.name && this.ruleForm.password) {
console.log(123);
userPinByLgoin(from).then(res => {
console.log(res,`12123`);
if (res.status == 0) {
seveCookie("userpin", res.data.userpin);
this.$message({
message: "登录成功！",
type: "success"
});
} else if (res.status == 2010) {
this.$message.error("账户或密码错误！");
} else if (res.status == 2060) {
this.$message({
message: "请不要重新登录！",
type: "warning"
});
} else {
this.$message.error("登录失败！");
}
});
}
}
}
......
channel-access/src/views/pages/user/login/verificationCode.vue
......@@ -14,7 +14,7 @@
</el-form-item>
<el-form-item
><el-input
v-model="dynamicValidateForm.verificationCode"
v-model="dynamicValidateForm.verifyCode"
placeholder="请输入验证码"
></el-input
><el-button @click="getVerificationCode">{{ btnInnerText }}</el-button>
......@@ -27,6 +27,8 @@
</template>
<script>
import { getVerifyCode, userPinByLgoinVcode } from "@/api/user.js";
import { seveCookie } from "@/utils/getToken.js";
export default {
data() {
var checkPhone = (rule, value, callback) => {
......@@ -49,12 +51,12 @@ export default {
//
return {
dynamicValidateForm: {
phone: "",
verificationCode: ""
phone: "17600004328",
verifyCode: ""
},
btnInnerText: "获取验证码",
flag: true,
timeNum: 10,
timeNum: 60,
timer: null,
rules: {
buyerPhone: [{ validator: checkPhone, trigger: "blur" }]
......@@ -62,10 +64,22 @@ export default {
};
},
methods: {
//获取验证码
getVerificationCode() {
if (this.flag) {
if (/^1[3|4|5|7|8][0-9]{9}$/.test(this.dynamicValidateForm.phone)) {
this.flag = false;
//获取验证码
getVerifyCode(this.dynamicValidateForm.phone).then(res => {
console.log(res);
if (res.status == 0) {
this.$message({
message: "获取验证码成功！",
type: "success"
});
} else {
this.$message.error("获取验证码失败！");
}
});
this.btnInnerText = this.timeNum + "秒之后重新获取";
this.timer = setInterval(() => {
this.timeNum--;
......@@ -78,15 +92,38 @@ export default {
}
}, 1000);
}
}
},
//提交表单
submitForm() {
let form = {
mobile: this.dynamicValidateForm.phone, // Y 手机号
vcode: this.dynamicValidateForm.verifyCode // Y 验证码
};
if (
/^1[3|4|5|7|8][0-9]{9}$/.test(this.dynamicValidateForm.phone) &&
this.dynamicValidateForm.verificationCode
this.dynamicValidateForm.verifyCode
) {
console.log(123);
userPinByLgoinVcode(form).then(res => {
console.log(res, "123123");
if (res.status == 0) {
seveCookie("userpin", res.data.userpin);
this.$message({
message: "登录成功！",
type: "success"
});
} else if (res.status == 2030) {
this.$message.error("验证码错误！");
} else if (res.status == 2060) {
this.$message({
message: "请不要重新登录！",
type: "warning"
});
} else {
this.$message.error("登录失败！");
}
});
}
}
}
......
channel-access/src/views/pages/user/register/index.vue
......@@ -32,6 +32,8 @@
</template>
<script>
import { userPinByRegister, getVerifyCode } from "@/api/user.js";
import { seveCookie } from "@/utils/getToken.js";
export default {
data() {
return {
......@@ -42,7 +44,7 @@ export default {
},
btnInnerText: "获取验证码",
flag: true,
timeNum: 10,
timeNum: 60,
timer: null,
rules: {
name: [{ required: true, message: "请输入账号", trigger: "blur" }],
......@@ -54,10 +56,23 @@ export default {
};
},
methods: {
//获取验证码
getVerificationCode() {
if (this.flag) {
if (/^1[3|4|5|7|8][0-9]{9}$/.test(this.ruleForm.name)) {
this.flag = false;
//获取验证码
getVerifyCode(this.ruleForm.name).then(res => {
console.log(res);
if (res.status == 0) {
this.$message({
message: "获取验证码成功！",
type: "success"
});
} else {
this.$message.error("获取验证码失败！");
this.btnInnerText = "重新获取验证码";
}
});
this.btnInnerText = this.timeNum + "秒之后重新获取";
this.timer = setInterval(() => {
this.timeNum--;
......@@ -70,16 +85,39 @@ export default {
}
}, 1000);
}
}
},
//提交表单
submitForm() {
let from = {
mobile: this.ruleForm.name, // Y 手机号
vcode: this.ruleForm.verificationCode, // Y 验证码
password: this.ruleForm.password // Y 密码
};
if (
this.ruleForm.name &&
this.ruleForm.password &&
this.ruleForm.verificationCode &&
this.ruleForm.password
) {
console.log(123);
userPinByRegister(from).then(res => {
if (res.status == 0) {
seveCookie("userpin", res.data.userpin);
this.$message({
message: "注册成功！",
type: "success"
});
} else if (res.status == 2030) {
this.$message.error("验证码错误！");
} else if (res.status == 2060) {
this.$message({
message: "请不要重新登录！",
type: "warning"
});
} else {
this.$message.error("注册失败！");
}
});
}
}
}
......
channel-access/vue.config.js
......@@ -10,7 +10,7 @@ module.exports = {
hotOnly: false,
proxy: {
'/api': {
target: 'https://movie.douban.com', //API服务器的地址
target: 'http://zcchannel.gongsibao.com:4003', //API服务器的地址
ws: true, //代理websockets
changeOrigin: true, // 虚拟的站点需要更管origin
pathRewrite: { //重写路径 比如'/api/aaa/ccc'重写为'/aaa/ccc'
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment