Commit c28154b7 authored by xd's avatar xd

修复侧边栏

parent 0399b05a
# 页面 title 前缀
NODE_ENV = development
VUE_APP_TITLE = 亿百分-dev
VUE_APP_OY_API = /api/
VUE_APP_API_A = http://139.155.48.151:8085
VUE_APP_API_B = http://111.26.165.55:8010/crminterface.ashx
# 页面 title 前缀
NODE_ENV = development
VUE_APP_TITLE = 亿百分-dev
VUE_APP_OY_API = http://111.26.165.55:8010/crminterface.ashx
VUE_APP_API_A = http://139.155.48.151:8085
VUE_APP_API_B = http://111.26.165.55:8010/crminterface.ashx
# 页面 title 前缀
NODE_ENV = production
VUE_APP_TITLE = 亿百分-prod
VUE_APP_OY_API = http://111.26.165.55:8010/crminterface.ashx
VUE_APP_API_A = http://139.155.48.151:8085
VUE_APP_API_B = http://111.26.165.55:8010/crminterface.ashx
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:vue/essential',
'eslint:recommended'
],
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-unused-vars': 'off',
'no-undef': 'off'
},
parserOptions: {
parser: 'babel-eslint'
}
}
module.exports = {
plugins: [
require('postcss-pxtorem')({
rootValue: 32,
minPixelValue: 2,
propWhiteList: []
})
]
};
# ybf_wx
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Run your tests
```
npm run test
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
ovlGwUtiSAgGUQLs
\ No newline at end of file
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}
{
"name": "ybf_wx",
"version": "0.1.0",
"private": true,
"scripts": {
"start": "vue-cli-service serve",
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"build:dev": "vue-cli-service build --mode dev",
"build:prod": "vue-cli-service build --mode prod"
},
"dependencies": {
"axios": "^0.19.1",
"core-js": "^3.4.4",
"js-md5": "^0.7.3",
"jssdk": "^0.0.1",
"qrcode": "^1.4.4",
"vant": "^2.3.3",
"vue": "^2.6.10",
"vue-router": "^3.1.3",
"vuex": "^3.1.2"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^4.1.0",
"@vue/cli-plugin-eslint": "^4.1.0",
"@vue/cli-service": "^4.1.0",
"babel-eslint": "^10.0.3",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"node-sass": "^4.13.0",
"postcss-loader": "^3.0.0",
"postcss-pxtorem": "^4.0.1",
"sass-loader": "^8.0.0",
"vue-template-compiler": "^2.6.10"
}
}
ovlGwUtiSAgGUQLs
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>亿百分</title>
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
</head>
<body>
<noscript>
<strong>We're sorry but ybf_wx doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
</body>
</html>
This diff is collapsed.
<!DOCTYPE html>
<html>
<head>
<meta lang="zh-cn">
<title>QRCode</title>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src='https://code.jquery.com/jquery-3.2.1.min.js'></script>
<style>
.qr-code {
text-align: center;
padding-top: 50px;
}
.qr-code>#image {
display: inline-block;
width: 60%;
}
</style>
</head>
<body>
<!-- <div id="uri">Uri:</div> -->
<div class="qr-code">
<img id="image" src="" alt />
</div>
<!--<h1>Hola qrCode.</h1>-->
<!-- <img src="./3.png"> -->
<script>
const cleanUrlAndPostQRInfo = () => {
// alert(`--->qrCode: cleanUrlAndPostQRInfo: IN.`)
let nowUrl = ''
let id = ''
let actionid = ''
let activeId = ''
let voucherId = ''
let unionId = ''
nowUrl = document.location.toString().slice(42);
// alert(`--->nowUrl =${nowUrl}`)
id = String(nowUrl.split("?")[1].slice(3).split("&")[0]);
actionid = String(nowUrl.split("?")[1].slice(3).split("&")[1].split("=")[1]);
activeId = String(nowUrl.split("?")[1].slice(3).split("&")[2].split("=")[1]);
voucherId = String(nowUrl.split("?")[1].slice(3).split("&")[3].split("=")[1]);
unionId = String(nowUrl.split("?")[1].slice(3).split("&")[4].split("=")[1]);
// let pageUri = `${nowUrl}&detailid=${voucherId}&actionid=${activeId}&unionid=${unionId}`;
let pageUri = `${nowUrl}`;
pageUri = pageUri.split('&').slice(0, 5).join('&')
let pageUrl = `http://139.155.48.151:8085/workWx/auth/oauth2/wxMiniQrCode?pageUri=${pageUri}`;
// document.getElementById('uri').innerHTML = 'Uri=' + String(pageUri)
// alert(`--->qrCode: Ajax: POST: pageUrl = ${pageUrl}`)
// document.location = pageUri
$.ajax({
type: "POST",
url: pageUrl,
// data: JSON.stringify({ path: "pages/signIn/signIn" }),
data: {},
success: function (res) {
// alert(`--->qrCode: ajax: res.`)
// alert(`--->qrCode: ajax: res: res =${JSON.stringify(res)}`)
console.log(res)
$('#image').attr('src', res.data)
// $('#image').attr('src', 'http://qywx2.100smartdata.com/qrCode/1584512690487.jpeg')
},
error: function (data) {
alert(`--->qrCode: ajax: err.`)
alert(`--->qrCode: ajax: err: err =${JSON.stringify(err)}`)
alert('error' + JSON.stringify(data))
console.log(data);
}
});
}
const __main = () => {
cleanUrlAndPostQRInfo()
}
__main()
</script>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta lang="zh-cn">
<title>优惠券详情</title>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src='https://code.jquery.com/jquery-3.2.1.min.js'></script>
<style>
body {
background-color: rgba(15, 106, 184, 0.99);
font-size: 10px;
margin: 0;
padding: 0;
}
.main {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
overflow: hidden;
}
.main>.titles {
/*border: 2px solid cyan;*/
width: 100%;
height: 8rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.main>.titles>.title {
font-size: 3rem;
color: white;
text-align: center;
}
.main>.cards {
/*border: 2px solid red;*/
/*background-color: whitesmoke;*/
width: 76%;
height: auto;
/*padding: 0 2rem;*/
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.main>.cards>.card {
/*border: 2px solid orange;*/
/*background-color: white;*/
width: 100%;
/*padding: 4rem 2rem;*/
}
.main>.cards>.card01 {
/*border-radius: 1rem 1rem 0 0;*/
border-top-left-radius: 1rem;
border-top-right-radius: 1rem;
background: white;
background:
linear-gradient(135deg, transparent 0, white 0) top left,
linear-gradient(-135deg, transparent 0, white 0) top right,
radial-gradient(circle at bottom right, transparent 2rem, white 0) bottom right,
radial-gradient(circle at bottom left, transparent 2rem, white 0) bottom left;
background-size: 50% 50%;
background-repeat: no-repeat;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.main>.cards>.card01>.titles {
margin: 4rem 2rem 0 2rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.main>.cards>.card01>.titles>.title {
font-size: 3rem;
margin-bottom: 2rem;
}
.main>.cards>.card01>.titles>.discount {
font-size: 3rem;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.main>.cards>.card01>.titles>.discount>.number {
margin-right: 1rem;
color: orangered;
font-size: 4rem;
}
.main>.cards>.card01>.titles>.description {
/*font-size: 2rem;*/
font-size: 1rem;
color: grey;
}
.main>.cards>.card01>.rules {
margin: 2rem 2rem 4rem 2rem;
}
.main>.cards>.card01>.rules>.rule {
font-size: 2rem;
}
.main>.cards>.line {
background-color: white;
width: 90%;
border-bottom: 4px dotted rgba(15, 106, 184, 0.99);
}
.main>.cards>.card02 {
/*border-radius: 0 0 1rem 1rem;*/
border-bottom-left-radius: 1rem;
border-bottom-right-radius: 1rem;
background: white;
background:
radial-gradient(circle at top left, transparent 2rem, white 0) top left,
radial-gradient(circle at top right, transparent 2rem, white 0) top right,
linear-gradient(45deg, transparent 1px, white 0) bottom right,
linear-gradient(-45deg, transparent 1px, white 0) bottom left;
background-size: 50% 50%;
background-repeat: no-repeat;
}
.main>.cards>.card02>.tips {
margin: 4rem 2rem;
}
.main>.cards>.card02>.tips>.tip {
font-size: 2rem;
font-weight: bold;
}
.main>.cards>.card02>.tips>.rules {}
.main>.cards>.card02>.tips>.rules>.rule {
font-size: 2rem;
}
.main>.cards>.card02>.tips>.qrcodes {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.main>.cards>.card02>.tips>.qrcodes>.qrcode {
width: 50%;
}
.main>.cards>.card02>.tips>.qrcodes>.qrcodeTip {
font-size: 1rem;
color: grey;
}
</style>
</head>
<body>
<div class="main">
<div class="titles">
<!--<div class="title">优惠券详情</div>-->
</div>
<div class="cards">
<div class="card card01" id="card01">
<div class="titles">
<div class="title">惊喜满减券</div>
<div class="discount"><div class="number"> 20 </div></div>
<div class="description">满 50 元可用</div>
</div>
<ul class="rules">
<li class="rule">满 50 元可用</li>
<li class="rule">有效期 2019-10-15 04:00:00 至 2019-10-15 04:01:00</li>
</ul>
</div>
<div class="line"></div>
<div class="card card02" id="card02">
<div class="tips">
<div class="tip">使用说明</div>
<ul class="rules">
<li class="rule">单次结算时候仅能使用一张优惠券折扣</li>
<li class="rule">单张优惠券不可叠加、找零、续用、残缺</li>
<li class="rule">该优惠券有效时间为 2019-10-15 04:00:00 至 2019-10-15 04:01:00 ,过期/提前均不可使用</li>
</ul>
<div class="qrcodes">
<!--<img class="qrcode" src="qrcodeBuy.png" alt />-->
<!--<img class="qrcode" id="image" src="QRCodeOY.png" alt />-->
<img class="qrcode" id="image" src="" alt />
<div class="qrcodeTip">长按识别二维码</div>
</div>
</div>
</div>
</div>
</div>
<script>
const cleanUrlAndPostQRInfo = () => {
// alert(`--->qrCode: cleanUrlAndPostQRInfo: IN.`)
let nowUrl = ''
let id = ''
let actionid = ''
let activeId = ''
let voucherId = ''
let unionId = ''
nowUrl = document.location.toString().slice(42);
// alert(`--->nowUrl =${nowUrl}`)
id = String(nowUrl.split("?")[1].slice(3).split("&")[0]);
actionid = String(nowUrl.split("?")[1].slice(3).split("&")[1].split("=")[1]);
activeId = String(nowUrl.split("?")[1].slice(3).split("&")[2].split("=")[1]);
voucherId = String(nowUrl.split("?")[1].slice(3).split("&")[3].split("=")[1]);
unionId = String(nowUrl.split("?")[1].slice(3).split("&")[4].split("=")[1]);
// let pageUri = `${nowUrl}&detailid=${voucherId}&actionid=${activeId}&unionid=${unionId}`;
let pageUri = `${nowUrl}`;
pageUri = pageUri.split('&').slice(0, 5).join('&')
let pageUrl = `http://139.155.48.151:8085/workWx/auth/oauth2/wxMiniQrCode?pageUri=${pageUri}`;
// document.getElementById('uri').innerHTML = 'Uri=' + String(pageUri)
// alert(`--->qrCode: Ajax: POST: pageUrl = ${pageUrl}`)
// document.location = pageUri
$.ajax({
type: "POST",
url: pageUrl,
// data: JSON.stringify({ path: "pages/signIn/signIn" }),
data: {},
success: function (res) {
// alert(`--->qrCode: ajax: res.`)
// alert(`--->qrCode: ajax: res: res =${JSON.stringify(res)}`)
console.log(res)
$('#image').attr('src', res.data)
// $('#image').attr('src', 'http://qywx2.100smartdata.com/qrCode/1584512690487.jpeg')
},
error: function (data) {
alert(`--->qrCode: ajax: err.`)
alert(`--->qrCode: ajax: err: err =${JSON.stringify(err)}`)
alert('error' + JSON.stringify(data))
console.log(data);
}
});
}
const __main = () => {
cleanUrlAndPostQRInfo()
}
__main()
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>会员拉新</title>
<script src="../js/jquery-3.4.1.min.js"></script>
<style>
html,body{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
font-size: 16px;
color: #ffffff;
}
.register_container{
height: 100%;
background-color: rgba(15, 106, 184, 0.99);
margin: 0;
padding: 2.5rem 2rem;
box-sizing: border-box;
text-align: center;
}
.register_titles .title{
font-size: 3rem;
line-height: 5rem;
}
.register_qrcode #image{
display: inline-block;
width: 60%;
height: auto;
margin: 3rem 0;
}
.register_qrcode .qrcodeTip{
font-size: 2rem;
}
</style>
</head>
<body>
<div class="register_container">
<div class="register_titles">
<div class="title">扫码注册成为会员</div>
</div>
<div class="register_qrcode">
<img class="qrcode" id="image" src="" alt />
<div class="qrcodeTip">长按识别二维码</div>
</div>
</div>
<script>
$(function () {
showQRInfo()
});
const showQRInfo = () => {
// let pageUri = `${nowUrl}&detailid=${voucherId}&actionid=${activeId}&unionid=${unionId}`;
let storecode = "181"
let pageUri = `pages/user/register/register?storeCode=
${storecode}`;
let pageUrl = `http://139.155.48.151:8085/workWx/auth/oauth2/wxMiniQrCode?pageUri=${pageUri}`;
$.ajax({
type: "POST",
url: pageUrl,
data: {},
success: function (res) {
$('#image').attr('src', res.data)
},
error: function (data) {
}
});
}
</script>
</body>
</html>
<template>
<div id="app">
<router-view/>
</div>
</template>
<script>
import { getXToken } from './utils/aCommon'
getXToken()
export default {
name: 'App'
}
</script>
<style lang="scss">
/*@import '~@/assets/style/public.scss';*/
</style>
import request from '@/utils/bRequestEa'
export function getVoucherList(inData) {
// alert('--->PostToEA: ea.js: IN.')
let postData = {
args: inData
}
// alert(`--->PostToEA: ea.js: postData =${JSON.stringify(postData)}`)
return request({
url: '',
method: 'post',
data: postData
})
}
export function getVoucherWxUrl(inData) {
let postData = {
args: inData
}
return request({
url: '',
method: 'post',
data: postData
})
}
import wxRequest from '@/utils/aWxRequest'
import qs from 'qs'
export function getUserInfo(inData) {
return request({
url: '/workWx/auth/oauth2/getUserInfo',
method: 'post',
data: inData
})
}
import requestCF from '@/utils/aRequestCF'
import qs from 'qs'
export function getUserInfoByUserId(params) {
return requestCF({
url: '/admin/auth/addressbook/clerk/getByUserIdOrUserName',
method: 'get',
params
})
}
// export function ApiLoginSubmit(inData) {
// return requestCF({
// url: '/admin/common/login',
// method: 'post',
// data: qs.stringify(inData)
// })
// }
import request from '@/utils/bRequestEa'
// 案例
export function getCaseList(data) {
return request({
url: '/admin/common/findLoginType',
method: 'post',
data: data
})
}
export function getCaseDetail(data) {
return request({
url: '',
method: 'post',
data: data
})
}
// 收益列表
// 优惠券核销列表
export function getProfitList(data) {
return request({
url: '',
method: 'post',
data: data
})
}
// 商品购买列表
export function getGoodsList(data) {
return request({
url: '',
method: 'post',
data: data
})
}
// 拉新会员
export function getNewMemberList(data) {
return request({
url: '',
method: 'post',
data: data
})
}
\ No newline at end of file
import request from '@/utils/bRequestEa'
export function ApiTestGet() {
return request({
url: '/admin/common/findLoginType',
method: 'get'
})
}
export function ApiTestCfPost(inData) {
let postData = {
args: inData
}
return request({
url: '',
method: 'post',
data: postData
})
}
export function ApiTestEaPost(inData) {
let postData = {
args: inData
}
return request({
url: '/admin/common/findLoginType',
method: 'post',
data: postData
})
}
import request from '@/utils/bRequestEa'
export function ApiEaPost(inData) {
let postData = {
args: inData
}
return request({
url: '',
method: 'post',
data: postData
})
}
export function ApiEaActiveList(inData) {
let postData = {
args: inData
}
return request({
url: '',
method: 'post',
data: postData
})
}
* {
margin: 0;
padding: 0;
font-family: "PingFangSC-Regular","Microsoft YaHei", "lucida grande", "lucida sans unicode", lucida, helvetica, "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif;
box-sizing: border-box;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
//-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
//tap-highlight-color: rgba(0, 0, 0, 0);
//-webkit-transform: translateZ(0);
//transform: translateZ(0);
//-webkit-perspective: 1000;
//perspective: 1000;
//-webkit-backface-visibility: hidden;
//backface-visibility: hidden;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-webkit-font-smoothing:antialiased;
//touch-action: auto!important;
}
input, select, textarea{
font-family: "PingFangSC-Regular","Microsoft YaHei", "lucida grande", "lucida sans unicode", lucida, helvetica, "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif;
}
html, body {
width: 100%;
height: 100%;
}
ul, li {
list-style: none;
}
a {
text-decoration: none;
}
::-webkit-input-placeholder { /* WebKit browsers */
color:#fff;
font-family: "PingFangSC-Regular","Microsoft YaHei", "lucida grande", "lucida sans unicode", lucida, helvetica, "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif;
font-weight: normal;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #bbb;
}
.searchText::-webkit-input-placeholder{
font-family: 'iconfont';
}
h1, h2, h3, h4, h5, h6 { line-height:1.2;}
p { margin: 0;padding: 0 }
.fr{ float: right;}
.fl{ float: left }
.alignc{ text-align: center}
.alignr{ text-align: right}
input:focus{ outline: none;}
#app{
width: 100%;
height: 100%;
}
const envConfig = {
appOyAPI: process.env.VUE_APP_OY_API,
appBaseUrlA: process.env.VUE_APP_API_A,
appBaseUrlB: process.env.VUE_APP_API_B,
}
export default envConfig
/**
* Created by supervisor on 2019/12/29
*/
// 基准大小
const baseSize = 32
// 设置 rem 函数
function setRem () {
// 当前页面宽度相对于 750 宽的缩放比例,可根据自己需要修改。
var scale = document.documentElement.clientWidth / 375
// 设置页面根节点字体大小
document.documentElement.style.fontSize = (baseSize * Math.min(scale, 2)) + 'px'
}
// 初始化
setRem()
// 改变窗口大小时重新设置 rem
window.onresize = function () {
setRem()
}
import Vue from 'vue'
import App from './App.vue'
import Router from 'vue-router'
import router from './router'
import store from './store'
import './lib/rem';
import Vant from 'vant';
import 'vant/lib/index.css';
Vue.config.productionTip = false
Vue.use(Vant);
const originalPush = Router.prototype.push
Router.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/home.vue'
import { getXToken, configWx } from '@/utils/aCommon'
Vue.use(VueRouter)
const routes = [
{
path: '/',
name: 'MainSale',
component: () => import('@/views/mainSale/active/main/index')
},
{
path: '/turntableDetail',
name: 'turntableDetail',
component: () => import('../views/active/turntableDetail.vue')
},
{
path: '/couponDetail',
name: 'couponDetail',
component: () => import('../views/active/couponDetail.vue')
},
{
path: '/createActive',
name: 'createActive',
component: () => import('../views/active/createActive.vue')
},
{
path: '/activeList',
name: 'activeList',
component: () => import('../views/active/activeList.vue')
},
{
path: '/createBigWheelActive',
name: 'createBigWheelActive',
component: () => import('../views/active/createBigWheelActive.vue')
},
{
path: '/mainSale',
name: 'MainSale',
component: () => import('@/views/mainSale/active/main/index')
},
{
path: '/changeCounter',
name: 'changeCounter',
component: () => import('@/views/counter/changeCounter')
},
{
path: '/counterInfo',
name: 'counterInfo',
component: () => import('@/views/counter/counterInfo')
},
{
path: '/counterMaintain',
name: 'counterMaintain',
component: () => import('@/views/counter/counterMaintain')
},
{
path: '/goodManage',
name: 'goodManage',
component: () => import('@/views/goods/goodManage')
},
{
path: '/goodGrounding',
name: 'goodGrounding',
component: () => import('@/views/goods/goodGrounding')
},
{
path: '/profitList',
name: 'profitList',
component: () => import('@/views/profit/index')
},
{
path: '/actTemplate',
name: 'ActTemplate',
component: () => import('@/views/mainSale/active/template/index')
},
{
path: '/me',
name: 'Me',
component: () => import('@/views/mainSale/me/main/index')
},
{
path: '/task',
name: 'Task',
component: () => import('@/views/mainSale/me/task/index')
},
{
path: '/taskList',
name: 'taskList',
component: () => import('@/views/task/taskList')
},
{
path: '/newMemberTask',
name: 'newMemberTask',
component: () => import('@/views/task/newMemberTask')
},
{
path: '/case',
name: 'case',
component: () => import('@/views/case/index')
},
{
path: '/caseDetail',
name: 'caseDetail',
component: () => import('@/views/case/caseDetail')
},
{
path: '/newInfo',
name: 'newInfo',
component: () => import('@/views/message/newInfo')
},
{
path: '/voucherInfo',
name: 'VoucherInfo',
component: () => import('@/views/voucherInfo/index')
},
{
path: '/qrCode',
name: 'qrCode',
component: () => import('@/views/qrCode/index')
},
{
path: '/manInfo',
name: 'ManInfo',
component: () => import('@/views/sideNav/manInfo/index')
},
{
path: '/goodPost',
name: 'GoodPost',
component: () => import('@/views/sideNav/goodPost/index')
},
// {
// path: '/about',
// name: 'about',
// // route level code-splitting
// // this generates a separate chunk (about.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
// }
]
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
const whiteList = ['/discount', 'discount']
router.beforeEach((to, from ,next) => {
// alert(`--->route: beforeEach: to =${JSON.stringify(to)}. from =${from}. next =${JSON.stringify(next)}`)
if(whiteList.indexOf(to.path) != -1) {
// alert(`--->route: beforeEach: If: UnIn whiteList.`)
if(sessionStorage.getItem('zConfigWx') === 'Pass'){
next()
} else {
configWx(to)
}
} else {
// alert(`--->route: beforeEach: If: In whiteList.`)
next()
}
// if (whiteList.indexOf(to.path) !== -1) {
// next()
// } else {
// if(sessionStorage.getItem('unionid')) {
// next()
// } else {
// getUnionId(to)
// // next()
// }
// }
})
// async function getUnionId (to) {
// await getXToken()
// configWx(to)
// }
export default router
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
},
mutations: {
},
actions: {
},
modules: {
}
})
This diff is collapsed.
import axios from 'axios'
import { Message, MessageBox } from 'element-ui'
import Router from '../router'
import envConfig from '@/config/env-config'
// import store from '../store'
// import { getToken } from '@/utils/auth'
// const testEnv = require('../../config/dev.env')
// Z-BasicInfo
let INFO = {
// corpId: 'wwd1cdbca7b8b2b6c4',
// agentId: '1000015',
corpId: 'ww4df265003b43fa0d',
agentId: '1000033',
// url: 'http://139.155.48.151:8085',
url: envConfig.appBaseUrlA,
}
// 创建axios实例
const service = axios.create({
baseURL: INFO.url, // api 的 base_url
timeout: 50000 // 请求超时时间
})
// request拦截器
service.interceptors.request.use(
(config) => {
if (sessionStorage['token']) {
config.headers['token'] = sessionStorage['token']
config.headers['businessId'] = sessionStorage['businessId']
} else {
config.headers['businessId'] = '10'
}
return config;
},
(error) => {
Promise.reject(error)
}
)
// response 拦截器
service.interceptors.response.use(
response => {
console.log(response)
if(response.status == 200) {
return response.data
} else {
Message({
message: response.data.msg,
type: 'error',
duration: 5 * 1000
})
}
// let loadingSetting = Loading.service({
// fullscreen: true,
// lock: true,
// background: 'rgba(0,0,0,0.4)',
// text: '正在加载',
// spinner: 'el-icon-loading'
// })
// endLoading(loadingSetting)
// if (response.errorCode == '1001') {
// Router.push({ path: "/login" });
// }
},
error => {
console.log(error)
// console.log('err' + error) // for debug
// Message({
// message: error.message,
// type: 'error',
// duration: 50 * 1000
// })
// return Promise.reject(error)
}
)
// function endLoading (loading) {
// store.commit('LOADING', false)
// loading.close()
// }
// function startLoding () {
// store.commit('LOADING', true)
// }
export default service
import axios from 'axios'
import md5 from "js-md5"
let BASE_API = "http://139.155.48.151:8084"
const zlog = console.log.bind(console)
// ztest
// 创建 axios 实例
const service = axios.create({
baseURL: BASE_API,
timeout: 20000
})
// request 拦截器
service.interceptors.request.use(
request => {
// zlog('--->request: request:', request)
return request
},
error => {
Promise.reject(error)
}
)
// response 拦截器
service.interceptors.response.use(
response => {
const res = response.data
return res
},
error => {
return Promise.reject(error)
}
)
export default service
\ No newline at end of file
import axios from 'axios'
import envConfig from '@/config/env-config'
export function wxRequest(inUrl, data = {}, header = {}, method = 'post') {
// let URL = `http://172.16.0.111:8081${url}`
// let URL = `http://139.155.48.151:8081${url}`
// Z-BasicInfo
let INFO = {
// corpId: 'wwd1cdbca7b8b2b6c4',
// agentId: '1000015',
corpId: 'ww4df265003b43fa0d',
agentId: '1000033',
// url: 'http://139.155.48.151:8085' + inUrl,
url: envConfig.appBaseUrlA + inUrl,
}
if (method == 'post') {
return new Promise(function (resolve, reject) {
axios({
url: INFO.url,
method: method,
headers: header,
data: data
}).then(res => {
resolve(res.data)
}).catch(res => {
reject(res)
})
})
}
if (method == 'get') {
return new Promise(function (resolve, reject) {
axios({
url: INFO.url,
method: method,
headers: header,
params: data
}).then(res => {
resolve(res.data)
}).catch(res => {
reject(res)
})
})
}
}
import axios from 'axios'
import md5 from "js-md5"
// import envConfig from '@/config/env-config'
import envConfig from '../config/env-config'
// let BASE_API = "https://gd.chfatech.com/guangdian"
// let BASE_API = "/api/"
// let BASE_API = envConfig.appOyAPI
// let BASE_API = "http://111.26.165.55:8010/crminterface.ashx"
let BASE_API = "/api"
const zlog = console.log.bind(console)
// URL 编码与拼接
const createSign = (inPostData, inAppSecret) => {
let appUser = inPostData.appUser
let appCode = inPostData.appCode
let ts = inPostData.ts
let args = JSON.parse(JSON.stringify(inPostData.args));
let appSecret = inAppSecret
let res = "";
// URL 编码
for (let key in args) {
res += encodeURIComponent(key) + "%3D" + encodeURIComponent(args[key]) + "%26";
}
res = res.slice(0, -3);
// URL 拼接
res += `&appUser=${appUser}&appCode=${appCode}&${ts}${appSecret}`
return res;
};
// Basic Info
// 欧亚认证信息_V1
// appUser: "YBF001",
// appSecret: "t04yYm6gjsuHeehxOxojtmiwlYfXY8Zkdowf"
// 欧亚认证信息_V2
// appUser: "WZ001",
// appSecret: "mfdmTGAYU2M3F=JeC0mImYzU5Yjg1E2ZjZmO"
let basicInfo = {
appUser: "WZ001",
ver: "v2.17",
appSecret: "mfdmTGAYU2M3F=JeC0mImYzU5Yjg1E2ZjZmO"
}
// 创建 axios 实例
debugger
const service = axios.create({
baseURL: BASE_API,
timeout: 20000
})
// request 拦截器
service.interceptors.request.use(
req => {
// zlog('--->axios: req.params: start:', req.params)
let apiMethod = req.method
if (apiMethod === 'post') {
// alert('--->PostToEA: bRequestEa.js: if: post: IN.')
// zlog('--->axios: req.data:', req.data)
let oldPostData = JSON.parse(JSON.stringify(req.data))
let newPostData = {
appUser: basicInfo.appUser,
appCode: oldPostData.args.appCode,
// ts: String(Date.parse(new Date())),
// ts: '1563355520',
ts: String(parseInt(new Date().getTime()/1000)),
ver: basicInfo.ver,
args: oldPostData.args
}
delete newPostData.args.appCode
let postData = {
appUser: newPostData.appUser,
appCode: newPostData.appCode,
ts: newPostData.ts,
sign: md5(createSign(newPostData, basicInfo.appSecret)),
ver: newPostData.ver,
args: newPostData.args
}
// alert(`--->PostToEA: bRequestEa.js: if: end: req.data = ${JSON.stringify(postData)}`)
req.data = postData
}
if (apiMethod === 'get') {
// log('--->axios: req.data:', req.data)
let oldPostData = JSON.parse(JSON.stringify(req.params))
let newPostData = {
appUser: basicInfo.appUser,
appCode: oldPostData.args.appCode,
ts: String(Date.parse(new Date())),
ver: basicInfo.ver,
args: oldPostData.args
}
delete newPostData.args.appCode
let postData = {
appUser: newPostData.appUser,
appCode: newPostData.appCode,
ts: newPostData.ts,
sign: md5(createSign(newPostData, basicInfo.appSecret)),
ver: newPostData.ver,
args: newPostData.args
}
req.params = postData
}
// zlog('--->axios: req.params: end:', req.params)
return req
},
error => {
// alert(`--->PostToEA: bRequestEa.js: err = ${JSON.stringify(error)}`)
Promise.reject(error)
}
)
// response 拦截器
service.interceptors.response.use(
response => {
const res = response.data
return res
},
error => {
return Promise.reject(error)
}
)
export default service
import axios from 'axios'
import md5 from "js-md5"
import envConfig from '@/config/env-config'
// let BASE_API = "https://gd.chfatech.com/guangdian"
let BASE_API = envConfig.appOyAPI
const zlog = console.log.bind(console)
// URL 编码与拼接
const createSign = (inPostData, inAppSecret) => {
let appUser = inPostData.appUser
let appCode = inPostData.appCode
let ts = inPostData.ts
let args = JSON.parse(JSON.stringify(inPostData.args));
let appSecret = inAppSecret
let res = "";
// URL 编码
for (let key in args) {
res += encodeURIComponent(key) + "%3d" + encodeURIComponent(args[key]).toLowerCase() + "%26";
}
res = res.slice(0, -3);
// URL 拼接
res += `&appUser=${appUser}&appCode=${appCode}&${ts} ${appSecret}`
return res;
};
// Basic Info
let basicInfo = {
appUser: "user001",
ver: "v2.17",
appSecret: "JeC0mmE2ZjZmOfdmTGImYzU5Yjg1AYU2M3F="
}
// 创建 axios 实例
const service = axios.create({
baseURL: BASE_API,
timeout: 20000
})
// request 拦截器
service.interceptors.request.use(
res => {
// log('--->axios: res.data:', res.data)
let oldPostData = JSON.parse(JSON.stringify(res.data))
let newPostData = {
appUser: basicInfo.appUser,
appCode: oldPostData.args.appCode,
ts: String(Date.parse(new Date())),
ver: basicInfo.ver,
args: oldPostData.args
}
let postData = {
appUser: newPostData.appUser,
appCode: newPostData.appCode,
ts: newPostData.ts,
sign: md5(createSign(newPostData, basicInfo.appSecret)),
ver: newPostData.ver,
args: newPostData.args
}
delete postData.args.appCode
zlog()
res.data = postData
return res
},
error => {
Promise.reject(error)
}
)
// response 拦截器
service.interceptors.response.use(
response => {
const res = response.data
return res
},
error => {
return Promise.reject(error)
}
)
export default service
<template>
<div class="container">
<div class="title">
<span>会员分裂</span>
<span class="fr">查看更多<span class="icon">></span></span>
</div>
<div class="active">
<div class="list">
<div class="left"></div>
<div class="right">
<h3>砍价</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<div class="list">
<div class="left"></div>
<div class="right">
<h3>集赞</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<div class="list list3">
<div class="left"></div>
<div class="right">
<h3>推荐有礼</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
</div>
<div class="fg">复购</div>
<div class="active">
<div class="list">
<div class="left"></div>
<div class="right">
<h3>大转盘抽奖</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<div class="list list3">
<div class="left"></div>
<div class="right">
<h3>砸金蛋抽奖</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
</div>
</div>
</template>
<script>
export default {};
</script>
<style scoped>
.container {
height: auto;
background-color: rgba(248, 248, 248, 1);
min-height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.title {
height: 44px;
background: rgba(248, 248, 248, 1);
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 16px;
font-size: 12px;
color: rgba(45, 71, 106, 1);
}
.fg {
padding: 0 16px;
font-size: 12px;
color: rgba(45, 71, 106, 1);
height: 44px;
line-height: 44px;
}
.icon {
font-weight: 800;
}
.active {
background-color: #fff;
padding: 12px 12px 0 12px;
box-shadow:0px 2px 4px 0px rgba(221,221,221,1);
}
.list {
height: 94px;
width: 100%;
background-color: #fff;
display: flex;
justify-content: space-between;
border-bottom: 1px solid rgba(238,238,238,1);
margin-bottom: 14px;
}
.list3 {
border-bottom: none;
margin-bottom: 0;
}
.left,.right {
height: 80px;
}
.left {
width: 80px;
background:rgba(248,248,248,1);
}
.right {
width: 76%;
padding-left: 10px;
background-color: #fff;
}
h3 {
font-size: 14px;
font-weight:bold;
color:rgba(45,71,106,1);
}
p {
margin-top: 10px;
font-size:12px;
color:rgba(45,71,106,0.8);
}
</style>
<template>
<div class="container">
<div>
<div class="topb">
</div>
<div class="title">
<span class="bt">服装店幸运抽奖</span>
<div class="tb">
<img src="../../../public/img/zp.png" alt="" />
大转盘抽奖
</div>
</div>
<div class="wtitle">
<img src="../../../public/img/water.png" alt="" />
<span class="wan">玩法介绍</span>
</div>
<div class="content">
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
</div>
</div>
<div class="creat" @click="createActive">创建同款活动</div>
</div>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
createActive() {
this.$router.push({
name: 'createActive'
})
}
},
};
</script>
<style>
</style>
<style scoped>
p {
font-size: 12px;
font-weight: 400;
color: rgba(45, 71, 106, 0.8);
margin-top: 14px;
}
.wan {
position: absolute;
left: 77px;
top: 8px;
font-size: 16px;
font-weight: bold;
}
.wtitle {
width: 200px;
height: 24px;
position: absolute;
left: 50%;
transform: translate(-50%);
top: 268px;
z-index: 999;
}
.wtitle img {
width: 100%;
}
.topb {
width: 100%;
height: 200px;
background:url(../../../public/img/zpbg.png) no-repeat;
background-size: cover;
}
.title {
width: 100%;
height: 50px;
font-size: 18px;
background-color: #fff;
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
line-height: 50px;
padding-left: 16px;
position: relative;
}
.container {
background-color: rgba(248, 248, 248, 1);
height: auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: column;
min-height: 100%;
}
.bt {
font-size: 16px;
margin-left: 96px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
.tb {
position: absolute;
height: 24px;
line-height: 24px;
left: 16px;
top: 14px;
border-radius: 2px;
border: 1px solid rgba(45, 71, 106, 1);
font-size: 10px;
font-weight: 500;
color: rgba(45, 71, 106, 1);
width: 88px;
text-align: center;
}
.tb img {
width: 12px;
height: 12px;
}
.content {
margin: 36px 16px 16px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
position: relative;
padding: 16px 16px 30px 16px;
}
.creat {
width: 343px;
height: 40px;
line-height: 40px;
background: rgba(117, 178, 253, 1);
border-radius: 10px;
font-size: 16px;
font-weight: bold;
color: rgba(255, 255, 255, 1);
text-align: center;
margin-bottom: 16px;
}
</style>
<template>
<div class="container">
<div class="title">基础设置</div>
<van-cell-group class="all">
<van-cell title="活动标题" style="font-size:14px;">
<template slot="default">
<van-field
v-model="title"
placeholder="请输入活动标题"
class="right"
style="font-size:14px;"
/>
</template>
</van-cell>
<van-cell title="消费后领券" style="font-size:14px;">
<template slot="default">
<van-switch v-model="coupon" size="20px" class="right" />
</template>
</van-cell>
<van-cell title="新客专享" style="font-size:14px;">
<template slot="default">
<van-switch v-model="newCustomer" size="20px" class="right" />
</template>
</van-cell>
<van-cell title="领券条件" style="font-size:14px;">
<template slot="default">
<div class="condition">
<span class="phone">手机号必填</span>
<van-switch v-model="condition" size="20px" />
</div>
</template>
</van-cell>
</van-cell-group>
<div class="title">券设置</div>
<van-cell-group class="all">
<van-cell title="活动标题" style="font-size:14px;">
<template slot="default">
<van-field
v-model="title2"
placeholder="请输入活动标题"
class="right"
style="font-size:14px;"
/>
</template>
</van-cell>
<van-cell title="券类型" style="font-size:14px;">
<template slot="default">
<van-radio-group v-model="type" class="right">
<van-radio name="1" style="float:left;">代金券</van-radio>
<van-radio name="2" style="float:right;">折扣券</van-radio>
</van-radio-group>
</template>
</van-cell>
<van-cell title="代金券金额" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<van-field
class="right noborder"
readonly
clickable
:value="cashCoupon"
placeholder="输入代金券金额"
@touchstart.native.stop="show = true"
/>
<van-number-keyboard
v-model="cashCoupon"
:show="show"
:maxlength="6"
@blur="show = false"
/>
</div>
</template>
</van-cell>
<van-cell title="使用门槛" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<van-field
class="right noborder"
readonly
clickable
:value="limit"
placeholder="输入使用门槛"
@touchstart.native.stop="show2 = true"
/>
<van-number-keyboard
v-model="limit"
:show="show2"
:maxlength="6"
@blur="show2 = false"
/>
</div>
</template>
</van-cell>
<van-cell title="活动开始时间" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<van-field
class="right"
v-model="startTime1"
placeholder="选择活动开始时间"
readonly="readonly"
@click="startShow = true"
/>
<van-popup v-model="startShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="startTime"
type="date"
@cancel="startShow = false"
@confirm="handleStartTime"
@change="startTimeChange"
/>
</van-popup>
</div>
</template>
</van-cell>
<van-cell title="活动结束时间" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<van-field
class="right"
v-model="endTime1"
placeholder="选择活动结束时间"
readonly="readonly"
@click="endShow = true"
/>
<van-popup v-model="endShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="endTime"
type="date"
@cancel="endShow = false"
@confirm="handleEndTime"
@change="endTimeChange"
/>
</van-popup>
</div>
</template>
</van-cell>
<div class="des">描述</div>
<van-field
class="area"
v-model="message"
rows="3"
autosize
type="textarea"
placeholder="请输入描述"
show-word-limit
/>
</van-cell-group>
<div class="creat">创建活动</div>
</div>
</template>
<script>
export default {
data() {
return {
title: "",
title2: "",
coupon: "",
newCustomer: "",
condition: "",
type: "",
show: false,
show2: false,
cashCoupon: "",
limit: "",
startTime: new Date(),
startTime1: "",
endTime: new Date(),
endTime1: "",
startShow: false,
endShow: false,
message: ""
};
},
methods: {
timeFormat(time) {
let year = 1900 + time.getYear();
let month = "0" + (time.getMonth() + 1);
let date = "0" + time.getDate();
return year + "-" + month.substring(month.length-2, month.length) + "-" + date.substring(date.length-2, date.length)
+ " "
},
startTimeChange(e) {
let startTimeArr = e.getValues();
this.startTime1 = `${startTimeArr[0]}-${startTimeArr[1]}-${startTimeArr[2]}`;
},
handleStartTime(value) {
this.startTime1 = this.timeFormat(value)
this.startShow = false
},
handleEndTime(value) {
this.endTime1 = this.timeFormat(value)
this.endShow = false
},
endTimeChange(e) {
let endTimeArr = e.getValues();
this.endTime1 = `${endTimeArr[0]}-${endTimeArr[1]}-${endTimeArr[2]}`;
}
},
mounted() {}
};
</script>
<style></style>
<style scoped>
.condition {
display: flex;
justify-content: flex-end;
align-items: center;
}
.phone {
margin-right: 10px;
}
.all >>> input {
text-align: right;
}
.noborder >>> .van-cell:not(:last-child)::after {
display: none !important;
}
.npbr .van-cell:not(:last-child)::after {
display: none !important;
}
.creat {
margin-top: 80px;
width: 96%;
height: 40px;
background: rgba(117, 178, 253, 1);
border-radius: 10px;
text-align: center;
line-height: 40px;
font-size: 16px;
font-weight: bold;
color: #fff;
margin-left: 2%;
margin-bottom: 16px;
}
.container {
height: auto;
display: flex;
flex-direction: column;
background: rgba(248, 248, 248, 1);
min-height: 100%;
}
.area >>> .van-field__control {
background: #f8f8f8;
padding: 12px;
}
.des {
padding: 5px 18px 0px;
font-size: 14px;
color: #2d476a;
}
.title {
background-color: #f8f8f8;
height: 36px;
line-height: 36px;
font-size: 12px;
padding-left: 16px;
color: #2d476a;
}
[data-v-08d4afe1] .van-cell {
height: 100%;
font-size: 14px;
}
.right {
padding: 0;
}
.van-cell__title {
color: #2d476a !important;
}
</style>
This diff is collapsed.
<template>
<div class="container">
<div>
<div class="topb">
<!-- <img src="../../../public/img/zpbg.png" alt="" /> -->
</div>
<div class="title">
<span class="bt">服装店幸运抽奖</span>
<div class="tb">
<img src="../../../public/img/zp.png" alt="" />
大转盘抽奖
</div>
</div>
<div class="wtitle">
<img src="../../../public/img/water.png" alt="" />
<span class="wan">玩法介绍</span>
</div>
<div class="content">
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
</div>
</div>
<div class="creat" @click="createActive">创建同款活动</div>
</div>
</template>
<script>
export default {
data() {
return {};
},
methods: {
createActive() {
this.$router.push({
name: "createBigWheelActive"
});
}
}
};
</script>
<style></style>
<style scoped>
p {
font-size: 12px;
font-weight: 400;
color: rgba(45, 71, 106, 0.8);
margin-top: 14px;
}
.wan {
position: absolute;
left: 77px;
top: 8px;
font-size: 16px;
font-weight: bold;
}
.wtitle {
width: 200px;
height: 24px;
position: absolute;
left: 50%;
transform: translate(-50%);
top: 268px;
z-index: 999;
}
.wtitle img {
width: 100%;
}
.topb {
width: 100%;
height: 200px;
background:url(../../../public/img/zpbg.png) no-repeat;
background-size: cover;
}
.topb img {
width: 100%;
}
.title {
width: 100%;
height: 50px;
font-size: 18px;
background-color: #fff;
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
line-height: 50px;
padding-left: 16px;
position: relative;
}
.container {
height: auto;
background-color: rgba(248, 248, 248, 1);
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: column;
min-height: 100%;
}
.bt {
font-size: 16px;
margin-left: 96px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
.tb {
position: absolute;
height: 24px;
line-height: 24px;
left: 16px;
top: 14px;
border-radius: 2px;
border: 1px solid rgba(45, 71, 106, 1);
font-size: 10px;
font-weight: 500;
color: rgba(45, 71, 106, 1);
width: 88px;
text-align: center;
align-items: center;
}
.tb img {
width: 12px;
height: 12px;
vertical-align: middle;
}
.content {
margin: 36px 16px 16px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
position: relative;
padding: 16px 16px 30px 16px;
}
.creat {
width: 343px;
height: 40px;
line-height: 40px;
background: rgba(117, 178, 253, 1);
border-radius: 10px;
font-size: 16px;
font-weight: bold;
color: rgba(255, 255, 255, 1);
text-align: center;
margin-bottom: 16px;
}
</style>
<template>
<div class="container" >
<div class="ct">
<div class="head">
<h3>我的一次成功销售案例</h3>
<div>
<span>作者: </span>
<span>亿百分</span>
<span style="margin-left:24px;">2019 / 12 /24</span>
</div>
</div>
<div class="nr">
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
<div class="pic">
<img src="/img/article.png" alt="">
</div>
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
</div>
</div>
</div>
</template>
<script>
import { getCaseDetail } from '@/api/test/active'
export default {
data() {
return {
}
},
methods: {
getDeatil() {
let data = {
}
getCaseDetail(data).then(res => {
console.log(res,"案例详情");
})
}
},
};
</script>
<style scoped>
.pic {
width: 100%;
margin-bottom: 14px;
}
.pic img {
width: 100%;
}
.nr {
margin-top: 12px;
}
.nr p {
font-size: 12px;
font-weight: 400;
color: #576C88;
margin-bottom: 14px;
}
.container {
background: #f8f8f8;
height: auto;
padding: 16px;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: start;
min-height: 100%;
}
.ct {
background-color: #fff;
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
padding: 16px;
}
.head {
height: 74px;
width: 100%;
border-bottom: 1px solid rgba(238, 238, 238, 1);
}
.head h3 {
font-size: 18px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
.head span {
font-size: 12px;
font-weight: 500;
color: rgba(45, 71, 106, 1);
}
</style>
<template>
<div class="container">
<div class="kj">
<div class="title">热门案例</div>
<div class="ct al" @click="handleDetail">
<div class="ck">查看详情</div>
</div>
</div>
<div class="kj" @click="handleDetail">
<div class="title">技巧</div>
<div class="ct jq">
<div class="ck">查看详情</div>
</div>
</div>
<div class="kj last" @click="handleDetail">
<div class="title">服务</div>
<div class="ct fw">
<div class="ck">查看详情</div>
</div>
</div>
<div class="main-menuBar">
<div class="menuBar-menu" @click="menuBarClick('MainSale')">
<img class="menuBar-icon" :src="menuBarInfo.icon.now['1']" />
<div class="menuBar-title">活动</div>
</div>
<div class="menuBar-menu">
<img class="menuBar-icon" :src="menuBarInfo.icon.now['2']" />
<div class="menuBar-title menuBar-title-ac">案例</div>
</div>
<div class="menuBar-menu" @click="menuProfit()">
<img class="menuBar-icon" :src="menuBarInfo.icon.now['3']" />
<div class="menuBar-title">收益</div>
</div>
<div class="menuBar-menu" @click="menuTask()">
<img class="menuBar-icon" :src="menuBarInfo.icon.now['4']" />
<div class="menuBar-title">任务</div>
</div>
<div class="menuBar-menu" @click="menuBarClick('Me')">
<img class="menuBar-icon" :src="menuBarInfo.icon.now['5']" />
<div class="menuBar-title">我的</div>
</div>
</div>
</div>
</template>
<script>
import { getCaseList } from '@/api/test/active'
export default {
data() {
return {
// 图标
menuBarInfo: {
list: {
main: [
{
name: "",
iconUaUrl: "",
iconAcUrl: ""
}
]
},
icon: {
now: {
"1": "",
"2": "",
"3": "",
"4": "",
"5": ""
},
ua: {
"1": "/mainSale/icon-menuBar-1-ua.png",
"2": "/mainSale/icon-menuBar-2-ua.png",
"3": "/mainSale/icon-menuBar-3-ua.png",
"4": "/mainSale/icon-menuBar-4-ua.png",
"5": "/mainSale/icon-menuBar-5-ua.png"
},
ac: {
"1": "/mainSale/icon-menuBar-1-ac.png",
"2": "/mainSale/icon-menuBar-2-ac.png",
"3": "/mainSale/icon-menuBar-3-ac.png",
"4": "/mainSale/icon-menuBar-4-ac.png",
"5": "/mainSale/icon-menuBar-5-ac.png"
}
}
}
};
},
created() {
this.checkNowMenuBar();
this.getList()
},
methods: {
getList() {
/* let data = {
}
getCaseList(data).then( res => {
console.log(res,"案例列表")
}) */
},
handleDetail() {
this.$router.push({
path:'caseDetail'
})
},
// 导航
checkNowMenuBar() {
let inData = "2";
this.menuBarInfo.icon.now = this.menuBarInfo.icon.ua;
this.menuBarInfo.icon.now[inData] = this.menuBarInfo.icon.ac[inData];
},
menuBarClick(inData) {
this.$router.push(inData);
},
listTaskClick() {
this.$router.push("Task");
},
menuProfit() {
this.$router.push({ path: "/profitList" });
},
menuTask() {
this.$router.push({ path: "/taskList" });
}
}
};
</script>
<style scoped>
.kj {
width: 100%;
height: 229px;
background: rgba(248, 248, 248, 1);
padding: 12px;
margin-bottom: 10px;
}
.container {
padding: 16px;
}
.title {
font-size: 14px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
.ct {
width: 100%;
height: 180px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
border-radius: 10px;
margin-top: 12px;
position: relative;
}
.ck {
position: absolute;
width: 100%;
bottom: 0;
height: 32px;
line-height: 32px;
text-align: center;
background: rgba(117, 178, 253, 0.8);
border-radius: 0px 0px 10px 10px;
font-size: 12px;
font-weight: 400;
color: rgba(255, 255, 255, 1);
}
.main-menuBar {
/*border: 1px solid darkviolet;*/
box-shadow: inset 0px 1px 2px 0px rgba(221, 221, 221, 1);
width: 100%;
height: 82px;
position: fixed;
bottom: 0px;
left: 0px;
background-color: #fafafa;
padding: 0px 14px;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.menuBar-menu {
/*background-color: greenyellow;*/
width: 48px;
height: 47px;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
}
.menuBar-icon {
width: 24px;
height: 24px;
object-fit: cover;
}
.menuBar-title {
width: auto;
height: 12px;
font-size: 10px;
font-weight: bold;
color: rgba(67, 119, 188, 0.4);
text-align: center;
}
.menuBar-title-ac {
color: rgba(67, 119, 188, 1);
}
.last {
margin-bottom: 80px;
}
.al,.fw,.jq {
background:url(../../../public/img/cswiper.png)no-repeat;
background-size: cover;
}
</style>
<template>
<div class="container">
<van-radio-group v-model="radio" class="nobr">
<van-cell-group>
<van-cell clickable @click="radio = '1'">
<div class="list">
<div class="left">
<img src="../../../public/img/counter.png" alt="" />
</div>
<div class="right">
<h3>欧亚一号专柜</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<van-radio slot="right-icon" name="1" />
</van-cell>
<van-cell clickable @click="radio = '2'">
<div class="list">
<div class="left">
<img src="../../../public/img/counter.png" alt="" />
</div>
<div class="right">
<h3>欧亚一号专柜</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<van-radio slot="right-icon" name="2" />
</van-cell>
<van-cell clickable @click="radio = '3'">
<div class="list">
<div class="left">
<img src="../../../public/img/counter.png" alt="" />
</div>
<div class="right">
<h3>欧亚一号专柜</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<van-radio slot="right-icon" name="3" />
</van-cell>
</van-cell-group>
</van-radio-group>
</div>
</template>
<script>
export default {
data() {
return {
radio: ""
};
}
};
</script>
<style scoped>
.container {
height: auto;
background-color: #fff;
min-height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.title {
height: 44px;
background: rgba(248, 248, 248, 1);
line-height: 44px;
padding: 0 16px;
font-size: 12px;
color: rgba(45, 71, 106, 1);
}
.fg {
padding: 0 16px;
font-size: 12px;
color: rgba(45, 71, 106, 1);
height: 44px;
line-height: 44px;
}
.icon {
font-weight: 800;
}
.active {
background-color: #fff;
padding: 12px 12px 0 12px;
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
}
.list {
height: 94px;
width: 100%;
background-color: #fff;
display: flex;
justify-content: space-between;
border-bottom: 1px solid rgba(238, 238, 238, 1);
margin-bottom: 14px;
}
.list3 {
border-bottom: none;
margin-bottom: 0;
}
.left,
.right {
height: 80px;
}
.left {
width: 80px;
background: rgba(248, 248, 248, 1);
}
.left img {
width: 100%;
}
.right {
width: 76%;
padding: 10px;
background-color: #fff;
}
h3 {
font-size: 14px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
p {
margin-top: 10px;
font-size: 12px;
color: rgba(45, 71, 106, 0.8);
}
.nobr >>> [class*=van-hairline]::after {
display: none;
}
.nobr >>> .van-cell:not(:last-child)::after {
display: none;
}
</style>
<template>
<div class="container">
<div class="img">
<van-swipe :autoplay="3000">
<van-swipe-item>
<img src="../../../public/img/cswiper.png" />
</van-swipe-item>
<van-swipe-item>
<img src="../../../public/img/cswiper.png" />
</van-swipe-item>
<van-swipe-item>
<img src="../../../public/img/cswiper.png" />
</van-swipe-item>
</van-swipe>
</div>
<div class="list">
<div class="left">
<img src="../../../public/img/counter.png" alt="" />
</div>
<div class="right">
<h3>欧亚一号专柜</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<van-cell-group class="gn">
<van-cell title="专柜信息" is-link value="详细信息" />
<van-cell title="访问专柜首页" is-link value="详细信息" />
<van-cell title="专柜收款码" is-link value="详细信息" />
<van-cell title="推送门店信息" is-link value="详细信息" />
</van-cell-group>
</div>
</template>
<script>
export default {
data() {
return {};
}
};
</script>
<style scoped>
.gn >>> .van-cell__title{
font-size:14px;
font-weight:bold;
color:rgba(45,71,106,1);
}
.gn {
margin-top: 12px;
width: 100%;
}
.container {
background: #f8f8f8;
height: auto;
display: flex;
justify-content: flex-start;
align-items: center;
flex-direction: column;
min-height: 100%;
}
.img {
width: 100%;
height: 200px;
background-color: pink;
}
.img img {
width: 100%;
}
.list {
height: 80px;
width: 100%;
background-color: #fff;
display: flex;
justify-content: space-between;
border-bottom: 1px solid rgba(238, 238, 238, 1);
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
border-radius: 2px;
z-index: 100;
}
.list3 {
border-bottom: none;
margin-bottom: 0;
}
.left,
.right {
height: 80px;
}
.left {
width: 80px;
background: rgba(248, 248, 248, 1);
position: absolute;
top: 188px;
left: 10px;
}
.left img {
width: 100%;
}
.right {
width: 76%;
padding: 10px;
background-color: #fff;
margin-left: 94px;
}
h3 {
font-size: 14px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
p {
margin-top: 10px;
font-size: 12px;
color: rgba(45, 71, 106, 0.8);
}
</style>
<template>
<div class="container">
<div class="img">
<van-uploader class="upload" v-model="bannerList" :max-count="4">
<div class="circle">
<span class="add">+</span>
</div>
</van-uploader>
<div class="tj">
点击添加专柜主题图
</div>
</div>
<div class="banner">
<van-uploader class="upload" v-model="bannerList" :max-count="4">
</van-uploader>
</div>
<van-cell-group class="gn">
<van-cell title="专柜LOGO" center class="logo">
<template slot="default">
<van-uploader v-model="fileList" :max-count="1" class="input" >
<div class="cube" style="width:54px;height:50px;">
<van-icon name="photo" size="40" />
<div class="mb">点击替换</div>
</div>
</van-uploader>
</template>
</van-cell>
<van-cell title="专柜名称">
<template slot="default">
<van-field v-model="name" placeholder="输入名称" class="input" />
</template>
</van-cell>
<van-cell title="所在楼层">
<template slot="default">
<van-field v-model="floor" placeholder="输入楼层" class="input" />
</template>
</van-cell>
<!-- <van-cell title="专柜介绍" is-link value="点击输入" /> -->
<div class="detail">
<div class="border">
<div class="des">活动描述</div>
<van-field
v-model="message"
rows="4"
autosize
type="textarea"
placeholder="请输入描述"
show-word-limit
/>
</div>
</div>
</van-cell-group>
<div class="creat">保存信息</div>
</div>
</template>
<script>
export default {
data() {
return {
name: "",
floor: "",
fileList: [],
bannerList:[],
message: ""
};
}
};
</script>
<style >
</style>
<style scoped>
.logo >>> .van-uploader__preview-delete{
top: 0;
}
.des {
font-size: 14px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
margin-bottom: 12px;
}
.detail {
background-color: #fff;
padding: 12px 16px 0 16px;
}
.border >>> .van-field__control {
text-align: left !important;
background-color: #f8f8f8;
}
.border >>> .van-cell {
padding: 0;
}
.banner >>> .upload[data-v-6ea3d66a] {
padding-top: 10px;
z-index: 100;
width: 100%;
position: static;
transform: unset;
padding: 10px 9px 0;
}
.img >>> .van-uploader__preview {
display: none;
}
.banner {
width: 100%;
background-color: #fff;
height: 96px;
}
.banner >>> .van-uploader__upload-icon {
display: none;
}
.creat {
margin: 20px 0;
width: 343px;
height: 40px;
line-height: 40px;
background: rgba(117, 178, 253, 1);
border-radius: 10px;
font-size: 16px;
font-weight: bold;
color: rgba(255, 255, 255, 1);
text-align: center;
bottom: 0;
}
.cube {
width:54px;
height: 50px;
background: rgba(248, 248, 248, 1);
border-radius: 8px;
position: relative;
text-align: center;
}
.tj {
height: 32px;
line-height: 32px;
background: rgba(117, 178, 253, 0.8);
text-align: center;
font-size: 12px;
color: #fff;
position: absolute;
bottom: 0;
width: 100%;
}
.add {
font-size: 60px;
font-weight: 500;
color: #fff;
}
.circle {
width: 64px;
height: 64px;
background: rgba(255, 255, 255, 0.6);
border-radius: 50%;
line-height: 60px;
text-align: center;
}
.upload {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.van-cell__value,
.van-cell__value--alone {
text-align: right;
}
.input {
padding: 0;
}
.gn >>> .van-field__control {
text-align: right;
}
.gn >>> .van-cell__title {
font-size: 14px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
.gn {
margin-top: 12px;
width: 100%;
padding-bottom: 12px;
}
.input >>> .van-uploader__input-wrapper {
width: 100%;
}
.container {
min-height: 100%;
height: auto;
background: #F8F8F8;
display: flex;
justify-content: flex-start;
flex-direction: column;
align-items: center;
}
.img {
width: 100%;
height: 200px;
position: relative;
background:url(../../../public/img/cswiper.png)no-repeat;
background-size: cover;
}
.mb {
position: absolute;
width: 100%;
height: 16px;
bottom: 0;
line-height: 16px;
background-color: #8EBFFB;
font-size: 6px;
color: #fff;
}
.mb img {
height: 100%;
}
.cfx {
position: absolute;
width: 100%;
height: 100%;
}
</style>
<template>
<div class="container">
<div class="list">
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
</div>
</div>
<van-cell-group class="option">
<van-cell class="nop">
<div class="type">
<div class="t-l">佣金类型</div>
<div class="t-r">
<van-radio-group v-model="type" @change="handleChooseChange">
<van-radio name="1" style="float:left;">固定金额</van-radio>
<van-radio name="2" style="float:right;">成交价比例</van-radio>
</van-radio-group>
<div class="fr" v-if="type == 1">
<span class="fr" style="margin-top:18px;"></span>
<van-field
class="price"
readonly
clickable
:value="price"
placeholder="请输入金额"
@touchstart.native.stop="show2 = true"
/>
<van-number-keyboard
v-model="price"
:show="show2"
@blur="show2 = false"
/>
</div>
<div class="fr" v-if="type == 2">
<span class="fr" style="margin-top:18px;">%</span>
<van-field
class="price"
readonly
clickable
:value="percent"
placeholder="请输入百分比"
@touchstart.native.stop="show3 = true"
/>
<van-number-keyboard
v-model="percent"
:show="show3"
@blur="show3 = false"
/>
</div>
</div>
</div>
</van-cell>
<van-cell title="活动开始时间" style="font-size:14px;">
<template slot="default">
<div class="jpsl">
<van-field
v-model="startTime1"
placeholder="选择活动开始时间"
readonly="readonly"
@click="startShow = true"
class="nop"
/>
<van-popup v-model="startShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="startTime"
type="datetime"
@cancel="startShow = false"
@confirm="handleStartTime"
@change="startTimeChange"
/>
</van-popup>
</div>
</template>
</van-cell>
<van-cell title="活动结束时间" style="font-size:14px;">
<template slot="default">
<div class="jpsl">
<van-field
v-model="endTime1"
placeholder="选择活动结束时间"
readonly="readonly"
@click="endShow = true"
class="nop"
/>
<van-popup v-model="endShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="endTime"
type="datetime"
@cancel="endShow = false"
@confirm="handleEndTime"
@change="endTimeChange"
/>
</van-popup>
</div>
</template>
</van-cell>
<van-cell title="上架数量" style="font-size:14px;" class="nob">
<template slot="default">
<van-field
class="nop"
readonly
clickable
:value="number"
placeholder="请输入数量"
@touchstart.native.stop="show = true"
/>
<van-number-keyboard
v-model="number"
:show="show"
@blur="show = false"
/>
</template>
</van-cell>
</van-cell-group>
<div class="creat">立即上架</div>
</div>
</template>
<script>
export default {
data() {
return {
startTime: new Date(),
startTime1: "",
endTime: new Date(),
endTime1: "",
startShow: false,
endShow: false,
number: "",
type: "1",
show: false,
show2: false,
show3: false,
price: "",
percent: ""
};
},
methods: {
timeFormat(time) {
let year = 1900 + time.getYear();
let month = "0" + (time.getMonth() + 1);
let date = "0" + time.getDate();
return (
year +
"-" +
month.substring(month.length - 2, month.length) +
"-" +
date.substring(date.length - 2, date.length) +
" "
);
},
startTimeChange(e) {
let startTimeArr = e.getValues();
this.startTime1 = `${startTimeArr[0]}-${startTimeArr[1]}-${startTimeArr[2]}`;
},
endTimeChange(e) {
let endTimeArr = e.getValues();
this.endTime1 = `${endTimeArr[0]}-${endTimeArr[1]}-${endTimeArr[2]}`;
},
handleStartTime(value) {
this.startTime1 = this.timeFormat(value);
this.startShow = false;
},
handleEndTime(value) {
this.endTime1 = this.timeFormat(value);
this.endShow = false;
},
handleChooseChange(e) {
this.price = ''
this.percent = ''
}
}
};
</script>
<style scoped>
.jpsl >>> .van-cell:not(:last-child)::after {
display: none;
}
.price {
width: 88px;
height: 36px;
line-height: 36px;
/* text-align: center; */
background: #f8f8f8;
float: right;
margin-top: 12px;
border-radius: 10px;
color: rgba(45, 71, 106, 0.6);
padding: 0;
}
.nop {
padding: 0;
}
.t-l {
width: 120px;
}
.t-r {
width: 70%;
}
.type {
padding: 14px;
display: flex;
justify-content: space-between;
font-size: 14px;
}
h3 {
font-size: 14px;
color: rgba(208, 2, 27, 1);
margin-top: 18px;
}
.container {
height: 100%;
background-color: #f8f8f8;
min-height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.name {
font-size: 14px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.good {
height: 108px;
border-bottom: 1px solid rgba(238, 238, 238, 1);
width: 100%;
padding: 12px 0;
display: flex;
justify-content: space-between;
}
.list {
padding: 0 16px;
box-sizing: border-box;
background-color: #fff;
box-shadow: 0px 1px 3px 0px rgba(221, 221, 221, 1);
}
.left,
.right,
.center {
height: 80px;
}
.left {
width: 80px;
border-radius: 4px;
}
.left img {
width: 100%;
}
.center {
width: 70%;
}
.phone {
float: left;
}
.option {
margin-top: 10px;
}
.option >>> .van-field__control {
text-align: right;
}
.nob >>> .van-cell:not(:last-child)::after {
border: none;
}
.price >>> .van-field__control {
text-align: center;
}
.creat {
width: 96%;
height: 40px;
background: rgba(117, 178, 253, 1);
border-radius: 10px;
text-align: center;
line-height: 40px;
font-size: 16px;
font-weight: bold;
color: #fff;
margin-left: 2%;
position: absolute;
bottom: 16px;
}
</style>
<template>
<div>
<div class="container">
<div class="search">
<van-search
v-model="inputValue"
placeholder="客官你要搜索点什么"
shape="round"
@search="onSearch"
>
</van-search>
</div>
<van-tabs
type="card"
@click="onClick"
title-active-color="#fff"
title-inactive-color="#2D476A"
class="tab"
background="#F8F8F8"
>
<van-tab title="已上架">
<div class="list">
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD" >下架</div>
</div>
</div>
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD">下架</div>
</div>
</div>
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD">下架</div>
</div>
</div>
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD">下架</div>
</div>
</div>
</div>
</van-tab>
<van-tab title="未上架">
<div class="list">
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD" @click="handleUpperShelf">上架</div>
</div>
</div>
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD">上架</div>
</div>
</div>
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD">上架</div>
</div>
</div>
<div class="good">
<div class="left">
<img src="../../../public/img/goods.png" />
</div>
<div class="center">
<div class="name">商品名称商品名称商品名称商品名称商品</div>
<h3>¥888</h3>
</div>
<div class="right">
<div class="sj" color="#75B2FD">上架</div>
</div>
</div>
</div>
</van-tab>
</van-tabs>
</div>
</div>
</template>
<script>
export default {
data() {
return {
inputValue: "",
lower: 2,
higger: 1
};
},
methods: {
onSearch() {},
onClick(name, title) {
this.$toast(title);
if (title == "已上架") {
this.higger = 1;
this.lower = 2;
} else {
this.higger = 2;
this.lower = 1;
}
},
handleUpperShelf() {
this.$router.push("goodGrounding");
}
}
};
</script>
<style scoped>
.tab >>> .van-tabs__nav--card .van-tab {
border-right: none;
}
.tab >>> .van-tab.van-tab--active {
background-color: #75B2FD;
}
.sj {
width: 64px;
height: 32px;
background: rgba(117, 178, 253, 1);
border-radius: 8px;
line-height: 32px;
text-align: center;
font-size: 14px;
color: #fff;
margin-top: 20px;
}
h3 {
font-size: 14px;
color: rgba(208, 2, 27, 1);
margin-top: 18px;
}
.name {
font-size: 14px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.good {
height: 108px;
border-bottom: 1px solid rgba(238, 238, 238, 1);
width: 100%;
padding: 12px 0;
display: flex;
justify-content: space-between;
}
.list {
padding: 0 16px;
box-sizing: border-box;
}
.left,
.right,
.center {
height: 80px;
}
.left {
width: 80px;
border-radius:4px;
}
.left img {
width: 100%;
}
.center {
width: 50%;
}
.right {
width: 20%;
}
.tab >>> .van-tabs__nav--card {
margin: 0;
border: none;
height: 40px;
}
.container {
height: auto;
min-height: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.search {
padding: 12px 16px;
}
.active {
background-color: #75b2fd;
}
</style>
<template>
<div></div>
</template>
<script>
export default {
}
</script>
<style>
</style>
\ No newline at end of file
This diff is collapsed.
<template>
<div class="lists">
<div v-for="(item, index) of list.active" :key="index">
<div class="list" @click="listClick(index)">
<div class="list-logos">
<img class="list-logo" :src="item.logoUrl">
</div>
<div class="list-infos">
<div class="list-title">{{item.name}}</div>
<div class="list-dsc">{{item.dsc}}</div>
</div>
</div>
</div>
</div>
</template>
<script>
// ZKit
// const log = console.log.bind(console)
export default {
name: "discountIndex",
data() {
return {
list: {
active: [
{
name: "大转盘活动",
logoUrl: "/mainSale/icon-active-1.png",
dsc: "有各种物质组成的举行球状天体,叫做星球。星球有一定的形状。",
reDirect: "turntableDetail"
},
{
name: "送券活动",
logoUrl: "/mainSale/icon-active-2.png",
dsc: "有各种物质组成的举行球状天体,叫做星球。星球有一定的形状。",
reDirect: "couponDetail"
}
],
},
};
},
created() {
},
methods: {
listClick(inIndex){
// log('--->click: inIndex =', inIndex)
// log('--->click: reDirect =', this.list.active[inIndex].reDirect)
this.$router.push(this.list.active[inIndex].reDirect)
},
}
};
</script>
<style scoped>
.lists {
padding: 4px 16px 20px 16px;
}
.list {
padding: 12px 0px;
display: flex;
flex-direction: row;
justify-content: start;
align-items: center;
border-bottom: 1px solid #EEEEEE;
}
.list-logos {
width: 80px;
height: 80px;
background-color: #F8F8F8;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.list-logo {
width: 56px;
height: 56px;
}
.list-infos {
width: 251px;
height: 80px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: start;
margin-left: 12px;
}
.list-title {
font-size: 14px;
height: 16px;
line-height: 16px;
font-weight: bold;
color: #2D476A;
width: 100%;
text-align: left;
margin-bottom: 8px;
}
.list-dsc {
font-size: 12px;
height: 14px;
line-height: 14px;
font-weight: normal;
color: #2D476A;
width: 100%;
text-align: left;
overflow: auto;
}
</style>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
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