2 Commits

Author SHA1 Message Date
zhaoguoqiang e0d07bcd55 Merge branch 'guoqiang' into develop 3 years ago
zhaoguoqiang e2d058b1e9 添加返回 3 years ago
  1. 50
      postcss.config.js
  2. 27
      src/views/teamList/index.vue
  3. 40
      src/views/teamPerformance/index.vue
  4. 25
      vue.config.js

50
postcss.config.js

@ -1,25 +1,29 @@
module.exports = {
"plugins": {
"postcss-import": {},
"postcss-url": {},
"postcss-aspect-ratio-mini": {},
"postcss-write-svg": {
utf8: false
},
"postcss-cssnext": {},
"postcss-px-to-viewport": {
viewportWidth: 750, // 视窗的宽度,对应的是我们设计稿的宽度,移动端一般是750,如果是pc端那就是类似1920这样的尺寸
viewportHeight: 1344, // 视窗的高度,移动端一般指定1334,也可以不配置
unitPrecision: 3, // 指定`px`转换为视窗单位值的小数位数(很多时候无法整除)
viewportUnit: 'vw', // 指定需要转换成的视窗单位,建议使用vw
selectorBlackList: ['.ignore', '.hairlines'], // 指定不转换为视窗单位的类,可以自定义,可以无限添加,建议定义一至两个通用的类名
minPixelValue: 1, // 小于或等于`1px`不转换为视窗单位,你也可以设置为你想要的值
mediaQuery: false // 允许在媒体查询中转换`px`
},
"postcss-viewport-units":{},
"cssnano": {
preset: "default", // 设置成default将不会启用autoprefixer
"postcss-zindex": false
const path = require('path');
module.exports = ({
file
}) => {
const designWidth = file.dirname.includes(path.join('node_modules', 'vant')) ? 375 : 750;
return {
plugins: {
autoprefixer: {},
"postcss-px-to-viewport": {
unitToConvert: "px",
viewportWidth: designWidth,
propList: ["*"],
unitPrecision: 3, // 转换后的精度,即小数点位数
viewportUnit: "vw",
fontViewportUnit: "vw",
selectorBlackList: [],
landscapeUnit: 'vh', // 横屏时使用的单位
landscapeWidth: 667, // 横屏时使用的视口宽度
selectorBlackList: [], // 指定不转换为视窗单位的类名
minPixelValue: 1, // 默认值1,小于或等于1px则不进行转换
mediaQuery: true,
exclude: [],
landscape: false
}
}
}
}
}

27
src/views/teamList/index.vue

@ -1,5 +1,6 @@
<template>
<div class="teamList">
<van-nav-bar title="列表" left-text="返回" left-arrow @click-left="onClickLeft" />
<div v-if="list.data.length>0" class="moneyRanking">
<p class="title">{{this.$route.query.level_id | capitalize2}}</p>
<div class="list">
@ -29,9 +30,7 @@
<script>
import data from "@/api/data.js";
import {
Tab,
Tabs,
Empty
NavBar
} from 'vant';
export default {
data() {
@ -49,6 +48,9 @@
id: '',
}
},
components: {
"van-nav-bar": NavBar
},
filters: {
capitalize: function (val) {
return (+val || 0).toFixed(0).replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g, '$&,')
@ -76,6 +78,9 @@
this.getList()
},
methods: {
onClickLeft() {
this.$router.go(-1)
},
async getList() {
const res = await data.poxyList({
type: this.$route.query.type,
@ -125,7 +130,21 @@
min-height: 100vh;
background: RGBA(63, 66, 88, 1);
position: relative;
::v-deep .van-nav-bar__content{
background: RGBA(63, 66, 88, 1);
}
::v-deep .van-nav-bar__title{
color: #fff;
}
::v-deep .van-nav-bar__text{
color: #fff;
}
::v-deep .van-icon-arrow-left::before{
color: #fff;
}
::v-deep .van-hairline--bottom::after{
border: none;
}
.empty {
position: absolute;
top: 20%;

40
src/views/teamPerformance/index.vue

@ -1,5 +1,6 @@
<template>
<div class="dataOverview">
<van-nav-bar title="团队信息" left-text="返回" left-arrow @click-left="onClickLeft" />
<div class="top">
<p class="title">2021年总业绩</p>
<p class="money">¥{{list.year_count | capitalize}}</p>
@ -120,7 +121,7 @@
<div class="teamInfo">
<div class="teamName">{{item.username}}</div>
<div class="teamMoney">{{list.today_month}}月打款业绩{{item.team_integral | capitalize}}</div>
<div class="teamNum">团队人数{{item.team_num}}</div>
<div class="teamNum">注册时间{{item.created_at | time}}</div>
</div>
</div>
</div>
@ -129,28 +130,40 @@
</template>
<script>
import data from "@/api/data.js";
import {
NavBar
} from 'vant';
export default {
name: "dataOverview",
components: {
"van-nav-bar": NavBar
},
data() {
return {
list: {},
id:'',
id: '',
}
},
filters: {
capitalize: function (val) {
return (+val || 0).toFixed(0).replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g, '$&,')
},
time: function (val) {
return val.substring(0, 10);
},
},
created() {
this.id = this.$route.query.lid
console.log(this.id,'-----------------');
console.log(this.id, '-----------------');
this.getData()
},
methods: {
onClickLeft() {
this.$router.go(-1)
},
async getData() {
const res = await data.overviewByUserId({
user_id:this.id,
user_id: this.id,
});
this.list = res.data
console.log(this.list, '---this.list');
@ -161,7 +174,7 @@
query: {
type: type,
level_id: id,
id:this.id,
id: this.id,
}
})
},
@ -171,7 +184,22 @@
<style lang="scss" scoped>
.dataOverview {
background: #3C3F50;
::v-deep .van-nav-bar__content{
background: RGBA(63, 66, 88, 1);
}
::v-deep .van-nav-bar__title{
color: #fff;
}
::v-deep .van-nav-bar__text{
color: #fff;
}
::v-deep .van-icon-arrow-left::before{
color: #fff;
}
::v-deep .van-hairline--bottom::after{
border: none;
}
.top {
width: 750px;
height: 334px;

25
vue.config.js

@ -1,29 +1,4 @@
module.exports = {
css: {
loaderOptions: {
postcss: {
plugins: [
require("postcss-px-to-viewport")({
unitToConvert: "px", // 要转化的单位
viewportWidth: 750, // UI设计稿的宽度
unitPrecision: 3, // 转换后的精度,即小数点位数
propList: [
"*"
], // 指定转换的css属性的单位,*代表全部css属性的单位都进行转换
viewportUnit: "vw", // 指定需要转换成的视窗单位,默认vw
fontViewportUnit: "vw", // 指定字体需要转换成的视窗单位,默认vw
landscapeUnit: 'vh', // 横屏时使用的单位
landscapeWidth: 667, // 横屏时使用的视口宽度
selectorBlackList: [], // 指定不转换为视窗单位的类名
minPixelValue: 1, // 默认值1,小于或等于1px则不进行转换
mediaQuery: false, // 是否在媒体查询的css代码中也进行转换,默认false
replace: true, // 是否转换后直接更换属性值
// landscape: false, // 是否处理横屏情况
})
]
}
},
},
lintOnSave: false,
// devServer: {
// proxy: { //配置跨域

Loading…
Cancel
Save