Skip to content

Y
yaoai-video
Commit 3db44894 authored by yaoke.yk's avatar yaoke.yk
Browse files
Options

Merge remote-tracking branch 'origin/main'

parents cda0db1d 07a22029
Hide whitespace changes
Inline Side-by-side
Showing with 913 additions and 121 deletions
doc/h5/package-lock.json
View file @ 3db44894
......@@ -9,6 +9,7 @@
"version": "0.0.1",
"dependencies": {
"axios": "^1.5.0",
"echarts": "^6.1.0",
"element-plus": "^2.14.0",
"nprogress": "^0.2.0",
"vue": "^3.4.0",
......@@ -1240,6 +1241,16 @@
"node": ">= 0.4"
}
},
"node_modules/echarts": {
"version": "6.1.0",
"resolved": "https://registry.npmmirror.com/echarts/-/echarts-6.1.0.tgz",
"integrity": "sha512-q0yaFPggC9FUdsWH4blavRWFmxdrIodbkoKNAjJudAI6CA9gNPxHtV2RcZNEepZVlk4yvBYkOkbk6HIVpIyHZA==",
"license": "Apache-2.0",
"dependencies": {
"tslib": "2.3.0",
"zrender": "6.1.0"
}
},
"node_modules/element-plus": {
"version": "2.14.0",
"resolved": "https://registry.npmmirror.com/element-plus/-/element-plus-2.14.0.tgz",
......@@ -1849,6 +1860,12 @@
"node": ">=0.10.0"
}
},
"node_modules/tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
"license": "0BSD"
},
"node_modules/typescript": {
"version": "5.9.3",
"resolved": "https://registry.npmmirror.com/typescript/-/typescript-5.9.3.tgz",
......@@ -2008,6 +2025,15 @@
"peerDependencies": {
"vue": "^3.0.1"
}
},
"node_modules/zrender": {
"version": "6.1.0",
"resolved": "https://registry.npmmirror.com/zrender/-/zrender-6.1.0.tgz",
"integrity": "sha512-oEGMDB6pOP2S6OwRR4PdVv610zrjnA3Bh+JnSG12fYJlBKjtNAoEb5fSUoCOOINlH96I2fU38/A2UpRKs67xYQ==",
"license": "BSD-3-Clause",
"dependencies": {
"tslib": "2.3.0"
}
}
}
}
doc/h5/package.json
View file @ 3db44894
......@@ -11,6 +11,7 @@
},
"dependencies": {
"axios": "^1.5.0",
"echarts": "^6.1.0",
"element-plus": "^2.14.0",
"nprogress": "^0.2.0",
"vue": "^3.4.0",
......
doc/h5/src/components/Aside.vue
View file @ 3db44894
<template>
<nav v-if="isShow" class="navbar w-200 px-8">
<nav v-if="isShow" class="navbar w-200 px-8 min-w-200">
<div class="flex-center pt-28">
<img src="@/static/imgs/logo.png" class="w-100 h-22" alt="Logo">
</div>
<div class="mt-22 h-36 flex-center relative selectbox">
<el-icon class="absolute top-1 left-16" size="20" style="z-index: 1;">
<Help />
</el-icon>
<div class="absolute top-10 left-16" style="z-index: 1;">
<svg t="1779787867535" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="73193" width="16" height="16">
<path
d="M426.3 611.6c-141.5 0-256.5-115.1-256.5-256.5s115-256.6 256.5-256.6S682.8 213.6 682.8 355 567.7 611.6 426.3 611.6z m0-416.4c-88.1 0-159.8 71.7-159.8 159.8s71.7 159.8 159.8 159.8c88.1 0 159.8-71.7 159.8-159.8s-71.7-159.8-159.8-159.8z"
fill="#5337C7" p-id="73194"></path>
<path
d="M738.5 923.8c-26.7 0-48.4-21.7-48.4-48.4 0-145.5-118.4-263.9-263.9-263.9S162.4 730 162.4 875.5c0 26.7-21.7 48.4-48.4 48.4s-48.4-21.7-48.4-48.4c0-198.8 161.8-360.6 360.6-360.6s360.6 161.8 360.6 360.6c0.1 26.7-21.6 48.3-48.3 48.3zM912 854.4c-26.7 0-48.4-21.7-48.4-48.4 0-101.5-56.9-192.3-148.6-237-15.4-7.5-25.7-22.6-27-39.7-1.3-17.1 6.4-33.6 20.5-43.4 42.8-30 68.4-78.9 68.4-130.9 0-72.1-48.5-135.5-118-154.3-25.8-7-41-33.5-34.1-59.3 6.9-25.8 33.4-41.1 59.3-34.1 111.6 30.1 189.5 132 189.5 247.7 0 59.8-21 117-58.1 162.3 90.7 67.3 144.8 172.9 144.8 288.7 0.1 26.8-21.6 48.4-48.3 48.4z"
fill="#5337C7" p-id="73195"></path>
</svg>
</div>
<el-select v-model="groupValue">
<el-option v-for="item in groupList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
......@@ -15,9 +23,12 @@
<div class="ml-16 mt-16 mb-4" style="color: #00000066;">创作</div>
<div class="flex-align-center gap-8 mt-12 cursor-pointer pl-16 h-36 rounded-4"
:class="indexvalue == 0 ? 'active' : ''" @click="switchTab(0)">
<el-icon>
<VideoCameraFilled />
</el-icon>
<svg t="1779787201077" class="icon" viewBox="0 0 1251 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="51112" width="16" height="18">
<path
d="M1063.442963 0H188.112593C84.347259 0 0 83.171556 0 185.457778v653.084444C0 940.828444 84.347259 1024 188.112593 1024h875.33037c103.765333 0 188.112593-83.171556 188.112593-185.457778V185.457778C1251.403852 83.285333 1167.056593 0 1063.442963 0zM75.282963 549.015704h91.894518v131.602963H75.282963v-131.602963z m91.780741-74.183111H75.093333V343.22963h91.894519v131.602963zM242.270815 74.221037h766.78637v875.557926H242.308741V74.221037zM1176.272593 474.832593h-91.894519V343.22963h91.894519v131.602963z m-91.894519 74.183111h91.894519v131.602963h-91.894519v-131.602963z m91.894519-363.557926v83.702518h-91.894519V76.231111c52.224 9.633185 91.894519 54.916741 91.894519 109.188741zM167.063704 76.231111v192.891259H75.093333V185.457778c0.151704-54.234074 39.670519-99.555556 91.894519-109.188741z m-91.780741 762.311111v-83.740444h91.894518v193.042963c-52.337778-9.784889-91.894519-55.068444-91.894518-109.340445z m1009.095111 109.150815v-192.891259h91.894519v83.702518c0 54.234074-39.670519 99.555556-91.894519 109.188741z m-277.504-510.482963A84.992 84.992 0 0 1 850.678519 512c0 31.250963-16.497778 59.164444-43.842371 74.752l-274.583704 156.406519a88.329481 88.329481 0 0 1-87.722666 0 84.992 84.992 0 0 1-43.880297-74.752V355.593481c0-31.250963 16.497778-59.164444 43.880297-74.714074a87.988148 87.988148 0 0 1 87.570963 0l274.735407 156.368593z m-37.584593 85.333333a12.250074 12.250074 0 0 0 6.295704-10.581333c0-2.616889-0.83437-7.585185-6.144-10.619259L494.554074 345.012148a12.515556 12.515556 0 0 0-12.439704 0 12.136296 12.136296 0 0 0-6.144 10.619259v312.775112c0 6.181926 3.792593 9.216 6.144 10.619259 2.389333 1.327407 7.130074 3.034074 12.439704 0l274.735407-156.406519z"
:fill="indexvalue == 0 ? '#5337C7' : '#3f3f51'" p-id="51113"></path>
</svg>
<span>剧本生成短剧</span>
</div>
</div>
......@@ -25,14 +36,20 @@
<div class="ml-16 mt-16 mb-4" style="color: #00000066;">我的</div>
<div class="flex-align-center gap-8 mt-12 cursor-pointer pl-16 h-36 rounded-4"
:class="indexvalue == 1 ? 'active' : ''" @click="switchTab(1)">
<el-icon>
<Files />
</el-icon>
<svg t="1779787587591" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="64906" width="16" height="16">
<path
d="M450.66344 529.684L50.09544 339.18C22.20544 328.377 3.82144 301.543 3.82144 271.633c0-29.91 18.383-56.744 46.274-67.546L450.66344 13.582a144.87 144.87 0 0 1 122.054 0L973.28544 204.087c27.89 10.802 46.274 37.636 46.274 67.546 0 29.91-18.383 56.744-46.274 67.546L572.71744 529.684a144.87 144.87 0 0 1-122.054 0z"
:fill="indexvalue == 1 ? '#5337C7' : '#3f3f51'" p-id="64907"></path>
<path
d="M511.69044 784.476a189.964 189.964 0 0 1-84.025-19.557L34.70244 569.705a54.327 54.327 0 1 1 48.17-96.882l392.6 195.213a82.939 82.939 0 0 0 72.436 0l392.962-195.213a54.327 54.327 0 1 1 48.17 96.882L595.71544 764.919a189.42 189.42 0 0 1-84.025 19.557z m0 229.62a189.42 189.42 0 0 1-84.025-19.557L34.70244 799.325a54.327 54.327 0 1 1 48.17-96.882l392.6 195.214a81.671 81.671 0 0 0 72.436 0l392.962-195.214a54.327 54.327 0 1 1 48.17 96.882L595.71544 994.54a189.42 189.42 0 0 1-84.025 19.558z"
:fill="indexvalue == 1 ? '#5337C7' : '#3f3f51'" p-id="64908"></path>
</svg>
<span>项目</span>
</div>
<div class="flex-align-center gap-8 mt-12 cursor-pointer pl-16 h-36 rounded-4"
:class="indexvalue == 2 ? 'active' : ''" @click="switchTab(2)">
<el-icon>
<el-icon size="16">
<PieChart />
</el-icon>
<span>资产</span>
......@@ -42,23 +59,43 @@
<div class="ml-16 mt-16 mb-4" style="color: #00000066;">企业配置</div>
<div class="flex-align-center gap-8 mt-12 cursor-pointer pl-16 h-36 rounded-4"
:class="indexvalue == 3 ? 'active' : ''" @click="switchTab(3)">
<el-icon>
<Files />
</el-icon>
<span>项目</span>
<svg t="1779787867535" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="73193" width="16" height="16">
<path
d="M426.3 611.6c-141.5 0-256.5-115.1-256.5-256.5s115-256.6 256.5-256.6S682.8 213.6 682.8 355 567.7 611.6 426.3 611.6z m0-416.4c-88.1 0-159.8 71.7-159.8 159.8s71.7 159.8 159.8 159.8c88.1 0 159.8-71.7 159.8-159.8s-71.7-159.8-159.8-159.8z"
:fill="indexvalue == 3 ? '#5337C7' : '#3f3f51'" p-id="73194"></path>
<path
d="M738.5 923.8c-26.7 0-48.4-21.7-48.4-48.4 0-145.5-118.4-263.9-263.9-263.9S162.4 730 162.4 875.5c0 26.7-21.7 48.4-48.4 48.4s-48.4-21.7-48.4-48.4c0-198.8 161.8-360.6 360.6-360.6s360.6 161.8 360.6 360.6c0.1 26.7-21.6 48.3-48.3 48.3zM912 854.4c-26.7 0-48.4-21.7-48.4-48.4 0-101.5-56.9-192.3-148.6-237-15.4-7.5-25.7-22.6-27-39.7-1.3-17.1 6.4-33.6 20.5-43.4 42.8-30 68.4-78.9 68.4-130.9 0-72.1-48.5-135.5-118-154.3-25.8-7-41-33.5-34.1-59.3 6.9-25.8 33.4-41.1 59.3-34.1 111.6 30.1 189.5 132 189.5 247.7 0 59.8-21 117-58.1 162.3 90.7 67.3 144.8 172.9 144.8 288.7 0.1 26.8-21.6 48.4-48.3 48.4z"
:fill="indexvalue == 3 ? '#5337C7' : '#3f3f51'" p-id="73195"></path>
</svg>
<span>团队管理</span>
</div>
<div class="flex-align-center gap-8 mt-12 cursor-pointer pl-16 h-36 rounded-4"
:class="indexvalue == 4 ? 'active' : ''" @click="switchTab(4)">
<el-icon>
<PieChart />
</el-icon>
<svg t="1779788041086" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="82395" width="16" height="16">
<path
d="M819.182933 955.716267a34.1504 34.1504 0 0 1 0 68.283733H204.8a34.1504 34.1504 0 0 1 0-68.283733H819.2z m34.133334-955.716267C947.5072 0 1024 71.406933 1024 159.232v568.951467c-0.136533 87.842133-76.629333 159.232-170.683733 159.232H170.666667C76.6464 887.432533 0 816.042667 0 728.200533V159.249067C0 71.406933 76.629333 0 170.683733 0H853.333333z m0 68.283733H170.666667c-56.507733 0-102.4 40.789333-102.4 90.965334v568.9344c0 50.158933 45.892267 90.965333 102.4 90.965333h682.615466c56.5248 0 102.417067-40.8064 102.417067-90.965333V159.249067C955.733333 109.090133 909.824 68.266667 853.333333 68.266667zM365.704533 324.266667c59.2384 0 95.453867 27.716267 168.311467 108.202666l13.704533 15.172267c54.903467 60.2624 81.237333 80.008533 110.5408 80.008533 49.4592 0 87.381333-19.165867 117.0432-59.170133a36.3008 36.3008 0 0 1 51.2-7.389867 37.256533 37.256533 0 0 1 7.304534 51.7632c-43.485867 58.606933-103.082667 88.746667-175.547734 88.746667-59.2384 0-95.453867-27.716267-168.311466-108.202667l-13.704534-15.172266c-54.903467-60.2624-81.237333-80.008533-110.5408-80.008534-57.1392 0-92.091733 26.555733-111.581866 85.640534a36.488533 36.488533 0 0 1-46.267734 23.415466 37.085867 37.085867 0 0 1-23.1424-46.779733C213.981867 371.677867 276.514133 324.266667 365.7216 324.266667z"
:fill="indexvalue == 4 ? '#5337C7' : '#3f3f51'" p-id="82396"></path>
</svg>
<span>用量统计</span>
</div>
<div class="flex-align-center gap-8 mt-12 cursor-pointer pl-16 h-36 rounded-4"
:class="indexvalue == 5 ? 'active' : ''" @click="switchTab(5)">
<el-icon>
<PieChart />
</el-icon>
<svg t="1779788163351" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="87157" width="16" height="16">
<path
d="M788.667 64C883.29 64 960 140.709 960 235.333V350.71c0 18.225-14.775 33-33 33s-33-14.775-33-33V235.333C894 177.16 846.84 130 788.667 130H235.333C177.16 130 130 177.16 130 235.333v553.334C130 846.84 177.16 894 235.333 894h112.899c18.225 0 33 14.775 33 33s-14.775 33-33 33H235.333C140.71 960 64 883.291 64 788.667V235.333C64 140.71 140.709 64 235.333 64h553.334z"
:fill="indexvalue == 5 ? '#5337C7' : '#3f3f51'" p-id="87158"></path>
<path d="M284.192 314.593a60.731 60.741 0 1 0 121.462 0 60.731 60.741 0 1 0-121.462 0Z" fill="#333333"
p-id="87159"></path>
<path
d="M267.003 633.481c-16.773 0-30.37-13.597-30.37-30.37a30.37 30.37 0 0 1 5.586-17.553l70.329-99.303c9.694-13.688 28.649-16.926 42.337-7.232a30.37 30.37 0 0 1 7.231 7.232l15.33 21.646 145.556-168.563c16.443-19.043 45.21-21.15 64.253-4.707a45.556 45.556 0 0 1 4.706 4.707l188.946 218.815c16.443 19.042 14.336 47.81-4.707 64.253a45.556 45.556 0 0 1-29.773 11.075H267.003z"
:fill="indexvalue == 5 ? '#5337C7' : '#3f3f51'" p-id="87160"></path>
<path
d="M650.86 796.503c50.465-43.752 102.888-62.685 155.854-54.267 51.616 8.203 100.093 41.842 146.01 98.982 11.416 14.207 9.154 34.978-5.053 46.395-14.207 11.416-34.978 9.154-46.395-5.053-36.53-45.46-71.697-69.862-104.922-75.143-31.238-4.964-64.146 6.596-100.057 37.064l-0.989 0.843-1.194 1.25c-39.681 41.242-84.038 60.168-131.215 53.767l-1.46-0.206c-46.18-6.769-91.17-37.31-136.056-89.79-11.846-13.851-10.222-34.682 3.628-46.528 13.85-11.847 34.682-10.222 46.528 3.628 35.46 41.459 67.647 63.31 95.471 67.388 25.31 3.71 50.426-7.175 77.382-35.955a33 33 0 0 1 2.468-2.375z"
:fill="indexvalue == 5 ? '#5337C7' : '#3f3f51'" p-id="87161"></path>
</svg>
<span>AI生成水印设置</span>
</div>
</div>
......@@ -66,7 +103,7 @@
</template>
<script setup lang="ts">
import { computed, ref, watch } from 'vue';
import { ref, watch } from 'vue';
import { useAuth } from '../stores/useAuth';
import { VideoCameraFilled, Files, PieChart, Help } from '@element-plus/icons-vue'
import { useRouter, useRoute } from 'vue-router';
......@@ -78,7 +115,7 @@ const routeIndexMap: Record<string, number> = {
'/': 0,
'/projectlist': 1,
'/asset': 2,
'/enterprise/project': 3,
'/enterprise/team': 3,
'/enterprise/usage': 4,
'/enterprise/watermark': 5,
};
......@@ -95,20 +132,16 @@ watch(
);
const groupList = [{
value: 'group1',
label: '哈哈哈大萨达',
},
{
value: 'group2',
label: '地址都干啥',
},
value: 0,
label: '默认团队',
}
];
const groupValue = ref(groupList[0].value);
const tabRouter:any = {
const tabRouter: any = {
0: '/',
1: '/projectlist',
2: '/asset',
3: '/enterprise/project',
3: '/enterprise/team',
4: '/enterprise/usage',
5: '/enterprise/watermark',
}
......
doc/h5/src/components/Header.vue
View file @ 3db44894
......@@ -7,17 +7,26 @@
<img src="@/static/imgs/logo.png" class="w-130 h-26 mb-2 cursor-pointer" alt="Logo" @click="router.push('/')">
</div>
<div class="flex gap-26">
<el-input
v-model="search"
class="responsive-input"
placeholder="搜索产品和文档"
:prefix-icon="Search"
/>
<el-button type="primary" class="nav-button">
<el-input v-model="searchVal" class="responsive-input" placeholder="搜索产品和文档" :prefix-icon="Search" />
<el-popover placement="bottom" :width="180" trigger="click" :show-arrow="false">
<template #reference>
<el-button type="primary" class="nav-button">
<span class="pt-2">企业</span><el-icon class="el-icon--right" size="12">
<ArrowDownBold />
</el-icon>
</el-button>
</template>
<div class="">
<div v-for="(item, index) in poverMenus" :key="index" class=" py-6 cursor-pointer mt-4 menuhover" @click="router.push(item.path)">{{ item.name }}</div>
</div>
</el-popover>
<!-- <el-button type="primary" class="nav-button">
<span class="pt-2">企业</span><el-icon class="el-icon--right" size="12">
<ArrowDownBold />
</el-icon>
</el-button>
</el-button> -->
<el-button type="primary" class="nav-button">
<span class="pt-2">工具</span><el-icon class="el-icon--right" size="12">
<ArrowDownBold />
......@@ -36,7 +45,9 @@
<el-button type="primary" class="nav-button pt-2">备案</el-button>
<el-button type="primary" class="nav-button pt-2">文档</el-button>
<el-badge :value="12" class="mt-6 cursor-pointer">
<el-icon size="18"><Bell /></el-icon>
<el-icon size="18">
<Bell />
</el-icon>
</el-badge>
<el-button type="primary" link class="nav-button fw-bold color">中文</el-button>
<div class="w-30 h-30 flex-center rounded-circle headimg fs-12 mt-2">黄</div>
......@@ -51,7 +62,34 @@ import { ArrowDownBold, Bell, Search } from '@element-plus/icons-vue'
import { useRouter } from 'vue-router';
const router = useRouter();
const search = ref('');
const searchVal = ref('');
const poverMenus = ref([
{
name: '企业组织',
path: '',
value: 1
},
{
name: '云身份中心',
path: '',
value: 2
},
{
name: '访问控制',
path: '',
value: 3
},
{
name: '资源管理',
path: '',
value: 4
},
{
name: '操作审计（云审计）',
path: '',
value: 5
}
])
</script>
<style scoped lang="scss">
......@@ -59,17 +97,20 @@ const search = ref('');
box-shadow: 0 3px 5px #eee;
z-index: 1;
}
.responsive-input {
width: 240px;
height: 36px;
border-radius: 8px !important;
border: 1px solid #E5E7EB;
overflow: hidden;
:deep(.el-input__wrapper) {
box-shadow: none !important;
background-color: #F9FAFB;
}
}
.headimg {
background-color: #EFF6FF;
border: 1px solid #DBEAFE;
......@@ -90,6 +131,7 @@ const search = ref('');
.pt-2 {
padding-top: 2px;
}
.color {
color: #155DFC;
}
......@@ -102,4 +144,17 @@ const search = ref('');
.active {
color: #409eff;
}
.menuhover {
&:hover {
background-color: #F0F2F5;
border-radius: 4px;
}
}
</style>
<style lang="scss">
.el-popover {
&.el-popper {
padding: 4px 10px !important;
}
}
</style>
doc/h5/src/components/UploadFile.vue → doc/h5/src/components/UploadSingleFile.vue
View file @ 3db44894
<template>
<div>
<div>
<div class="upload-demo" :style="{
'border': `1px dashed ${borderColor}`,
'background-color': `${backgroundColor}`
}">
<div class="h-200 flex-center flex-col" v-if="fileList.length > 0">
<div class="flex-align-center rounded-6 px-10 py-6 file">
<el-icon size="36" color="#3461f3"><Document /></el-icon>
<div class="ml-4">
<div>文件名文件名文件名</div>
<div class="text-999 fs-12 mt-6">pdf</div>
</div>
</div>
<el-button class="mt-20" round :icon="Upload" @click="fileList=[]">重新上传</el-button>
</div>
<el-upload class="upload-demo" :multiple="multiple" :show-file-list="false" :limit="limit" :accept="accept"
:style="{
'border': borderColor ? `1px dashed ${borderColor}` : 'none',
'background-color': `${backgroundColor}`
}" drag action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15">
<el-upload v-else :show-file-list="false" :accept="accept" drag
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15">
<slot />
</el-upload>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { Document, Upload } from '@element-plus/icons-vue'
const emit = defineEmits(['changeFiles'])
const props = defineProps({
borderColor: {
type: String,
......@@ -24,24 +33,18 @@ const props = defineProps({
type: String,
default: '#fff'
},
multiple: {
type: Boolean,
default: false
},
showFileList: {
type: Boolean,
default: false
},
limit: {
type: Number,
default: 1
},
accept: {
type: String,
default: 'img'
}
})
const fileList = ref([])
</script>
<style scoped lang="scss">
.upload-demo {
......@@ -49,7 +52,7 @@ const props = defineProps({
transition: all 0.2s;
&:hover {
border-color: #5337C7;
border-color: #5337C7 !important;
}
:deep(.el-upload-dragger) {
......@@ -60,5 +63,9 @@ const props = defineProps({
.el-upload__text {
color: #00000063;
}
.file {
border: 1px solid #eee;
background-color: #f9f9f9;
}
}
</style>
\ No newline at end of file
doc/h5/src/components/UploadSingleImg.vue 0 → 100644
View file @ 3db44894
<template>
<div class="upload-demo" :style="{
'border': `1px dashed ${borderColor}`,
'background-color': `${backgroundColor}`
}">
<div class="flex-center flex-col relative" style="height: 270px;" v-if="fileList.length == 0">
<div class="h-b100 overflow-hidden">
<img src="https://res.volccdn.com/obj/volc-console-fe/dramart/static/image/PIC3.22e42366.png"
class="w-b100 h-b100 object-cover" />
</div>
<div class="absolute bottom-0 left-0 top-0 w-b100 flex-center rounded-14 bg-099">
<el-button class="mt-20" round :icon="Upload" @click="fileList=[]">重新上传</el-button>
</div>
</div>
<el-upload v-else :show-file-list="false" :accept="accept" drag
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15">
<slot />
</el-upload>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { Upload } from '@element-plus/icons-vue'
const emit = defineEmits(['changeFiles'])
const props = defineProps({
borderColor: {
type: String,
default: '#ddd'
},
backgroundColor: {
type: String,
default: '#fff'
},
showFileList: {
type: Boolean,
default: false
},
accept: {
type: String,
default: 'img'
}
})
const fileList = ref([])
</script>
<style scoped lang="scss">
.upload-demo {
border-radius: 16px;
transition: all 0.2s;
:deep(.el-upload) {
border: 2px dashed #ddd;
width: 100%;
height: 240px;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: all 0.3s;
&:hover {
border-color: #c5c5c5;
}
}
:deep(.el-upload-dragger) {
background-color: transparent;
border: none;
}
.el-upload__text {
color: #00000063;
}
.bg-099 {
background-color: #00000020;
}
}
</style>
\ No newline at end of file
doc/h5/src/router/index.ts
View file @ 3db44894
......@@ -9,7 +9,7 @@ const Login = () => import('@/views/Login.vue');
const NotFound = () => import('@/views/NotFound.vue');
const Projectlist = () => import('@/views/project/projectlist.vue');
const Asset = () => import('@/views/project/asset.vue');
const EnterpriseProject = () => import('@/views/enterprise/project.vue');
const EnterpriseTeam = () => import('@/views/enterprise/team.vue');
const EnterpriseUsage = () => import('@/views/enterprise/usage.vue');
const EnterpriseWatermark = () => import('@/views/enterprise/watermark.vue');
const Drama = () => import('@/views/project/drama.vue');
......@@ -44,9 +44,9 @@ const routes = [
meta: { authRequired: true }
},
{
path: '/enterprise/project',
name: 'EnterpriseProject',
component: EnterpriseProject,
path: '/enterprise/team',
name: 'EnterpriseTeam',
component: EnterpriseTeam,
meta: { authRequired: true }
},
{
......
doc/h5/src/views/Home.vue
View file @ 3db44894
......@@ -27,19 +27,12 @@
<div class="flex-center fs-40 pt-82">翻开剧本，创作<span class="c-5337C7">精品短剧</span></div>
<section class="card mt-44 bg-fff rounded-20 p-12">
<!-- <el-upload class="upload-demo" drag action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
:on-change="handleChange" :show-file-list="false" accept=".doc,.docx,.pdf,.txt,.md">
<UploadSingleFile backgroundColor="#F8F9FC" accept=".doc,.docx,.pdf,.txt,.md" @changeFiles="changeFiles">
<img src="@/static/imgs/fileupload.png" class="w-120" alt="">
<div class="el-upload__text mt-24">
点击或拖拽剧本文件到这里，支持 doc、docx、txt、pdf、md，大小不超过 20M;也可以先跳过，下一页手动输入刷本
</div>
</el-upload> -->
<UploadFile backgroundColor="#F8F9FC" accept=".doc,.docx,.pdf,.txt,.md">
<img src="@/static/imgs/fileupload.png" class="w-120" alt="">
<div class="el-upload__text mt-24">
点击或拖拽剧本文件到这里，支持 doc、docx、txt、pdf、md，大小不超过 20M;也可以先跳过，下一页手动输入刷本
</div>
</UploadFile>
</UploadSingleFile>
<section class="mt-12">
<el-dropdown>
......@@ -164,7 +157,7 @@ import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { ElMessage } from 'element-plus'
import { ArrowDownBold, SwitchFilled } from '@element-plus/icons-vue'
import UploadFile from '@/components/UploadFile.vue'
import UploadSingleFile from '@/components/UploadSingleFile.vue'
const router = useRouter();
......@@ -184,6 +177,10 @@ const handleChange = (uploadFile: any, uploadFiles: any) => {
console.log(11, uploadFile, uploadFiles)
}
const changeFiles = (file: any) => {
}
</script>
<style scoped lang="scss">
......@@ -197,26 +194,6 @@ const handleChange = (uploadFile: any, uploadFiles: any) => {
.card {
width: 800px;
.upload-demo {
background-color: #F8F9FC;
border: 1px dashed #ddd;
border-radius: 16px;
transition: all 0.2s;
&:hover {
border-color: #5337C7;
}
:deep(.el-upload-dragger) {
background-color: transparent;
border: none;
}
.el-upload__text {
color: #00000063;
}
}
}
.btnjb {
......
doc/h5/src/views/enterprise/project.vue deleted 100644 → 0
View file @ cda0db1d
<template>
<div></div>
</template>
<script setup lang="ts"></script>
<style lang="scss" scoped></style>
\ No newline at end of file
doc/h5/src/views/enterprise/team.vue 0 → 100644
View file @ 3db44894
<template>
<section class="px-64 flex flex-col gap-20 h-b100">
<div>
<div class="flex gap-30 fs-18 pt-30 pb-10 bg-F8F9FA">
<a v-for="(item, index) in tabs" :key="index" class="cursor-pointer aa"
:class="indexTab === index ? 'active' : ''" @click="changeTab(index)">{{ item }}</a>
</div>
<div v-if="isShowtip" class="hint flex-between-center px-20 py-10 my-20">
<div class="flex-align-center">
<el-icon color="#5252ff" size="16">
<WarningFilled />
</el-icon>
<span class="ml-4">需要授权账号登录权限且将其加入到团队中，子账号才可以登陆到短剧平台。</span>
</div>
<div class="flex gap-20">
<div>已授权 <span class="fw-bold" style="color: darkgreen;">0</span></div>
<span style="color: #ccc;">|</span>
<div>未授权 <span>2</span></div>
</div>
</div>
<div class="flex-center gap-10 mt-10">
<el-input v-model="searchValue" placeholder="搜索" :prefix-icon="Search" />
<el-select v-model="selectValue" placeholder="Select" style="width: 240px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-button type="primary" :dark="true" :icon="Plus">
<span class="ml-4">新建子账号</span>
</el-button>
</div>
</div>
<el-table :data="tableData">
<el-table-column type="selection" :selectable="selectable" width="55" />
<el-table-column prop="name" label="用户名" width="180" />
<el-table-column prop="name" label="备注" width="180" />
<el-table-column prop="name" label="隶属团队" />
<el-table-column prop="name" label="授权登录状态" />
<el-table-column prop="name" label="操作" width="180">
<template #default="scope">
<el-button link type="primary" size="small">
编辑
</el-button>
<el-button link type="danger" size="small">
删除
</el-button>
</template>
</el-table-column>
</el-table>
</section>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { Search, Plus, WarningFilled } from '@element-plus/icons-vue'
const searchValue = ref('');
const isShowtip = ref(true)
const selectValue = ref(1);
const options = [
{
value: 1,
label: '所有授权',
},
{
value: 2,
label: '已授权',
},
{
value: 3,
label: '未授权',
},
]
const tabs = ref(['子账号管理', '团队管理'])
const indexTab = ref(0)
const changeTab = ref((index: number) => {
indexTab.value = index
})
// 表格
const tableData = [
{
date: '2016-05-03',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
{
date: '2016-05-02',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
{
date: '2016-05-04',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
{
date: '2016-05-01',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
]
const selectable = (row: any, index: number) => {
return row.name !== 'Tom'
}
</script>
<style lang="scss">
:root {
--el-color-primary: #5272ff;
/* 修改主色 */
}
</style>
<style lang="scss" scoped>
.hint {
border: 1px solid #e5e7eb;
background-color: #f5f7ff;
border-radius: 8px;
}
.bg-F8F9FA {
background-color: #f8f9fa;
.aa {
text-decoration: none;
color: #888;
outline: none;
&.active {
color: #333;
}
}
}
:deep(.el-table) {
border: 1px solid #eee;
border-radius: 8px;
border-bottom: none;
th{
padding-top: 10px;
padding-bottom: 10px;
background-color: rgba(28, 106, 224, 0.027);
}
}
</style>
\ No newline at end of file
doc/h5/src/views/enterprise/usage.vue
View file @ 3db44894
<template>
<div></div>
<section class="px-64 h-b100 overflow-y-auto pb-20 min-w-800">
<section class="mt-36">
<div class="fs-18">余量统计</div>
<div class="flex gap-20 mt-10 flex-wrap">
<div class="child card1 rounded-16 p-20">
<div class="">积分余量</div>
<div class="h-200" id="chart1"></div>
<div class="flex-between-center">
<div class="">
<span class="text-888">积分余量</span>
<div class="flex items-end mt-16">
<span class="fs-28 fw-bold line-h20">879</span>
<span class="fs-12 ml-2">个</span>
</div>
</div>
<div class="">
<span class="text-888">积分总量</span>
<div class="flex items-end mt-16">
<span class="fs-28 fw-bold line-h20">10000</span>
<span class="fs-12 ml-2">个</span>
</div>
</div>
</div>
</div>
<div class="child card1 rounded-16 p-20">
<div class="">子账号余量</div>
<div class="h-200" id="chart2"></div>
<div class="flex-between-center">
<div class="">
<span class="text-888">子账号余量</span>
<div class="flex items-end mt-16">
<span class="fs-28 fw-bold line-h20">30</span>
<span class="fs-12 ml-2">个</span>
</div>
</div>
<div class="">
<span class="text-888">子账号总量</span>
<div class="flex items-end mt-16">
<span class="fs-28 fw-bold line-h20">30</span>
<span class="fs-12 ml-2">个</span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="mt-36">
<div class="fs-18">资源明细</div>
<div class="flex gap-20 mt-10 flex-wrap">
<div class="child card2 rounded-16 p-20">
<div class="flex-between-center">
<span>权益套餐-基础版</span>
<span class="tag rounded-4 px-6 py-2">使用中</span>
</div>
<div class="text-666 fs-12">
<div class="flex-between-center mt-16">
<span>积分余量（个）</span>
<span class="text-333 fw-bold">977 / 10000</span>
</div>
<div class="flex-between-center mt-16">
<span>子账号余量（个）</span>
<span class="text-333 fw-bold">30 / 30</span>
</div>
</div>
<div class="boo mt-20 pt-12">
<span class="text-999 fs-12">2026-03-22 10:22 ~ 2026-05-22 23:59</span>
</div>
</div>
</div>
</section>
<section class="mt-36">
<div class="fs-18">积分消耗趋势</div>
<div class="gap-20 mt-10">
<div class="child card2 rounded-16 p-20">
<div class="flex-between-center">
<span>消耗积分统计 (个)</span>
<div class="flex-align-center rounded-4 bbb">
<div class="px-10 py-4 cursor-pointer" @click="refreshCharts">
<svg t="1779783997777" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="28452" width="14" height="14">
<path
d="M524.288 25.173333l2.816 2.389334 128 128a21.333333 21.333333 0 0 1 2.432 27.221333l-2.432 2.986667-128 128a21.333333 21.333333 0 0 1-36.138667-11.434667L490.666667 298.666667V213.973333a341.333333 341.333333 0 1 0 317.141333 170.24 42.666667 42.666667 0 0 1 73.898667-42.666666A424.874667 424.874667 0 0 1 938.666667 554.666667c0 235.648-191.018667 426.666667-426.666667 426.666666S85.333333 790.314667 85.333333 554.666667c0-228.48 179.626667-415.018667 405.333334-426.154667V42.666667a21.333333 21.333333 0 0 1 33.621333-17.493334z"
fill="#3f3f51" p-id="28453"></path>
</svg>
</div>
<span class="text-999 fs-12 line-h10" style="margin-top: -2px;">|</span>
<div class="px-10 py-4 cursor-pointer">
<svg t="1779783965212" class="icon" viewBox="0 0 1030 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="27299" width="13" height="13">
<path
d="M140.8 1017.6c-38.4 0-70.4-12.8-96-38.4-25.6-25.6-38.4-57.6-38.4-96v-185.6c0-12.8 6.4-25.6 12.8-32s19.2-12.8 32-12.8 25.6 6.4 32 12.8 12.8 19.2 12.8 32v185.6c0 12.8 6.4 32 12.8 38.4 6.4 6.4 19.2 12.8 38.4 12.8h742.4c12.8 0 32-6.4 38.4-12.8 6.4-6.4 12.8-19.2 12.8-38.4v-185.6c0-12.8 6.4-25.6 12.8-32 6.4-6.4 19.2-12.8 32-12.8s25.6 6.4 32 12.8c6.4 6.4 12.8 19.2 12.8 32v185.6c0 38.4-12.8 70.4-38.4 96-25.6 25.6-57.6 38.4-96 38.4H140.8z m377.6-275.2c-12.8 0-25.6-6.4-32-12.8s-12.8-19.2-12.8-32V160s0-6.4-6.4-6.4h-6.4L313.6 313.6c-6.4 6.4-25.6 12.8-25.6 12.8-12.8 0-25.6-6.4-32-12.8-12.8-12.8-19.2-19.2-19.2-25.6 0-12.8 6.4-25.6 12.8-32L480 25.6c12.8-12.8 25.6-19.2 38.4-19.2 12.8 0 25.6 6.4 32 12.8L774.4 256c6.4 6.4 12.8 19.2 12.8 32s-6.4 25.6-12.8 32-19.2 12.8-32 12.8-19.2-12.8-25.6-19.2L563.2 153.6h-6.4s-6.4 0-6.4 6.4V704c0 12.8-6.4 25.6-12.8 32s-12.8 6.4-19.2 6.4z"
p-id="27300" fill="#3f3f51"></path>
</svg>
</div>
</div>
</div>
<div class="flex gap-10 mt-10">
<el-tree-select v-model="teamVal" :data="data1" multiple collapse-tags collapse-tags-tooltip
:max-collapse-tags="2" :render-after-expand="false" show-checkbox style="width: 200px"
placeholder="团队选择" />
<el-tree-select v-model="useItemVal" :data="data2" multiple collapse-tags collapse-tags-tooltip
:max-collapse-tags="2" :render-after-expand="false" show-checkbox style="width: 260px"
placeholder="消耗项选择" />
<div style="width: 350px"><el-date-picker v-model="dateVal" type="daterange" start-placeholder="开始日期"
end-placeholder="结束日期" /></div>
</div>
<div class="h-300 mt-40" id="chart3"></div>
</div>
</div>
</section>
</section>
</template>
<script setup lang="ts"></script>
<style lang="scss" scoped></style>
\ No newline at end of file
<script setup lang="ts">
import { onMounted, ref, nextTick } from 'vue'
import * as echarts from 'echarts'
import { RefreshRight } from '@element-plus/icons-vue'
const teamVal = ref(null)
const useItemVal = ref(null)
const dateVal = ref(null)
const data1 = ref([
{
value: 1,
label: '默认团队'
},
])
const data2 = ref([
{
value: 1,
label: '角色生成'
},
{
value: 2,
label: '场景生成'
},
{
value: 3,
label: '道具生成'
},
{
value: 4,
label: '分镜视频生成'
},
])
// 图表实例引用
let chart1: echarts.ECharts | null = null
let chart2: echarts.ECharts | null = null
let chart3: echarts.ECharts | null = null
// 积分余量图表配置
const chart1Option = ref({
tooltip: {
trigger: 'item'
},
color: ['#ddd', '#fac858'],
series: [
{
name: '积分使用占比',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: 40,
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{ value: 9121, name: '已使用' },
{ value: 879, name: '剩余' }
]
}
]
})
// 子账号余量图表配置
const chart2Option = ref({
tooltip: {
trigger: 'item'
},
color: ['#ddd', '#5252ff'],
series: [
{
name: '子账号使用占比',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center',
},
emphasis: {
label: {
show: true,
fontSize: 40,
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{ value: 0, name: '已使用' },
{ value: 30, name: '剩余' }
]
}
]
})
const chart3Option = ref({
grid: {
left: '0%', // 左侧距离，可设置为 '3%' 或具体数值如 20
right: '0%', // 右侧距离
top: 20,
bottom: 20,
containLabel: true // 包含坐标轴标签，避免标签被裁剪
},
xAxis: {
type: 'category',
data: ['2026-05-20', '2026-05-21', '2026-05-22', '2026-05-23', '2026-05-24', '2026-05-25', '2026-05-26'],
axisTick: {
show: true // 显示刻度线（默认就是 true）
}
},
yAxis: {
type: 'value'
},
series: [
{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
smooth: true
}
]
})
// 初始化图表的函数
const initCharts = () => {
const chart1Dom = document.getElementById('chart1')
const chart2Dom = document.getElementById('chart2')
const chart3Dom = document.getElementById('chart3')
if (chart1Dom) {
chart1 = echarts.init(chart1Dom)
chart1.setOption(chart1Option.value)
}
if (chart2Dom) {
chart2 = echarts.init(chart2Dom)
chart2.setOption(chart2Option.value)
}
if (chart3Dom) {
chart3 = echarts.init(chart3Dom)
chart3.setOption(chart3Option.value)
}
}
// 刷新图表
const refreshCharts = () => {
if (chart3) {
chart3.clear() // 清空图表实例，以便重新设置数据
teamVal.value = null
useItemVal.value = null
dateVal.value = null
chart3.setOption(chart3Option.value, true) // true 表示不合并，完全替换
}
}
// 响应窗口大小变化
const handleResize = () => {
chart1?.resize()
chart2?.resize()
chart3?.resize()
}
onMounted(() => {
// 确保 DOM 完全渲染后再初始化图表
nextTick(() => {
initCharts()
})
// 监听窗口大小变化
window.addEventListener('resize', handleResize)
})
// 组件卸载时销毁图表实例
import { onUnmounted } from 'vue'
onUnmounted(() => {
window.removeEventListener('resize', handleResize)
chart1?.dispose()
chart2?.dispose()
chart3?.dispose()
})
</script>
<style lang="scss" scoped>
.child {
flex: 0 0 calc(25% - 15px);
border: 1px solid #eaebee;
&.card1 {
background: linear-gradient(to bottom, #f8f8fd 0%, #fff 18%, #fff);
}
&.card2 {
background: #fff;
.boo {
border-top: 1px solid #eaebee;
}
}
.tag {
background-color: #d9f1dd;
color: #07b44f;
}
}
.bbb {
border: 1px solid #eaebee;
}
/* 1600px以下：一行3个 */
@media (max-width: 1600px) {
.child {
flex: 0 0 calc(33.333% - 14px);
}
}
/* 1400px以下：一行2个 */
@media (max-width: 1400px) {
.child {
flex: 0 0 calc(50% - 11px);
}
}
</style>
<style lang="scss">
:root {
--el-color-primary: #5272ff;
/* 修改主色 */
}
.el-tree-node__content {
padding-left: 14px !important;
padding-top: 15px !important;
padding-bottom: 15px !important;
.el-tree-node__expand-icon {
display: none;
}
}
</style>
\ No newline at end of file
doc/h5/src/views/enterprise/watermark.vue
View file @ 3db44894
<template>
<div></div>
<section class="px-64 h-b100 overflow-y-auto pb-20 min-w-800">
<section class="mt-36">
<div class="fs-18">去除水印管理</div>
<div v-if="isShowtip" class="hint flex-between-center px-16 py-16 mt-18">
<div class="flex gap-10">
<el-icon color="#5252ff" size="18" class="mt-2">
<WarningFilled />
</el-icon>
<span class="ml-4 line-h22"
style="font-size: 13px;">根据法律法规要求，火山剧创平台（“平台”）提供AI生成合成服务，可能导致公众混淆或者误认的，平台应当在AI生成合成内容上添加显式标识（即“AI生成”明水印），向公众进行提示。经过您的申请，平台可以向您提供未添加显式标识的AI生成合成内容。如您后续使用网络信息内容传播服务发布AI生成合成内容，请注意您还需主动声明并使用传播平台提供的标识功能进行标识。您理解并承诺，如您未按照法律法规要求在AI生成合成内容上添加显式标识，导致公众混淆或者误认，因此所发生的后果和责任均由您自行承担。</span>
</div>
</div>
<div class="card1 rounded-16 p-16 mt-16 bg-fff">
<div class="">子账号余量</div>
<div class="flex-between-center">
<div class="text-666 fs-12 mt-10">
<div>打开去除水印开关后，您使用火山剧创平台前述账号所创作、生成的AI生成合成内容将不再添加“Al生成”明水印。</div>
<div class="mt-2">打开开关，代表您已确认充分了解上述情况并同意</div>
</div>
<el-switch v-model="switchVal" class="ml-2" @change="change"
style="--el-switch-on-color: #5272ff; --el-switch-off-color: #ddd" />
</div>
</div>
</section>
</section>
</template>
<script setup lang="ts"></script>
<style lang="scss" scoped></style>
\ No newline at end of file
<script setup lang="ts">
import { ref } from 'vue'
import { WarningFilled } from '@element-plus/icons-vue'
import { ElMessage } from 'element-plus'
const isShowtip = ref(true)
const switchVal = ref(false)
const change = () => {
ElMessage.success('设置成功')
}
</script>
<style lang="scss" scoped>
.hint {
background-color: #edf1ff;
border-radius: 12px;
}
.card1 {
border: 1px solid #eaebee;
}
</style>
\ No newline at end of file
doc/h5/src/views/project/asset.vue
View file @ 3db44894
<template>
<div></div>
<section class="px-64 flex flex-col gap-20 h-b100">
<div>
<div class="h-36 flex gap-8 rounded-8 p-2 cursor-pointer mt-36" style="width: 260px;background-color: #f1f2f9;">
<div class="flex-1 flex-center" :class="typeVal === 1 ? 'active1' : ''" @click="typeVal = 1">个人资产</div>
<div class="flex-1 flex-center" :class="typeVal === 2 ? 'active1' : ''" @click="typeVal = 2">团队资产</div>
<div class="flex-1 flex-center" :class="typeVal === 3 ? 'active1' : ''" @click="typeVal = 3">写实人像库</div>
</div>
<div class="flex gap-30 fs-18 pt-30 pb-10 bg-F8F9FA">
<a v-for="(item, index) in tabs" :key="index" class="cursor-pointer aa"
:class="indexTab === index ? 'active' : ''" :href="'#' + item" @click="changeTab(index)">{{ item }}</a>
</div>
<div class="flex-center gap-10 mt-10">
<el-input v-model="searchValue" placeholder="搜索短剧项目名称" :prefix-icon="Search" />
<el-button type="primary" color="#785BE5" :dark="true" :icon="Plus">
<span class="ml-4">上传角色</span>
</el-button>
</div>
</div>
<section class="flex-1">
<div class="min-h-400">
<div class="h-400 flex-center flex-col">
<svg t="1779342435411" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="25486" width="64" height="64">
<path
d="M625.777778 0l341.333333 307.2v648.931556c0 37.432889-33.792 67.868444-75.320889 67.868444H132.209778C90.680889 1024 56.888889 993.564444 56.888889 956.131556V67.868444C56.888889 30.435556 90.680889 0 132.209778 0H625.777778zM476.728889 747.52h-11.491556a52.337778 52.337778 0 0 0-51.768889 52.906667c0 29.240889 23.153778 52.906667 51.768889 52.906666h11.548445a52.337778 52.337778 0 0 0 51.768889-52.906666 52.337778 52.337778 0 0 0-51.768889-52.906667zM459.377778 341.333333c-30.151111 0-57.287111 4.892444-80.497778 14.620445a147.342222 147.342222 0 0 0-55.694222 39.879111c-45.795556 53.134222-38.684444 122.026667-37.717334 129.706667a47.616 47.616 0 0 0 53.020445 41.927111 48.241778 48.241778 0 0 0 41.073778-54.215111c0-0.284444-2.844444-32.881778 14.791111-53.361778 12.401778-14.392889 34.304-21.617778 65.024-21.617778 34.702222 0 57.059556 8.817778 66.503111 26.225778a44.600889 44.600889 0 0 1-3.982222 47.616l-93.184 125.383111a49.152 49.152 0 0 0 9.102222 67.868444 46.535111 46.535111 0 0 0 66.446222-9.272889l93.184-125.383111a143.246222 143.246222 0 0 0 11.377778-153.144889C590.051556 382.805333 548.807111 341.333333 459.377778 341.333333z"
fill="#e6e6e6" p-id="25487"></path>
<path
d="M941.852444 276.48L628.280889 0v217.941333c0 32.711111 29.354667 58.481778 62.236444 58.481778l251.335111 0.056889z"
fill="#e6e6e6" fill-opacity=".5" p-id="25488"></path>
</svg>
<div class="text-888 mt-10">暂无数据</div>
</div>
</div>
</section>
</section>
</template>
<script setup lang="ts"></script>
<style lang="scss" scoped></style>
\ No newline at end of file
<script setup lang="ts">
import { ref } from 'vue'
import { Search, Plus } from '@element-plus/icons-vue'
const typeVal = ref(1)
const searchValue = ref('');
const tabs = ref(['角色', '场景', '道具'])
const indexTab = ref(0)
const changeTab = ref((index: number) => {
indexTab.value = index
})
</script>
<style lang="scss" scoped>
.active1 {
background: #fff;
border-radius: 8px;
box-shadow: 0 0 3px #ddd;
}
.bg-F8F9FA {
background-color: #f8f9fa;
.aa {
text-decoration: none;
color: #888;
outline: none;
&.active {
color: #333;
}
}
}
</style>
\ No newline at end of file
doc/h5/src/views/project/components/LocalUploadModal.vue
View file @ 3db44894
......@@ -14,10 +14,8 @@
<el-button type="primary" @click="close">确定</el-button>
</div>
</template>
<el-upload class="avatar-uploader mt-20" action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
:show-file-list="false">
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
<div v-else class="flex-center flex-col line-h24 fs-12">
<UploadSingleImg @changeFiles="changeFiles">
<div class="flex-center flex-col line-h24 fs-12">
<el-icon size="20">
<Plus />
</el-icon>
......@@ -25,7 +23,7 @@
<span>仅支持 JPG, PNG 格式</span>
<span>最大文件限制在 20MB 内</span>
</div>
</el-upload>
</UploadSingleImg>
<div class="text-center mt-20 mb-40">支持 JPG、PNG 格式，单个文件不超过 20MB</div>
</el-dialog>
</template>
......@@ -34,6 +32,7 @@
import { ref } from 'vue'
import { Plus } from '@element-plus/icons-vue'
import IconType from './IconType.vue';
import UploadSingleImg from '@/components/UploadSingleImg.vue';
const props = defineProps({
title: {
......@@ -53,6 +52,10 @@ const close = () => {
visible.value = false
}
defineExpose({ open })
const changeFiles = (val: any) => {
}
</script>
<style lang="scss" scoped>
.cirir {
......
doc/h5/src/views/project/components/StepOne.vue
View file @ 3db44894
......@@ -137,7 +137,7 @@ import { ref } from 'vue';
const list = ref([1]);
const tags = ref(['悬疑', '古装', '奇幻', '爱情', '都市']);
const colors = ['#5337C7', '#12d9d2', '#DD8330', '#C9397E', '#53B06C', '#155DFC']
const loading = ref(true)
const loading = ref(false)
// 根据colors数组长度生成随机颜色
const randomColor = (index: number) => {
return colors[index];
......
doc/h5/src/views/project/components/StepTwo.vue
View file @ 3db44894
......@@ -299,7 +299,7 @@
</section>
</section>
<div class="fixed bottom-30 btnfooter w-140 h-54 flex-center rounded-200 text-fff cursor-pointer"
@click="$emit('next', 2)">
@click="emit('next', 2)">
<img src="@/static/imgs/icon1.png" alt="">
<span class="ml-10">进入下一步</span>
</div>
......@@ -312,13 +312,14 @@
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { CloseBold, Plus, DocumentCopy, MagicStick, FolderAdd, Download, MoreFilled, Delete } from '@element-plus/icons-vue'
import { CloseBold, Plus, MagicStick, FolderAdd, Download, MoreFilled, Delete } from '@element-plus/icons-vue'
import EditModal from './EditModal.vue'; // 新增'角色', '场景', '道具'
import BatchModal from './BatchModal.vue'; // 批量生成
import DepotModal from './DepotModal.vue'; // 从库中选择
import LocalUploadModal from './LocalUploadModal.vue'; // 本地上传
import AiEditModal from './AiEditModal.vue';
const emit = defineEmits(['next'])
const isShowtip = ref(true)
const indexTab = ref(0)
......
doc/h5/src/views/project/projectlist.vue
View file @ 3db44894
......@@ -7,7 +7,7 @@
<el-select v-model="selectValue" placeholder="Select" style="width: 240px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-button type="primary" color="#785BE5" :dark="true">
<el-button type="primary" color="#785BE5" :dark="true" @click="router.push('/')">
<img src="@/static/imgs/icon1.png" alt="">
<span class="ml-4">创建项目</span>
</el-button>
......@@ -25,7 +25,7 @@
<div class="flex-between-center mt-14">
<div class="text-999 fs-12">2020-10-22 13:20:30 创建</div>
<el-dropdown>
<el-button text :icon="MoreFilled" class="morebtn" />
<el-button text :icon="MoreFilled" class="morebtn" @click.stop/>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="openModal(item, '1')">编辑名称</el-dropdown-item>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment