forked from pnhq5agf9/poetize
haitao
2 years ago
parent
703adbd2fb
commit
de2cd6dc46
@ -0,0 +1,8 @@
|
||||
# Default ignored files
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# Datasource local storage ignored files
|
||||
/dataSources/
|
||||
/dataSources.local.xml
|
||||
# Editor-based HTTP Client requests
|
||||
/httpRequests/
|
||||
@ -0,0 +1,6 @@
|
||||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
|
||||
</profile>
|
||||
</component>
|
||||
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="JavaScriptSettings">
|
||||
<option name="languageLevel" value="ES6" />
|
||||
</component>
|
||||
</project>
|
||||
@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/poetize.iml" filepath="$PROJECT_DIR$/.idea/poetize.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
@ -0,0 +1,9 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="JAVA_MODULE" version="4">
|
||||
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$" />
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
@ -0,0 +1,3 @@
|
||||
> 1%
|
||||
last 2 versions
|
||||
not dead
|
||||
@ -0,0 +1,5 @@
|
||||
[*.{js,jsx,ts,tsx,vue}]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
@ -0,0 +1,17 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
extends: [
|
||||
'plugin:vue/vue3-essential',
|
||||
'@vue/standard'
|
||||
],
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
},
|
||||
rules: {
|
||||
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
]
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,38 @@
|
||||
{
|
||||
"name": "poetry-im-ui",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "set NODE_OPTIONS=--openssl-legacy-provider & vue-cli-service serve",
|
||||
"build": "set NODE_OPTIONS=--openssl-legacy-provider & vue-cli-service build",
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.27.2",
|
||||
"core-js": "^3.6.5",
|
||||
"crypto-js": "^4.1.1",
|
||||
"element-plus": "^2.2.10",
|
||||
"qs": "^6.10.3",
|
||||
"reconnecting-websocket": "^4.4.0",
|
||||
"vue": "^3.0.0",
|
||||
"vue-router": "^4.0.0-0",
|
||||
"vuex": "^4.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.5.13",
|
||||
"@vue/cli-plugin-eslint": "~4.5.13",
|
||||
"@vue/cli-plugin-router": "~4.5.13",
|
||||
"@vue/cli-service": "~4.5.13",
|
||||
"@vue/compiler-sfc": "^3.0.0",
|
||||
"@vue/eslint-config-standard": "^5.1.2",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"eslint": "^6.7.2",
|
||||
"eslint-plugin-import": "^2.20.2",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-promise": "^4.2.1",
|
||||
"eslint-plugin-standard": "^4.0.0",
|
||||
"eslint-plugin-vue": "^7.0.0",
|
||||
"naive-ui": "^2.28.4",
|
||||
"vfonts": "^0.0.3"
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<link rel="icon" href="./poetize-im.jpg" sizes="16x16">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<title>POETIZE-IM</title>
|
||||
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/qiniu-js/3.4.0/qiniu.min.js"></script>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<n-config-provider :theme="null" :locale="zhCN" :date-locale="dateZhCN">
|
||||
<n-dialog-provider>
|
||||
<router-view/>
|
||||
</n-dialog-provider>
|
||||
</n-config-provider>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {NConfigProvider, NDialogProvider, zhCN, dateZhCN, darkTheme} from 'naive-ui';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
NConfigProvider,
|
||||
NDialogProvider
|
||||
},
|
||||
setup() {
|
||||
return {
|
||||
darkTheme,
|
||||
zhCN,
|
||||
dateZhCN
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,161 @@
|
||||
/* 以my-animation-开头的class */
|
||||
[class*=my-animation-] {
|
||||
animation-duration: 1s;
|
||||
animation-timing-function: ease-out;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
|
||||
.my-animation-slide-top {
|
||||
animation-name: slide-top
|
||||
}
|
||||
|
||||
.my-animation-slide-bottom {
|
||||
animation-name: slide-bottom
|
||||
}
|
||||
|
||||
.my-animation-hideToShow {
|
||||
animation-name: hideToShow
|
||||
}
|
||||
|
||||
|
||||
/* 上移 */
|
||||
@keyframes slide-top {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-20%)
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0)
|
||||
}
|
||||
}
|
||||
|
||||
/* 下移 */
|
||||
@keyframes slide-bottom {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20%)
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0)
|
||||
}
|
||||
}
|
||||
|
||||
/* 首图动画：下移 */
|
||||
@keyframes header-effect {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-50px);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* 旋转 */
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* 显示 */
|
||||
@keyframes hideToShow {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* 下移 */
|
||||
@keyframes my-shake {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
}
|
||||
|
||||
30% {
|
||||
opacity: 0.5;
|
||||
transform: translateY(25px);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
|
||||
/* 上移 */
|
||||
@keyframes scatter {
|
||||
0% {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
50% {
|
||||
top: -15px;
|
||||
}
|
||||
|
||||
100% {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* 放大 */
|
||||
@keyframes scale {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
/* 背景位置移动 */
|
||||
@keyframes gradientBG {
|
||||
0% {
|
||||
background-position: 0 50%;
|
||||
}
|
||||
|
||||
50% {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
|
||||
100% {
|
||||
background-position: 0 50%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 阴影变化 */
|
||||
@keyframes weiYanShadowFlashing {
|
||||
0% {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
50% {
|
||||
box-shadow: 0 0 20px var(--red);
|
||||
}
|
||||
|
||||
100% {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,78 @@
|
||||
:root {
|
||||
/* 背景 */
|
||||
--background: white;
|
||||
--gradualBackground: linear-gradient(to right bottom, #ee7752, #e73c7e, #23a6d5, #23d5ab);
|
||||
--gradualBlue: linear-gradient(to right, #23a6d5, #23d5ab);
|
||||
|
||||
/* 字体 */
|
||||
--fontColor: black;
|
||||
/* 边框 */
|
||||
--borderColor: rgba(0, 0, 0, 0.5);
|
||||
/* 边框 */
|
||||
--borderHoverColor: rgba(110, 110, 110, 0.4);
|
||||
|
||||
/* 主题背景 */
|
||||
--themeBackground: orange;
|
||||
/* 主题悬停背景 */
|
||||
--gradualRed: linear-gradient(to right, #ff4b2b, #ff416c);
|
||||
|
||||
/* 水波纹 */
|
||||
--rippleColor: rgba(0, 0, 0, 0.5);
|
||||
/* 导航栏字体 */
|
||||
--toolbarFont: #333333;
|
||||
/* 导航栏背景 */
|
||||
--toolbarBackground: rgba(255, 255, 255, 1);
|
||||
/* 灰色字体 */
|
||||
--greyFont: #797979;
|
||||
--maxGreyFont: #595A5A;
|
||||
--commentContent: #F7F9FE;
|
||||
/* footer背景 */
|
||||
--gradientBG: linear-gradient(-90deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
|
||||
/* 透明 */
|
||||
--transparent: rgba(0, 0, 0, 0);
|
||||
/* 黑色遮罩 */
|
||||
--mask: rgba(0, 0, 0, 0.3);
|
||||
/* 白色遮罩 */
|
||||
--whiteMask: rgba(255, 255, 255, 0.3);
|
||||
/* max白色遮罩 */
|
||||
--maxWhiteMask: rgba(255, 255, 255, 0.5);
|
||||
/* mini黑色遮罩 */
|
||||
--miniMask: rgba(0, 0, 0, 0.15);
|
||||
/* mini白色遮罩 */
|
||||
--miniWhiteMask: rgba(255, 255, 255, 0.15);
|
||||
/* 半透明 */
|
||||
--translucent: rgba(0, 0, 0, 0.5);
|
||||
/* max黑色遮罩 */
|
||||
--maxMask: rgba(0, 0, 0, 0.7);
|
||||
|
||||
--white: white;
|
||||
--maxWhite: #fcfcfc;
|
||||
--midWhite: #f3f3f3;
|
||||
|
||||
--red: red;
|
||||
--lightRed: #ff4b2b;
|
||||
--maxLightRed: #ff416c;
|
||||
--orangeRed: #EF794F;
|
||||
|
||||
--azure: #ECF7FE;
|
||||
--blue: rgb(3, 169, 244);
|
||||
--messageColor: #cfe7ff;
|
||||
|
||||
--imBG: #edeff3;
|
||||
|
||||
--lowGray: #cacacb;
|
||||
--lightGray: #DDDDDD;
|
||||
--maxLightGray: #EEEEEE;
|
||||
--maxMaxLightGray: rgba(242, 242, 242, 0.5);
|
||||
|
||||
--green: #67C23A;
|
||||
--black: black;
|
||||
--lightYellow: #F4E1C0;
|
||||
|
||||
--globalFont: SmileySans;
|
||||
|
||||
--imBackground: url(../file/bg1.jpg);
|
||||
|
||||
--commentURL: url(../file/comment.jpg);
|
||||
--toTop: url(../file/top.jpg);
|
||||
}
|
||||
@ -0,0 +1,87 @@
|
||||
body {
|
||||
color: var(--fontColor);
|
||||
font-family: var(--globalFont), serif;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: SmileySans;
|
||||
src: url(../fonts/SmileySans.otf);
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
/* 居中 */
|
||||
.myCenter {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.transformCenter {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
/* 两边 */
|
||||
.myBetween {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 滚动条 */
|
||||
.group-card ::-webkit-scrollbar {
|
||||
|
||||
}
|
||||
|
||||
.image-list::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* el弹出框样式 */
|
||||
.el-message {
|
||||
top: 80px !important;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.el-message * {
|
||||
color: var(--white) !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.el-message--success {
|
||||
background: var(--themeBackground);
|
||||
}
|
||||
|
||||
.el-message--warning {
|
||||
background: var(--gradientBG);
|
||||
}
|
||||
|
||||
.el-message--error {
|
||||
background: var(--gradualRed);
|
||||
}
|
||||
|
||||
.message img {
|
||||
max-width: 250px !important;
|
||||
}
|
||||
|
||||
.v-x-scroll {
|
||||
overflow: unset;
|
||||
}
|
||||
|
||||
.n-base-icon.n-dialog__icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 400px) {
|
||||
.emoji-body {
|
||||
max-width: 230px !important;
|
||||
}
|
||||
|
||||
.n-modal {
|
||||
width: 70% !important;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<div>
|
||||
<transition name="body">
|
||||
<div v-show="showEmoji" class="emoji-body">
|
||||
<span class="emoji-item"
|
||||
v-for="(value, key, index) in emojiListURL"
|
||||
:key="index"
|
||||
@click="addEmoji(key)">
|
||||
<img class="emoji" :src="value" :title="key" width="30" height="30"/>
|
||||
</span>
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
showEmoji: {
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
emojiList: this.$constant.emojiList,
|
||||
emojiListURL: {}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.emojiListURL = this.getEmojiList(this.emojiList);
|
||||
},
|
||||
methods: {
|
||||
addEmoji(key) {
|
||||
this.$emit("addEmoji", key);
|
||||
},
|
||||
getEmojiList(emojiList) {
|
||||
let emojiName;
|
||||
let url;
|
||||
let result = {}
|
||||
for (let i = 0; i < emojiList.length; i++) {
|
||||
emojiName = "[" + emojiList[i] + "]";
|
||||
let j = i + 1;
|
||||
url = this.$constant.qiniuDownload + "emoji/q" + j + ".gif";
|
||||
result[emojiName] = url;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.emoji-body {
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.emoji-item {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.emoji-item:hover {
|
||||
transition: all 0.2s;
|
||||
border-radius: 0.25rem;
|
||||
background: var(--lightGray);
|
||||
}
|
||||
|
||||
.emoji {
|
||||
margin: 0.25rem;
|
||||
/* 把此元素放置在父元素的中部 */
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.body-enter-active, .body-leave-active {
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.body-enter, .body-leave-to {
|
||||
opacity: 0;
|
||||
transform: scale(0.5);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,383 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 群名称 -->
|
||||
<div style="height: 60px;background-color: var(--maxWhite)">
|
||||
<span style="line-height: 60px;margin-left: 20px;font-size: 18px">
|
||||
{{groups[currentGroupId].groupName}}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 群信息 -->
|
||||
<div style="background: var(--midWhite);height: calc(100% - 60px)">
|
||||
<!-- 群头像 -->
|
||||
<div class="myCenter" style="padding: 50px 0">
|
||||
<n-avatar object-fit="cover"
|
||||
:size="60"
|
||||
:src="groups[currentGroupId].avatar"/>
|
||||
</div>
|
||||
|
||||
<!-- 群信息 -->
|
||||
<div class="myCenter">
|
||||
<div style="width: 65%;font-size: 16px">
|
||||
<!-- 群名称 -->
|
||||
<div style="margin-bottom: 10px">
|
||||
<span class="friend-label">
|
||||
群名称
|
||||
</span>
|
||||
<span style="margin: 0 5px 0 0">
|
||||
{{groups[currentGroupId].groupName}}
|
||||
</span>
|
||||
<span @click="changeDataType(2)"
|
||||
v-if="groups[currentGroupId].masterFlag"
|
||||
style="display: inline-block;vertical-align: sub;cursor: pointer">
|
||||
<svg viewBox="0 0 1024 1024" width="20" height="20">
|
||||
<path
|
||||
d="M929.909189 827.019236H93.990821c-16.598379 0-29.997071 13.398692-29.99707 29.997071s13.398692 29.997071 29.99707 29.997071h835.918368c16.598379 0 29.997071-13.398692 29.99707-29.997071 0-16.498389-13.398692-29.997071-29.99707-29.997071z"
|
||||
fill="#FF6600" opacity=".502"></path>
|
||||
<path
|
||||
d="M705.931061 198.080656c3.099697 0 8.999121 0.799922 14.098624 5.899424l28.297236 28.297237c5.099502 5.099502 5.899424 10.998926 5.899424 14.098623 0 3.099697-0.799922 8.999121-5.899424 14.098623L392.161703 616.739772l-86.991505 28.997168 27.597305-82.791915 358.964945-358.964945c5.099502-5.199492 11.098916-5.899424 14.198613-5.899424m0-59.994141c-20.497998 0-40.896006 7.799238-56.594473 23.397715L281.672493 529.148325l-0.699932-0.699931-70.693096 212.079289 212.079289-70.693097 0.699932 0.699932 367.664095-367.664095c31.196953-31.196953 31.196953-81.892003 0-113.088956l-28.297237-28.297237c-15.598477-15.598477-35.996485-23.397715-56.494483-23.397715z"
|
||||
fill="#FF6600"></path>
|
||||
<path d="M578.626494 230.803461L621.049351 188.381603l141.40619 141.406191-42.421857 42.421857z"
|
||||
fill="#FF6600"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 群公告 -->
|
||||
<div style="margin-bottom: 10px">
|
||||
<span class="friend-label">
|
||||
群公告
|
||||
</span>
|
||||
<span style="margin: 0 5px 0 0">
|
||||
{{groups[currentGroupId].notice}}
|
||||
</span>
|
||||
<span @click="changeDataType(3)"
|
||||
v-if="groups[currentGroupId].masterFlag"
|
||||
style="display: inline-block;vertical-align: sub;cursor: pointer">
|
||||
<svg viewBox="0 0 1024 1024" width="20" height="20">
|
||||
<path
|
||||
d="M929.909189 827.019236H93.990821c-16.598379 0-29.997071 13.398692-29.99707 29.997071s13.398692 29.997071 29.99707 29.997071h835.918368c16.598379 0 29.997071-13.398692 29.99707-29.997071 0-16.498389-13.398692-29.997071-29.99707-29.997071z"
|
||||
fill="#FF6600" opacity=".502"></path>
|
||||
<path
|
||||
d="M705.931061 198.080656c3.099697 0 8.999121 0.799922 14.098624 5.899424l28.297236 28.297237c5.099502 5.099502 5.899424 10.998926 5.899424 14.098623 0 3.099697-0.799922 8.999121-5.899424 14.098623L392.161703 616.739772l-86.991505 28.997168 27.597305-82.791915 358.964945-358.964945c5.099502-5.199492 11.098916-5.899424 14.198613-5.899424m0-59.994141c-20.497998 0-40.896006 7.799238-56.594473 23.397715L281.672493 529.148325l-0.699932-0.699931-70.693096 212.079289 212.079289-70.693097 0.699932 0.699932 367.664095-367.664095c31.196953-31.196953 31.196953-81.892003 0-113.088956l-28.297237-28.297237c-15.598477-15.598477-35.996485-23.397715-56.494483-23.397715z"
|
||||
fill="#FF6600"></path>
|
||||
<path d="M578.626494 230.803461L621.049351 188.381603l141.40619 141.406191-42.421857 42.421857z"
|
||||
fill="#FF6600"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 群简介 -->
|
||||
<div style="margin-bottom: 40px">
|
||||
<span class="friend-label">群简介</span>
|
||||
<span style="margin: 0 5px 0 6px">
|
||||
{{groups[currentGroupId].introduction}}
|
||||
</span>
|
||||
<span @click="changeDataType(4)"
|
||||
v-if="groups[currentGroupId].masterFlag"
|
||||
style="display: inline-block;vertical-align: sub;cursor: pointer">
|
||||
<svg viewBox="0 0 1024 1024" width="20" height="20">
|
||||
<path
|
||||
d="M929.909189 827.019236H93.990821c-16.598379 0-29.997071 13.398692-29.99707 29.997071s13.398692 29.997071 29.99707 29.997071h835.918368c16.598379 0 29.997071-13.398692 29.99707-29.997071 0-16.498389-13.398692-29.997071-29.99707-29.997071z"
|
||||
fill="#FF6600" opacity=".502"></path>
|
||||
<path
|
||||
d="M705.931061 198.080656c3.099697 0 8.999121 0.799922 14.098624 5.899424l28.297236 28.297237c5.099502 5.099502 5.899424 10.998926 5.899424 14.098623 0 3.099697-0.799922 8.999121-5.899424 14.098623L392.161703 616.739772l-86.991505 28.997168 27.597305-82.791915 358.964945-358.964945c5.099502-5.199492 11.098916-5.899424 14.198613-5.899424m0-59.994141c-20.497998 0-40.896006 7.799238-56.594473 23.397715L281.672493 529.148325l-0.699932-0.699931-70.693096 212.079289 212.079289-70.693097 0.699932 0.699932 367.664095-367.664095c31.196953-31.196953 31.196953-81.892003 0-113.088956l-28.297237-28.297237c-15.598477-15.598477-35.996485-23.397715-56.494483-23.397715z"
|
||||
fill="#FF6600"></path>
|
||||
<path
|
||||
d="M578.626494 230.803461L621.049351 188.381603l141.40619 141.406191-42.421857 42.421857z"
|
||||
fill="#FF6600"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 群按钮 -->
|
||||
<div class="myCenter sendMsg">
|
||||
<n-button type="info" @click="sendGroupMessage()">
|
||||
发消息
|
||||
</n-button>
|
||||
<template
|
||||
v-if="groups[currentGroupId].groupType === 1 || (groups[currentGroupId].groupType === 2 && groups[currentGroupId].masterFlag)">
|
||||
|
||||
<n-button type="primary" @click="groupSetting()">
|
||||
群设置
|
||||
</n-button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 群设置 -->
|
||||
<n-drawer class="group-card"
|
||||
v-model:show="activeGroupSet"
|
||||
:width="300"
|
||||
placement="right"
|
||||
to="#body-group">
|
||||
<n-card style="margin-bottom: 20px">
|
||||
<n-tabs default-value="群设置" justify-content="space-evenly" type="line">
|
||||
<!-- 群设置 -->
|
||||
<n-tab-pane name="群设置" tab="群设置">
|
||||
<div>
|
||||
<div class="myCenter" style="margin: 15px 0">
|
||||
<n-avatar object-fit="cover" @click="changeAvatar(2)" round class="group-avatar" :size="70"
|
||||
:src="groups[currentGroupId].avatar"/>
|
||||
</div>
|
||||
|
||||
<div class="group-set"
|
||||
v-if="groups[currentGroupId].groupType === 1 && groups[currentGroupId].masterFlag">
|
||||
<div>
|
||||
是否需要审核
|
||||
</div>
|
||||
<div>
|
||||
<n-switch @update:value="updateInType(currentGroupId, !groups[currentGroupId].inType)"
|
||||
v-model:value="groups[currentGroupId].inType"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex;justify-content: space-around;margin-top: 20px">
|
||||
<n-button type="warning" @click="exitGroup(currentGroupId)"
|
||||
v-if="groups[currentGroupId].groupType === 1">
|
||||
退出群
|
||||
</n-button>
|
||||
|
||||
<template v-if="groups[currentGroupId].masterFlag">
|
||||
<n-button type="error" @click="dissolveGroup(currentGroupId)">
|
||||
解散群
|
||||
</n-button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</n-tab-pane>
|
||||
|
||||
<!-- 成员设置 -->
|
||||
<n-tab-pane name="群成员" tab="群成员" v-if="groups[currentGroupId].groupType === 1">
|
||||
<div class="group-user"
|
||||
v-for="(item, index) in groupUsers"
|
||||
:key="index">
|
||||
<!-- 成员信息 -->
|
||||
<div style="display: flex;align-items: center">
|
||||
<div>
|
||||
<n-avatar object-fit="cover"
|
||||
:size="40"
|
||||
:src="item.avatar"/>
|
||||
</div>
|
||||
|
||||
<div style="margin-left: 20px;font-size: 16px">
|
||||
{{item.username}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 成员设置 -->
|
||||
<div style="display: flex;align-items: center">
|
||||
<div v-if="item.adminFlag"
|
||||
class="user-tag"
|
||||
style="background-color: var(--themeBackground)">
|
||||
管理员
|
||||
</div>
|
||||
|
||||
<div v-if="!item.adminFlag && groups[currentGroupId].adminFlag && item.userStatus === 1"
|
||||
class="user-tag"
|
||||
@click="changeGroupUserStatus(currentGroupId, item, 1, 2)"
|
||||
style="background-color: var(--red);cursor: pointer">
|
||||
禁言
|
||||
</div>
|
||||
|
||||
<div v-if="!item.adminFlag && groups[currentGroupId].adminFlag && item.userStatus === 2"
|
||||
class="user-tag"
|
||||
@click="changeGroupUserStatus(currentGroupId, item, 2, 1)"
|
||||
style="background-color: var(--blue);cursor: pointer">
|
||||
解禁
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</n-tab-pane>
|
||||
</n-tabs>
|
||||
</n-card>
|
||||
</n-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {useStore} from 'vuex';
|
||||
|
||||
import {useDialog} from 'naive-ui';
|
||||
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
import {reactive, getCurrentInstance, onMounted, onBeforeUnmount, watchEffect, toRefs} from 'vue';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
currentGroupId: {
|
||||
type: Number
|
||||
},
|
||||
groups: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
setup(props, context) {
|
||||
const globalProperties = getCurrentInstance().appContext.config.globalProperties;
|
||||
const $common = globalProperties.$common;
|
||||
const $http = globalProperties.$http;
|
||||
const $constant = globalProperties.$constant;
|
||||
const store = useStore();
|
||||
const dialog = useDialog();
|
||||
|
||||
let data = reactive({
|
||||
//群成员
|
||||
groupUsers: [],
|
||||
//组设置
|
||||
activeGroupSet: false
|
||||
})
|
||||
|
||||
function updateInType(currentGroupId, inType) {
|
||||
$http.post($constant.baseURL + "/imChatGroup/updateGroup", {
|
||||
id: props.groups[currentGroupId].id,
|
||||
inType: inType
|
||||
})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function changeDataType(type) {
|
||||
context.emit("changeDataType", type);
|
||||
}
|
||||
|
||||
function sendGroupMessage() {
|
||||
context.emit("sendGroupMessage");
|
||||
}
|
||||
|
||||
function groupSetting() {
|
||||
data.activeGroupSet = true;
|
||||
if (props.groups[props.currentGroupId].groupType === 1) {
|
||||
getGroupUser(props.currentGroupId);
|
||||
}
|
||||
}
|
||||
|
||||
function getGroupUser(groupId, current = 1, size = 9999) {
|
||||
$http.get($constant.baseURL + "/imChatGroupUser/getGroupUser", {groupId: groupId, current: current, size: size})
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data) && !$common.isEmpty(res.data.records)) {
|
||||
data.groupUsers = res.data.records;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function exitGroup(currentGroupId) {
|
||||
context.emit("exitGroup", currentGroupId);
|
||||
}
|
||||
|
||||
function dissolveGroup(currentGroupId) {
|
||||
context.emit("dissolveGroup", currentGroupId);
|
||||
}
|
||||
|
||||
function changeGroupUserStatus(groupId, item, oldUserStatus, userStatus) {
|
||||
$http.get($constant.baseURL + "/imChatGroupUser/changeUserStatus", {
|
||||
groupId: groupId,
|
||||
userId: item.userId,
|
||||
oldUserStatus: oldUserStatus,
|
||||
userStatus: userStatus
|
||||
})
|
||||
.then((res) => {
|
||||
item.userStatus = userStatus;
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function changeAvatar(type) {
|
||||
context.emit("changeAvatar", type);
|
||||
}
|
||||
|
||||
return {
|
||||
...toRefs(data),
|
||||
changeDataType,
|
||||
sendGroupMessage,
|
||||
groupSetting,
|
||||
updateInType,
|
||||
exitGroup,
|
||||
dissolveGroup,
|
||||
changeGroupUserStatus,
|
||||
changeAvatar
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.friend-label {
|
||||
color: var(--greyFont);
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.sendMsg .n-button {
|
||||
height: 35px;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
.group-set {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.group-set:first-child {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.user-tag {
|
||||
color: var(--white);
|
||||
border-radius: 3px;
|
||||
font-size: 12px;
|
||||
padding: 0 6px;
|
||||
margin: 0 6px;
|
||||
height: 22px;
|
||||
line-height: 22px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.group-user {
|
||||
display: flex;
|
||||
padding: 10px;
|
||||
height: 60px;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.group-avatar {
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.group-avatar:hover {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div class="myButton">
|
||||
<div :style="{'background': before}">{{info}}</div>
|
||||
<div :style="{'background': after}">{{info}}</div>
|
||||
<div :style="{'background': after}">{{info}}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
info: {
|
||||
type: String,
|
||||
default: "确定"
|
||||
},
|
||||
before: {
|
||||
type: String,
|
||||
default: "black"
|
||||
},
|
||||
after: {
|
||||
type: String,
|
||||
default: "linear-gradient(45deg, #f43f3b, #ec008c)"
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.myButton {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
position: relative;
|
||||
width: 66px;
|
||||
height: 33px;
|
||||
border-radius: 4px;
|
||||
color: var(--white);
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.myButton div {
|
||||
width: 66px;
|
||||
height: 33px;
|
||||
line-height: 33px;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.myButton div:nth-child(2) {
|
||||
width: 100px;
|
||||
transition: all 0.3s ease;
|
||||
transform: translateX(-120px) skewX(-30deg);
|
||||
}
|
||||
|
||||
.myButton div:nth-child(3) {
|
||||
transition: all 0.3s ease;
|
||||
transform: translateX(-120px);
|
||||
}
|
||||
|
||||
.myButton:hover div:nth-child(2) {
|
||||
transform: translateX(20px) skewX(-30deg);
|
||||
}
|
||||
|
||||
.myButton:hover div:nth-child(3) {
|
||||
transform: translateX(0px);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,282 @@
|
||||
<template>
|
||||
<div class="tree-hole-container">
|
||||
<ol class="tree-hole-list" v-if="!$common.isEmpty(treeHoleList)">
|
||||
<li class="tree-hole-li"
|
||||
v-for="(treeHole, index) in treeHoleList"
|
||||
style="animation: hideToShow 1.5s"
|
||||
:key="index">
|
||||
<div class="tree-hole-content"
|
||||
:class="{ leftTreeHole: index % 2 === 0 && !$common.mobile(), rightTreeHole: index % 2 !== 0 || $common.mobile() }">
|
||||
<n-avatar object-fit="cover"
|
||||
class="avatar-img"
|
||||
:size="36"
|
||||
:src="avatar"/>
|
||||
<div class="tree-hole-box"
|
||||
:style="{background: $constant.tree_hole_color[index % $constant.tree_hole_color.length]}">
|
||||
<div class="box-tag" v-if="index % 2 === 0 && !$common.mobile()"
|
||||
:style="{'border-color': 'transparent transparent transparent '+$constant.tree_hole_color[index % $constant.tree_hole_color.length]}"></div>
|
||||
<div class="box-tag" v-if="index % 2 !== 0 || $common.mobile()"
|
||||
:style="{'border-color': 'transparent '+$constant.tree_hole_color[index % $constant.tree_hole_color.length]+' transparent transparent'}"></div>
|
||||
<div class="my-content" v-html="treeHole.content"></div>
|
||||
<div style="display: flex;justify-content: space-between">
|
||||
<div>😃 {{treeHole.createTime}}</div>
|
||||
<div @click="deleteTreeHole(treeHole.id)"
|
||||
class="tree-hole-delete"
|
||||
v-if="$store.state.currentUser.id === treeHole.userId">
|
||||
<svg viewBox="0 0 1024 1024" width="18" height="18" style="vertical-align: -2px;">
|
||||
<path
|
||||
d="M921.1392 155.392h-270.592v-48.2816c0-22.7328-18.432-41.1648-41.1648-41.1648H426.3424a41.1648 41.1648 0 0 0-41.1648 41.1648v48.2816H110.6432c-14.1312 0-25.6 11.4688-25.6 25.6s11.4688 25.6 25.6 25.6h810.496c14.1312 0 25.6-11.4688 25.6-25.6s-11.4688-25.6-25.6-25.6zM170.8032 260.0448v592.8448c0 50.8928 41.2672 92.16 92.16 92.16h500.6848c50.8928 0 92.16-41.2672 92.16-92.16V260.0448H170.8032z m249.1392 462.7968c0 14.1312-11.4688 25.6-25.6 25.6s-25.6-11.4688-25.6-25.6V443.0848c0-14.1312 11.4688-25.6 25.6-25.6s25.6 11.4688 25.6 25.6v279.7568z m243.1488 0c0 14.1312-11.4688 25.6-25.6 25.6s-25.6-11.4688-25.6-25.6V443.0848c0-14.1312 11.4688-25.6 25.6-25.6s25.6 11.4688 25.6 25.6v279.7568z"
|
||||
fill="#FF623E"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="tree-hole-go">
|
||||
<i class="fa fa-paper-plane" @click="launch()"></i>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
treeHoleList: {
|
||||
type: Array
|
||||
},
|
||||
avatar: {
|
||||
type: String
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
|
||||
computed: {},
|
||||
|
||||
watch: {},
|
||||
|
||||
created() {
|
||||
|
||||
},
|
||||
|
||||
mounted() {
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
launch() {
|
||||
this.$emit("launch");
|
||||
},
|
||||
deleteTreeHole(id) {
|
||||
this.$emit("deleteTreeHole", id);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.tree-hole-container {
|
||||
padding: 20px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.tree-hole-list {
|
||||
padding: 100px 0 20px;
|
||||
margin: 0;
|
||||
position: relative;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.tree-hole-list:before {
|
||||
content: '';
|
||||
width: 4px;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: var(--themeBackground);
|
||||
}
|
||||
|
||||
.tree-hole-list:after {
|
||||
content: '';
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border: 4px solid var(--maxLightRed);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: var(--white);
|
||||
animation: weiYanShadowFlashing 1.5s linear infinite;
|
||||
}
|
||||
|
||||
.tree-hole-li {
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
.tree-hole-content {
|
||||
position: relative;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.leftTreeHole {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.rightTreeHole {
|
||||
margin-left: 50%;
|
||||
}
|
||||
|
||||
.tree-hole-content:before {
|
||||
content: '';
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border: 4px solid var(--blue);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
background-color: var(--white);
|
||||
}
|
||||
|
||||
.leftTreeHole:before {
|
||||
right: 0;
|
||||
transform: translateX(10px);
|
||||
}
|
||||
|
||||
.rightTreeHole:before {
|
||||
left: 0;
|
||||
transform: translateX(-10px);
|
||||
}
|
||||
|
||||
.avatar-img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.leftTreeHole .avatar-img {
|
||||
right: 25px;
|
||||
}
|
||||
|
||||
.rightTreeHole .avatar-img {
|
||||
left: 25px;
|
||||
}
|
||||
|
||||
.tree-hole-box {
|
||||
font-size: 16px;
|
||||
padding: 10px;
|
||||
width: 250px;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
letter-spacing: 0.1em;
|
||||
font-weight: 400;
|
||||
transition: all 0.3s ease-in-out;
|
||||
color: var(--black);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.leftTreeHole .tree-hole-box {
|
||||
margin-right: 90px;
|
||||
}
|
||||
|
||||
.rightTreeHole .tree-hole-box {
|
||||
margin-left: 90px;
|
||||
}
|
||||
|
||||
.tree-hole-box:hover, .avatar-img:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 0 16px 3px var(--miniMask);
|
||||
}
|
||||
|
||||
.box-tag {
|
||||
content: '';
|
||||
position: absolute;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.leftTreeHole .box-tag {
|
||||
right: -10px;
|
||||
border-width: 15px 0 5px 10px;
|
||||
}
|
||||
|
||||
.rightTreeHole .box-tag {
|
||||
left: -10px;
|
||||
border-width: 15px 10px 5px 0;
|
||||
}
|
||||
|
||||
.my-content {
|
||||
margin: 0 10px 10px;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
.tree-hole-box > div:last-child {
|
||||
color: var(--greyFont);
|
||||
padding: 10px 10px 0;
|
||||
border-top: 1px dashed var(--white);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.tree-hole-go {
|
||||
color: var(--blue);
|
||||
font-weight: 700;
|
||||
font-size: 25px;
|
||||
margin: 20px auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tree-hole-go i {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tree-hole-go i:hover {
|
||||
animation: scale 1s linear infinite;
|
||||
}
|
||||
|
||||
.tree-hole-delete {
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
.tree-hole-box {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.tree-hole-content {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.tree-hole-list:after {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.tree-hole-list:before {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.rightTreeHole {
|
||||
margin-left: unset;
|
||||
}
|
||||
|
||||
.tree-hole-content {
|
||||
width: calc(100% - 40px);
|
||||
margin: 0 auto 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 450px) {
|
||||
.tree-hole-content {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,163 @@
|
||||
import {useStore} from 'vuex';
|
||||
|
||||
import {useDialog} from 'naive-ui';
|
||||
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
import {reactive, getCurrentInstance, onMounted, onBeforeUnmount, watchEffect, toRefs} from 'vue';
|
||||
|
||||
export default function () {
|
||||
const globalProperties = getCurrentInstance().appContext.config.globalProperties;
|
||||
const $common = globalProperties.$common;
|
||||
const $http = globalProperties.$http;
|
||||
const $constant = globalProperties.$constant;
|
||||
const store = useStore();
|
||||
const dialog = useDialog();
|
||||
|
||||
let bindEmailData = reactive({
|
||||
emailVisible: false,
|
||||
email: '',
|
||||
code: '',
|
||||
password: '',
|
||||
codeString: "验证码"
|
||||
})
|
||||
|
||||
let intervalCode = null;
|
||||
|
||||
onMounted(() => {
|
||||
showEmail();
|
||||
})
|
||||
|
||||
function showEmail() {
|
||||
if (!$common.isEmpty(store.state.currentUser) && $common.isEmpty(store.state.currentUser.email)) {
|
||||
//没有绑定邮箱的用户会弹框
|
||||
//bindEmailData.emailVisible = true;
|
||||
}
|
||||
}
|
||||
|
||||
function getCode() {
|
||||
if (bindEmailData.codeString === "验证码") {
|
||||
// 获取验证码
|
||||
if ($common.isEmpty(bindEmailData.email)) {
|
||||
ElMessage({
|
||||
message: "请输入邮箱！",
|
||||
type: 'error'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!(/^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/.test(bindEmailData.email))) {
|
||||
ElMessage({
|
||||
message: "邮箱格式有误！",
|
||||
type: 'error'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
$http.get($constant.baseURL + "/user/getCodeForBind", {
|
||||
flag: 2,
|
||||
place: bindEmailData.email
|
||||
})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "验证码已发送，请注意查收！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
bindEmailData.codeString = "30";
|
||||
intervalCode = setInterval(() => {
|
||||
if (bindEmailData.codeString === "0") {
|
||||
clearInterval(intervalCode)
|
||||
bindEmailData.codeString = "验证码";
|
||||
} else {
|
||||
bindEmailData.codeString = (parseInt(bindEmailData.codeString) - 1) + "";
|
||||
}
|
||||
}, 1000);
|
||||
} else {
|
||||
ElMessage({
|
||||
message: "请稍后再试！",
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function submitDialog() {
|
||||
if ($common.isEmpty(bindEmailData.email)) {
|
||||
ElMessage({
|
||||
message: "请输入邮箱！",
|
||||
type: 'error'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!(/^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/.test(bindEmailData.email))) {
|
||||
ElMessage({
|
||||
message: "邮箱格式有误！",
|
||||
type: 'error'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if ($common.isEmpty(bindEmailData.code)) {
|
||||
ElMessage({
|
||||
message: "请输入验证码！",
|
||||
type: 'error'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if ($common.isEmpty(bindEmailData.password)) {
|
||||
ElMessage({
|
||||
message: "请输入密码！",
|
||||
type: 'error'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
let params = {
|
||||
code: bindEmailData.code.trim(),
|
||||
flag: 2,
|
||||
place: bindEmailData.email.trim(),
|
||||
password: $common.encrypt(bindEmailData.password.trim())
|
||||
};
|
||||
$http.post($constant.baseURL + "/user/updateSecretInfo", params, false)
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data)) {
|
||||
ElMessage({
|
||||
message: "保存成功！",
|
||||
type: 'success'
|
||||
});
|
||||
store.commit("loadCurrentUser", res.data);
|
||||
clearEmailDialog();
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function clearEmailDialog() {
|
||||
bindEmailData.password = "";
|
||||
bindEmailData.codeString = "验证码";
|
||||
if (intervalCode != null) {
|
||||
clearInterval(intervalCode);
|
||||
intervalCode = null;
|
||||
}
|
||||
bindEmailData.email = "";
|
||||
bindEmailData.code = "";
|
||||
bindEmailData.emailVisible = false;
|
||||
}
|
||||
|
||||
return {
|
||||
bindEmailData,
|
||||
getCode,
|
||||
submitDialog
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,229 @@
|
||||
import {useStore} from 'vuex';
|
||||
|
||||
import {useDialog} from 'naive-ui';
|
||||
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
import {reactive, getCurrentInstance, onMounted, onBeforeUnmount, watchEffect, toRefs} from 'vue';
|
||||
|
||||
export default function (friendData, groupData) {
|
||||
const globalProperties = getCurrentInstance().appContext.config.globalProperties;
|
||||
const $common = globalProperties.$common;
|
||||
const $http = globalProperties.$http;
|
||||
const $constant = globalProperties.$constant;
|
||||
const store = useStore();
|
||||
const dialog = useDialog();
|
||||
|
||||
let changeDataData = reactive({
|
||||
//修改信息
|
||||
changeData: '',
|
||||
changeType: null,
|
||||
changeModal: false,
|
||||
|
||||
avatarType: null,
|
||||
avatarPrefix: '',
|
||||
showAvatarDialog: false
|
||||
})
|
||||
|
||||
function closeModal() {
|
||||
changeDataData.avatarType = null;
|
||||
changeDataData.avatarPrefix = '';
|
||||
|
||||
changeDataData.changeData = '';
|
||||
changeDataData.changeType = null;
|
||||
}
|
||||
|
||||
function changeAvatar(type) {
|
||||
if (type === 1 || (type === 2 && groupData.groups[groupData.currentGroupId].masterFlag)) {
|
||||
closeModal();
|
||||
changeDataData.showAvatarDialog = true;
|
||||
changeDataData.avatarType = type;
|
||||
if (type === 1) {
|
||||
changeDataData.avatarPrefix = 'userAvatar';
|
||||
} else if (type === 2) {
|
||||
changeDataData.avatarPrefix = 'im/groupAvatar';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function changeDataType(type) {
|
||||
closeModal();
|
||||
changeDataData.changeType = type;
|
||||
changeDataData.changeModal = true;
|
||||
}
|
||||
|
||||
function submitAvatar(avatar) {
|
||||
if ($common.isEmpty(avatar)) {
|
||||
ElMessage({
|
||||
message: "请上传头像！",
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (changeDataData.avatarType === 1) {
|
||||
let user = {
|
||||
avatar: avatar
|
||||
};
|
||||
$http.post($constant.baseURL + "/user/updateUserInfo", user)
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data)) {
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
store.commit("loadCurrentUser", res.data);
|
||||
closeModal();
|
||||
changeDataData.showAvatarDialog = false;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
} else if (changeDataData.avatarType === 2) {
|
||||
$http.post($constant.baseURL + "/imChatGroup/updateGroup", {
|
||||
id: groupData.currentGroupId,
|
||||
avatar: avatar
|
||||
})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
groupData.groups[groupData.currentGroupId].avatar = avatar;
|
||||
closeModal();
|
||||
changeDataData.showAvatarDialog = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function submitChange() {
|
||||
if (changeDataData.changeType === 1) {
|
||||
if ($common.isEmpty(changeDataData.changeData)) {
|
||||
ElMessage({
|
||||
message: "请输入备注！",
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
$http.get($constant.baseURL + "/imChatUserFriend/changeFriend", {
|
||||
friendId: friendData.currentFriendId,
|
||||
remark: changeDataData.changeData
|
||||
})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
friendData.friends[friendData.currentFriendId].remark = changeDataData.changeData;
|
||||
closeModal();
|
||||
changeDataData.changeModal = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
} else if (changeDataData.changeType === 2) {
|
||||
if ($common.isEmpty(changeDataData.changeData)) {
|
||||
ElMessage({
|
||||
message: "请输入群名称！",
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
$http.post($constant.baseURL + "/imChatGroup/updateGroup", {
|
||||
id: groupData.currentGroupId,
|
||||
groupName: changeDataData.changeData
|
||||
})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
groupData.groups[groupData.currentGroupId].groupName = changeDataData.changeData;
|
||||
closeModal();
|
||||
changeDataData.changeModal = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
} else if (changeDataData.changeType === 3) {
|
||||
if ($common.isEmpty(changeDataData.changeData)) {
|
||||
ElMessage({
|
||||
message: "请输入群公告！",
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
$http.post($constant.baseURL + "/imChatGroup/updateGroup", {
|
||||
id: groupData.currentGroupId,
|
||||
notice: changeDataData.changeData
|
||||
})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
groupData.groups[groupData.currentGroupId].notice = changeDataData.changeData;
|
||||
closeModal();
|
||||
changeDataData.changeModal = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
} else if (changeDataData.changeType === 4) {
|
||||
if ($common.isEmpty(changeDataData.changeData)) {
|
||||
ElMessage({
|
||||
message: "请输入群简介！",
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
$http.post($constant.baseURL + "/imChatGroup/updateGroup", {
|
||||
id: groupData.currentGroupId,
|
||||
introduction: changeDataData.changeData
|
||||
})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
groupData.groups[groupData.currentGroupId].introduction = changeDataData.changeData;
|
||||
closeModal();
|
||||
changeDataData.changeModal = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
changeDataData,
|
||||
changeAvatar,
|
||||
changeDataType,
|
||||
submitAvatar,
|
||||
submitChange
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,118 @@
|
||||
import {useStore} from 'vuex';
|
||||
|
||||
import {useDialog} from 'naive-ui';
|
||||
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
import {reactive, getCurrentInstance, onMounted, onBeforeUnmount, watchEffect, toRefs} from 'vue';
|
||||
|
||||
export default function () {
|
||||
const globalProperties = getCurrentInstance().appContext.config.globalProperties;
|
||||
const $common = globalProperties.$common;
|
||||
const $http = globalProperties.$http;
|
||||
const $constant = globalProperties.$constant;
|
||||
const store = useStore();
|
||||
const dialog = useDialog();
|
||||
|
||||
let friendData = reactive({
|
||||
//好友请求
|
||||
friendRequests: [],
|
||||
//好友列表
|
||||
friends: {},
|
||||
//当前朋友信息
|
||||
currentFriendId: null
|
||||
})
|
||||
|
||||
async function getImFriend() {
|
||||
await $http.get($constant.baseURL + "/imChatUserFriend/getFriend", {friendStatus: 1})
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data)) {
|
||||
res.data.forEach(friend => {
|
||||
friendData.friends[friend.friendId] = friend;
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function removeFriend(currentFriendId) {
|
||||
dialog.error({
|
||||
title: '警告',
|
||||
content: '你确定删除' + friendData.friends[currentFriendId].remark + '?',
|
||||
positiveText: '确定',
|
||||
onPositiveClick: () => {
|
||||
$http.get($constant.baseURL + "/imChatUserFriend/changeFriend", {
|
||||
friendId: currentFriendId,
|
||||
friendStatus: -1
|
||||
})
|
||||
.then((res) => {
|
||||
delete friendData.friends[currentFriendId];
|
||||
friendData.currentFriendId = null;
|
||||
ElMessage({
|
||||
message: "删除成功！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getFriendRequests() {
|
||||
$http.get($constant.baseURL + "/imChatUserFriend/getFriend", {friendStatus: 0})
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data)) {
|
||||
friendData.friendRequests = res.data;
|
||||
ElMessage({
|
||||
message: "您有好友申请待处理！",
|
||||
showClose: true,
|
||||
type: 'success',
|
||||
duration: 0
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function changeFriendStatus(friendId, status, index) {
|
||||
$http.get($constant.baseURL + "/imChatUserFriend/changeFriend", {friendId: friendId, friendStatus: status})
|
||||
.then((res) => {
|
||||
friendData.friendRequests.splice(index, 1);
|
||||
ElMessage({
|
||||
message: "修改成功！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
friendData,
|
||||
getImFriend,
|
||||
removeFriend,
|
||||
getFriendRequests,
|
||||
changeFriendStatus
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,168 @@
|
||||
import {useStore} from 'vuex';
|
||||
|
||||
import {useDialog} from 'naive-ui';
|
||||
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
import {reactive, getCurrentInstance, onMounted, onBeforeUnmount, watchEffect, toRefs} from 'vue';
|
||||
|
||||
export default function () {
|
||||
const globalProperties = getCurrentInstance().appContext.config.globalProperties;
|
||||
const $common = globalProperties.$common;
|
||||
const $http = globalProperties.$http;
|
||||
const $constant = globalProperties.$constant;
|
||||
const store = useStore();
|
||||
const dialog = useDialog();
|
||||
|
||||
let friendCircleData = reactive({
|
||||
showFriendCircle: false,
|
||||
treeHoleList: [],
|
||||
weiYanDialogVisible: false,
|
||||
isPublic: true,
|
||||
weiYanAvatar: '',
|
||||
weiYanUsername: '',
|
||||
pagination: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0,
|
||||
userId: null
|
||||
}
|
||||
})
|
||||
|
||||
function launch() {
|
||||
friendCircleData.weiYanDialogVisible = true;
|
||||
}
|
||||
|
||||
function openFriendCircle(userId, avatar, username) {
|
||||
friendCircleData.pagination.userId = userId;
|
||||
friendCircleData.weiYanAvatar = avatar;
|
||||
friendCircleData.weiYanUsername = username;
|
||||
getWeiYan();
|
||||
}
|
||||
|
||||
function deleteTreeHole(id) {
|
||||
dialog.error({
|
||||
title: '警告',
|
||||
content: '确定删除?',
|
||||
positiveText: '确定',
|
||||
onPositiveClick: () => {
|
||||
$http.get($constant.baseURL + "/weiYan/deleteWeiYan", {id: id})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "删除成功！",
|
||||
type: 'success'
|
||||
});
|
||||
friendCircleData.pagination.current = 1;
|
||||
friendCircleData.pagination.size = 10;
|
||||
friendCircleData.treeHoleList = [];
|
||||
getWeiYan();
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getWeiYan() {
|
||||
$http.post($constant.baseURL + "/weiYan/listWeiYan", friendCircleData.pagination)
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data)) {
|
||||
res.data.records.forEach(c => {
|
||||
c.content = c.content.replace(/\n{2,}/g, '<div style="height: 12px"></div>');
|
||||
c.content = c.content.replace(/\n/g, '<br/>');
|
||||
c.content = $common.faceReg(c.content);
|
||||
c.content = $common.pictureReg(c.content);
|
||||
});
|
||||
friendCircleData.treeHoleList = friendCircleData.treeHoleList.concat(res.data.records);
|
||||
friendCircleData.pagination.total = res.data.total;
|
||||
friendCircleData.showFriendCircle = true;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function submitWeiYan(content) {
|
||||
let weiYan = {
|
||||
content: content,
|
||||
isPublic: friendCircleData.isPublic
|
||||
};
|
||||
|
||||
$http.post($constant.baseURL + "/weiYan/saveWeiYan", weiYan)
|
||||
.then((res) => {
|
||||
friendCircleData.pagination.current = 1;
|
||||
friendCircleData.pagination.size = 10;
|
||||
friendCircleData.treeHoleList = [];
|
||||
friendCircleData.weiYanDialogVisible = false;
|
||||
getWeiYan();
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function cleanFriendCircle() {
|
||||
friendCircleData.pagination = {
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0,
|
||||
userId: null
|
||||
};
|
||||
friendCircleData.weiYanAvatar = '';
|
||||
friendCircleData.weiYanUsername = '';
|
||||
friendCircleData.treeHoleList = [];
|
||||
friendCircleData.showFriendCircle = false;
|
||||
}
|
||||
|
||||
function pageWeiYan() {
|
||||
friendCircleData.pagination.current = friendCircleData.pagination.current + 1;
|
||||
getWeiYan();
|
||||
}
|
||||
|
||||
function addFriend() {
|
||||
dialog.success({
|
||||
title: '好友申请',
|
||||
content: '确认提交好友申请，添加 ' + friendCircleData.weiYanUsername + ' 为好友？',
|
||||
positiveText: '确定',
|
||||
onPositiveClick: () => {
|
||||
$http.get($constant.baseURL + "/imChatUserFriend/addFriend", {friendId: friendCircleData.pagination.userId})
|
||||
.then((res) => {
|
||||
ElMessage({
|
||||
message: "提交成功！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
friendCircleData,
|
||||
launch,
|
||||
openFriendCircle,
|
||||
deleteTreeHole,
|
||||
submitWeiYan,
|
||||
pageWeiYan,
|
||||
cleanFriendCircle,
|
||||
addFriend
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,98 @@
|
||||
import {useStore} from 'vuex';
|
||||
|
||||
import {useDialog} from 'naive-ui';
|
||||
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
import {reactive, getCurrentInstance, onMounted, onBeforeUnmount, watchEffect, toRefs} from 'vue';
|
||||
|
||||
export default function () {
|
||||
const globalProperties = getCurrentInstance().appContext.config.globalProperties;
|
||||
const $common = globalProperties.$common;
|
||||
const $http = globalProperties.$http;
|
||||
const $constant = globalProperties.$constant;
|
||||
const store = useStore();
|
||||
const dialog = useDialog();
|
||||
|
||||
let groupData = reactive({
|
||||
//群组列表
|
||||
groups: {},
|
||||
//当前群信息
|
||||
currentGroupId: null
|
||||
})
|
||||
|
||||
function exitGroup(currentGroupId) {
|
||||
$http.get($constant.baseURL + "/imChatGroupUser/quitGroup", {id: currentGroupId})
|
||||
.then((res) => {
|
||||
delete groupData.groups[currentGroupId];
|
||||
groupData.currentGroupId = null;
|
||||
ElMessage({
|
||||
message: "退群成功！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function dissolveGroup(currentGroupId) {
|
||||
$http.get($constant.baseURL + "/imChatGroup/deleteGroup", {id: currentGroupId})
|
||||
.then((res) => {
|
||||
delete groupData.groups[currentGroupId];
|
||||
groupData.currentGroupId = null;
|
||||
ElMessage({
|
||||
message: "解散群成功！",
|
||||
type: 'success'
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async function getImGroup() {
|
||||
await $http.get($constant.baseURL + "/imChatGroup/listGroup")
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data)) {
|
||||
res.data.forEach(group => {
|
||||
groupData.groups[group.id] = group;
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function addGroupTopic() {
|
||||
$http.get($constant.baseURL + "/imChatGroup/addGroupTopic", {id: groupData.currentGroupId})
|
||||
.then((res) => {
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
groupData,
|
||||
getImGroup,
|
||||
addGroupTopic,
|
||||
exitGroup,
|
||||
dissolveGroup
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,153 @@
|
||||
import {useStore} from 'vuex';
|
||||
|
||||
import {useDialog} from 'naive-ui';
|
||||
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
import {reactive, getCurrentInstance, onMounted, onBeforeUnmount, watchEffect, toRefs} from 'vue';
|
||||
|
||||
export default function () {
|
||||
const globalProperties = getCurrentInstance().appContext.config.globalProperties;
|
||||
const $common = globalProperties.$common;
|
||||
const $http = globalProperties.$http;
|
||||
const $constant = globalProperties.$constant;
|
||||
const store = useStore();
|
||||
const dialog = useDialog();
|
||||
|
||||
let imUtilData = reactive({
|
||||
//系统消息
|
||||
systemMessages: [],
|
||||
showBodyLeft: true,
|
||||
//表情包
|
||||
imageList: []
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
if ($common.mobile()) {
|
||||
$(".friend-aside").click(function () {
|
||||
imUtilData.showBodyLeft = true;
|
||||
mobileRight();
|
||||
});
|
||||
|
||||
$(".body-right").click(function () {
|
||||
imUtilData.showBodyLeft = false;
|
||||
mobileRight();
|
||||
});
|
||||
}
|
||||
mobileRight();
|
||||
})
|
||||
|
||||
function changeAside() {
|
||||
imUtilData.showBodyLeft = !imUtilData.showBodyLeft;
|
||||
mobileRight();
|
||||
}
|
||||
|
||||
function mobileRight() {
|
||||
if (imUtilData.showBodyLeft && $common.mobile()) {
|
||||
$(".body-right").addClass("mobile-right");
|
||||
} else if (!imUtilData.showBodyLeft && $common.mobile()) {
|
||||
$(".body-right").removeClass("mobile-right");
|
||||
}
|
||||
}
|
||||
|
||||
function getSystemMessages() {
|
||||
$http.get($constant.baseURL + "/imChatUserMessage/listSystemMessage")
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data) && !$common.isEmpty(res.data.records)) {
|
||||
imUtilData.systemMessages = res.data.records;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hiddenBodyLeft() {
|
||||
if ($common.mobile()) {
|
||||
$(".body-right").click(function () {
|
||||
imUtilData.showBodyLeft = false;
|
||||
mobileRight();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function imgShow() {
|
||||
$(".message img").click(function () {
|
||||
let src = $(this).attr("src");
|
||||
$("#bigImg").attr("src", src);
|
||||
|
||||
/** 获取当前点击图片的真实大小，并显示弹出层及大图 */
|
||||
$("<img/>").attr("src", src).load(function () {
|
||||
let windowW = $(window).width();//获取当前窗口宽度
|
||||
let windowH = $(window).height();//获取当前窗口高度
|
||||
let realWidth = this.width;//获取图片真实宽度
|
||||
let realHeight = this.height;//获取图片真实高度
|
||||
let imgWidth, imgHeight;
|
||||
let scale = 0.8;//缩放尺寸，当图片真实宽度和高度大于窗口宽度和高度时进行缩放
|
||||
|
||||
if (realHeight > windowH * scale) {//判断图片高度
|
||||
imgHeight = windowH * scale;//如大于窗口高度，图片高度进行缩放
|
||||
imgWidth = imgHeight / realHeight * realWidth;//等比例缩放宽度
|
||||
if (imgWidth > windowW * scale) {//如宽度仍大于窗口宽度
|
||||
imgWidth = windowW * scale;//再对宽度进行缩放
|
||||
}
|
||||
} else if (realWidth > windowW * scale) {//如图片高度合适，判断图片宽度
|
||||
imgWidth = windowW * scale;//如大于窗口宽度，图片宽度进行缩放
|
||||
imgHeight = imgWidth / realWidth * realHeight;//等比例缩放高度
|
||||
} else {//如果图片真实高度和宽度都符合要求，高宽不变
|
||||
imgWidth = realWidth;
|
||||
imgHeight = realHeight;
|
||||
}
|
||||
$("#bigImg").css("width", imgWidth);//以最终的宽度对图片缩放
|
||||
|
||||
let w = (windowW - imgWidth) / 2;//计算图片与窗口左边距
|
||||
let h = (windowH - imgHeight) / 2;//计算图片与窗口上边距
|
||||
$("#innerImg").css({"top": h, "left": w});//设置top和left属性
|
||||
$("#outerImg").fadeIn("fast");//淡入显示
|
||||
});
|
||||
|
||||
$("#outerImg").click(function () {//再次点击淡出消失弹出层
|
||||
$(this).fadeOut("fast");
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function getImageList() {
|
||||
$http.get($constant.baseURL + "/resource/getImageList")
|
||||
.then((res) => {
|
||||
if (!$common.isEmpty(res.data)) {
|
||||
imUtilData.imageList = res.data;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function parseMessage(content) {
|
||||
content = content.replace(/\n{2,}/g, '<div style="height: 12px"></div>');
|
||||
content = content.replace(/\n/g, '<br/>');
|
||||
content = $common.faceReg(content);
|
||||
content = $common.pictureReg(content);
|
||||
return content;
|
||||
}
|
||||
|
||||
return {
|
||||
imUtilData,
|
||||
changeAside,
|
||||
mobileRight,
|
||||
getSystemMessages,
|
||||
hiddenBodyLeft,
|
||||
imgShow,
|
||||
getImageList,
|
||||
parseMessage
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,100 @@
|
||||
import {createApp} from 'vue'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import store from './store'
|
||||
import {
|
||||
create,
|
||||
NAvatar,
|
||||
NInput,
|
||||
NIcon,
|
||||
NTag,
|
||||
NDivider,
|
||||
NButton,
|
||||
NDrawer,
|
||||
NCard,
|
||||
NTabs,
|
||||
NTabPane,
|
||||
NSwitch,
|
||||
NModal,
|
||||
NBadge,
|
||||
NPopover,
|
||||
NImage,
|
||||
NPopconfirm
|
||||
} from 'naive-ui'
|
||||
|
||||
import {
|
||||
ElUpload,
|
||||
ElButton,
|
||||
ElRadioGroup,
|
||||
ElRadioButton
|
||||
} from 'element-plus'
|
||||
import 'element-plus/dist/index.css'
|
||||
|
||||
import http from './utils/request'
|
||||
import common from './utils/common'
|
||||
import constant from './utils/constant'
|
||||
|
||||
import 'vfonts/FiraCode.css'
|
||||
import './assets/css/index.css'
|
||||
import './assets/css/color.css'
|
||||
import './assets/css/animation.css'
|
||||
|
||||
const naive = create({
|
||||
components: [NAvatar, NInput, NIcon, NTag, NDivider, NButton,
|
||||
NDrawer, NCard, NTabs, NTabPane, NSwitch, NModal, NBadge,
|
||||
NPopover, NImage, NPopconfirm]
|
||||
})
|
||||
|
||||
const app = createApp(App)
|
||||
app.use(router)
|
||||
app.use(store)
|
||||
app.use(naive)
|
||||
|
||||
app.component(ElUpload.name, ElUpload)
|
||||
app.component(ElButton.name, ElButton)
|
||||
app.component(ElRadioGroup.name, ElRadioGroup)
|
||||
app.component(ElRadioButton.name, ElRadioButton)
|
||||
|
||||
app.config.globalProperties.$http = http
|
||||
app.config.globalProperties.$common = common
|
||||
app.config.globalProperties.$constant = constant
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
if (to.meta.requiresAuth) {
|
||||
if (to.path === "/") {
|
||||
if (typeof to.query.defaultStoreType !== "undefined") {
|
||||
localStorage.setItem("defaultStoreType", to.query.defaultStoreType);
|
||||
}
|
||||
if (typeof to.query.userToken !== "undefined") {
|
||||
let userToken = to.query.userToken;
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('post', constant.baseURL + "/user/token", false);
|
||||
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
|
||||
xhr.send("userToken=" + userToken);
|
||||
let result = JSON.parse(xhr.responseText);
|
||||
if (!common.isEmpty(result) && result.code === 200) {
|
||||
store.commit("loadCurrentUser", result.data);
|
||||
localStorage.setItem("userToken", result.data.accessToken);
|
||||
window.location.href = constant.imURL;
|
||||
next();
|
||||
} else {
|
||||
window.location.href = constant.webBaseURL;
|
||||
}
|
||||
} else if (Boolean(localStorage.getItem("userToken"))) {
|
||||
next();
|
||||
} else {
|
||||
window.location.href = constant.webBaseURL;
|
||||
}
|
||||
} else {
|
||||
if (Boolean(localStorage.getItem("userToken"))) {
|
||||
next();
|
||||
} else {
|
||||
window.location.href = constant.webBaseURL;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
})
|
||||
|
||||
app.mount('#app')
|
||||
@ -0,0 +1,20 @@
|
||||
import {createRouter, createWebHistory} from 'vue-router'
|
||||
import constant from "../utils/constant";
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: "/",
|
||||
meta: {requiresAuth: true},
|
||||
component: () => import('../components/index')
|
||||
}
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(constant.webHistory),
|
||||
routes,
|
||||
scrollBehavior(to, from, savedPosition) {
|
||||
return {left: 0, top: 0};
|
||||
}
|
||||
})
|
||||
|
||||
export default router
|
||||
@ -0,0 +1,18 @@
|
||||
import {createStore} from 'vuex'
|
||||
|
||||
|
||||
export default createStore({
|
||||
state: {
|
||||
currentUser: JSON.parse(localStorage.getItem("currentUser") || '{}')
|
||||
},
|
||||
getters: {},
|
||||
mutations: {
|
||||
loadCurrentUser(state, user) {
|
||||
state.currentUser = user;
|
||||
localStorage.setItem("currentUser", JSON.stringify(user));
|
||||
}
|
||||
},
|
||||
actions: {},
|
||||
modules: {},
|
||||
plugins: []
|
||||
})
|
||||
@ -0,0 +1,75 @@
|
||||
import common from './common'
|
||||
|
||||
function getError(
|
||||
action,
|
||||
option,
|
||||
xhr
|
||||
) {
|
||||
let msg
|
||||
if (xhr.response) {
|
||||
msg = `${xhr.response.error || xhr.response}`
|
||||
} else if (xhr.responseText) {
|
||||
msg = `${xhr.responseText}`
|
||||
} else {
|
||||
msg = `fail to ${action} ${xhr.status}`
|
||||
}
|
||||
|
||||
return new Error(msg)
|
||||
}
|
||||
|
||||
function getBody(xhr) {
|
||||
const text = xhr.responseText || xhr.response
|
||||
if (!text) {
|
||||
return text
|
||||
}
|
||||
|
||||
try {
|
||||
return JSON.parse(text)
|
||||
} catch {
|
||||
return text
|
||||
}
|
||||
}
|
||||
|
||||
export default function (option) {
|
||||
const xhr = new XMLHttpRequest()
|
||||
const action = option.action
|
||||
|
||||
const formData = new FormData()
|
||||
if (option.data) {
|
||||
for (const [key, value] of Object.entries(option.data)) {
|
||||
if (Array.isArray(value)) formData.append(key, ...value)
|
||||
else formData.append(key, value)
|
||||
}
|
||||
}
|
||||
formData.append(option.filename, option.file, option.file.name)
|
||||
|
||||
xhr.addEventListener('error', () => {
|
||||
option.onError(getError(action, option, xhr))
|
||||
})
|
||||
|
||||
xhr.addEventListener('load', () => {
|
||||
if (xhr.status < 200 || xhr.status >= 300) {
|
||||
return option.onError(getError(action, option, xhr))
|
||||
}
|
||||
option.onSuccess(getBody(xhr))
|
||||
})
|
||||
|
||||
xhr.open(option.method, action, true)
|
||||
|
||||
if (option.withCredentials && 'withCredentials' in xhr) {
|
||||
xhr.withCredentials = true
|
||||
}
|
||||
|
||||
const headers = option.headers || {}
|
||||
if (headers instanceof Headers) {
|
||||
headers.forEach((value, key) => xhr.setRequestHeader(key, value))
|
||||
} else {
|
||||
for (const [key, value] of Object.entries(headers)) {
|
||||
if (common.isEmpty(value)) continue
|
||||
xhr.setRequestHeader(key, value)
|
||||
}
|
||||
}
|
||||
|
||||
xhr.send(formData)
|
||||
return xhr
|
||||
}
|
||||
@ -0,0 +1,167 @@
|
||||
import constant from "./constant";
|
||||
import CryptoJS from 'crypto-js';
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 判断设备
|
||||
*/
|
||||
mobile() {
|
||||
let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i);
|
||||
return flag && flag.length && flag.length > 0;
|
||||
},
|
||||
|
||||
/**
|
||||
* 判断是否为空
|
||||
*/
|
||||
isEmpty(value) {
|
||||
if (typeof value === "undefined" || value === null || (typeof value === "string" && value.trim() === "") || (Array.prototype.isPrototypeOf(value) && value.length === 0) || (Object.prototype.isPrototypeOf(value) && Object.keys(value).length === 0)) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 加密
|
||||
*/
|
||||
encrypt(plaintText) {
|
||||
let options = {
|
||||
mode: CryptoJS.mode.ECB,
|
||||
padding: CryptoJS.pad.Pkcs7
|
||||
};
|
||||
let key = CryptoJS.enc.Utf8.parse(constant.cryptojs_key);
|
||||
let encryptedData = CryptoJS.AES.encrypt(plaintText, key, options);
|
||||
return encryptedData.toString().replace(/\//g, "_").replace(/\+/g, "-");
|
||||
},
|
||||
|
||||
/**
|
||||
* 解密
|
||||
*/
|
||||
decrypt(encryptedBase64Str) {
|
||||
let val = encryptedBase64Str.replace(/\-/g, '+').replace(/_/g, '/');
|
||||
let options = {
|
||||
mode: CryptoJS.mode.ECB,
|
||||
padding: CryptoJS.pad.Pkcs7
|
||||
};
|
||||
let key = CryptoJS.enc.Utf8.parse(constant.cryptojs_key);
|
||||
let decryptedData = CryptoJS.AES.decrypt(val, key, options);
|
||||
return CryptoJS.enc.Utf8.stringify(decryptedData);
|
||||
},
|
||||
|
||||
/**
|
||||
* 表情包转换
|
||||
*/
|
||||
faceReg(content) {
|
||||
content = content.replace(/\[[^\[^\]]+\]/g, (word) => {
|
||||
let index = constant.emojiList.indexOf(word.replace("[", "").replace("]", ""));
|
||||
if (index > -1) {
|
||||
let url = constant.qiniuDownload + "emoji/q" + (index + 1) + ".gif";
|
||||
return '<img style="vertical-align: middle;width: 32px;height: 32px" src="' + url + '" title="' + word + '"/>';
|
||||
} else {
|
||||
return word;
|
||||
}
|
||||
});
|
||||
return content;
|
||||
},
|
||||
|
||||
/**
|
||||
* 图片转换
|
||||
*/
|
||||
pictureReg(content) {
|
||||
content = content.replace(/\[[^\[^\]]+\]/g, (word) => {
|
||||
let index = word.indexOf(",");
|
||||
if (index > -1) {
|
||||
let arr = word.replace("[", "").replace("]", "").split(",");
|
||||
return '<img style="border-radius: 5px;width: 100%;max-width: 250px" src="' + arr[1] + '" title="' + arr[0] + '"/>';
|
||||
} else {
|
||||
return word;
|
||||
}
|
||||
});
|
||||
return content;
|
||||
},
|
||||
|
||||
/**
|
||||
* 字符串转换为时间戳
|
||||
*/
|
||||
getDateTimeStamp(dateStr) {
|
||||
return Date.parse(dateStr.replace(/-/gi, "/"));
|
||||
},
|
||||
|
||||
getDateDiff(dateStr) {
|
||||
let publishTime = Date.parse(dateStr.replace(/-/gi, "/")) / 1000,
|
||||
d_seconds,
|
||||
d_minutes,
|
||||
d_hours,
|
||||
d_days,
|
||||
timeNow = Math.floor(new Date().getTime() / 1000),
|
||||
d,
|
||||
date = new Date(publishTime * 1000),
|
||||
Y = date.getFullYear(),
|
||||
M = date.getMonth() + 1,
|
||||
D = date.getDate(),
|
||||
H = date.getHours(),
|
||||
m = date.getMinutes(),
|
||||
s = date.getSeconds();
|
||||
//小于10的在前面补0
|
||||
if (M < 10) {
|
||||
M = '0' + M;
|
||||
}
|
||||
if (D < 10) {
|
||||
D = '0' + D;
|
||||
}
|
||||
if (H < 10) {
|
||||
H = '0' + H;
|
||||
}
|
||||
if (m < 10) {
|
||||
m = '0' + m;
|
||||
}
|
||||
if (s < 10) {
|
||||
s = '0' + s;
|
||||
}
|
||||
d = timeNow - publishTime;
|
||||
d_days = Math.floor(d / 86400);
|
||||
d_hours = Math.floor(d / 3600);
|
||||
d_minutes = Math.floor(d / 60);
|
||||
d_seconds = Math.floor(d);
|
||||
if (d_days > 0 && d_days < 3) {
|
||||
return d_days + '天前';
|
||||
} else if (d_days <= 0 && d_hours > 0) {
|
||||
return d_hours + '小时前';
|
||||
} else if (d_hours <= 0 && d_minutes > 0) {
|
||||
return d_minutes + '分钟前';
|
||||
} else if (d_seconds < 60) {
|
||||
if (d_seconds <= 0) {
|
||||
return '刚刚发表';
|
||||
} else {
|
||||
return d_seconds + '秒前';
|
||||
}
|
||||
} else if (d_days >= 3 && d_days < 30) {
|
||||
return M + '-' + D + ' ' + H + ':' + m;
|
||||
} else if (d_days >= 30) {
|
||||
return Y + '-' + M + '-' + D + ' ' + H + ':' + m;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 保存资源
|
||||
*/
|
||||
saveResource(that, type, path, size, mimeType, originalName, storeType) {
|
||||
let resource = {
|
||||
type: type,
|
||||
path: path,
|
||||
size: size,
|
||||
mimeType: mimeType,
|
||||
storeType: storeType,
|
||||
originalName: originalName
|
||||
};
|
||||
|
||||
that.$http.post(that.$constant.baseURL + "/resource/saveResource", resource)
|
||||
.catch((error) => {
|
||||
ElMessage({
|
||||
message: error.message,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,29 @@
|
||||
import Tiows from "./tiows";
|
||||
import constant from "./constant";
|
||||
import {ElMessage} from "element-plus";
|
||||
|
||||
export default function () {
|
||||
this.ws_protocol = constant.wsProtocol;
|
||||
this.ip = constant.imBaseURL;
|
||||
this.port = constant.wsPort;
|
||||
this.paramStr = 'Authorization=' + localStorage.getItem("userToken");
|
||||
this.binaryType = 'blob';
|
||||
|
||||
this.initWs = () => {
|
||||
this.tio = new Tiows(this.ws_protocol, this.ip, this.port, this.paramStr, this.binaryType);
|
||||
this.tio.connect();
|
||||
}
|
||||
|
||||
this.sendMsg = (value) => {
|
||||
if (this.tio && this.tio.ws && this.tio.ws.readyState === 1) {
|
||||
this.tio.send(value);
|
||||
return true;
|
||||
} else {
|
||||
ElMessage({
|
||||
message: "发送失败，请重试！",
|
||||
type: 'error'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,11 @@
|
||||
module.exports = {
|
||||
devServer: {
|
||||
port: 81,
|
||||
// port: 443,
|
||||
https: false,
|
||||
open: false
|
||||
},
|
||||
// publicPath: '/im/',
|
||||
lintOnSave: false,
|
||||
productionSourceMap: false
|
||||
}
|
||||
@ -0,0 +1,201 @@
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue