ccsens_tall
/
TALL-MUI-4
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

feat: 登录、日历页小绿点、二级项目列表

test2
xuesinan 4 years ago
parent
68e9189bbf
commit
e676cf07f6
10 changed files with 508 additions and 498 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 12
      App.vue
  2. 1
      CHANGELOG.md
  3. 11
      apis/tall.js
  4. 13
      common/js/config.js
  5. 930
      components/PrettyExchange/PrettyExchange.vue
  6. 13
      components/Projects/ProjectItem.vue
  7. 2
      pages/index/index.vue
  8. 5
      pages/user/login.vue
  9. 2
      store/socket/actions.js
  10. 17
      utils/request.js

12
App.vue
View File

@ -1,6 +1,4 @@
<script> <script>
// import { mapState } from 'vuex';
export default { export default {
// computed: { // computed: {
// ...mapState(['theme']), // ...mapState(['theme']),
@ -19,13 +17,19 @@ export default {
console.log('onLaunch options: ', options); console.log('onLaunch options: ', options);
this.checkNetwork(); // 监听网络状态 this.checkNetwork(); // 监听网络状态
this.getSystemInfo(); // 获取系统设备信息、 this.getSystemInfo(); // 获取系统设备信息、
await this.syncLocalDataToStore(options.query.u); // 将localStorage里的数据同步到store里
const token = await this.getToken(); const token = this.$store.state.user.token || this.$storage.getStorageSync('anyringToken') || '';
if (!token) { if (!token) {
this.$ui.showToast('获取用户信息失败, 请登录'); this.$ui.showToast('获取用户信息失败, 请登录');
// TODO: 跳转登录界面 // TODO: 跳转登录界面
return; return;
} else {
this.$store.commit('user/setToken', token);
} }
// await this.syncLocalDataToStore(options.query.u); // 将localStorage里的数据同步到store里
// token = await this.getToken();
this.noPhone(this.$store.state.user.phone); this.noPhone(this.$store.state.user.phone);
this.$store.dispatch('socket/initSocket'); this.$store.dispatch('socket/initSocket');
}, },

1
CHANGELOG.md
View File

@ -20,6 +20,7 @@
- | 项目列表 | [a52e6d5](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/a52e6d5) - | 项目列表 | [a52e6d5](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/a52e6d5)
- | 项目列表新 | [88cf48d](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/88cf48d) - | 项目列表新 | [88cf48d](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/88cf48d)
- | 账户名密码登录 | [ebf456e](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/ebf456e) - | 账户名密码登录 | [ebf456e](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/ebf456e)
- | 注册、用户协议 | [68e9189](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/68e9189)
- | app.vue | [970cf9a](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/970cf9a) - | app.vue | [970cf9a](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/970cf9a)
- | first commit | [8dc26de](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/8dc26de) - | first commit | [8dc26de](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/8dc26de)
project | 日常任务面板添加 | [b3f16ff](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/b3f16ff) project | 日常任务面板添加 | [b3f16ff](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/b3f16ff)

11
apis/tall.js
View File

@ -1,15 +1,16 @@
import Config from '@/common/js/config.js' import Config from '@/common/js/config.js'
const apiUrl = Config.apiUrl; // const apiUrl = Config.apiUrl;
const tall = `${apiUrl}/tall3/v3.0`; const apiUrl = Config.apiUrlNew;
const tall1 = `http://101.201.226.163/gateway/ptos`; // const tall = `${apiUrl}/tall3/v3.0`;
const tall = `${apiUrl}/ptostall`;
export function setupTall(app) { export function setupTall(app) {
uni.$u.api = { ...uni.$u.api } || {}; uni.$u.api = { ...uni.$u.api } || {};
// 登录 // 登录
uni.$u.api.signin = params => uni.$u.http.post(`${tall}/users/signin`, params); // 登录 uni.$u.api.signin = params => uni.$u.http.post(`${tall}/users/signin`, params);
// 注册 // 注册
uni.$u.api.signup = params => uni.$u.http.post(`${tall}/users/signup`, params); // 登录 // uni.$u.api.signup = params => uni.$u.http.post(`${tall}/users/signup`, params);
// 获取图片验证码 // 获取图片验证码
uni.$u.api.getImageCode = () => uni.$u.get(`${tall}/users/code`); uni.$u.api.getImageCode = () => uni.$u.get(`${tall}/users/code`);
// 获取短信验证码 // 获取短信验证码

13
common/js/config.js
View File

@ -2,14 +2,19 @@ var config = {
baseUrl: 'https://test.tall.wiki', baseUrl: 'https://test.tall.wiki',
apiUrl: 'https://test.tall.wiki/gateway', apiUrl: 'https://test.tall.wiki/gateway',
msgUrl: 'wss://test.tall.wiki/websocket/message/v4.0/ws', msgUrl: 'wss://test.tall.wiki/websocket/message/v4.0/ws',
projectPath: 'https://test.tall.wiki/tall-project', projectPath: 'https://test.tall.wiki/tall-project',
baseUrlNew: 'http://101.201.226.163',
apiUrlNew: 'http://101.201.226.163/gateway',
msgUrlNew: 'wss://101.201.226.163/websocket/message/v4.0/ws',
projectPathNew: 'https://101.201.226.163/tall-project',
// baseUrl: 'https://www.tall.wiki', // baseUrl: 'https://www.tall.wiki',
// apiUrl: 'https://www.tall.wiki/gateway', // apiUrl: 'https://www.tall.wiki/gateway',
// msgUrl: 'wss://www.tall.wiki/websocket/message/v4.0/ws'; // msgUrl: 'wss://www.tall.wiki/websocket/message/v4.0/ws';
// projectPath: 'https://www.tall.wiki/tall-project', // projectPath: 'https://www.tall.wiki/tall-project',
version: 'v4.0.0' version: 'v4.0.0'
}; };
export default config; export default config;

930
components/PrettyExchange/PrettyExchange.vue
View File

@ -1,480 +1,476 @@
<template> <template>
<view> <view>
<scroll-view scroll-y="true"> <scroll-view scroll-y="true">
<view v-if="!data.changeEvent"> <view v-if="!data.changeEvent">
<view :id="'cu-' + index" :key="item.id" class="cu-item flex-col" v-for="(item, index) in data.itemList"> <view :id="'cu-' + index" :key="item.id" class="cu-item flex-col" v-for="(item, index) in data.itemList">
<ProjectItem <ProjectItem class="w-full" :index="index" :item="item" :menuList="data.menuList" @setData="setData"
class="w-full" @openSubProject="openSubProject" />
:index="index" </view>
:item="item" </view>
:menuList="data.menuList"
@setData="setData" <view v-else>
@openSubProject="openSubProject" <view :id="'cu-' + index" :key="index" :style="{ 'background-color': item.color }"
/> @touchend="stops($event, index)" @touchmove.stop.prevent="move" @touchstart="start($event, index)"
</view> class="cu-item flex-col" v-for="(item, index) in data.itemList">
</view> <view class="border-100 bg-blue-500" v-if="item.showTopBorder"></view>
111111111111
<view v-else> <!-- 内容区 -->
<view <!-- 父项目 -->
:id="'cu-' + index" <view class="w-full">
:key="index" <view class="flex items-center justify-between p-3">
:style="{ 'background-color': item.color }" <u-icon class="mover" name="https://www.tall.wiki/staticrec/drag.svg" size="48"></u-icon>
@touchend="stops($event, index)"
@touchmove.stop.prevent="move" <view class="flex-1 px-3">
@touchstart="start($event, index)" <view class="flex items-center mb-1">
class="cu-item flex-col" v-for="(item, index) in data.itemList" <view class="mr-2">{{ item.name }}</view>
> <!-- 状态 TODO:-->
<view class="border-100 bg-blue-500" v-if="item.showTopBorder"></view> <view class="px-2 text-xs text-green-400 bg-green-100 rounded-full flex-shrink-0">进行中</view>
</view>
<!-- 内容区 -->
<!-- 父项目 --> <view class="flex items-center text-xs text-gray-400">
<view class="w-full"> <view class="pr-2">{{ dayjs(+item.startTime).format('MM-DD HH:mm') }}</view>
<view class="flex items-center justify-between p-3"> 至
<u-icon class="mover" name="https://www.tall.wiki/staticrec/drag.svg" size="48"></u-icon> <view class="pl-2">{{ dayjs(+item.endTime).format('MM-DD HH:mm') }}</view>
</view>
<view class="flex-1 px-3"> </view>
<view class="flex items-center mb-1">
<view class="mr-2">{{ item.name }}</view> <!-- 箭头 -->
<!-- 状态 TODO:--> <view v-if="item.sonProjectList && item.sonProjectList.length">
<view class="px-2 text-xs text-green-400 bg-green-100 rounded-full flex-shrink-0">进行中</view> <u-icon @click="openSubProject(item.sonProjectList.length, index)" class="text-gray-400" name="arrow-up"
</view> size="14px" v-if="item.show"></u-icon>
<u-icon @click="openSubProject(item.sonProjectList.length, index)" class="text-gray-400"
<view class="flex items-center text-xs text-gray-400"> name="arrow-down" size="14px" v-else></u-icon>
<view class="pr-2">{{ dayjs(+item.startTime).format('MM-DD HH:mm') }}</view> </view>
至 <u-icon class="text-gray-400" name="arrow-right" size="14px" v-else></u-icon>
<view class="pl-2">{{ dayjs(+item.endTime).format('MM-DD HH:mm') }}</view> </view>
</view> <!-- 父项目 end -->
</view>
<!-- 子项目 -->
<!-- 箭头 --> <view class="ml-8" v-if="item.show">
<view v-if="item.sonProjectList && item.sonProjectList.length"> <view :id="'cu-' + index + '-' + subIndex" :key="subIndex"
<u-icon @click="openSubProject(item.sonProjectList.length, index)" class="text-gray-400" name="arrow-up" size="14px" v-if="item.show"></u-icon> @touchend.stop.prevent="stops($event, index + '-' + subIndex, item.sonProjectList.length)"
<u-icon @click="openSubProject(item.sonProjectList.length, index)" class="text-gray-400" name="arrow-down" size="14px" v-else></u-icon> @touchmove.stop.prevent="move($event, item.sonProjectList.length)"
</view> @touchstart.stop.prevent="start($event, index + '-' + subIndex)" class="cu-item flex-col"
<u-icon class="text-gray-400" name="arrow-right" size="14px" v-else></u-icon> v-for="(subItem, subIndex) in item.sonProjectList">
</view> <view class="flex items-center justify-between p-3 w-full">
<!-- 父项目 end --> <u-icon class="mover" name="https://www.tall.wiki/staticrec/drag.svg" size="48">
</u-icon>
<!-- 子项目 -->
<view class="ml-8" v-if="item.show"> <view class="flex-1 px-3">
<view :id="'cu-' + index + '-' + subIndex" :key="subIndex" <view class="flex items-center">
@touchend.stop.prevent="stops($event, index + '-' + subIndex, item.sonProjectList.length)" <view class="mr-2">{{ subItem.name }}</view>
@touchmove.stop.prevent="move($event, item.sonProjectList.length)" <!-- 状态 -->
@touchstart.stop.prevent="start($event, index + '-' + subIndex)" <view :class="
class="cu-item flex-col" v-for="(subItem, subIndex) in item.sonProjectList"> subItem.status === 0
<view class="flex items-center justify-between p-3 w-full"> ? 'text-blue-400 bg-blue-100'
<u-icon class="mover" name="https://www.tall.wiki/staticrec/drag.svg" size="48"> : subItem.status === 1
</u-icon> ? 'text-green-400 bg-green-100'
: subItem.status === 2
<view class="flex-1 px-3"> ? 'text-red-400 bg-red-100'
<view class="flex items-center">
<view class="mr-2">{{ subItem.name }}</view>
<!-- 状态 -->
<view
:class="
subItem.status === 0
? 'text-blue-400 bg-blue-100'
: subItem.status === 1
? 'text-green-400 bg-green-100'
: subItem.status === 2
? 'text-red-400 bg-red-100'
: 'text-gray-400 bg-gray-100' : 'text-gray-400 bg-gray-100'
" " class="px-2 text-xs text-gray-400 bg-gray-100 rounded-full flex-shrink-0">
class="px-2 text-xs text-gray-400 bg-gray-100 rounded-full flex-shrink-0"> {{ subItem.status === 0 ? '未开始' : subItem.status === 1 ? '进行中' : subItem.status === 2 ? '暂停' : '已完成' }}
{{ subItem.status === 0 ? '未开始' : subItem.status === 1 ? '进行中' : subItem.status === 2 ? '暂停' : '已完成' }} </view>
</view> </view>
</view> </view>
</view>
<!-- 箭头 -->
<!-- 箭头 --> <u-icon class="text-gray-400" name="arrow-right" size="14px"></u-icon>
<u-icon class="text-gray-400" name="arrow-right" size="14px"></u-icon> </view>
</view> </view>
</view> </view>
</view> </view>
</view> <!-- 内容区 end -->
<!-- 内容区 end -->
<view class="border-100 bg-blue-500" v-if="item.showBorder"></view>
<view class="border-100 bg-blue-500" v-if="item.showBorder"></view> <view class="border-80 bg-blue-500" v-if="item.showSubBorder"></view>
<view class="border-80 bg-blue-500" v-if="item.showSubBorder"></view> </view>
</view> </view>
</view> </scroll-view>
</scroll-view>
<!-- 移动悬浮 begin -->
<!-- 移动悬浮 begin --> <view v-if="data.showMoveImage">
<view v-if="data.showMoveImage"> <view :style="{ left: moveLeft + 'px', top: moveTop + 'px' }" class="cu-item absolute">
<view :style="{ left: moveLeft + 'px', top: moveTop + 'px' }" class="cu-item absolute"> <ProjectItem class="w-full" :item="moveItem" />
<ProjectItem class="w-full" :item="moveItem" /> </view>
</view> </view>
</view> <!-- 移动悬浮 end -->
<!-- 移动悬浮 end -->
<!-- 项目操作面板 -->
<!-- 项目操作面板 --> <u-action-sheet :list="data.menuList" :tips="data.tips" @click="chooseAction" v-model="data.showMenu"></u-action-sheet>
<u-action-sheet :list="data.menuList" :tips="data.tips" @click="chooseAction" v-model="data.showMenu"></u-action-sheet> </view>
</view>
</template> </template>
<script setup> <script setup>
import { ref, onMounted, watch, computed } from 'vue'; import { reactive, onMounted, watch, computed } from 'vue';
import ProjectItem from '@/components/Projects/ProjectItem.vue'; import ProjectItem from '@/components/Projects/ProjectItem.vue';
import { useStore } from 'vuex'; import { useStore } from 'vuex';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
const store = useStore(); const store = useStore();
const projects = computed(() => store.state.project.projects); const projects = computed(() => store.state.project.projects);
const data = ref({ const data = reactive({
itemTop: 0, // itemTop: 0,
itemLeft: 0, itemLeft: 0,
itemHeight: 0, // 移动元素的高度 itemHeight: 0, // 移动元素的高度
subItemHeight: 0, // 移动子元素的高度 subItemHeight: 0, // 移动子元素的高度
itemWidth: 0, // 移动元素的宽度 itemWidth: 0, // 移动元素的宽度
showMoveImage: false, showMoveImage: false,
moveItem: '', moveItem: '',
moveLeft: 0, moveLeft: 0,
moveTop: 0, moveTop: 0,
deltaLeft: 0, deltaLeft: 0,
deltaTop: 0, deltaTop: 0,
beginleft: 0, beginleft: 0,
begintop: 0, begintop: 0,
itemList: [], itemList: [], // 项目列表
setSubItem: false, setSubItem: false,
changeEvent: false, changeEvent: false, // 是否点击过操作面板
showMenu: false,
showMenu: false, tips: { text: '', color: '#909399', fontSize: 28, },
tips: { projectId: 0,
text: '', menuList: [{ text: '复制' }, { text: '编辑' }, { text: '删除' }, { text: '置顶' }, { text: '排序' }],
color: '#909399', // show: false,
fontSize: 28, // border: 'border border-blue-500 shadow rounded-md',
}, showBorder: false, // 一级项目底部边框是否显示
projectId: 0, showItemIndex: undefined,
menuList: [{ text: '复制' }, { text: '编辑' }, { text: '删除' }, { text: '置顶' }, { text: '排序' }], });
// show: false,
border: 'border border-blue-500 shadow rounded-md', const emit = defineEmits(['changeHeight']);
showBorder: false,
showItemIndex: undefined, watch(projects, (val) => {
}); data.itemList = val;
data.itemList.forEach(item => {
watch(projects, (val) => { item.showBorder = false; // 一级项目底部边框是否显示
data.value.itemList = val; item.showSubBorder = false; // 一级项目底部边框是否显示
data.value.itemList.forEach(item => { item.showTopBorder = false; // 一级项目顶部边框是否显示
item.showBorder = false; });
item.showSubBorder = false; })
item.showTopBorder = false;
}); onMounted(() => {
}) data.itemList = projects.value;
data.itemList.forEach(item => {
onMounted(() => { item.showBorder = false; // 一级项目底部边框是否显示
data.value.itemList = projects.value; item.showSubBorder = false; // 一级项目底部边框是否显示
data.value.itemList.forEach(item => { item.showTopBorder = false; // 一级项目顶部边框是否显示
item.showBorder = false; });
item.showSubBorder = false; });
item.showTopBorder = false;
}); // 展开子项目
}); function openSubProject(length, index) {
store.commit('project/setProjectItemShow', {
// 展开子项目 index,
function openSubProject(length, index) { show: data.itemList[index].show ? false : true
setProjectItemShow({ index, show: data.value.itemList[index].show ? false : true }); });
if (length && index) { if (length && index) {
this.$emit('changeHeight', length, index); emit('changeHeight', length, index);
}
data.value.showItemIndex = index;
}
// 获取项目列表距离顶部的距离
function getDate() {
const query = uni.createSelectorQuery().in(this);
query.select(`#cu-0`).boundingClientRect(res => {
console.log('data: ', res);
data.value.begintop = res.top;
data.value.beginleft = res.left;
}).exec();
}
function setData(flag, projectId, tips) {
data.value.showMenu = flag;
data.value.projectId = projectId;
data.value.tips = tips;
}
function chooseAction(e) {
let obj = { index: e, projectId: data.value.projectId };
// this.$emit('chooseAction', data);
actionFun(obj);
} }
data.showItemIndex = index;
// 操作 }
function actionFun(obj) {
let action = data.value.menuList[obj.index].text; // 获取项目列表距离顶部的距离
if (action === '排序') { function getDate() {
data.value.changeEvent = true; const query = uni.createSelectorQuery().in(this);
uni.$ui.showToast('请移动进行排序'); query.select(`#cu-0`).boundingClientRect(res => {
} console.log('data: ', res);
data.begintop = res.top;
if (action === '删除') { data.beginleft = res.left;
data.value.changeEvent = false; }).exec();
delProject(obj.projectId); }
}
function setData(flag, projectId, tips) {
if (data.value.showItemIndex !== undefined) { data.showMenu = flag;
setProjectItemShow({ index: data.value.showItemIndex, show: true }); data.projectId = projectId;
} data.tips = tips;
}
function chooseAction(e) {
let obj = {
index: e,
projectId: data.projectId
};
// this.$emit('chooseAction', data);
actionFun(obj);
}
// 操作
function actionFun(obj) {
let action = data.menuList[obj.index].text;
if (action === '排序') {
data.changeEvent = true;
uni.$ui.showToast('请移动进行排序');
} }
function isNumber(val) { if (action === '删除') {
return val === +val; data.changeEvent = false;
} delProject(obj.projectId);
function start(e, index) {
console.log('开始', e);
setTimeout(() => {
getDate();
}, 300);
if (isNumber(index)) {
data.value.setSubItem = false;
const query = uni.createSelectorQuery().in(this);
console.log('2222', query)
query.select(`#cu-${index}`).boundingClientRect(res => {
data.value.moveTop = res.top;
data.value.moveLeft = res.left;
data.value.moveItem = data.value.itemList[index];
data.value.itemWidth = res.width;
data.value.itemHeight = res.height;
}).exec();
} else {
let arr = index.split('-');
data.value.setSubItem = true;
const query = uni.createSelectorQuery().in(this);
query.select(`#cu-${arr[0] - 0}`).boundingClientRect(res => {
data.value.itemHeight = res.height;
}).exec();
query.select(`#cu-${index}`).boundingClientRect(res => {
data.value.moveTop = res.top;
data.value.moveLeft = res.left;
data.value.moveItem = data.value.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
data.value.itemWidth = res.width;
data.value.subItemHeight = res.height;
}).exec();
}
}
function move(e, length) {
console.log('移动');
data.value.showMoveImage = true; //悬浮开始
const touch = e.touches[0];
if (data.value.deltaLeft == 0) {
// 获得本身的移动
data.value.deltaLeft = touch.pageX - data.value.moveLeft;
data.value.deltaTop = touch.pageY - data.value.moveTop;
}
data.value.moveLeft = touch.pageX - data.value.deltaLeft;
data.value.moveTop = touch.pageY - data.value.deltaTop;
let lastIndex = (lastIndex = findOverIndex(touch.pageY, length));
console.log('111111', lastIndex);
// 显示下划线
for (let i = 0; i < data.value.itemList.length; i++) {
if (data.value.moveLeft > 35) {
data.value.itemList[i].showBorder = false;
data.value.itemList[i].showTopBorder = false;
if (i === lastIndex) {
data.value.itemList[i].showSubBorder = true;
} else {
data.value.itemList[i].showSubBorder = false;
}
} else {
if (lastIndex === -1) {
data.value.itemList[0].showTopBorder = true;
data.value.itemList[i].showSubBorder = false;
data.value.itemList[i].showBorder = false;
} else {
data.value.itemList[i].showSubBorder = false;
data.value.itemList[i].showTopBorder = false;
if (i === lastIndex) {
data.value.itemList[i].showBorder = true;
} else {
data.value.itemList[i].showBorder = false;
}
}
}
}
} }
function stops(e, index, length) { if (data.showItemIndex !== undefined) {
console.log('结束'); store.commit('project/setProjectItemShow', {
const touch = e.mp.changedTouches[0]; index: data.showItemIndex,
let lastIndex = (lastIndex = findOverIndex(touch.pageY, length)); show: true
});
// 交换两个值
for (let i = 0; i < data.value.itemList.length; i++) {
// 插入顶部
if (data.value.itemList[i].showTopBorder) {
if (isNumber(index)) {
let Value = data.value.itemList[index];
data.value.itemList.unshift(Value);
data.value.itemList.splice(index + 1, 1);
} else {
let arr = index.split('-');
let Value = data.value.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
data.value.itemList.unshift(Value);
data.value.itemList[arr[0] - 0].sonProjectList.splice([arr[1] - 0], 1);
const options = {
id: Value.id,
parentId: 0,
};
this.$emit('change', options);
}
// 清空
clearSet(i);
this.$emit('change', data.value.itemList);
return;
}
// 插入一级项目
if (data.value.itemList[i].showBorder) {
if (isNumber(index)) {
let Value = data.value.itemList[index];
data.value.itemList.splice(i + 1, 0, Value);
if (i < index) {
data.value.itemList.splice(index + 1, 1);
} else {
data.value.itemList.splice(index, 1);
}
} else {
let arr = index.split('-');
let Value = data.value.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
data.value.itemList.splice(i + 1, 0, Value);
data.value.itemList[arr[0] - 0].sonProjectList.splice([arr[1] - 0], 1);
const options = {
id: Value.id,
parentId: 0,
};
this.$emit('change', options);
}
// 清空
clearSet(i);
this.$emit('change', data.value.itemList);
return;
}
// 插入二级项目
if (data.value.itemList[i].showSubBorder) {
if (isNumber(index)) {
let Value = data.value.itemList[index];
if (data.value.itemList[lastIndex - 1].sonProjectList && data.value.itemList[lastIndex - 1].sonProjectList.length) {
data.value.itemList[lastIndex - 1].sonProjectList.push(Value);
} else {
data.value.itemList[lastIndex].sonProjectList = [Value];
}
data.value.itemList.splice(index, 1);
// 清空
clearSet(i);
const options = {
id: Value.id,
parentId: data.value.itemList[lastIndex - 1].id,
};
this.$emit('change', options);
} else {
let arr = index.split('-');
let Value = data.value.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
if (data.value.itemList[lastIndex].sonProjectList && data.value.itemList[lastIndex].sonProjectList.length) {
data.value.itemList[lastIndex].sonProjectList.push(Value);
} else {
data.value.itemList[lastIndex].sonProjectList = [Value];
}
data.value.itemList[arr[0] - 0].sonProjectList.splice([arr[1] - 0], 1);
// 清空
clearSet(i);
const options = {
id: Value.id,
parentId: data.value.itemList[lastIndex].id,
};
this.$emit('change', options);
const options1 = {
id: Value.id,
parentId: 0,
};
this.$emit('change', options1);
}
return;
}
}
} }
}
// 还原初始数据
function clearSet(i) { function isNumber(val) {
data.value.itemList[i].showBorder = false; return val === +val;
data.value.itemList[i].showSubBorder = false; }
data.value.itemList[i].showTopBorder = false;
data.value.deltaLeft == 0; function start(e, index) {
data.value.showMoveImage = false; console.log('开始', e);
data.value.setSubItem = false; setTimeout(() => {
data.value.changeEvent = false; getDate();
data.value.showItemIndex = undefined; }, 300);
}
if (isNumber(index)) {
// 找到停下的元素的下标 data.setSubItem = false;
function findOverIndex(posY) { const query = uni.createSelectorQuery().in(this);
// 如果有子项目展开着 console.log('2222', query)
let leng = data.value.itemList.length * data.value.itemHeight; // 最后一个元素距离顶部的距离 query.select(`#cu-${index}`).boundingClientRect(res => {
if (posY < data.value.begintop) { data.moveTop = res.top;
return -1; data.moveLeft = res.left;
} data.moveItem = data.itemList[index];
for (var i = 0; i < data.value.itemList.length; i++) { data.itemWidth = res.width;
let begin = data.value.itemHeight * i + data.value.begintop; data.itemHeight = res.height;
let end = data.value.itemHeight * i + data.value.begintop + data.value.itemHeight; }).exec();
if (begin <= posY && end >= posY) { } else {
return i; let arr = index.split('-');
} data.setSubItem = true;
} const query = uni.createSelectorQuery().in(this);
if (posY > leng) { query.select(`#cu-${arr[0] - 0}`).boundingClientRect(res => {
// 交换最后一个 data.itemHeight = res.height;
return data.value.itemList.length - 1; }).exec();
} else if (posY < data.value.begintop) {
return 0; query.select(`#cu-${index}`).boundingClientRect(res => {
} data.moveTop = res.top;
} data.moveLeft = res.left;
data.moveItem = data.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
// 删除项目 data.itemWidth = res.width;
function delProject(id) { data.subItemHeight = res.height;
uni.showModal({ }).exec();
title: '', }
content: '是否删除项目？', }
showCancel: true,
success: async ({ confirm }) => { function move(e, length) {
if (confirm) { console.log('移动');
await this.$u.api.delProject(id); data.showMoveImage = true; //悬浮开始
let flag_index = 0; const touch = e.touches[0];
data.value.itemList.forEach((item, index) => { if (data.deltaLeft == 0) {
if (item.id == id) { // 获得本身的移动
flag_index = index; data.deltaLeft = touch.pageX - data.moveLeft;
} data.deltaTop = touch.pageY - data.moveTop;
}); }
data.moveLeft = touch.pageX - data.deltaLeft;
data.value.itemList.splice(flag_index, 1); data.moveTop = touch.pageY - data.deltaTop;
setProjects(data.value.itemList);
} let lastIndex = (lastIndex = findOverIndex(touch.pageY, length));
}, console.log('111111', lastIndex);
}); // 显示下划线
} for (let i = 0; i < data.itemList.length; i++) {
if (data.moveLeft > 35) {
data.itemList[i].showBorder = false;
data.itemList[i].showTopBorder = false;
if (i === lastIndex) {
data.itemList[i].showSubBorder = true;
} else {
data.itemList[i].showSubBorder = false;
}
} else {
if (lastIndex === -1) {
data.itemList[0].showTopBorder = true;
data.itemList[i].showSubBorder = false;
data.itemList[i].showBorder = false;
} else {
data.itemList[i].showSubBorder = false;
data.itemList[i].showTopBorder = false;
if (i === lastIndex) {
data.itemList[i].showBorder = true;
} else {
data.itemList[i].showBorder = false;
}
}
}
}
}
function stops(e, index, length) {
console.log('结束');
const touch = e.mp.changedTouches[0];
let lastIndex = (lastIndex = findOverIndex(touch.pageY, length));
// 交换两个值
for (let i = 0; i < data.itemList.length; i++) {
// 插入顶部
if (data.itemList[i].showTopBorder) {
if (isNumber(index)) {
let Value = data.itemList[index];
data.itemList.unshift(Value);
data.itemList.splice(index + 1, 1);
} else {
let arr = index.split('-');
let Value = data.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
data.itemList.unshift(Value);
data.itemList[arr[0] - 0].sonProjectList.splice([arr[1] - 0], 1);
const options = {
id: Value.id,
parentId: 0,
};
this.$emit('change', options);
}
// 清空
clearSet(i);
this.$emit('change', data.itemList);
return;
}
// 插入一级项目
if (data.itemList[i].showBorder) {
if (isNumber(index)) {
let Value = data.itemList[index];
data.itemList.splice(i + 1, 0, Value);
if (i < index) {
data.itemList.splice(index + 1, 1);
} else {
data.itemList.splice(index, 1);
}
} else {
let arr = index.split('-');
let Value = data.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
data.itemList.splice(i + 1, 0, Value);
data.itemList[arr[0] - 0].sonProjectList.splice([arr[1] - 0], 1);
const options = {
id: Value.id,
parentId: 0,
};
this.$emit('change', options);
}
// 清空
clearSet(i);
this.$emit('change', data.itemList);
return;
}
// 插入二级项目
if (data.itemList[i].showSubBorder) {
if (isNumber(index)) {
let Value = data.itemList[index];
if (data.itemList[lastIndex - 1].sonProjectList && data.itemList[lastIndex - 1].sonProjectList.length) {
data.itemList[lastIndex - 1].sonProjectList.push(Value);
} else {
data.itemList[lastIndex].sonProjectList = [Value];
}
data.itemList.splice(index, 1);
// 清空
clearSet(i);
const options = {
id: Value.id,
parentId: data.itemList[lastIndex - 1].id,
};
this.$emit('change', options);
} else {
let arr = index.split('-');
let Value = data.itemList[arr[0] - 0].sonProjectList[arr[1] - 0];
if (data.itemList[lastIndex].sonProjectList && data.itemList[lastIndex].sonProjectList.length) {
data.itemList[lastIndex].sonProjectList.push(Value);
} else {
data.itemList[lastIndex].sonProjectList = [Value];
}
data.itemList[arr[0] - 0].sonProjectList.splice([arr[1] - 0], 1);
// 清空
clearSet(i);
const options = {
id: Value.id,
parentId: data.itemList[lastIndex].id,
};
this.$emit('change', options);
const options1 = {
id: Value.id,
parentId: 0,
};
this.$emit('change', options1);
}
return;
}
}
}
// 还原初始数据
function clearSet(i) {
data.itemList[i].showBorder = false;
data.itemList[i].showSubBorder = false;
data.itemList[i].showTopBorder = false;
data.deltaLeft == 0;
data.showMoveImage = false;
data.setSubItem = false;
data.changeEvent = false;
data.showItemIndex = undefined;
}
// 找到停下的元素的下标
function findOverIndex(posY) {
// 如果有子项目展开着
let leng = data.itemList.length * data.itemHeight; // 最后一个元素距离顶部的距离
if (posY < data.begintop) {
return -1;
}
for (var i = 0; i < data.itemList.length; i++) {
let begin = data.itemHeight * i + data.begintop;
let end = data.itemHeight * i + data.begintop + data.itemHeight;
if (begin <= posY && end >= posY) {
return i;
}
}
if (posY > leng) {
// 交换最后一个
return data.itemList.length - 1;
} else if (posY < data.begintop) {
return 0;
}
}
// 删除项目
function delProject(id) {
uni.showModal({
title: '',
content: '是否删除项目？',
showCancel: true,
success: async ({
confirm
}) => {
if (confirm) {
await this.$u.api.delProject(id);
let flag_index = 0;
data.itemList.forEach((item, index) => {
if (item.id == id) {
flag_index = index;
}
});
data.itemList.splice(flag_index, 1);
store.commit('project/setProjects', data.itemList);
}
},
});
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.cu-item { .cu-item {
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 14px; font-size: 14px;
} }
.border-100 { .border-100 {
width: 92%; width: 92%;
height: 4rpx; height: 4rpx;
} }
.border-80 { .border-80 {
width: 84%; width: 84%;
height: 2px; height: 2px;
margin-left: 30px; margin-left: 30px;
} }
</style> </style>

13
components/Projects/ProjectItem.vue
View File

@ -20,8 +20,8 @@
<!-- 箭头 --> <!-- 箭头 -->
<view v-if="item.sonProjectList && item.sonProjectList.length"> <view v-if="item.sonProjectList && item.sonProjectList.length">
<u-icon @click="$emit('openSubProject', item.sonProjectList.length, index)" class="text-gray-400" name="arrow-up" size="14px" v-if="item.show"></u-icon> <u-icon @click="emit('openSubProject', item.sonProjectList.length, index)" class="text-gray-400" name="arrow-up" size="14px" v-if="item.show"></u-icon>
<u-icon @click="$emit('openSubProject', item.sonProjectList.length, index)" class="text-gray-400" name="arrow-down" size="14px" v-else></u-icon> <u-icon @click="emit('openSubProject', item.sonProjectList.length, index)" class="text-gray-400" name="arrow-down" size="14px" v-else></u-icon>
</view> </view>
<u-icon @click="openProject(item)" class="text-gray-400" name="arrow-right" size="14px" v-else></u-icon> <u-icon @click="openProject(item)" class="text-gray-400" name="arrow-right" size="14px" v-else></u-icon>
</view> </view>
@ -63,7 +63,7 @@
</template> </template>
<script setup> <script setup>
import { ref, computed } from 'vue'; import { reactive, computed } from 'vue';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import { useStore } from 'vuex'; import { useStore } from 'vuex';
import config from '@/common/js/config.js'; import config from '@/common/js/config.js';
@ -82,12 +82,12 @@ defineProps({
// default: () => [], // default: () => [],
// }, // },
}); });
const emit = defineEmits(['setData']); const emit = defineEmits(['setData', 'openSubProject']);
const store = useStore(); const store = useStore();
const userId = computed(() => store.getters['user/userId']); const userId = computed(() => store.getters['user/userId']);
const data = ref({ const data = reactive({
showMenu: false, showMenu: false,
tips: { tips: {
text: '', text: '',
@ -102,7 +102,7 @@ const data = ref({
// 打开项目详情 // 打开项目详情
function openProject(project) { function openProject(project) {
const gateway = config.apiUrl; const gateway = config.apiUrlNew;
const url = `${gateway}/defaultwbs`; const url = `${gateway}/defaultwbs`;
const { name, id } = project; const { name, id } = project;
uni.navigateTo({ url: `/pages/project/project?u=${userId.value}&p=${id}&pname=${name}&url=${encodeURIComponent(url)}` }); uni.navigateTo({ url: `/pages/project/project?u=${userId.value}&p=${id}&pname=${name}&url=${encodeURIComponent(url)}` });
@ -117,7 +117,6 @@ function openMenu(project) {
data.tips.text = project.name; data.tips.text = project.name;
emit('setData', data.showMenu, data.projectId, data.tips); emit('setData', data.showMenu, data.projectId, data.tips);
// this.$emit('setData', data.showMenu, data.projectId, data.tips);
} }
</script> </script>

2
pages/index/index.vue
View File

@ -108,7 +108,7 @@ function onMove(event) {
} }
function toLogin() { function toLogin() {
uni.navigateTo({ url: '/pages/user/accountLogin' }) uni.navigateTo({ url: '/pages/user/login' })
} }
</script> </script>

5
pages/user/login.vue
View File

@ -68,9 +68,7 @@
// 表单验证 // 表单验证
const submitLogin = () => { const submitLogin = () => {
console.log('111111')
phoneLoginForm.value.validate(valid => { phoneLoginForm.value.validate(valid => {
console.log('2222', valid)
if (valid) { if (valid) {
login() login()
} }
@ -100,6 +98,7 @@
}); });
let res = await uni.$u.api.signin(params); let res = await uni.$u.api.signin(params);
console.log(res, '----------')
store.commit('user/setToken', res.token); store.commit('user/setToken', res.token);
store.commit('user/setUser', res); store.commit('user/setUser', res);
uni.$storage.setStorageSync('anyringToken', res.token || ''); uni.$storage.setStorageSync('anyringToken', res.token || '');
@ -112,7 +111,7 @@
}); });
} catch (error) { } catch (error) {
uni.$ui.hideLoading(); uni.$ui.hideLoading();
uni.$ui.showToast(error); uni.$ui.showToast(error.msg);
} }
} }

2
store/socket/actions.js
View File

@ -202,7 +202,7 @@ const actions = {
dispatch('sendHeart'); dispatch('sendHeart');
} else { } else {
uni.$u.toast('消息系统认证失败, 请退出重新登录'); uni.$u.toast('消息系统认证失败, 请退出重新登录');
uni.$t.removeStorageSync('anyringToken'); uni.$storage.removeStorageSync('anyringToken');
commit('setSocket', null); commit('setSocket', null);
} }
}, },

17
utils/request.js
View File

@ -14,23 +14,28 @@ export function setupHttp(app) {
'content-type': 'application/json;charset=UTF-8' 'content-type': 'application/json;charset=UTF-8'
}, },
}); });
// 请求拦截部分，如配置，每次请求前都会执行 // 请求拦截部分，如配置，每次请求前都会执行
app.config.globalProperties.$u.http.interceptor.request = config => { app.config.globalProperties.$u.http.interceptor.request = config => {
const token = store.state.user.token || storage.getStorageSync('anyringToken'); const token = store.state.user.token || storage.getStorageSync('anyringToken');
if (token) { if (token) {
config.header.Authorization = `Bearer ${token}`; config.header.Authorization = `Bearer ${token}`;
} }
return config; return config;
}; };
// 响应拦截，如配置，每次请求结束都会执行本方法 // 响应拦截，如配置，每次请求结束都会执行本方法
app.config.globalProperties.$u.http.interceptor.response = res => { app.config.globalProperties.$u.http.interceptor.response = res => {
if (res.code === 200) { if (res.code === 200) {
// res为服务端返回值，可能有code，result等字段 // res为服务端返回值，可能有code，result等字段
// 这里对res.result进行返回，将会在this.$u.post(url).then(res => {})的then回调中的res的到 // 这里对res.result进行返回，将会在this.$u.post(url).then(res => {})的then回调中的res的到
// 如果配置了originalData为true，请留意这里的返回值 // 如果配置了originalData为true，请留意这里的返回值
if (res.tokenObj.token) {
storage.setStorageSync('anyringToken', res.tokenObj.token || '');
store.commit('user/setToken', res.tokenObj.token);
}
return res.data; return res.data;
} else if (res.code === 401) { } else if (res.code === 401) {
// 假设201为token失效，这里跳转登录 // 假设201为token失效，这里跳转登录
@ -48,7 +53,7 @@ export function setupHttp(app) {
return false; return false;
} }
}; };
app.config.globalProperties.$u.post = (url, param = {}, header = {}) => { app.config.globalProperties.$u.post = (url, param = {}, header = {}) => {
return app.config.globalProperties.$u.http.request({ return app.config.globalProperties.$u.http.request({
url, url,
@ -59,4 +64,4 @@ export function setupHttp(app) {
}, },
}); });
}; };
} }

Write Preview
Loading…
Cancel
Save