HolyKnightIX 2 lat temu
rodzic
commit
f8b79d2776
8 zmienionych plików z 741 dodań i 520 usunięć
  1. +1
    -12
      README.md
  2. BIN
      src/assets/img/parter7.png
  3. BIN
      src/assets/img/partner7.png
  4. +113
    -77
      src/components/common/tail.vue
  5. +49
    -34
      src/components/common/top.vue
  6. +391
    -246
      src/components/home/home.vue
  7. +185
    -149
      src/components/views/turing.vue
  8. +2
    -2
      src/router/index.js

+ 1
- 12
README.md Wyświetl plik

@@ -22,15 +22,4 @@ npm run build


See [Configuration Reference](https://cli.vuejs.org/config/). See [Configuration Reference](https://cli.vuejs.org/config/).


未知的node版本,若要稳定运行此项目,请确保node版本为v10.24.1,且运行忽略node版本检查

```powershell
yarn config set ignore-engines true
```

Unknow node.js Engines,if you want to run project,please make sure your node.js Version 10.24.1,then go ignore check
node,js Engines.

```powershell
yarn config set ignore-engines true
```
若要稳定运行此项目,请确保node版本为v16.14.0

BIN
src/assets/img/parter7.png Wyświetl plik

Przed Po
Szerokość: 156  |  Wysokość: 156  |  Rozmiar: 11 KiB

BIN
src/assets/img/partner7.png Wyświetl plik

Przed Po
Szerokość: 480  |  Wysokość: 480  |  Rozmiar: 47 KiB

+ 113
- 77
src/components/common/tail.vue Wyświetl plik

@@ -1,25 +1,40 @@
<template> <template>
<div class="tailBox"> <div class="tailBox">
<div class="taillong"> <div class="taillong">
<img src="../../assets/img/LOGO1.png" alt />
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/LOGO1.png"
alt
/>
</div> </div>
<div class="tiemBox"> <div class="tiemBox">
<div class="taolIconBox"> <div class="taolIconBox">
<div class="taolIconText"> <div class="taolIconText">
{{ characters == 1 ? '关注我们' : 'follow Us' }}
{{ characters == 1 ? "关注我们" : "follow Us" }}
</div> </div>
<div class="iconBox"> <div class="iconBox">
<img src="../../assets/img/f.png" alt />
<img src="../../assets/img/o.png" alt />
<img src="../../assets/img/ft.png" alt />
<img src="../../assets/img/x.png" alt />
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/f.png"
alt
/>
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/o.png"
alt
/>
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/ft.png"
alt
/>
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/x.png"
alt
/>
</div> </div>
</div> </div>
<div class="contentBox"> <div class="contentBox">
<div class="taolIconText"> <div class="taolIconText">
{{ characters == 1 ? '联系我们' : 'Contact us' }}
{{ characters == 1 ? "联系我们" : "Contact us" }}
</div> </div>
<!-- <div class="contentInput"> <!-- <div class="contentInput">
<el-input v-model="userName" :placeholder="characters == 1 ? '姓名' : 'Name'"></el-input> <el-input v-model="userName" :placeholder="characters == 1 ? '姓名' : 'Name'"></el-input>
@@ -35,15 +50,24 @@
</div> --> </div> -->
<el-form v-if="showForm" ref="form" :rules="rules1" :model="form"> <el-form v-if="showForm" ref="form" :rules="rules1" :model="form">
<el-form-item class="width" prop="userName"> <el-form-item class="width" prop="userName">
<el-input v-model="form.userName" maxlength="10" :placeholder="characters == 1 ? '姓名' : 'Name'"></el-input>
<el-input
v-model="form.userName"
maxlength="10"
:placeholder="characters == 1 ? '姓名' : 'Name'"
></el-input>
</el-form-item> </el-form-item>
<el-form-item class="width" prop="phone"> <el-form-item class="width" prop="phone">
<el-input v-model="form.phone" :placeholder="characters == 1 ? '手机' : 'Phone'"></el-input>
<el-input
v-model="form.phone"
:placeholder="characters == 1 ? '手机' : 'Phone'"
></el-input>
</el-form-item> </el-form-item>
<el-form-item class="width" prop="email"> <el-form-item class="width" prop="email">
<el-input v-model="form.email" placeholder="Email"></el-input> <el-input v-model="form.email" placeholder="Email"></el-input>
</el-form-item> </el-form-item>
<el-button class="subBtn1" type="primary" @click="submit()">{{ characters == 1 ? '提 交' : 'Submit' }}</el-button>
<el-button class="subBtn1" type="primary" @click="submit()">{{
characters == 1 ? "提 交" : "Submit"
}}</el-button>
</el-form> </el-form>
</div> </div>
@@ -52,27 +76,37 @@
<div class="site"> <div class="site">
{{ {{
characters == 1 characters == 1
? '北京市海淀区中关村南大街12号农业科学院信息楼311室'
: '311, Information Building, Academy of Agricultural Sciences, No. 12 Zhongguancun South Street, Haidian District, Beijing'
? "北京市海淀区中关村南大街12号农业科学院信息楼311室"
: "311, Information Building, Academy of Agricultural Sciences, No. 12 Zhongguancun South Street, Haidian District, Beijing"
}} }}
</div> </div>
<div class="phone" v-if="characters == 1">周女士 +65 9422 2858</div> <div class="phone" v-if="characters == 1">周女士 +65 9422 2858</div>
<div class="phone" v-if="characters != 1">Chow +65 9422 2858</div> <div class="phone" v-if="characters != 1">Chow +65 9422 2858</div>
<div class="site"> <div class="site">
{{ characters == 1 ? '新加坡北桥路111号,半岛广场07-11号,邮编179098' : '111 North Bridge Road, #07-11, Penisula Plaza, Singapore 179098' }}
{{
characters == 1
? "新加坡北桥路111号,半岛广场07-11号,邮编179098"
: "111 North Bridge Road, #07-11, Penisula Plaza, Singapore 179098"
}}
</div> </div>
<div class="rqCodeTiemBox"> <div class="rqCodeTiemBox">
<div class="rqCodeTiem"> <div class="rqCodeTiem">
<div class="rqcode"> <div class="rqcode">
<!-- <img src="../../assets/img/wechat.png" alt /> -->
<img src="../../assets/img/vx.jpg" alt />
<!-- <img src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/wechat.png" alt /> -->
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/vx.jpg"
alt
/>
</div> </div>
<div class="rqtext">Wechat</div> <div class="rqtext">Wechat</div>
</div> </div>
<div class="rqCodeTiem1"> <div class="rqCodeTiem1">
<div class="rqcode"> <div class="rqcode">
<!-- <img src="../../assets/img/tiktok.png" alt /> -->
<img src="../../assets/img/dy.png" alt />
<!-- <img src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/tiktok.png" alt /> -->
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/dy.png"
alt
/>
</div> </div>
<div class="rqtext">Tiktok</div> <div class="rqtext">Tiktok</div>
</div> </div>
@@ -88,17 +122,17 @@
</div> </div>
</template> </template>
<script> <script>
import { mapState } from 'vuex';
import { mapState } from "vuex";
export default { export default {
data() { data() {
return { return {
userName: '',
phone: '',
email: '',
userName: "",
phone: "",
email: "",
form: { form: {
userName: '',
phone: '',
email: ''
userName: "",
phone: "",
email: "",
}, },
rules: { rules: {
userName: [ userName: [
@@ -106,16 +140,16 @@ export default {
required: true, required: true,
min: 1, min: 1,
max: 10, max: 10,
message: '此项必填,内容最大10个字符!',
trigger: 'blur'
}
message: "此项必填,内容最大10个字符!",
trigger: "blur",
},
], ],
phone: [ phone: [
{ {
required: true, required: true,
trigger: 'change',
message: '请先输手机号',
trigger: 'blur'
trigger: "change",
message: "请先输手机号",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
@@ -123,18 +157,18 @@ export default {
// var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/, // var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/,
let phone = /^1[35789]\d{9}$/; let phone = /^1[35789]\d{9}$/;
if (value && !phone.test(value)) { if (value && !phone.test(value)) {
callback('抱歉,请输入正确的手机号');
callback("抱歉,请输入正确的手机号");
} }
callback(errors); callback(errors);
}
}
},
},
], ],
email: [ email: [
{ {
required: true, required: true,
trigger: 'change',
message: '请输入邮箱!',
trigger: 'blur'
trigger: "change",
message: "请输入邮箱!",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
@@ -142,12 +176,12 @@ export default {
// var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/, // var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/,
let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (value && !email.test(value)) { if (value && !email.test(value)) {
callback('抱歉,请输入正确的邮箱');
callback("抱歉,请输入正确的邮箱");
} }
callback(errors); callback(errors);
}
}
]
},
},
],
}, },
rulesEnglish: { rulesEnglish: {
userName: [ userName: [
@@ -155,49 +189,49 @@ export default {
required: true, required: true,
min: 1, min: 1,
max: 10, max: 10,
message: 'This item is required !',
trigger: 'blur'
}
message: "This item is required !",
trigger: "blur",
},
], ],
phone: [ phone: [
{ {
required: true, required: true,
trigger: 'change',
message: 'Please enter your cell phone number',
trigger: 'blur'
trigger: "change",
message: "Please enter your cell phone number",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
var errors = []; var errors = [];
let phone = /^1[35789]\d{9}$/; let phone = /^1[35789]\d{9}$/;
if (value && !phone.test(value)) { if (value && !phone.test(value)) {
callback('Sorry, please enter the correct cell phone number');
callback("Sorry, please enter the correct cell phone number");
} }
callback(errors); callback(errors);
}
}
},
},
], ],
email: [ email: [
{ {
required: true, required: true,
trigger: 'change',
message: 'Please enter email!',
trigger: 'blur'
trigger: "change",
message: "Please enter email!",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
var errors = []; var errors = [];
let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (value && !email.test(value)) { if (value && !email.test(value)) {
callback('Sorry, please enter the correct email address');
callback("Sorry, please enter the correct email address");
} }
callback(errors); callback(errors);
}
}
]
},
},
],
}, },
rules1: null, rules1: null,
showForm: true
showForm: true,
}; };
}, },
methods: { methods: {
@@ -218,45 +252,47 @@ export default {
// applicant: this.userName, //姓名 // applicant: this.userName, //姓名
// phone: this.phone //电话 // phone: this.phone //电话
// }; // };
this.$refs.form.validate(valid => {
this.$refs.form.validate((valid) => {
console.log(valid); console.log(valid);
if (valid) { if (valid) {
let params = { let params = {
mallName: this.form.email, //邮箱 mallName: this.form.email, //邮箱
applicant: this.form.userName, //姓名 applicant: this.form.userName, //姓名
phone: this.form.phone //电话
phone: this.form.phone, //电话
}; };
this.$axios({ this.$axios({
method: 'post',
url: '/C/api/wxMallApply/add',
method: "post",
url: "/C/api/wxMallApply/add",
headers: { headers: {
'Content-Type': 'application/json;charset=UTF-8'
"Content-Type": "application/json;charset=UTF-8",
}, },
data: params
data: params,
}) })
.then(res => {
this.email = '';
this.userName = '';
this.phone = '';
this.form.email = '';
this.form.userName = '';
this.form.phone = '';
this.$message.success(this.characters == 1 ? '提交成功' : 'submit successfully');
.then((res) => {
this.email = "";
this.userName = "";
this.phone = "";
this.form.email = "";
this.form.userName = "";
this.form.phone = "";
this.$message.success(
this.characters == 1 ? "提交成功" : "submit successfully"
);
}) })
.catch(err => {
.catch((err) => {
this.$message.error(err.message); this.$message.error(err.message);
}); });
} }
}); });
}
},
}, },
created() { created() {
this.rules1 = this.rules; this.rules1 = this.rules;
}, },
computed: { computed: {
...mapState({ ...mapState({
characters: state => state.publicObj.characters
})
characters: (state) => state.publicObj.characters,
}),
}, },
watch: { watch: {
@@ -270,8 +306,8 @@ export default {
setTimeout(() => { setTimeout(() => {
this.showForm = true; this.showForm = true;
}, 100); }, 100);
}
}
},
},
}; };
</script> </script>


+ 49
- 34
src/components/common/top.vue Wyświetl plik

@@ -1,7 +1,11 @@
<template> <template>
<div class="topBox" ref="scrollDiv"> <div class="topBox" ref="scrollDiv">
<div class="logoBox" @click="go('/')"> <div class="logoBox" @click="go('/')">
<img src="../../assets/img/logo.png" alt class="logo" />
<img
src="https://suimang.oss-accelerate.aliyuncs.com/builtin/static/pc/assets/img/logo.png"
alt
class="logo"
/>
<div class="logoTitle">metavatar</div> <div class="logoTitle">metavatar</div>
</div> </div>
@@ -9,38 +13,49 @@
<div class="categoryitem"> <div class="categoryitem">
<el-dropdown @command="handleCommand"> <el-dropdown @command="handleCommand">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
{{ characters == 1 ? '产品能力' : 'Products' }}
{{ characters == 1 ? "产品能力" : "Products" }}
<i class="el-icon-arrow-down el-icon--right"></i> <i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="MetaGene"> <el-dropdown-item command="MetaGene">
{{ characters == 1 ? '慧生' : 'MetaGene' }}
{{ characters == 1 ? "邃芒慧生" : "MetaGene" }}
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="MetaManeuver">{{ characters == 1 ? '慧播' : 'MetaStreaming' }}</el-dropdown-item>
<el-dropdown-item command="MetaStream">{{ characters == 1 ? '慧影' : 'MetaNeuver' }}</el-dropdown-item>
<el-dropdown-item command="MetaTuring">{{ characters == 1 ? '邃芒慧侃' : 'MetaTuring' }}</el-dropdown-item>
<el-dropdown-item command="MetaStream">{{
characters == 1 ? "邃芒慧播" : "MetaStreaming"
}}</el-dropdown-item>
<el-dropdown-item command="MetaManeuver">{{
characters == 1 ? "邃芒慧影" : "MetaNeuver"
}}</el-dropdown-item>
<el-dropdown-item command="MetaTuring">{{
characters == 1 ? "邃芒慧侃" : "MetaTuring"
}}</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</div> </div>
<div class="categoryitem" @click="goView('Technology')"> <div class="categoryitem" @click="goView('Technology')">
{{ characters == 1 ? '创新技术' : 'Technology' }}
{{ characters == 1 ? "创新技术" : "Technology" }}
</div> </div>
<div class="categoryitem" @click="goView('Solutions')"> <div class="categoryitem" @click="goView('Solutions')">
{{ characters == 1 ? '解决方案' : 'Solutions' }}
{{ characters == 1 ? "解决方案" : "Solutions" }}
</div> </div>
<!-- <div class="categoryitem" @click="goView('Cases')"> <!-- <div class="categoryitem" @click="goView('Cases')">
{{ characters == 1 ? "经典案例" : "Cases" }} {{ characters == 1 ? "经典案例" : "Cases" }}
</div> --> </div> -->
<div class="categoryitem" @click="goView('aboutUs')"> <div class="categoryitem" @click="goView('aboutUs')">
{{ characters == 1 ? '关于我们' : 'About us' }}
{{ characters == 1 ? "关于我们" : "About us" }}
</div> </div>
</div> </div>
<div class="cutBox"> <div class="cutBox">
<!-- <img src="@/assets/img/earth.png" alt="" /> --> <!-- <img src="@/assets/img/earth.png" alt="" /> -->
<div class="en"> <div class="en">
<el-select v-model="charactersMy" placeholder="请选择" @change="change"> <el-select v-model="charactersMy" placeholder="请选择" @change="change">
<el-option v-for="item in languageLsit" :key="item.value" :label="item.name" :value="item.value">
<el-option
v-for="item in languageLsit"
:key="item.value"
:label="item.name"
:value="item.value"
>
<div class> <div class>
<!-- <img :src="item.url" alt class="cutImg" /> --> <!-- <img :src="item.url" alt class="cutImg" /> -->
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
@@ -52,25 +67,25 @@
</div> </div>
</template> </template>
<script> <script>
import { mapState, mapActions } from 'vuex';
import { mapState, mapActions } from "vuex";
export default { export default {
name: 'top',
name: "top",
data() { data() {
return { return {
languageLsit: [ languageLsit: [
{ {
name: '中文(中国)',
name: "中文(中国)",
value: 1, value: 1,
url: require('../../assets/img/cn.jpeg')
url: require("../../assets/img/cn.jpeg"),
}, },
{ {
name: 'English(USA)',
name: "English(USA)",
value: 2, value: 2,
url: require('../../assets/img/en.jpg')
}
url: require("../../assets/img/en.jpg"),
},
], ],
charactersMy: 1
charactersMy: 1,
}; };
}, },
watch: { watch: {
@@ -89,11 +104,11 @@ export default {
}, },
computed: { computed: {
...mapState({ ...mapState({
characters: state => state.publicObj.characters
})
characters: (state) => state.publicObj.characters,
}),
}, },
methods: { methods: {
...mapActions(['setCharacters']),
...mapActions(["setCharacters"]),
change(value) { change(value) {
console.log(value); console.log(value);
this.setCharacters(value); this.setCharacters(value);
@@ -102,20 +117,20 @@ export default {
this.$router.push(`/${path}`); this.$router.push(`/${path}`);
}, },
goView(id) { goView(id) {
if (id == 'Technology' || id == 'Solutions') {
if (id == "Technology" || id == "Solutions") {
this.$router.push(`/`); this.$router.push(`/`);
setTimeout(() => { setTimeout(() => {
document.querySelector('#' + id).scrollIntoView({
behavior: 'smooth', //定义动画过渡效果"auto"或 "smooth" 之一。默认为 "auto"。
block: 'start', //定义垂直方向的对齐, "start", "center", "end", 或 "nearest"之一。默认为 "start"。
inline: 'nearest' //"start", "center", "end", 或 "nearest"之一。默认为 "nearest"。
document.querySelector("#" + id).scrollIntoView({
behavior: "smooth", //定义动画过渡效果"auto"或 "smooth" 之一。默认为 "auto"。
block: "start", //定义垂直方向的对齐, "start", "center", "end", 或 "nearest"之一。默认为 "start"。
inline: "nearest", //"start", "center", "end", 或 "nearest"之一。默认为 "nearest"。
}); });
}, 100); }, 100);
} else { } else {
document.querySelector('#' + id).scrollIntoView({
behavior: 'smooth', //定义动画过渡效果"auto"或 "smooth" 之一。默认为 "auto"。
block: 'start', //定义垂直方向的对齐, "start", "center", "end", 或 "nearest"之一。默认为 "start"。
inline: 'nearest' //"start", "center", "end", 或 "nearest"之一。默认为 "nearest"。
document.querySelector("#" + id).scrollIntoView({
behavior: "smooth", //定义动画过渡效果"auto"或 "smooth" 之一。默认为 "auto"。
block: "start", //定义垂直方向的对齐, "start", "center", "end", 或 "nearest"之一。默认为 "start"。
inline: "nearest", //"start", "center", "end", 或 "nearest"之一。默认为 "nearest"。
}); });
} }
}, },
@@ -130,16 +145,16 @@ export default {
handleScrollTop() { handleScrollTop() {
this.$nextTick(() => { this.$nextTick(() => {
let scrollElem = this.$refs.scrollDiv; let scrollElem = this.$refs.scrollDiv;
scrollElem.scrollTo({ top: 0, behavior: 'smooth' });
scrollElem.scrollTo({ top: 0, behavior: "smooth" });
}); });
}
},
}, },
mounted() { mounted() {
console.log(this.languageLsit, 'characters');
console.log(this.languageLsit, "characters");
}, },
created() { created() {
this.handleScrollTop(); this.handleScrollTop();
}
},
}; };
</script> </script>


+ 391
- 246
src/components/home/home.vue
Plik diff jest za duży
Wyświetl plik


+ 185
- 149
src/components/views/turing.vue Wyświetl plik

@@ -1,9 +1,17 @@
<template> <template>
<div class="Box" id="top"> <div class="Box" id="top">
<div class="module_1"> <div class="module_1">
<img ref="vidoe" src="../../assets/img/LiLei@2x.png" width="100%" height="100%" autoplay muted="muted" loop="loop" />
<img
ref="vidoe"
src="../../assets/img/LiLei@2x.png"
width="100%"
height="100%"
autoplay
muted="muted"
loop="loop"
/>
<div class="titleBox"> <div class="titleBox">
<div class="title_item1" v-if="characters == 1">邃图灵</div>
<div class="title_item1" v-if="characters == 1">邃芒慧侃</div>
<!-- <div class="title_item3" v-if="characters == 1"> <!-- <div class="title_item3" v-if="characters == 1">
轻松创造您独一无二的数字人IP 轻松创造您独一无二的数字人IP
</div> --> </div> -->
@@ -13,44 +21,69 @@
<div class="title_item1_y" v-if="characters == 1">与李雷成为朋友</div> <div class="title_item1_y" v-if="characters == 1">与李雷成为朋友</div>
<div class="title_item1" v-if="characters != 1">MetaTuring</div> <div class="title_item1" v-if="characters != 1">MetaTuring</div>
<div class="title_item1_y" v-if="characters != 1">Be friend with Lee</div>
<div class="title_item1_y" v-if="characters != 1">
Be friend with Lee
</div>
<!-- <div class="title_item3" v-if="characters != 1"> <!-- <div class="title_item3" v-if="characters != 1">
Easily create your unique digital IP Easily create your unique digital IP
</div> --> </div> -->
<div class="title_btn" @click="showBox"> <div class="title_btn" @click="showBox">
{{ characters == 1 ? '与李雷交谈' : 'converse to Lee' }}
{{ characters == 1 ? "与李雷交谈" : "converse to Lee" }}
</div> </div>
</div> </div>
<div class="md1" id="md1"></div> <div class="md1" id="md1"></div>
</div> </div>
<el-dialog :title="characters == 1 ? '留下您的信息,我们会尽快与您取得联系' : 'Tell us about yourself, we ll be in touch right away.'" :visible.sync="dialogVisible" width="34%">
<el-form ref="form" :rules="characters == 1 ? rules : rulesEnglish" :model="form">
<el-dialog
:title="
characters == 1
? '留下您的信息,我们会尽快与您取得联系'
: 'Tell us about yourself, we ll be in touch right away.'
"
:visible.sync="dialogVisible"
width="34%"
>
<el-form
ref="form"
:rules="characters == 1 ? rules : rulesEnglish"
:model="form"
>
<el-form-item class="width" prop="name"> <el-form-item class="width" prop="name">
<el-input v-model="form.name" maxlength="10" :placeholder="characters == 1 ? '姓名' : 'Name'"></el-input>
<el-input
v-model="form.name"
maxlength="10"
:placeholder="characters == 1 ? '姓名' : 'Name'"
></el-input>
</el-form-item> </el-form-item>
<el-form-item class="width" prop="phone"> <el-form-item class="width" prop="phone">
<el-input v-model="form.phone" :placeholder="characters == 1 ? '手机' : 'Phone'"></el-input>
<el-input
v-model="form.phone"
:placeholder="characters == 1 ? '手机' : 'Phone'"
></el-input>
</el-form-item> </el-form-item>
<el-form-item class="width" prop="email"> <el-form-item class="width" prop="email">
<el-input v-model="form.email" placeholder="Email"></el-input> <el-input v-model="form.email" placeholder="Email"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">{{ characters == 1 ? '取 消' : 'Cancel' }}</el-button>
<el-button type="primary" @click="submit()">{{ characters == 1 ? '提 交' : 'Submit' }}</el-button>
<el-button @click="dialogVisible = false">{{
characters == 1 ? "取 消" : "Cancel"
}}</el-button>
<el-button type="primary" @click="submit()">{{
characters == 1 ? "提 交" : "Submit"
}}</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import 'swiper/dist/js/swiper';
import 'swiper/dist/css/swiper.css';
import Swiper from 'swiper';
import { mapState, mapActions } from 'vuex';
import "swiper/dist/js/swiper";
import "swiper/dist/css/swiper.css";
import Swiper from "swiper";
import { mapState, mapActions } from "vuex";
export default { export default {
data() { data() {
@@ -59,27 +92,27 @@ export default {
charactersMy: 1, charactersMy: 1,
languageLsit: [ languageLsit: [
{ {
name: 'Cn',
name: "Cn",
value: 1, value: 1,
url: require('../../assets/img/cn.jpeg')
url: require("../../assets/img/cn.jpeg"),
}, },
{ {
name: 'En',
name: "En",
value: 2, value: 2,
url: require('../../assets/img/en.jpg')
}
url: require("../../assets/img/en.jpg"),
},
], ],
// //
userName: '',
phone: '',
email: '',
userName: "",
phone: "",
email: "",
form: { form: {
name: '',
phone: '',
email: ''
name: "",
phone: "",
email: "",
}, },
rules: { rules: {
@@ -88,16 +121,16 @@ export default {
required: true, required: true,
min: 1, min: 1,
max: 10, max: 10,
message: '此项必填,内容最大10个字符!',
trigger: 'blur'
}
message: "此项必填,内容最大10个字符!",
trigger: "blur",
},
], ],
phone: [ phone: [
{ {
required: true, required: true,
trigger: 'change',
message: '请先输手机号',
trigger: 'blur'
trigger: "change",
message: "请先输手机号",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
@@ -105,18 +138,18 @@ export default {
// var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/, // var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/,
let phone = /^1[35789]\d{9}$/; let phone = /^1[35789]\d{9}$/;
if (value && !phone.test(value)) { if (value && !phone.test(value)) {
callback('抱歉,请输入正确的手机号');
callback("抱歉,请输入正确的手机号");
} }
callback(errors); callback(errors);
}
}
},
},
], ],
email: [ email: [
{ {
required: true, required: true,
trigger: 'change',
message: '请输入邮箱!',
trigger: 'blur'
trigger: "change",
message: "请输入邮箱!",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
@@ -124,12 +157,12 @@ export default {
// var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/, // var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/,
let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (value && !email.test(value)) { if (value && !email.test(value)) {
callback('抱歉,请输入正确的邮箱');
callback("抱歉,请输入正确的邮箱");
} }
callback(errors); callback(errors);
}
}
]
},
},
],
}, },
rulesEnglish: { rulesEnglish: {
name: [ name: [
@@ -137,174 +170,175 @@ export default {
required: true, required: true,
min: 1, min: 1,
max: 10, max: 10,
message: 'This item is required !',
trigger: 'blur'
}
message: "This item is required !",
trigger: "blur",
},
], ],
phone: [ phone: [
{ {
required: true, required: true,
trigger: 'change',
message: 'Please enter your cell phone number',
trigger: 'blur'
trigger: "change",
message: "Please enter your cell phone number",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
var errors = []; var errors = [];
let phone = /^1[35789]\d{9}$/; let phone = /^1[35789]\d{9}$/;
if (value && !phone.test(value)) { if (value && !phone.test(value)) {
callback('Sorry, please enter the correct cell phone number');
callback("Sorry, please enter the correct cell phone number");
} }
callback(errors); callback(errors);
}
}
},
},
], ],
email: [ email: [
{ {
required: true, required: true,
trigger: 'change',
message: 'Please enter email!',
trigger: 'blur'
trigger: "change",
message: "Please enter email!",
trigger: "blur",
}, },
{ {
validator(rule, value, callback, source, options) { validator(rule, value, callback, source, options) {
var errors = []; var errors = [];
let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; let email = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (value && !email.test(value)) { if (value && !email.test(value)) {
callback('Sorry, please enter the correct email address');
callback("Sorry, please enter the correct email address");
} }
callback(errors); callback(errors);
}
}
]
},
},
],
}, },
// characters: 1, //1=》中文 2=》英文 // characters: 1, //1=》中文 2=》英文
timeFlag: 5, timeFlag: 5,
dialogVisible: false, dialogVisible: false,
module_6_data: [ module_6_data: [
{ {
url: require('../../assets/img/demo_1.png'),
name: '增加电子商务销售额',
name_y: 'Increase eCommerce sales'
url: require("../../assets/img/demo_1.png"),
name: "增加电子商务销售额",
name_y: "Increase eCommerce sales",
}, },
{ {
url: require('../../assets/img/demo_2.png'),
name: '推动品牌声誉',
name_y: 'Drive Brand engagement'
url: require("../../assets/img/demo_2.png"),
name: "推动品牌声誉",
name_y: "Drive Brand engagement",
}, },
{ {
url: require('../../assets/img/demo_3.png'),
name: '拓展客户服务',
name_y: 'Scale customer service'
url: require("../../assets/img/demo_3.png"),
name: "拓展客户服务",
name_y: "Scale customer service",
}, },
{ {
url: require('../../assets/img/demo_4.png'),
name: ' 节约您的劳动成本',
name_y: ' Augment your current workforce'
url: require("../../assets/img/demo_4.png"),
name: " 节约您的劳动成本",
name_y: " Augment your current workforce",
}, },
{ {
url: require('../../assets/img/demo_5.png'),
name: ' 提供支持和陪伴',
name_y: 'Provide support and companionship'
url: require("../../assets/img/demo_5.png"),
name: " 提供支持和陪伴",
name_y: "Provide support and companionship",
}, },
{ {
url: require('../../assets/img/demo_6.png'),
name: '投资元宇宙的未来',
name_y: 'Deliver knowledge and learning'
url: require("../../assets/img/demo_6.png"),
name: "投资元宇宙的未来",
name_y: "Deliver knowledge and learning",
}, },
{ {
url: require('../../assets/img/demo_7.png'),
name: '数字化名人的力量',
name_y: 'Leverage the power of Digital Celebrities'
url: require("../../assets/img/demo_7.png"),
name: "数字化名人的力量",
name_y: "Leverage the power of Digital Celebrities",
}, },
{ {
url: require('../../assets/img/demo_8.png'),
name: '传递学习和知识',
name_y: ' Invest in the metaverse future'
}
url: require("../../assets/img/demo_8.png"),
name: "传递学习和知识",
name_y: " Invest in the metaverse future",
},
], ],
carouselLsit: [ carouselLsit: [
{ {
url: require('../../assets/img/carousel1.png')
url: require("../../assets/img/carousel1.png"),
}, },
{ {
url: require('../../assets/img/carousel2.png')
url: require("../../assets/img/carousel2.png"),
}, },
{ {
url: require('../../assets/img/carousel3.png')
}
url: require("../../assets/img/carousel3.png"),
},
], ],
partnerLsit: [ partnerLsit: [
{ {
url: require('../../assets/img/partner1.png')
url: require("../../assets/img/partner1.png"),
}, },
{ {
url: require('../../assets/img/partner2.png')
url: require("../../assets/img/partner2.png"),
}, },
{ {
url: require('../../assets/img/partner3.png')
url: require("../../assets/img/partner3.png"),
}, },
{ {
url: require('../../assets/img/partner4.png')
url: require("../../assets/img/partner4.png"),
}, },
{ {
url: require('../../assets/img/partner5.png')
}
url: require("../../assets/img/partner5.png"),
},
], ],
timeLsit: [ timeLsit: [
{ {
title: '2018-10',
ctn1_y: 'Team built up in Oct. 2018',
title: "2018-10",
ctn1_y: "Team built up in Oct. 2018",
// ctn2_y: "Team built up in Oct. 2018", // ctn2_y: "Team built up in Oct. 2018",
ctn1: '团队组建'
ctn1: "团队组建",
// ctn2: "团队组建" // ctn2: "团队组建"
}, },
{ {
url: require('../../assets/img/carousel2.png'),
title: '2019',
ctn1_y: 'Deliver the first movie project in May. 2019',
url: require("../../assets/img/carousel2.png"),
title: "2019",
ctn1_y: "Deliver the first movie project in May. 2019",
// ctn2_y: "Deliver the first movie project in May. 2019", // ctn2_y: "Deliver the first movie project in May. 2019",
ctn1: '第一个影视特效 ',
ctn2: '项目交付'
ctn1: "第一个影视特效 ",
ctn2: "项目交付",
}, },
{ {
url: require('../../assets/img/carousel3.png'),
title: '2021-05',
ctn1_y: 'Beta of MetaGene published in May,2021',
url: require("../../assets/img/carousel3.png"),
title: "2021-05",
ctn1_y: "Beta of MetaGene published in May,2021",
// ctn2_y: "Beta of MetaGene published in May,2021", // ctn2_y: "Beta of MetaGene published in May,2021",
ctn1: '内部产品',
ctn2: 'Metagene V1完成'
ctn1: "内部产品",
ctn2: "Metagene V1完成",
}, },
{ {
url: require('../../assets/img/carousel3.png'),
title: '2021-08',
ctn1_y: 'Metavatar built up in Aug, 2021',
url: require("../../assets/img/carousel3.png"),
title: "2021-08",
ctn1_y: "Metavatar built up in Aug, 2021",
// ctn2_y: "Metavatar built up in Aug, 2021", // ctn2_y: "Metavatar built up in Aug, 2021",
ctn1: '邃芒科技成立'
ctn1: "邃芒科技成立",
// ctn2: "邃芒科技成立", // ctn2: "邃芒科技成立",
}, },
{ {
url: require('../../assets/img/carousel3.png'),
title: '2022-01',
ctn1_y: 'Angel fund in Jan, 2022',
url: require("../../assets/img/carousel3.png"),
title: "2022-01",
ctn1_y: "Angel fund in Jan, 2022",
// ctn2_y: "Angel fund in Jan, 2022", // ctn2_y: "Angel fund in Jan, 2022",
ctn1: '获得天使轮融资'
ctn1: "获得天使轮融资",
// ctn2: "获得天使轮融资", // ctn2: "获得天使轮融资",
}, },
{ {
url: require('../../assets/img/carousel3.png'),
title: '2022-06',
ctn1_y: 'Deliver the first project based on Magenta for our strategic partner in Jun,2022',
url: require("../../assets/img/carousel3.png"),
title: "2022-06",
ctn1_y:
"Deliver the first project based on Magenta for our strategic partner in Jun,2022",
// ctn2_y: "Beta of MetaGene published in May,2021", // ctn2_y: "Beta of MetaGene published in May,2021",
ctn1: '为战略合作伙伴新奥特',
ctn2: '交付首个基于MetaGene的内容生产项目'
}
]
ctn1: "为战略合作伙伴新奥特",
ctn2: "交付首个基于MetaGene的内容生产项目",
},
],
}; };
}, },
methods: { methods: {
...mapActions(['setCharacters']),
...mapActions(["setCharacters"]),
change(value) { change(value) {
console.log(value); console.log(value);
@@ -315,59 +349,61 @@ export default {
this.dialogVisible = true; this.dialogVisible = true;
}, },
goView(id) { goView(id) {
document.querySelector('#' + id).scrollIntoView({
document.querySelector("#" + id).scrollIntoView({
//定义动画过渡效果"auto"或 "smooth" 之一。默认为 "auto"。 //定义动画过渡效果"auto"或 "smooth" 之一。默认为 "auto"。
block: 'start',
block: "start",
//定义垂直方向的对齐, "start", "center", "end", 或 "nearest"之一。默认为 "start"。 //定义垂直方向的对齐, "start", "center", "end", 或 "nearest"之一。默认为 "start"。
inline: 'nearest',
inline: "nearest",
//"start", "center", "end", 或 "nearest"之一。默认为 "nearest"。 //"start", "center", "end", 或 "nearest"之一。默认为 "nearest"。
behavior: 'smooth'
behavior: "smooth",
}); });
}, },
goPages(path) { goPages(path) {
this.$router.push(`/${path}`); this.$router.push(`/${path}`);
}, },
submit() { submit() {
this.$refs.form.validate(valid => {
this.$refs.form.validate((valid) => {
console.log(valid); console.log(valid);
if (valid) { if (valid) {
let params = { let params = {
mallName: this.form.email, //邮箱 mallName: this.form.email, //邮箱
applicant: this.form.name, //姓名 applicant: this.form.name, //姓名
phone: this.form.phone //电话
phone: this.form.phone, //电话
}; };
this.$axios({ this.$axios({
method: 'post',
url: '/C/api/wxMallApply/add',
method: "post",
url: "/C/api/wxMallApply/add",
headers: { headers: {
'Content-Type': 'application/json;charset=UTF-8'
"Content-Type": "application/json;charset=UTF-8",
}, },
data: params
data: params,
}) })
.then(res => {
this.form.email = '';
this.form.name = '';
this.form.phone = '';
this.$message.success(this.characters == 1 ? '提交成功' : 'submit successfully');
.then((res) => {
this.form.email = "";
this.form.name = "";
this.form.phone = "";
this.$message.success(
this.characters == 1 ? "提交成功" : "submit successfully"
);
this.dialogVisible = false; this.dialogVisible = false;
}) })
.catch(err => {
.catch((err) => {
this.$message.error(err.message); this.$message.error(err.message);
}); });
} }
}); });
}
},
}, },
computed: { computed: {
...mapState({ ...mapState({
characters: state => state.publicObj.characters
})
characters: (state) => state.publicObj.characters,
}),
}, },
mounted() { mounted() {
// console.log(); // console.log();
// this.$refs["vidoe"].play(); // this.$refs["vidoe"].play();
new Swiper('.swiper-container', {
new Swiper(".swiper-container", {
slidesPerView: 3, slidesPerView: 3,
spaceBetween: 30, spaceBetween: 30,
centeredSlides: true, centeredSlides: true,
@@ -375,27 +411,27 @@ export default {
// 如果需要分页器 // 如果需要分页器
pagination: { pagination: {
el: '.swiper-pagination',
clickable: true // 分页器可以点击
el: ".swiper-pagination",
clickable: true, // 分页器可以点击
}, },
// 如果需要前进后退按钮 // 如果需要前进后退按钮
navigation: { navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
}, },
// 如果需要滚动条 // 如果需要滚动条
scrollbar: { scrollbar: {
el: '.swiper-scrollbar'
}
el: ".swiper-scrollbar",
},
}); });
}, },
created() { created() {
this.$nextTick(() => { this.$nextTick(() => {
this.goView('top');
this.goView("top");
}); });
}
},
}; };
</script> </script>


+ 2
- 2
src/router/index.js Wyświetl plik

@@ -38,7 +38,7 @@ const routes = [
{ {
path: '/MetaStream', path: '/MetaStream',
name: 'live', name: 'live',
component: () => import("../components/views/live"),
component: () => import("../components/views/shadow"),
}, },
{ {
path: '/MetaGene', path: '/MetaGene',
@@ -48,7 +48,7 @@ const routes = [
{ {
path: '/MetaManeuver', path: '/MetaManeuver',
name: 'shadow', name: 'shadow',
component: () => import("../components/views/shadow"),
component: () => import("../components/views/live"),
}, },
] ]




Ładowanie…
Anuluj
Zapisz