28 changed files with 717 additions and 455 deletions
@ -1,9 +1,11 @@ |
|||
const apiUrl = process.env.VUE_APP_API_URL; |
|||
const mock = `${apiUrl}/defaultwbs`; |
|||
const plugin = `${apiUrl}/pluginshop/plugin`; |
|||
|
|||
const install = (Vue, vm) => { |
|||
vm.$u.api = { ...vm.$u.api } || {}; |
|||
vm.$u.api.getPlugin = param => vm.$u.post(`${mock}/plugin`, { param }); |
|||
vm.$u.api.getPlugin = param => vm.$u.post(`${mock}/plugin`, param); |
|||
vm.$u.api.getOtherPlugin = param => vm.$u.post(`${plugin}/query`, param); |
|||
}; |
|||
|
|||
export default { install }; |
|||
|
|||
@ -1,25 +0,0 @@ |
|||
@font-face { |
|||
font-family: 'custom-icon'; /* Project id 2685595 */ |
|||
src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAVsAAsAAAAACgAAAAUfAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDHAqGfIV2ATYCJAMQCwoABCAFhQsHURurCMiuMYUxPrWYbZJ11AENNuDWinu9B3343wTPy36/c+WrJmkq4NUbnswqIdo6oyVCh0pjZM3kN/Sb+9vabmY0s5OZwYtCdsO5QNnpi6ia8CLyL4qgGGt7b54+glfxrBKtmXWGqFaCp0B7SiATEr1ANPXvGzvOkmQsS994MvzlXijX3tRv70+uPsD5P2a6+rgS+DYAiUqMLBrYLNryeeZlUwrdgcsp3zK86iB34z4IiBvJJR7XVDYCxyMKmYEvKb1YEAXLkZ6hgJKT8gqiiArC0K2pSryAEPRW3AB48n5e/iSGEiqUpF9oa4fQglNvlF+/krv/O0w+Mra/NDxdQQgY6M1MLnvV2nOSwNYjES+ySM0BlCVK0Wvbz9vn/6foq+JGjX95YJRAMnRukoAZju0YzSLB8HWdBMXXc/oJcJ3MjoIIpAsgJwhUvkUYmwyUFcbgMUNP8NZs7bxRHjnzp3oxW69OvXx796hdkdpN5y5Ebxkdwyy0i/vNo9wbK1Xk1tF54gvn5PfeNWr37ctTr8YwJ4XR/NAFC9xLZaNP2FbujgGf9ZwyD3DnQc33oheKon7aLHNKrdlOcW+0bV5gW7ibN8+jySFrJfPtigKKzb6vTcXsU1BaIFpe6HwCu/HkmhO2hddjq6Os03jJqjnAq0/wSUKsCLT6KWyVajV+esn9acKTJM832i45UpN9vEPRUT/rJt1Vl7sTtltjd1k1fPmx0O7qFsi9o/lcd+Piclq/x9+580euFfJOCmlCHm/aHdDEN/PVN2zf9aPirdu0KH7P0SfDgoYGPQFri6pmqOdydenxe+I+WE4sH5ScnFTZJ+RLfZZHvhxl+quLBcFV4bqiUqj8l3pCPinq2zdJobhZQax0/jn2f2PJLqEkFUKCDGdd67Hz6D/QX4mH+54XSbEkO1wwcsrateiYAnm2zJj4XzyIP9iZJnPb2yQxR7jJ0iyxJGZOZNQb5edFksqISkmx1C8hrsyzYxI92fKrJEUZRVVE8EfIvDkhSo+Dj/vvmGKPBEm+ISJUYzGXqGI63CfMLYviAmXcHlXBldMNmsSZESsm7p81fsPwjGLxrMnDPa52Cvf9K/u+bBkq9nogPMTf6hWWem4in+r5+O+msp5NnqCxc74uZw8BPnaYGyL7iGpFM6qiCGYIzm4BL6ccX5slzxpOHy1i2UhUcchS+VJUpKlS3BzxfVT8lW8BEVPoJtfHVEeU/vg2X8xlNFB4xED/XyMHq8EtAARbEjtvdvYsqQWCpGk26h+cxt/IEQ39nbL/c1x/46efq5IwYTz+IRqY+sd54MMBnGyKATz1lKgWBcCVmPYRGLYoiBsK+MVckPekD2HhPTpEQiGCKqIGTUId6WCEDIFlZBiswbiuOkpvs4eRkFQeNMzEUJTthyrtDZqy+0gHXxEhbMiQYeAH4w4i4biERkws4iCFoBZrGYzpadasM6MQ3WlBrAnXOtdDptNIcUJ6aG6GnEWPS7EEdXyBswSaIdfdCksXk4iQDtNxrAnT9HsxaDSyWDvHtkEaqVsRas+Mi9MVvYmaZk2gCAeiIJAWpsVgGD0ay0znHEJonSwQlgle8XvqQYxORhSuOo8CSzOI47h6MhhMArV4GLKEa4ZmneEqiy6MRAiig1lcrp0eo5mzGjIaNhamvXhSG4iGqLW2sLTLFEcK6aBc9bh80wWvAeL0m3okIhmpSIuvI0TRrSZoRvYm1gwH06zRuOFr7IrwlkFGnIPazkEAAAA=') |
|||
format('woff2'); |
|||
} |
|||
|
|||
.custom-icon { |
|||
font-family: 'custom-icon' !important; |
|||
font-size: 16px; |
|||
font-style: normal; |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
} |
|||
|
|||
.custom-icon-attachment:before { |
|||
content: '\e7e1'; |
|||
} |
|||
|
|||
.custom-icon-moneycollect:before { |
|||
content: '\e7cd'; |
|||
} |
|||
|
|||
.custom-icon-C-bxl-redux:before { |
|||
content: '\e608'; |
|||
} |
|||
File diff suppressed because one or more lines are too long
Binary file not shown.
@ -1,224 +0,0 @@ |
|||
<template> |
|||
<view> |
|||
<view class="home-box u-skeleton"> |
|||
<scroll-view :enable-flex="true" :scroll-left="scrollLeft" :throttle="false" scroll-with-animation scroll-x> |
|||
<view class="tab-box"> |
|||
<view :key="index" @click="changeIndex(item.id, index)" class="tab-item" v-for="(item, index) in roles"> |
|||
<view :class="setColor(item.mine, item.id)" class="tab-children u-skeleton-fillet">{{ item.name }}</view> |
|||
</view> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
<u-skeleton :animation="true" :loading="loading" bg-color="#fff"></u-skeleton> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState, mapMutations, mapActions } from 'vuex'; |
|||
|
|||
export default { |
|||
name: 'RoleList', |
|||
data() { |
|||
return { |
|||
tabIndex: 0, //当前访问的 index 默认为0 |
|||
tabList: [], //tab dom节点集合 |
|||
scrollLeft: 0, //scrollview需要滚动的距离 |
|||
loading: false, // 是否显示骨架屏组件 |
|||
roles: [ |
|||
{ |
|||
id: 1, |
|||
name: '项目经理', |
|||
mine: 0, |
|||
pm: 1, |
|||
sequence: 1, |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '运维', |
|||
mine: 0, |
|||
pm: 0, |
|||
sequence: 2, |
|||
}, |
|||
], |
|||
}; |
|||
}, |
|||
|
|||
computed: { ...mapState('home', ['visibleRoles', 'roleId', 'tasks']) }, |
|||
|
|||
watch: { |
|||
visibleRoles(val) { |
|||
if (val && val.length) { |
|||
this.roles = [...this.visibleRoles]; |
|||
this.loading = false; |
|||
} |
|||
}, |
|||
}, |
|||
|
|||
mounted() { |
|||
if (!this.visibleRoles || !this.visibleRoles.length) { |
|||
this.loading = true; |
|||
} |
|||
}, |
|||
|
|||
methods: { |
|||
...mapMutations('home', ['setRoleId']), |
|||
...mapActions('home', ['handleRegularTask']), |
|||
|
|||
setCurrentRole(index) { |
|||
const data = document.getElementsByClassName('tab-children'); |
|||
// 获取当前所有子元素 并插入到 tabList 列表中 |
|||
data.forEach(item => { |
|||
this.tabList.push({ |
|||
width: item.clientWidth, |
|||
left: item.offsetLeft, |
|||
}); |
|||
}); |
|||
//当前滚动的位置 |
|||
let left = 0; |
|||
let screenWidth = window.screen.width; |
|||
for (let i = 0; i < index; i++) { |
|||
left += this.tabList[i].width + this.tabList[i].left * 2; |
|||
} |
|||
left += this.tabList[index].width; |
|||
this.scrollLeft = left - screenWidth / 2; |
|||
}, |
|||
|
|||
async changeIndex(id, index) { |
|||
this.setRoleId(id); |
|||
//改变index 即手动点击切换 我在此时将当前元素赋值给左边距 实现自动滚动 |
|||
this.setCurrentRole(index); |
|||
// 根据时间基准点和角色查找定期任务 |
|||
await this.$emit('getTasks', { queryType: 0 }); |
|||
await this.$emit('getTasks', { queryType: 1 }); |
|||
console.log('this.tasks && this.tasks.length: ', this.tasks && this.tasks.length); |
|||
if (this.tasks && this.tasks.length) { |
|||
// 查上下的任务 |
|||
const upQuery = { |
|||
timeNode: +this.tasks[0].planStart, |
|||
queryType: 0, |
|||
queryNum: 6, |
|||
}; |
|||
console.log('upQuery: ', upQuery); |
|||
await this.$emit('getTasks', upQuery); |
|||
const downQuery = { |
|||
timeNode: +this.tasks[this.tasks.length - 1].planStart, |
|||
queryType: 0, |
|||
queryNum: 6, |
|||
}; |
|||
console.log('downQuery: ', downQuery); |
|||
await this.$emit('getTasks', downQuery); |
|||
} |
|||
}, |
|||
|
|||
// 设置文字颜色 |
|||
setColor(mine, id) { |
|||
const { roleId } = this; |
|||
if (mine === '1' && roleId === id) { |
|||
return 'default-tab-choice'; |
|||
} |
|||
if (mine === '1' && roleId !== id) { |
|||
return 'default-tab-item'; |
|||
} |
|||
if (mine === '0' && roleId === id) { |
|||
return 'tab-choice'; |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.home-box { |
|||
// 对此盒子进行 sticky 粘性定位 |
|||
position: sticky; |
|||
top: 0; |
|||
background: #fff; // 设置背景 否则会透明 |
|||
|
|||
/* #ifdef H5 */ |
|||
//粘性定位 在h5下 加 原生头部高度 44px |
|||
top: 88rpx; |
|||
/* #endif */ |
|||
|
|||
.tab-box { |
|||
position: relative; |
|||
white-space: nowrap; |
|||
// height: 84rpx; |
|||
|
|||
.tab-item { |
|||
// width: 20%; |
|||
// height: 84rpx; |
|||
padding: 20rpx 24rpx; |
|||
position: relative; |
|||
display: inline-block; |
|||
text-align: center; |
|||
font-size: 30rpx; |
|||
transition-property: background-color, width; |
|||
} |
|||
|
|||
.default-tab-item { |
|||
color: $roleChoiceColor; |
|||
} |
|||
|
|||
.default-tab-choice { |
|||
//当前选中 基于此类名给与底部选中框 |
|||
position: relative; |
|||
color: $roleChoiceColor; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
.default-tab-choice:before { |
|||
content: ''; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: -20rpx; |
|||
width: 100%; |
|||
height: 6rpx; |
|||
border-radius: 2rpx; |
|||
background: $roleChoiceColor; |
|||
} |
|||
|
|||
.tab-choice { |
|||
//当前选中 基于此类名给与底部选中框 |
|||
position: relative; |
|||
color: $uni-color-primary; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
.tab-choice:before { |
|||
content: ''; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: -20rpx; |
|||
width: 100%; |
|||
height: 6rpx; |
|||
border-radius: 2rpx; |
|||
background: $uni-color-primary; |
|||
} |
|||
} |
|||
} |
|||
|
|||
// // 删除 底部滚动条 |
|||
/* #ifndef APP-NVUE */ |
|||
::-webkit-scrollbar, |
|||
::-webkit-scrollbar, |
|||
::-webkit-scrollbar { |
|||
display: none; |
|||
width: 0 !important; |
|||
height: 0 !important; |
|||
-webkit-appearance: none; |
|||
background: transparent; |
|||
} |
|||
|
|||
/* #endif */ |
|||
/* #ifdef H5 */ |
|||
// 通过样式穿透，隐藏H5下，scroll-view下的滚动条 |
|||
scroll-view ::v-deep ::-webkit-scrollbar { |
|||
display: none; |
|||
} |
|||
|
|||
/* #endif */ |
|||
|
|||
.skeleton { |
|||
height: 44rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,17 @@ |
|||
export default { |
|||
timeUnits: [ |
|||
// 时间颗粒度
|
|||
{ id: 0, value: '毫秒' }, |
|||
{ id: 1, value: '秒' }, |
|||
{ id: 2, value: '分' }, |
|||
{ id: 3, value: '时' }, |
|||
{ id: 4, value: '天' }, |
|||
{ id: 5, value: '周' }, |
|||
{ id: 6, value: '月' }, |
|||
{ id: 7, value: '季度' }, |
|||
{ id: 8, value: '年' }, |
|||
{ id: 9, value: '年代' }, |
|||
{ id: 10, value: '世纪' }, |
|||
{ id: 11, value: '千年' }, |
|||
], |
|||
}; |
|||
@ -0,0 +1,56 @@ |
|||
export default { |
|||
/** |
|||
* 显示toast |
|||
* @param {string} title 提示内容 |
|||
* @param {number} duration 显示时间 默认2000 |
|||
*/ |
|||
showToast(title, duration = 2000) { |
|||
return uni.showToast({ |
|||
title, |
|||
icon: 'none', |
|||
duration, |
|||
mask: true, |
|||
}); |
|||
}, |
|||
|
|||
// 隐藏toast
|
|||
hideToast() { |
|||
return uni.hideToast(); |
|||
}, |
|||
|
|||
/** |
|||
* 显示加载雪花 |
|||
* @param {string} title |
|||
*/ |
|||
showLoading(title) { |
|||
return uni.showLoading({ |
|||
title, |
|||
mask: true, |
|||
}); |
|||
}, |
|||
|
|||
// 隐藏loading
|
|||
hideLoading() { |
|||
return uni.hideLoading(); |
|||
}, |
|||
|
|||
/** |
|||
* 显示modal弹出框 |
|||
* @param {string} title 标题 |
|||
* @param {string} content 内容 |
|||
* @param {boolean} showCancel 是否显示取消按钮 默认true |
|||
*/ |
|||
showModal(title, content, showCancel = true) { |
|||
return new Promise(function (resolve, reject) { |
|||
uni.showModal({ |
|||
title, |
|||
content, |
|||
showCancel, |
|||
success: ({ confirm, cancel }) => { |
|||
confirm && resolve(); |
|||
cancel && reject(); |
|||
}, |
|||
}); |
|||
}); |
|||
}, |
|||
}; |
|||
Loading…
Reference in new issue