黎海 преди 1 година
ревизия
f1eac42156
променени са 14 файла, в които са добавени 20583 реда и са изтрити 0 реда
  1. 24 0
      .gitignore
  2. 24 0
      README.md
  3. 5 0
      babel.config.js
  4. 19 0
      jsconfig.json
  5. 20054 0
      package-lock.json
  6. 46 0
      package.json
  7. BIN
      public/favicon.ico
  8. 17 0
      public/index.html
  9. 25 0
      src/App.vue
  10. BIN
      src/assets/logo.png
  11. 10 0
      src/main.js
  12. 322 0
      src/pages/index.vue
  13. 15 0
      src/router/index.js
  14. 22 0
      vue.config.js

+ 24 - 0
.gitignore

@@ -0,0 +1,24 @@
1
+.DS_Store
2
+node_modules
3
+.history
4
+/dist
5
+
6
+
7
+# local env files
8
+.env.local
9
+.env.*.local
10
+
11
+# Log files
12
+npm-debug.log*
13
+yarn-debug.log*
14
+yarn-error.log*
15
+pnpm-debug.log*
16
+
17
+# Editor directories and files
18
+.idea
19
+.vscode
20
+*.suo
21
+*.ntvs*
22
+*.njsproj
23
+*.sln
24
+*.sw?

+ 24 - 0
README.md

@@ -0,0 +1,24 @@
1
+# sutui_official
2
+
3
+## Project setup
4
+```
5
+npm install
6
+```
7
+
8
+### Compiles and hot-reloads for development
9
+```
10
+npm run serve
11
+```
12
+
13
+### Compiles and minifies for production
14
+```
15
+npm run build
16
+```
17
+
18
+### Lints and fixes files
19
+```
20
+npm run lint
21
+```
22
+
23
+### Customize configuration
24
+See [Configuration Reference](https://cli.vuejs.org/config/).

+ 5 - 0
babel.config.js

@@ -0,0 +1,5 @@
1
+module.exports = {
2
+  presets: [
3
+    '@vue/cli-plugin-babel/preset'
4
+  ]
5
+}

+ 19 - 0
jsconfig.json

@@ -0,0 +1,19 @@
1
+{
2
+  "compilerOptions": {
3
+    "target": "es5",
4
+    "module": "esnext",
5
+    "baseUrl": "./",
6
+    "moduleResolution": "node",
7
+    "paths": {
8
+      "@/*": [
9
+        "src/*"
10
+      ]
11
+    },
12
+    "lib": [
13
+      "esnext",
14
+      "dom",
15
+      "dom.iterable",
16
+      "scripthost"
17
+    ]
18
+  }
19
+}

Файловите разлики са ограничени, защото са твърде много
+ 20054 - 0
package-lock.json


+ 46 - 0
package.json

@@ -0,0 +1,46 @@
1
+{
2
+  "name": "sutui_official",
3
+  "version": "0.1.0",
4
+  "private": true,
5
+  "scripts": {
6
+    "serve": "vue-cli-service serve",
7
+    "dev": "vue-cli-service serve",
8
+    "build": "vue-cli-service build",
9
+    "lint": "vue-cli-service lint"
10
+  },
11
+  "dependencies": {
12
+    "core-js": "^3.8.3",
13
+    "element-plus": "^2.3.12",
14
+    "vue": "^3.2.13",
15
+    "vue-router": "^4.2.4"
16
+  },
17
+  "devDependencies": {
18
+    "@babel/core": "^7.12.16",
19
+    "@babel/eslint-parser": "^7.12.16",
20
+    "@vue/cli-plugin-babel": "~5.0.0",
21
+    "@vue/cli-plugin-eslint": "~5.0.0",
22
+    "@vue/cli-service": "~5.0.0",
23
+    "eslint": "^7.32.0",
24
+    "eslint-plugin-vue": "^8.0.3"
25
+  },
26
+  "eslintConfig": {
27
+    "root": true,
28
+    "env": {
29
+      "node": true
30
+    },
31
+    "extends": [
32
+      "plugin:vue/vue3-essential",
33
+      "eslint:recommended"
34
+    ],
35
+    "parserOptions": {
36
+      "parser": "@babel/eslint-parser"
37
+    },
38
+    "rules": {}
39
+  },
40
+  "browserslist": [
41
+    "> 1%",
42
+    "last 2 versions",
43
+    "not dead",
44
+    "not ie 11"
45
+  ]
46
+}

BIN
public/favicon.ico


+ 17 - 0
public/index.html

@@ -0,0 +1,17 @@
1
+<!DOCTYPE html>
2
+<html lang="">
3
+  <head>
4
+    <meta charset="utf-8">
5
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
7
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
8
+    <title><%= htmlWebpackPlugin.options.title %></title>
9
+  </head>
10
+  <body>
11
+    <noscript>
12
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
13
+    </noscript>
14
+    <div id="app"></div>
15
+    <!-- built files will be auto injected -->
16
+  </body>
17
+</html>

+ 25 - 0
src/App.vue

@@ -0,0 +1,25 @@
1
+<template>
2
+  <router-view></router-view>
3
+</template>
4
+
5
+<script>
6
+
7
+
8
+export default {
9
+  name: 'App',
10
+  components: {
11
+  
12
+  }
13
+}
14
+</script>
15
+
16
+<style>
17
+body{
18
+  margin: 0;
19
+ padding: 0;
20
+}
21
+#app {
22
+ margin: 0;
23
+ padding: 0;
24
+}
25
+</style>

BIN
src/assets/logo.png


+ 10 - 0
src/main.js

@@ -0,0 +1,10 @@
1
+import { createApp } from 'vue'
2
+import App from './App.vue'
3
+import router from './router'
4
+import ElementPlus from 'element-plus';
5
+import 'element-plus/dist/index.css';
6
+
7
+const app = createApp(App)
8
+app.use(router)
9
+app.use(ElementPlus)
10
+app.mount('#app')

+ 322 - 0
src/pages/index.vue

@@ -0,0 +1,322 @@
1
+<template>
2
+  <div class="hello">
3
+    <div class="content">
4
+      <div class="content-all">
5
+        <div class="title">速推</div>
6
+        <div class="content-tips">
7
+          <div>多功能利器,一键搞定!</div>
8
+          <div>AI小说转漫画、AI洗爆款视频、Midjourney中文绘画,让你事半功倍!</div>
9
+        </div>
10
+        <div class="floating-buttons">
11
+          <div class="download"
12
+               @click="openNewPage">点击下载</div>
13
+        </div>
14
+      </div>
15
+    </div>
16
+    <div class="main-tips">
17
+      <div class="tips-title">轻松创作,畅享无限可能!</div>
18
+      <div class="tips-text">以最专业的技术,解锁无限可能,尽享多功能体验!</div>
19
+    </div>
20
+    <div class="case">
21
+      <div class="case-content">
22
+        <div class="case-info">
23
+          <div class="case-info-left">
24
+            <div class="case-info-title">
25
+              小说转视频
26
+            </div>
27
+            <div class="case-info-content">
28
+              通过先进的人工智能技术,可以将文本内容转化为生动、富有创意的视频内容。无论是商业展示,还是个人娱乐,都能帮助用户快速、轻松地创建出高质量的视频。
29
+            </div>
30
+          </div>
31
+
32
+          <div class="case-info-right">
33
+            <video controls
34
+                   class="case-info-video"
35
+                   src="https://video-img.fyshark.com/1694057825126xiaoshuo.mp4"
36
+                   preload="none"
37
+                   poster="https://video-img.fyshark.com/1694071581422duoshitu.png"></video>
38
+          </div>
39
+        </div>
40
+        <div class="case-info-v2">
41
+          <div class="case-info-left">
42
+            <video controls
43
+                   class="case-info-video"
44
+                   src="https://video-img.fyshark.com/1694071264801video.mp4"
45
+                   preload="none"
46
+                   poster="https://video-img.fyshark.com/1694072100753WechatIMG15859.jpg"></video>
47
+          </div>
48
+
49
+          <div class="case-info-right-v2">
50
+            <div class="case-info-title">
51
+              洗爆款视频
52
+            </div>
53
+            <div class="case-info-content">
54
+              一键洗爆款视频,无需专业的视频制作技术,也能轻松制作出引人注目的内容。只需一键就可以将他人的热门视频经过重新编辑和包装,仿照其风格和内容,使其变成自己的原创内容。
55
+            </div>
56
+
57
+          </div>
58
+        </div>
59
+        <div class="case-info">
60
+          <div class="case-info-left">
61
+            <div class="case-info-title">
62
+              Midjourney中文绘画
63
+            </div>
64
+            <div class="case-info-content">
65
+              我们将Midjourney官网的功能进行简单直接化和中文化,让你能够更直观、更快速地进行艺术创作,让每一位用户都能轻松掌握。
66
+            </div>
67
+          </div>
68
+
69
+          <div class="case-info-right"> 
70
+            <video controls
71
+                   class="case-info-video"
72
+                   src="https://video-img.fyshark.com/16940718507729%E6%9C%887%E6%97%A5.mp4"
73
+                   preload="none"
74
+                   poster="https://video-img.fyshark.com/1694071395914hslajnf.jpeg"></video>
75
+          </div>
76
+        </div>
77
+
78
+      </div>
79
+    </div>
80
+    <div class="invite">
81
+      <div class="invite-title">诚邀代理合作</div>
82
+      <div class="invite-content">熟悉stable diffusion和Midjourney优先。联系我们:(微信:a1243434798)</div>
83
+    </div>
84
+    <div class="mine">
85
+      <div class="mine-title">关于我们</div>
86
+      <div class="mine-content">
87
+        <div>
88
+          我们一个专注于科技创新和智能技术的领先企业。我们的使命是通过我们的技术解决方案,让人们的生活变得更加便捷,更加丰富。
89
+        </div>
90
+        <div>
91
+          我们的主要业务领域包括但不限于小说转视频、视频清洗等多功能软件开发。我们的产品以其高效、智能和用户友好的特性而受到广大用户的喜爱。
92
+        </div>
93
+        <div>
94
+          在未来,我们将继续深化技术研发,优化产品性能,扩大服务范围,以满足用户不断变化和增长的需求。我们期待与您一起,创造更美好的未来。
95
+        </div>
96
+      </div>
97
+    </div>
98
+    <div class="footer">
99
+      杭州风与鲨科技有限公司
100
+      <a data-v-352b5944="" style="color: #000" href="https://beian.miit.gov.cn/" target="_blank" class="hover">粤ICP备17073188号</a>
101
+    </div>
102
+  </div>
103
+</template>
104
+
105
+<script>
106
+export default {
107
+  name: 'HelloWorld',
108
+  props: {
109
+
110
+  },
111
+  data () {
112
+    return {
113
+      textVideoUrl: 'https://video-img.fyshark.com/1694057825126xiaoshuo.mp4',
114
+      posterUrl: ''
115
+    }
116
+  },
117
+  methods: {
118
+    openNewPage () {
119
+      window.open('https://snvazev2ds.feishu.cn/docx/TWjldQmbPorfIbxi8NXcwpfSnbh', '_blank');
120
+    },
121
+  }
122
+}
123
+</script>
124
+
125
+<style scoped >
126
+.hello {
127
+  position: relative;
128
+}
129
+
130
+.content {
131
+  width: 100vw;
132
+  height: 56.25vw;
133
+  min-height: 800px;
134
+  background: url("https://video-img.fyshark.com/16939982357021693997963339921_1693997970945.jpeg")
135
+    100% 100% no-repeat;
136
+  background-size: cover;
137
+}
138
+.content-all {
139
+  padding-top: 2vw;
140
+  padding-left: 10vw;
141
+}
142
+.title {
143
+  color: aliceblue;
144
+  font-size: 36px;
145
+  font-family: serif;
146
+
147
+  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9);
148
+}
149
+.content-tips {
150
+  color: aliceblue;
151
+  font-size: 36px;
152
+  font-family: serif;
153
+  margin-top: 7vw;
154
+  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9);
155
+}
156
+.banner-name {
157
+  width: 100%;
158
+  height: auto;
159
+}
160
+
161
+.floating-buttons {
162
+  margin-top: 10vw;
163
+}
164
+.download {
165
+  height: 60px;
166
+  line-height: 60px;
167
+  border-radius: 30px;
168
+  cursor: pointer;
169
+  font-size: 24px;
170
+  padding: 0 45px;
171
+  display: inline-block;
172
+  color: aliceblue;
173
+  background-color: #11d59c;
174
+  box-shadow: 2px 2px 30px rgba(0, 0, 0, 5.9);
175
+}
176
+
177
+.software-name {
178
+  margin-top: 20px;
179
+  font-size: 24px;
180
+}
181
+.main-tips {
182
+  text-align: center;
183
+  margin: 80px 0;
184
+}
185
+.tips-title {
186
+  text-align: center;
187
+  margin-bottom: 10px;
188
+  font-size: 28px;
189
+  line-height: 40px;
190
+  font-weight: 700;
191
+}
192
+.tips-text {
193
+  font-size: 18px;
194
+}
195
+.case {
196
+}
197
+.case-content {
198
+}
199
+.case-info {
200
+  padding: 50px 130px 50px 250px;
201
+  background: #f6fafe;
202
+  display: flex;
203
+}
204
+.case-info-v2 {
205
+  padding: 50px 130px 50px 250px;
206
+  display: flex;
207
+}
208
+.case-info-left {
209
+  flex: 1;
210
+}
211
+.case-info-title {
212
+  margin-bottom: 10px;
213
+  font-size: 28px;
214
+  font-weight: 700;
215
+}
216
+.case-info-content {
217
+  font-size: 18px;
218
+}
219
+.case-info-right {
220
+  flex: 1;
221
+  margin-left: 30px;
222
+}
223
+.case-info-right-v2 {
224
+  flex: 1;
225
+  text-align: end;
226
+  margin-left: 100px;
227
+}
228
+.case-info-video {
229
+  width: 100%;
230
+}
231
+.invite {
232
+  padding-top: 20px;
233
+  height: 200px;
234
+  background: url(https://ssl-pubpic.51yund.com/1035407742.png) 100% 0/100% 100%
235
+    #f6fafe no-repeat;
236
+  text-align: center;
237
+}
238
+.invite-title {
239
+  margin-bottom: 10px;
240
+  font-size: 28px;
241
+  color: #333744;
242
+}
243
+.invite-content {
244
+  font-size: 18px;
245
+}
246
+.mine {
247
+  margin-top: 20px;
248
+  text-align: center;
249
+  margin-bottom: 50px;
250
+}
251
+.mine-title {
252
+  margin-bottom: 10px;
253
+  font-size: 28px;
254
+  color: #333744;
255
+}
256
+.mine-content {
257
+  font-size: 18px;
258
+  line-height: 36px;
259
+}
260
+.footer {
261
+  text-align: center;
262
+  font-size: 18px;
263
+  color: #333744;
264
+  line-height: 46px;
265
+}
266
+@media only screen and (max-width: 768px) {
267
+ 
268
+  .download {
269
+    height: 40px;
270
+    line-height: 40px;
271
+    font-size: 18px;
272
+    padding: 0 30px;
273
+  }
274
+
275
+  .main-tips {
276
+    margin: 40px 0;
277
+  }
278
+
279
+  .tips-title {
280
+    font-size: 20px;
281
+    line-height: 30px;
282
+  }
283
+
284
+  .tips-text,
285
+  .case-info-content,
286
+  .invite-content,
287
+  .mine-content {
288
+    font-size: 16px;
289
+  }
290
+  .case-info-content{
291
+    margin-bottom: 10px;
292
+  }
293
+
294
+  .case-info,
295
+  .case-info-v2 {
296
+    padding: 25px 10px 25px 10px;
297
+    flex-direction: column;
298
+  }
299
+  .case-info-v2{
300
+    flex-direction: column-reverse;
301
+  }
302
+
303
+  .case-info-left,
304
+  .case-info-right,
305
+  .case-info-right-v2 {
306
+    margin-left: 0;
307
+  }
308
+
309
+  .invite {
310
+    height: 100px;
311
+  }
312
+
313
+  .invite-title,
314
+  .mine-title {
315
+    font-size: 20px;
316
+  }
317
+
318
+  .footer {
319
+    font-size: 16px;
320
+  }
321
+}
322
+</style>

+ 15 - 0
src/router/index.js

@@ -0,0 +1,15 @@
1
+import { createRouter, createWebHistory } from 'vue-router'
2
+import Home from '../pages/index'
3
+
4
+const routes = [
5
+  // 定义您的路由路径和组件 
6
+  // 例如:
7
+  { path: '/', component: Home },
8
+]
9
+
10
+const router = createRouter({
11
+  history: createWebHistory(),
12
+  routes,
13
+})
14
+
15
+export default router

+ 22 - 0
vue.config.js

@@ -0,0 +1,22 @@
1
+const { defineConfig } = require('@vue/cli-service')
2
+module.exports = defineConfig({
3
+  publicPath:'https://www.fyshark.com',
4
+  // 设置跨域
5
+  crossorigin: 'anonymous',
6
+  /**
7
+     * 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。
8
+     *  map文件的作用在于:项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。
9
+     *  有了map就可以像未加密的代码一样,准确的输出是哪一行哪一列有错。
10
+     * */
11
+  productionSourceMap: false,
12
+  transpileDependencies: ['swiper', 'dom7'],
13
+
14
+  // 它支持webPack-dev-server的所有选项
15
+  devServer: {
16
+    host: "0.0.0.0",
17
+    port: 8083, // 端口号
18
+    https: false, // https:{type:Boolean}
19
+    open: true, //配置自动启动浏览器
20
+    proxy: '' // 配置跨域处理
21
+  },
22
+})