mirror of
https://github.com/yangjian102621/geekai.git
synced 2025-09-17 16:56:38 +08:00
refactor login dialog for front page
This commit is contained in:
RockYang
parent
cac3194d5b
commit
bcadee7290
@ -41,6 +41,8 @@ html, body {
|
||||
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-rendering: optimizeLegibility;
|
||||
|
||||
--primary-color: #21aa93
|
||||
}
|
||||
|
||||
.el-overlay-dialog {
|
||||
|
||||
@ -2,15 +2,6 @@
|
||||
background-color: #282c34;
|
||||
height 100%
|
||||
|
||||
.title {
|
||||
text-align center
|
||||
background-color #25272d
|
||||
font-size 24px
|
||||
color #ffffff
|
||||
padding 10px
|
||||
border-bottom 1px solid #3c3c3c
|
||||
}
|
||||
|
||||
.inner {
|
||||
display flex
|
||||
color #ffffff
|
||||
@ -19,52 +10,72 @@
|
||||
overflow-x hidden
|
||||
|
||||
.list-box {
|
||||
.app-item {
|
||||
border 1px solid #666666
|
||||
border-radius 6px
|
||||
overflow hidden
|
||||
transition: all 0.3s ease; /* 添加过渡效果 */
|
||||
|
||||
.el-image {
|
||||
padding 6px
|
||||
|
||||
.el-image__inner {
|
||||
border-radius 10px
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
.item {
|
||||
display flex
|
||||
flex-flow row
|
||||
border 1px solid #3c3c3c
|
||||
padding 10px
|
||||
|
||||
.name {
|
||||
.image {
|
||||
width 80px
|
||||
height 80px
|
||||
min-width 80px
|
||||
border-radius 5px
|
||||
overflow hidden
|
||||
}
|
||||
|
||||
.inner {
|
||||
display flex
|
||||
flex-flow column
|
||||
padding 0 0 0 10px
|
||||
width 100%
|
||||
|
||||
.info {
|
||||
text-align left
|
||||
font-size 16px
|
||||
font-weight bold
|
||||
color #47fff1
|
||||
|
||||
.info-title {
|
||||
color var(--el-text-color)
|
||||
font-size 1.25rem
|
||||
line-height 1.75rem
|
||||
letter-spacing: .025em;
|
||||
font-weight: 600;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
}
|
||||
|
||||
.opt {
|
||||
position: relative;
|
||||
width 100%
|
||||
top -5px
|
||||
}
|
||||
}
|
||||
|
||||
.hello-msg {
|
||||
height 60px
|
||||
padding 10px
|
||||
font-size 14px
|
||||
.info-text {
|
||||
padding 8px 0
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
word-break: break-all;
|
||||
height 34px
|
||||
font-size: .875rem;
|
||||
color #999999
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0 10px rgba(71, 255, 241, 0.6); /* 添加阴影效果 */
|
||||
transform: translateY(-10px); /* 向上移动10像素 */
|
||||
.btn {
|
||||
margin-top 10px
|
||||
display flex
|
||||
justify-content right
|
||||
|
||||
.el-button {
|
||||
margin-left 10px
|
||||
|
||||
.el-icon {
|
||||
margin-right 5px
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -140,6 +140,7 @@
|
||||
|
||||
.content {
|
||||
width: 100%
|
||||
overflow auto
|
||||
box-sizing: border-box
|
||||
background-color #282c34
|
||||
}
|
||||
|
||||
@ -65,9 +65,12 @@
|
||||
padding 15px 0 15px 15px;
|
||||
overflow-x hidden
|
||||
overflow-y visible
|
||||
display flex
|
||||
flex-flow row
|
||||
|
||||
.user-profile {
|
||||
padding 10px 20px 20px 20px
|
||||
width 300px
|
||||
background-color #393F4A
|
||||
color #ffffff
|
||||
border-radius 10px
|
||||
@ -91,12 +94,15 @@
|
||||
|
||||
|
||||
.product-box {
|
||||
padding 0 20px
|
||||
width 100%
|
||||
|
||||
.info {
|
||||
.el-alert__description {
|
||||
font-size 14px !important
|
||||
margin 0
|
||||
}
|
||||
padding 10px 20px 20px 0
|
||||
padding 0 0 20px 0
|
||||
}
|
||||
|
||||
.list-box {
|
||||
|
||||
@ -1,19 +1,10 @@
|
||||
<template>
|
||||
<div class="list-box" ref="container">
|
||||
<div class="list-inner">
|
||||
<div
|
||||
class="list-item"
|
||||
v-for="(item, index) in items"
|
||||
:key="index"
|
||||
:style="{width:itemWidth + 'px'}"
|
||||
>
|
||||
<div class="item-inner" :style="{padding: gap/2+'px'}">
|
||||
<div class="item-wrapper">
|
||||
<slot :item="item" :index="index" :width="itemWidth"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list-box" ref="containerRef">
|
||||
<el-row :gutter="gap">
|
||||
<el-col v-for="item in items" :key="item.id" :span="span" :style="{marginBottom:gap+'px'} ">
|
||||
<slot :item="item"></slot>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -29,7 +20,7 @@ const props = defineProps({
|
||||
},
|
||||
gap: {
|
||||
type: Number,
|
||||
default: 12
|
||||
default: 10
|
||||
},
|
||||
width: {
|
||||
type: Number,
|
||||
@ -37,45 +28,35 @@ const props = defineProps({
|
||||
}
|
||||
});
|
||||
|
||||
const container = ref(null)
|
||||
const itemWidth = ref(props.width)
|
||||
const containerRef = ref(null)
|
||||
const span = ref(12)
|
||||
|
||||
onMounted(() => {
|
||||
computeSize()
|
||||
calcSpan()
|
||||
})
|
||||
|
||||
const computeSize = () => {
|
||||
const w = container.value.offsetWidth - 10 // 减去滚动条的宽度
|
||||
let cols = Math.floor(w / props.width)
|
||||
itemWidth.value = Math.floor(w / cols)
|
||||
}
|
||||
|
||||
window.onresize = () => {
|
||||
computeSize()
|
||||
const calcSpan = () => {
|
||||
let cols = Math.floor(containerRef.value.offsetWidth / props.width)
|
||||
if (cols >= 12) {
|
||||
span.value = 1
|
||||
return
|
||||
}
|
||||
console.log(cols)
|
||||
while (cols > 1) {
|
||||
if (24 % cols === 0) {
|
||||
span.value = 24 / cols
|
||||
return
|
||||
}
|
||||
cols -= 1
|
||||
}
|
||||
span.value = 12
|
||||
}
|
||||
window.onresize = () => calcSpan()
|
||||
</script>
|
||||
|
||||
<style scoped lang="stylus">
|
||||
|
||||
.list-box {
|
||||
|
||||
.list-inner {
|
||||
display flex
|
||||
flex-wrap wrap
|
||||
|
||||
.list-item {
|
||||
.item-inner {
|
||||
display flex
|
||||
|
||||
.item-wrapper {
|
||||
height 100%
|
||||
width 100%
|
||||
display flex
|
||||
justify-content center
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -2,15 +2,21 @@
|
||||
<div>
|
||||
<div class="page-apps custom-scroll">
|
||||
<div class="inner" :style="{height: listBoxHeight + 'px'}">
|
||||
<ItemList :items="list" v-if="list.length > 0" :gap="20" :width="250">
|
||||
<ItemList :items="list" v-if="list.length > 0" :gap="15" :width="300">
|
||||
<template #default="scope">
|
||||
<div class="app-item" :style="{width: scope.width+'px'}">
|
||||
<el-image :src="scope.item.icon" fit="cover" :style="{height: scope.width+'px'}"/>
|
||||
<div class="title">
|
||||
<span class="name">{{ scope.item.name }}</span>
|
||||
<div class="opt">
|
||||
<div class="item">
|
||||
<div class="image">
|
||||
<el-image :src="scope.item.icon" fit="cover"/>
|
||||
</div>
|
||||
|
||||
<div class="inner">
|
||||
<div class="info">
|
||||
<div class="info-title">{{ scope.item.name }}</div>
|
||||
<div class="info-text">{{ scope.item.hello_msg }}</div>
|
||||
</div>
|
||||
<div class="btn">
|
||||
<div v-if="hasRole(scope.item.key)">
|
||||
<el-button size="small" type="success" @click="useRole(scope.item)">使用</el-button>
|
||||
<el-button size="small" color="#21aa93" @click="useRole(scope.item)">使用</el-button>
|
||||
<el-button size="small" type="danger" @click="updateRole(scope.item,'remove')">移除</el-button>
|
||||
</div>
|
||||
<el-button v-else size="small"
|
||||
@ -23,15 +29,34 @@
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hello-msg" ref="elements">{{ scope.item.intro }}</div>
|
||||
|
||||
|
||||
</div>
|
||||
<!-- <div class="app-item">-->
|
||||
<!-- <el-image :src="scope.item.icon" fit="cover"/>-->
|
||||
<!-- <div class="title">-->
|
||||
<!-- <span class="name">{{ scope.item.name }}</span>-->
|
||||
<!-- <div class="opt">-->
|
||||
<!-- <div v-if="hasRole(scope.item.key)">-->
|
||||
<!-- <el-button size="small" type="success" @click="useRole(scope.item)">使用</el-button>-->
|
||||
<!-- <el-button size="small" type="danger" @click="updateRole(scope.item,'remove')">移除</el-button>-->
|
||||
<!-- </div>-->
|
||||
<!-- <el-button v-else size="small"-->
|
||||
<!-- style="--el-color-primary:#009999"-->
|
||||
<!-- @click="updateRole(scope.item, 'add')">-->
|
||||
<!-- <el-icon>-->
|
||||
<!-- <Plus/>-->
|
||||
<!-- </el-icon>-->
|
||||
<!-- <span>添加应用</span>-->
|
||||
<!-- </el-button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="hello-msg" ref="elements">{{ scope.item.intro }}</div>-->
|
||||
<!-- </div>-->
|
||||
</template>
|
||||
</ItemList>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<login-dialog :show="showLoginDialog" @hide="getRoles" @success=""/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -39,18 +64,18 @@
|
||||
import {onMounted, ref} from "vue"
|
||||
import {ElMessage} from "element-plus";
|
||||
import {httpGet, httpPost} from "@/utils/http";
|
||||
import ItemList from "@/components/ItemList.vue";
|
||||
import {Plus} from "@element-plus/icons-vue";
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {checkSession} from "@/action/session";
|
||||
import {arrayContains, removeArrayItem, substr} from "@/utils/libs";
|
||||
import {useRouter} from "vue-router";
|
||||
import {useSharedStore} from "@/store/sharedata";
|
||||
import ItemList from "@/components/ItemList.vue";
|
||||
import {Plus} from "@element-plus/icons-vue";
|
||||
|
||||
const listBoxHeight = window.innerHeight - 147
|
||||
const listBoxHeight = window.innerHeight - 87
|
||||
const list = ref([])
|
||||
const showLoginDialog = ref(false)
|
||||
const roles = ref([])
|
||||
const elements = ref(null)
|
||||
const store = useSharedStore();
|
||||
|
||||
onMounted(() => {
|
||||
httpGet("/api/role/list?all=true").then((res) => {
|
||||
const items = res.data
|
||||
@ -67,7 +92,6 @@ onMounted(() => {
|
||||
})
|
||||
|
||||
const getRoles = () => {
|
||||
showLoginDialog.value = false
|
||||
checkSession().then(user => {
|
||||
roles.value = user.chat_roles
|
||||
}).catch(() => {
|
||||
@ -98,7 +122,7 @@ const updateRole = (row, opt) => {
|
||||
ElMessage.error(title.value + "失败：" + e.message)
|
||||
})
|
||||
}).catch(() => {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@ -99,7 +99,7 @@
|
||||
|
||||
<template #default>
|
||||
<div class="chat-config">
|
||||
<el-select v-model="roleId" filterable placeholder="角色" @change="newChat"
|
||||
<el-select v-model="roleId" filterable placeholder="角色" @change="_newChat"
|
||||
class="role-select"
|
||||
style="width:150px">
|
||||
<el-option
|
||||
@ -115,7 +115,7 @@
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<el-select v-model="modelID" filterable placeholder="模型" @change="newChat"
|
||||
<el-select v-model="modelID" filterable placeholder="模型" @change="_newChat"
|
||||
:disabled="disableModel"
|
||||
style="width:150px">
|
||||
<el-option
|
||||
@ -144,7 +144,7 @@
|
||||
</el-tooltip>
|
||||
</span>
|
||||
|
||||
<span class="tool-item">
|
||||
<span class="tool-item" v-if="isLogin">
|
||||
<el-tooltip class="box-item" effect="dark" content="上传附件">
|
||||
<file-select v-if="isLogin" :user-id="loginUser.id" @selected="insertURL"/>
|
||||
</el-tooltip>
|
||||
@ -378,6 +378,11 @@ const resizeElement = function () {
|
||||
leftBoxHeight.value = window.innerHeight - 90 - 45 - 82;
|
||||
};
|
||||
|
||||
const _newChat = () => {
|
||||
if (isLogin.value) {
|
||||
newChat()
|
||||
}
|
||||
}
|
||||
const disableModel = ref(false)
|
||||
// 新建会话
|
||||
const newChat = () => {
|
||||
|
||||
@ -221,7 +221,6 @@
|
||||
|
||||
</div>
|
||||
|
||||
<login-dialog :show="showLoginDialog" @hide="showLoginDialog = false" @success="initData"/>
|
||||
<el-image-viewer @close="() => { previewURL = '' }" v-if="previewURL !== ''" :url-list="[previewURL]"/>
|
||||
</div>
|
||||
</template>
|
||||
@ -233,16 +232,16 @@ import {httpGet, httpPost} from "@/utils/http";
|
||||
import {ElMessage, ElMessageBox, ElNotification} from "element-plus";
|
||||
import Clipboard from "clipboard";
|
||||
import {checkSession} from "@/action/session";
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {useSharedStore} from "@/store/sharedata";
|
||||
|
||||
const listBoxHeight = ref(0)
|
||||
const paramBoxHeight = ref(0)
|
||||
const showLoginDialog = ref(false)
|
||||
const isLogin = ref(false)
|
||||
const loading = ref(true)
|
||||
const colWidth = ref(240)
|
||||
const colWidth = ref(220)
|
||||
const isOver = ref(false)
|
||||
const previewURL = ref("")
|
||||
const store = useSharedStore();
|
||||
|
||||
const resizeElement = function () {
|
||||
listBoxHeight.value = window.innerHeight - 90
|
||||
@ -438,7 +437,7 @@ const generate = () => {
|
||||
}
|
||||
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
httpPost("/api/dall/image", params.value).then(() => {
|
||||
|
||||
@ -14,7 +14,7 @@
|
||||
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
effect="light"
|
||||
content="部署文档"
|
||||
placement="bottom">
|
||||
<a href="https://ai.r9it.com/docs/install/" class="link-button" target="_blank">
|
||||
@ -24,7 +24,7 @@
|
||||
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
effect="light"
|
||||
content="项目源码"
|
||||
placement="bottom">
|
||||
<a href="https://github.com/yangjian102621/chatgpt-plus" class="link-button" target="_blank">
|
||||
@ -68,7 +68,7 @@
|
||||
</el-dropdown>
|
||||
|
||||
<div v-else>
|
||||
<el-button size="small" color="#21aa93" @click="show = true" round>登录</el-button>
|
||||
<el-button size="small" color="#21aa93" @click="store.setShowLoginDialog(true)" round>登录</el-button>
|
||||
<el-button size="small" @click="router.push('/register')" round>注册</el-button>
|
||||
</div>
|
||||
</div>
|
||||
@ -113,7 +113,7 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="content" :style="{height: mainWinHeight+'px'}">
|
||||
<div class="content custom-scroll" :style="{height: mainWinHeight+'px'}">
|
||||
<router-view :key="routerViewKey" v-slot="{ Component }">
|
||||
<transition name="move" mode="out-in">
|
||||
<component :is="Component"></component>
|
||||
@ -220,5 +220,6 @@ const loginCallback = () => {
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import "@/assets/css/custom-scroll.styl"
|
||||
@import "@/assets/css/home.styl"
|
||||
</style>
|
||||
|
||||
@ -600,8 +600,6 @@
|
||||
</div>
|
||||
|
||||
<el-image-viewer @close="() => { previewURL = '' }" v-if="previewURL !== ''" :url-list="[previewURL]"/>
|
||||
|
||||
<login-dialog :show="showLoginDialog" @hide="showLoginDialog = false" @success="initData"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -616,14 +614,14 @@ import {checkSession} from "@/action/session";
|
||||
import {useRouter} from "vue-router";
|
||||
import {getSessionId} from "@/store/session";
|
||||
import {copyObj, removeArrayItem} from "@/utils/libs";
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {useSharedStore} from "@/store/sharedata";
|
||||
|
||||
const listBoxHeight = ref(0)
|
||||
const paramBoxHeight = ref(0)
|
||||
const showLoginDialog = ref(false)
|
||||
const loading = ref(true)
|
||||
const colWidth = ref(240)
|
||||
const colWidth = ref(220)
|
||||
const previewURL = ref("")
|
||||
const store = useSharedStore();
|
||||
|
||||
const resizeElement = function () {
|
||||
listBoxHeight.value = window.innerHeight - 80
|
||||
@ -903,7 +901,7 @@ const beforeUpload = (key) => {
|
||||
// 图片上传
|
||||
const uploadImg = (file) => {
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
|
||||
@ -936,7 +934,7 @@ const uploadImg = (file) => {
|
||||
const promptRef = ref(null)
|
||||
const generate = () => {
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
@ -497,8 +497,6 @@
|
||||
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
<login-dialog :show="showLoginDialog" @hide="showLoginDialog = false" @success="initData"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -511,17 +509,17 @@ import Clipboard from "clipboard";
|
||||
import {checkSession} from "@/action/session";
|
||||
import {useRouter} from "vue-router";
|
||||
import {getSessionId} from "@/store/session";
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {useSharedStore} from "@/store/sharedata";
|
||||
|
||||
const listBoxHeight = ref(0)
|
||||
const paramBoxHeight = ref(0)
|
||||
const fullImgHeight = ref(window.innerHeight - 60)
|
||||
const showTaskDialog = ref(false)
|
||||
const item = ref({})
|
||||
const showLoginDialog = ref(false)
|
||||
const isLogin = ref(false)
|
||||
const loading = ref(true)
|
||||
const colWidth = ref(240)
|
||||
const colWidth = ref(220)
|
||||
const store = useSharedStore();
|
||||
|
||||
const resizeElement = function () {
|
||||
listBoxHeight.value = window.innerHeight - 80
|
||||
@ -730,7 +728,7 @@ const generate = () => {
|
||||
}
|
||||
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
@ -311,7 +311,7 @@ const loading = ref(true)
|
||||
const isOver = ref(false)
|
||||
const imgType = ref("mj") // 图片类别
|
||||
const listBoxHeight = window.innerHeight - 124
|
||||
const colWidth = ref(240)
|
||||
const colWidth = ref(220)
|
||||
const fullImgHeight = ref(window.innerHeight - 60)
|
||||
const showTaskDialog = ref(false)
|
||||
const item = ref({})
|
||||
|
||||
@ -84,8 +84,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<login-dialog :show="showLoginDialog" @hide="showLoginDialog = false" @success="initData"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -97,17 +95,17 @@ import {ElMessage} from "element-plus";
|
||||
import Clipboard from "clipboard";
|
||||
import InviteList from "@/components/InviteList.vue";
|
||||
import {checkSession} from "@/action/session";
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {useSharedStore} from "@/store/sharedata";
|
||||
|
||||
const inviteURL = ref("")
|
||||
const qrImg = ref("")
|
||||
const qrImg = ref("/images/wx.png")
|
||||
const inviteChatCalls = ref(0)
|
||||
const inviteImgCalls = ref(0)
|
||||
const hits = ref(0)
|
||||
const regNum = ref(0)
|
||||
const rate = ref(0)
|
||||
const isLogin = ref(false)
|
||||
const showLoginDialog = ref(false)
|
||||
const store = useSharedStore()
|
||||
|
||||
onMounted(() => {
|
||||
initData()
|
||||
@ -152,7 +150,7 @@ const initData = () => {
|
||||
ElMessage.error("获取系统配置失败：" + e.message)
|
||||
})
|
||||
}).catch(() => {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -90,13 +90,10 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<login-dialog :show="showLoginDialog" @hide="showLoginDialog = false" @success="initData"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {nextTick, onMounted, onUnmounted, ref} from 'vue';
|
||||
import {Markmap} from 'markmap-view';
|
||||
import {Transformer} from 'markmap-lib';
|
||||
@ -105,6 +102,7 @@ import {httpGet} from "@/utils/http";
|
||||
import {ElMessage} from "element-plus";
|
||||
import {Download} from "@element-plus/icons-vue";
|
||||
import {Toolbar} from 'markmap-toolbar';
|
||||
import {useSharedStore} from "@/store/sharedata";
|
||||
|
||||
const leftBoxHeight = ref(window.innerHeight - 105)
|
||||
const rightBoxHeight = ref(window.innerHeight - 115)
|
||||
@ -125,10 +123,10 @@ const md = require('markdown-it')({breaks: true});
|
||||
const content = ref(text.value)
|
||||
const html = ref("")
|
||||
|
||||
const showLoginDialog = ref(false)
|
||||
const isLogin = ref(false)
|
||||
const loginUser = ref({power: 0})
|
||||
const transformer = new Transformer();
|
||||
const store = useSharedStore();
|
||||
|
||||
|
||||
const svgRef = ref(null)
|
||||
@ -150,10 +148,6 @@ onMounted(() => {
|
||||
});
|
||||
|
||||
const initData = () => {
|
||||
checkSession().then(user => {
|
||||
loginUser.value = user
|
||||
isLogin.value = true
|
||||
|
||||
httpGet("/api/model/list").then(res => {
|
||||
for (let v of res.data) {
|
||||
if (v.platform === "OpenAI" && v.value.indexOf("gpt-4-gizmo") === -1) {
|
||||
@ -161,10 +155,14 @@ const initData = () => {
|
||||
}
|
||||
}
|
||||
modelID.value = models.value[0].id
|
||||
connect(user.id)
|
||||
}).catch(e => {
|
||||
ElMessage.error("获取模型失败：" + e.message)
|
||||
})
|
||||
|
||||
checkSession().then(user => {
|
||||
loginUser.value = user
|
||||
isLogin.value = true
|
||||
connect(user.id)
|
||||
}).catch(() => {
|
||||
});
|
||||
}
|
||||
@ -205,7 +203,7 @@ window.onresize = () => {
|
||||
}
|
||||
|
||||
const socket = ref(null)
|
||||
const heartbeatHandle = ref(null)
|
||||
const heartbeatHandle = ref(0)
|
||||
const connect = (userId) => {
|
||||
if (socket.value !== null) {
|
||||
socket.value.close()
|
||||
@ -292,7 +290,7 @@ const generateAI = () => {
|
||||
return ElMessage.error("请输入你的需求")
|
||||
}
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
loading.value = true
|
||||
|
||||
@ -2,8 +2,6 @@
|
||||
<div>
|
||||
<div class="member custom-scroll">
|
||||
<div class="inner" :style="{height: listBoxHeight + 'px'}">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="7">
|
||||
<div class="user-profile">
|
||||
<user-profile/>
|
||||
|
||||
@ -27,9 +25,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="17">
|
||||
<div class="product-box">
|
||||
<div class="info" v-if="orderPayInfoText !== ''">
|
||||
<el-alert type="success" show-icon :closable="false" effect="dark">
|
||||
@ -37,9 +33,9 @@
|
||||
</el-alert>
|
||||
</div>
|
||||
|
||||
<ItemList :items="list" v-if="list.length > 0" :gap="30" :width="240">
|
||||
<ItemList :items="list" v-if="list.length > 0" :gap="15" :width="240">
|
||||
<template #default="scope">
|
||||
<div class="product-item" :style="{width: scope.width+'px'}">
|
||||
<div class="product-item">
|
||||
<div class="image-container">
|
||||
<el-image :src="vipImg" fit="cover"/>
|
||||
</div>
|
||||
@ -72,7 +68,8 @@
|
||||
<i class="iconfont icon-alipay"></i> 支付宝
|
||||
</el-button>
|
||||
<el-button type="success" @click="huPiPay(scope.item)" size="small" v-if="payWays['hupi']">
|
||||
<span v-if="payWays['hupi']['name'] === 'wechat'"><i class="iconfont icon-wechat-pay"></i> 微信</span>
|
||||
<span v-if="payWays['hupi']['name'] === 'wechat'"><i
|
||||
class="iconfont icon-wechat-pay"></i> 微信</span>
|
||||
<span v-else><i class="iconfont icon-alipay"></i> 支付宝</span>
|
||||
</el-button>
|
||||
|
||||
@ -91,9 +88,6 @@
|
||||
<user-order v-if="isLogin"/>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
|
||||
<password-dialog v-if="isLogin" :show="showPasswordDialog" @hide="showPasswordDialog = false"
|
||||
@ -154,7 +148,6 @@
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
<login-dialog :show="showLoginDialog" @hide="showLoginDialog = false" @success="loginSuccess"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -164,7 +157,6 @@ import {ElMessage} from "element-plus";
|
||||
import {httpGet, httpPost} from "@/utils/http";
|
||||
import ItemList from "@/components/ItemList.vue";
|
||||
import {InfoFilled, SuccessFilled} from "@element-plus/icons-vue";
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {checkSession} from "@/action/session";
|
||||
import UserProfile from "@/components/UserProfile.vue";
|
||||
import PasswordDialog from "@/components/PasswordDialog.vue";
|
||||
@ -174,10 +166,10 @@ import {useRouter} from "vue-router";
|
||||
import {removeUserToken} from "@/store/session";
|
||||
import UserOrder from "@/components/UserOrder.vue";
|
||||
import CountDown from "@/components/CountDown.vue";
|
||||
import {useSharedStore} from "@/store/sharedata";
|
||||
|
||||
const listBoxHeight = window.innerHeight - 97
|
||||
const list = ref([])
|
||||
const showLoginDialog = ref(false)
|
||||
const showPayDialog = ref(false)
|
||||
const vipImg = ref("/images/vip.png")
|
||||
const enableReward = ref(false) // 是否启用众筹功能
|
||||
@ -205,6 +197,7 @@ const amount = ref(0)
|
||||
const payName = ref("支付宝")
|
||||
const curPay = ref("alipay") // 当前支付方式
|
||||
const vipInfoText = ref("")
|
||||
const store = useSharedStore()
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
@ -212,7 +205,7 @@ onMounted(() => {
|
||||
user.value = _user
|
||||
isLogin.value = true
|
||||
}).catch(() => {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
})
|
||||
|
||||
httpGet("/api/product/list").then((res) => {
|
||||
@ -278,7 +271,7 @@ const alipay = (row) => {
|
||||
curPay.value = "alipay"
|
||||
amount.value = (row.price - row.discount).toFixed(2)
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
|
||||
@ -294,7 +287,7 @@ const huPiPay = (row) => {
|
||||
curPay.value = "hupi"
|
||||
amount.value = (row.price - row.discount).toFixed(2)
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
|
||||
@ -310,7 +303,7 @@ const PayJs = (row) => {
|
||||
curPay.value = "payjs"
|
||||
amount.value = (row.price - row.discount).toFixed(2)
|
||||
if (!isLogin.value) {
|
||||
showLoginDialog.value = true
|
||||
store.setShowLoginDialog(true)
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="power-log" v-loading="loading">
|
||||
<div class="inner">
|
||||
<div class="list-box" :style="{height: listBoxHeight + 'px'}">
|
||||
<div class="power-log custom-scroll" v-loading="loading">
|
||||
<div class="inner" :style="{height: listBoxHeight + 'px'}">
|
||||
<div class="list-box">
|
||||
<div class="handle-box">
|
||||
<el-input v-model="query.model" placeholder="模型" class="handle-input mr10" clearable></el-input>
|
||||
<el-date-picker
|
||||
@ -11,9 +11,9 @@
|
||||
end-placeholder="结束日期"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="margin: 0 10px;width: 200px; position: relative;top:3px;"
|
||||
style="margin: 0 10px;width: 200px;"
|
||||
/>
|
||||
<el-button type="primary" :icon="Search" @click="fetchData">搜索</el-button>
|
||||
<el-button color="#21aa93" :icon="Search" @click="fetchData">搜索</el-button>
|
||||
</div>
|
||||
|
||||
<el-row v-if="items.length > 0">
|
||||
@ -71,21 +71,25 @@ import {Search} from "@element-plus/icons-vue";
|
||||
import Clipboard from "clipboard";
|
||||
import {ElMessage} from "element-plus";
|
||||
import {httpPost} from "@/utils/http";
|
||||
import {checkSession} from "@/action/session";
|
||||
|
||||
const items = ref([])
|
||||
const total = ref(0)
|
||||
const page = ref(1)
|
||||
const pageSize = ref(20)
|
||||
const loading = ref(false)
|
||||
const listBoxHeight = window.innerHeight - 117
|
||||
const listBoxHeight = window.innerHeight - 87
|
||||
const query = ref({
|
||||
model: "",
|
||||
date: []
|
||||
})
|
||||
const tagColors = ref(["", "success", "", "danger", "info", "warning"])
|
||||
const tagColors = ref(["primary", "success", "primary", "danger", "info", "warning"])
|
||||
|
||||
onMounted(() => {
|
||||
checkSession().then(() => {
|
||||
fetchData()
|
||||
}).catch(() => {
|
||||
})
|
||||
const clipboard = new Clipboard('.copy-order-no');
|
||||
clipboard.on('success', () => {
|
||||
ElMessage.success("复制成功！");
|
||||
@ -121,33 +125,12 @@ const fetchData = () => {
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import "@/assets/css/custom-scroll.styl"
|
||||
.power-log {
|
||||
color #ffffff
|
||||
.inner {
|
||||
padding 0 20px 20px 20px
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px; /* 滚动条宽度 */
|
||||
}
|
||||
|
||||
/* 修改滚动条轨道的背景颜色 */
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
/* 修改滚动条的滑块颜色 */
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #cccccc;
|
||||
border-radius 8px
|
||||
}
|
||||
|
||||
/* 修改滚动条的滑块的悬停颜色 */
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #999999;
|
||||
}
|
||||
overflow auto
|
||||
|
||||
.list-box {
|
||||
overflow-x hidden
|
||||
|
||||
Loading…
Reference in New Issue
Block a user