Commit 62156b8e authored by 罗超's avatar 罗超

1

parent cbccd6de
<script> <script>
export default { export default {
onLaunch() { onLaunch() {
// console.log('App Launch') // console.log('App Launch')
}, },
onShow() { onShow() {
// console.log('App Show') // console.log('App Show')
}, },
onHide() { onHide() {
// console.log('App Hide') // console.log('App Hide')
} },
} };
</script> </script>
<style> <style>
/*每个页面公共css */ /*每个页面公共css */
@import "wxcomponents/vant/common/index.wxss"; @import "wxcomponents/vant/common/index.wxss";
@import "static/css/common.css"; @import "static/css/common.css";
@import "static/font/iconfont.css";
</style> </style>
...@@ -45,23 +45,26 @@ import { ...@@ -45,23 +45,26 @@ import {
} from "vue"; } from "vue";
export default { export default {
setup() { setup() {
let data = ref([]); let data = reactive({
data.value = [ data: [
{ {
name: "电子合同的名称", name: "电子合同的名称",
con: "一点小内容吧,放在这里,一点小内容吧", con: "一点小内容吧,放在这里,一点小内容吧",
}, },
{ {
name: "电子合同的名称", name: "电子合同的名称",
con: "一点小内容吧,放在这里,一点小内容吧", con: "一点小内容吧,放在这里,一点小内容吧",
}, },
{ {
name: "电子合同的名称", name: "电子合同的名称",
con: "一点小内容吧,放在这里,一点小内容吧", con: "一点小内容吧,放在这里,一点小内容吧",
}, },
]; ],
});
let methods = {};
return { return {
data, ...toRefs(data),
...methods,
}; };
}, },
onLoad() { onLoad() {
......
...@@ -80,33 +80,34 @@ import { ...@@ -80,33 +80,34 @@ import {
} from "vue"; } from "vue";
export default { export default {
setup() { setup() {
let showLayer = ref(false); let data = reactive({
let openLayer = () => { showLayer: false,
showLayer.value = true; data: [
}; {
let closeLayer = () => { name: "第一次课",
showLayer.value = false; coursetime: "4课时",
}; children: [
let data = ref([]); {
data.value = [ name: "4.1 第一课活动篇****你好",
{ },
name: "第一次课", {
coursetime: "4课时", name: "4.2 第一课理解篇****平假名",
children: [ },
{ ],
name: "4.1 第一课活动篇****你好", },
}, ],
{ });
name: "4.2 第一课理解篇****平假名", let methods = {
}, openLayer() {
], data.showLayer = true;
}, },
]; closeLayer() {
data.showLayer = false;
},
};
return { return {
showLayer, ...toRefs(data),
openLayer, ...methods,
closeLayer,
data,
}; };
}, },
onLoad() { onLoad() {
......
...@@ -46,13 +46,18 @@ export default { ...@@ -46,13 +46,18 @@ export default {
props: {}, props: {},
components: {}, components: {},
setup(props) { setup(props) {
let jumpPage = (url) => { let data = reactive({});
uni.navigateTo({ let methods = {
url: url, jumpPage(url) {
}); uni.navigateTo({
url: url,
});
},
}; };
return { return {
jumpPage, ...toRefs(data),
...methods,
}; };
}, },
}; };
......
...@@ -46,75 +46,78 @@ import { ...@@ -46,75 +46,78 @@ import {
} from "vue"; } from "vue";
export default { export default {
setup() { setup() {
let jumpPage = () => { let data = reactive({
uni.navigateTo({ questionList: [
url: "/pages/exam/examPaper", {
}); name: "一、单选题",
}; type: 1,
let questionList = ref([ children: [
{ {
name: "一、单选题", num: 1,
type: 1, choose: 1,
children: [ children: [1, 2, 3, 4, 5],
{ },
num: 1, {
choose: 1, num: 2,
children: [1, 2, 3, 4, 5], choose: 0,
}, children: [1, 2, 3, 4, 5],
{ },
num: 2, {
choose: 0, num: 3,
children: [1, 2, 3, 4, 5], choose: 0,
}, children: [1, 2, 3, 4, 5],
{ },
num: 3, ],
choose: 0, },
children: [1, 2, 3, 4, 5], {
}, name: "二、多选题",
], type: 2,
}, children: [
{ {
name: "二、多选题", num: 1,
type: 2, choose: [1, 2],
children: [ children: [1, 2, 3, 4, 5],
{ },
num: 1, {
choose: [1, 2], num: 2,
children: [1, 2, 3, 4, 5], choose: [],
}, children: [1, 2, 3, 4, 5],
{ },
num: 2, {
choose: [], num: 3,
children: [1, 2, 3, 4, 5], choose: [],
}, children: [1, 2, 3, 4, 5],
{ },
num: 3, ],
choose: [], },
children: [1, 2, 3, 4, 5], ],
}, });
], let methods = {
jumpPage() {
uni.navigateTo({
url: "/pages/exam/examPaper",
});
}, },
]); //选题
//选题 change(type, index, index1, index2) {
let change = (type, index, index1, index2) => { if (type === 1) {
if (type === 1) { data.questionList[index].children[index1].choose =
questionList.value[index].children[index1].choose = data.questionList[index].children[index1].children[index2];
questionList.value[index].children[index1].children[index2]; } else if (type === 2) {
} else if (type === 2) { let choose = data.questionList[index].children[index1].choose;
let choose = questionList.value[index].children[index1].choose; let res = data.questionList[index].children[index1].children[index2];
let res = questionList.value[index].children[index1].children[index2]; let find = choose.indexOf(res);
let find = choose.indexOf(res); if (find == -1) {
if (find == -1) { choose.push(res);
choose.push(res); } else {
} else { choose.splice(find, 1);
choose.splice(find, 1); }
} }
} },
}; };
return { return {
questionList, ...toRefs(data),
jumpPage, ...methods,
change,
}; };
}, },
onLoad() { onLoad() {
......
...@@ -45,26 +45,26 @@ export default { ...@@ -45,26 +45,26 @@ export default {
components: { Sub1 }, components: { Sub1 },
setup(props, context) { setup(props, context) {
let { refs } = getCurrentInstance(); let { refs } = getCurrentInstance();
let time = ref(0); let data = reactive({
// let countdown = ref(null); time: 2 * 60 * 60 * 1000,
time.value = 2 * 60 * 60 * 1000; });
let jumpPage = () => { let methods = {
uni.navigateTo({ jumpPage() {
url: "/pages/exam/examPaper", uni.navigateTo({
}); url: "/pages/exam/examPaper",
}; });
let start = () => { },
refs.countdown.start(); start() {
}; refs.countdown.start();
let back = () => { },
uni.navigateBack(); back() {
uni.navigateBack();
},
}; };
onMounted(() => {}); onMounted(() => {});
return { return {
jumpPage, ...toRefs(data),
time, ...methods,
start,
back,
}; };
}, },
onLoad() {}, onLoad() {},
......
...@@ -13,34 +13,42 @@ ...@@ -13,34 +13,42 @@
<van-tab title="已完成" name="d"></van-tab> <van-tab title="已完成" name="d"></van-tab>
</van-tabs> </van-tabs>
<view class="exampaper-con"> <view class="exampaper-con">
<view <scroll-view
v-for="(item, index) in examList" :scroll-top="0"
:key="index" scroll-y="true"
class="exam-item" class="scroll-box"
:style="{ 'background-image': `url(${item.bgimg})` }" @scrolltolower="lower"
@click="jumpPage"
> >
<view class="testName"> <view
{{ item.testName }} v-for="(item, index) in examList"
</view> :key="index"
<view class="testTime"> 考试时间:{{ item.testTime }} </view> class="exam-item"
<view class="teacherInfo-bg"></view> :style="{ 'background-image': `url(${item.bgimg})` }"
<view class="teacherInfo flex flex_between_center"> @click="jumpPage"
<view class="flex flex_start_center"> >
<van-image <view class="testName">
round {{ item.testName }}
width="45rpx"
height="45rpx"
fit="cover"
src="https://img.yzcdn.cn/vant/cat.jpeg"
/>
<view class="teacherName">{{ item.teacherName }}</view>
</view> </view>
<view class="exam-status"> <view class="testTime"> 考试时间:{{ item.testTime }} </view>
{{ item.status }} <view class="teacherInfo-bg"></view>
<view class="teacherInfo flex flex_between_center">
<view class="flex flex_start_center">
<van-image
round
width="45rpx"
height="45rpx"
fit="cover"
src="https://img.yzcdn.cn/vant/cat.jpeg"
/>
<view class="teacherName">{{ item.teacherName }}</view>
</view>
<view class="exam-status">
{{ item.status }}
</view>
</view> </view>
</view> </view>
</view> <Loadmore :state="pageState" />
</scroll-view>
</view> </view>
</view> </view>
</template> </template>
...@@ -56,40 +64,86 @@ import { ...@@ -56,40 +64,86 @@ import {
computed, computed,
onMounted, onMounted,
} from "vue"; } from "vue";
import Loadmore from "../../components/loadmore.vue";
export default { export default {
components: {
Loadmore,
},
setup() { setup() {
let curtab = ref("b"); let data = reactive({
let changeTab = (e) => { pageState: "more",
// console.log(62, e); examList: [
}; {
let jumpPage = () => { testName: "あぃお试卷名称",
uni.navigateTo({ testTime: "2021-07-29 14:00",
url: "/pages/exam/examPaper", bgimg: "https://img.yzcdn.cn/vant/cat.jpeg",
}); teacherName: "纳豆",
}; teacherImg: "https://img.yzcdn.cn/vant/cat.jpeg",
let examList = ref([ status: "未开始",
{ },
testName: "あぃお试卷名称", {
testTime: "2021-07-29 14:00", testName: "あぃお试卷名称",
bgimg: "https://img.yzcdn.cn/vant/cat.jpeg", testTime: "2021-07-29 14:00",
teacherName: "纳豆", bgimg: "",
teacherImg: "https://img.yzcdn.cn/vant/cat.jpeg", teacherName: "纳豆",
status: "未开始", teacherImg: "",
status: "未开始",
},
{
testName: "あぃお试卷名称",
testTime: "2021-07-29 14:00",
bgimg: "",
teacherName: "纳豆",
teacherImg: "",
status: "未开始",
},
{
testName: "あぃお试卷名称",
testTime: "2021-07-29 14:00",
bgimg: "",
teacherName: "纳豆",
teacherImg: "",
status: "未开始",
},
{
testName: "あぃお试卷名称",
testTime: "2021-07-29 14:00",
bgimg: "",
teacherName: "纳豆",
teacherImg: "",
status: "未开始",
},
{
testName: "あぃお试卷名称",
testTime: "2021-07-29 14:00",
bgimg: "",
teacherName: "纳豆",
teacherImg: "",
status: "未开始",
},
],
curtab: "b",
});
let methods = {
changeTab(e) {
console.log(123, e);
},
jumpPage() {
uni.navigateTo({
url: "/pages/exam/examPaper",
});
}, },
{ lower(e) {
testName: "あぃお试卷名称", data.pageState = "loading";
testTime: "2021-07-29 14:00", console.log(131, e);
bgimg: "",
teacherName: "纳豆",
teacherImg: "",
status: "未开始",
}, },
]); };
onMounted(() => {
console.log(135, data);
});
return { return {
curtab, ...toRefs(data),
changeTab, ...methods,
examList,
jumpPage,
}; };
}, },
onLoad() { onLoad() {
...@@ -111,9 +165,9 @@ export default { ...@@ -111,9 +165,9 @@ export default {
font-weight: bold !important; font-weight: bold !important;
} }
.exampaper-con { .exampaper-con {
height: calc(100vh - 100rpx);
box-sizing: border-box; box-sizing: border-box;
margin-top: 10rpx; margin-top: 10rpx;
padding: 0 30rpx;
} }
.exam-item { .exam-item {
height: 250rpx; height: 250rpx;
...@@ -177,4 +231,10 @@ export default { ...@@ -177,4 +231,10 @@ export default {
font-weight: bold; font-weight: bold;
color: #00acf9; color: #00acf9;
} }
.scroll-box {
height: 100%;
width: 100%;
box-sizing: border-box;
padding: 0 30rpx 40rpx;
}
</style> </style>
...@@ -56,186 +56,193 @@ import { ...@@ -56,186 +56,193 @@ import {
export default { export default {
setup(props, context) { setup(props, context) {
// let { refs } = getCurrentInstance(); // let { refs } = getCurrentInstance();
let jumpPage = () => { let data = reactive({
uni.navigateTo({ questionList: [
url: "/pages/exam/examPaper", {
}); name: "一、单选题",
}; type: 1,
children: [
let back = () => { {
uni.navigateBack(); num: "1、真実はいつも一つ?",
}; choose: "A",
let questionList = ref([ children: [
{ {
name: "一、单选题", chooseNum: "A",
type: 1, itemName: "答案1",
children: [ },
{ {
num: "1、真実はいつも一つ?", chooseNum: "B",
choose: "A", itemName: "答案2",
children: [ },
{ {
chooseNum: "A", chooseNum: "c",
itemName: "答案1", itemName: "答案3",
}, },
{ {
chooseNum: "B", chooseNum: "D",
itemName: "答案2", itemName: "答案4",
}, },
{ ],
chooseNum: "c", },
itemName: "答案3", {
}, num: "2、",
{ choose: 0,
chooseNum: "D", children: [
itemName: "答案4", {
}, chooseNum: "A",
], itemName: "答案1",
}, },
{ {
num: "2、", chooseNum: "B",
choose: 0, itemName: "答案2",
children: [ },
{ {
chooseNum: "A", chooseNum: "c",
itemName: "答案1", itemName: "答案3",
}, },
{ {
chooseNum: "B", chooseNum: "D",
itemName: "答案2", itemName: "答案4",
}, },
{ ],
chooseNum: "c", },
itemName: "答案3", {
}, num: 3,
{ choose: 0,
chooseNum: "D", children: [
itemName: "答案4", {
}, chooseNum: "A",
], itemName: "答案1",
}, },
{ {
num: 3, chooseNum: "B",
choose: 0, itemName: "答案2",
children: [ },
{ {
chooseNum: "A", chooseNum: "c",
itemName: "答案1", itemName: "答案3",
}, },
{ {
chooseNum: "B", chooseNum: "D",
itemName: "答案2", itemName: "答案4",
}, },
{ ],
chooseNum: "c", },
itemName: "答案3", ],
}, },
{ {
chooseNum: "D", name: "二、多选题",
itemName: "答案4", type: 2,
}, children: [
], {
}, num: "1、真実はいつも二つ?",
], choose: [],
children: [
{
chooseNum: "A",
itemName: "答案1",
},
{
chooseNum: "B",
itemName: "答案2",
},
{
chooseNum: "c",
itemName: "答案3",
},
{
chooseNum: "D",
itemName: "答案4",
},
],
},
{
num: 2,
choose: [],
children: [
{
chooseNum: "A",
itemName: "答案1",
},
{
chooseNum: "B",
itemName: "答案2",
},
{
chooseNum: "c",
itemName: "答案3",
},
{
chooseNum: "D",
itemName: "答案4",
},
],
},
{
num: 3,
choose: [],
children: [
{
chooseNum: "A",
itemName: "答案1",
},
{
chooseNum: "B",
itemName: "答案2",
},
{
chooseNum: "c",
itemName: "答案3",
},
{
chooseNum: "D",
itemName: "答案4",
},
],
},
],
},
],
});
let methods = {
jumpPage() {
uni.navigateTo({
url: "/pages/exam/examPaper",
});
},
back() {
uni.navigateBack();
}, },
{ //选题
name: "二、多选题", change(type, index, index1, index2) {
type: 2, if (type === 1) {
children: [ data.questionList[index].children[index1].choose =
{ data.questionList[index].children[index1].children[
num: "1、真実はいつも二つ?", index2
choose: [], ].chooseNum;
children: [ } else if (type === 2) {
{ let choose = data.questionList[index].children[index1].choose;
chooseNum: "A", let res =
itemName: "答案1", data.questionList[index].children[index1].children[index2]
}, .chooseNum;
{ let find = choose.indexOf(res);
chooseNum: "B", if (find == -1) {
itemName: "答案2", choose.push(res);
}, } else {
{ choose.splice(find, 1);
chooseNum: "c", }
itemName: "答案3", console.log(230, choose);
}, }
{
chooseNum: "D",
itemName: "答案4",
},
],
},
{
num: 2,
choose: [],
children: [
{
chooseNum: "A",
itemName: "答案1",
},
{
chooseNum: "B",
itemName: "答案2",
},
{
chooseNum: "c",
itemName: "答案3",
},
{
chooseNum: "D",
itemName: "答案4",
},
],
},
{
num: 3,
choose: [],
children: [
{
chooseNum: "A",
itemName: "答案1",
},
{
chooseNum: "B",
itemName: "答案2",
},
{
chooseNum: "c",
itemName: "答案3",
},
{
chooseNum: "D",
itemName: "答案4",
},
],
},
],
}, },
]); };
//选题
let change = (type, index, index1, index2) => { let change = (type, index, index1, index2) => {
console.log(158, type); console.log(158, type);
if (type === 1) {
questionList.value[index].children[index1].choose =
questionList.value[index].children[index1].children[index2].chooseNum;
} else if (type === 2) {
let choose = questionList.value[index].children[index1].choose;
let res =
questionList.value[index].children[index1].children[index2].chooseNum;
let find = choose.indexOf(res);
if (find == -1) {
choose.push(res);
} else {
choose.splice(find, 1);
}
console.log(230, choose);
}
}; };
onMounted(() => {}); onMounted(() => {});
return { return {
jumpPage, ...toRefs(data),
back, ...methods,
questionList,
change,
}; };
}, },
onLoad() {}, onLoad() {},
......
...@@ -115,78 +115,82 @@ export default { ...@@ -115,78 +115,82 @@ export default {
props: {}, props: {},
components: {}, components: {},
setup(props) { setup(props) {
let baseInfo = ref([ let data = reactive({
{ baseInfo: [
name: "学区", {
desc: "锦江校区", name: "学区",
img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon1.png", desc: "锦江校区",
bgcolor: "#CCEDFE", img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon1.png",
jumpUrl: "/pages/exam/answerSheet", bgcolor: "#CCEDFE",
}, jumpUrl: "/pages/exam/answerSheet",
{ },
name: "课程", {
desc: "N1~N3", name: "课程",
img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon2.png", desc: "N1~N3",
bgcolor: "#DDE6FF", img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon2.png",
jumpUrl: "/pages/course/course", bgcolor: "#DDE6FF",
}, jumpUrl: "/pages/course/course",
{ },
name: "进度", {
desc: "上到哪里了", name: "进度",
img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon3.png", desc: "上到哪里了",
bgcolor: "#FFEFE4", img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon3.png",
jumpUrl: "/pages/progress/progress", bgcolor: "#FFEFE4",
}, jumpUrl: "/pages/progress/progress",
{ },
name: "剩余时间", {
desc: "100课时", name: "剩余时间",
img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon4.png", desc: "100课时",
bgcolor: "#FFEAFE", img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon4.png",
jumpUrl: "/pages/surplusTime/surplusTime", bgcolor: "#FFEAFE",
}, jumpUrl: "/pages/surplusTime/surplusTime",
{ },
name: "电子合同", {
desc: "5个", name: "电子合同",
img: "https://img.yzcdn.cn/vant/cat.jpeg", desc: "5个",
bgcolor: "#D9FAF1", img: "https://img.yzcdn.cn/vant/cat.jpeg",
jumpUrl: "/pages/contract/contract", bgcolor: "#D9FAF1",
}, jumpUrl: "/pages/contract/contract",
{ },
name: "我的老师", {
desc: "李琴", name: "我的老师",
img: "https://img.yzcdn.cn/vant/cat.jpeg", desc: "李琴",
bgcolor: "#FFE7E6", img: "https://img.yzcdn.cn/vant/cat.jpeg",
jumpUrl: "", bgcolor: "#FFE7E6",
}, jumpUrl: "",
]); },
let testList = ref([ ],
{ testList: [
testName: "あぃお试卷名称", {
testTime: "2021-07-29 14:00", testName: "あぃお试卷名称",
bgimg: "https://img.yzcdn.cn/vant/cat.jpeg", testTime: "2021-07-29 14:00",
teacherName: "纳豆", bgimg: "https://img.yzcdn.cn/vant/cat.jpeg",
teacherImg: "https://img.yzcdn.cn/vant/cat.jpeg", teacherName: "纳豆",
status: "未开始", teacherImg: "https://img.yzcdn.cn/vant/cat.jpeg",
}, status: "未开始",
{ },
testName: "あぃお试卷名称", {
testTime: "2021-07-29 14:00", testName: "あぃお试卷名称",
bgimg: "", testTime: "2021-07-29 14:00",
teacherName: "纳豆", bgimg: "",
teacherImg: "", teacherName: "纳豆",
status: "未开始", teacherImg: "",
status: "未开始",
},
],
});
let methods = {
jumpPage(url) {
uni.navigateTo({
url: url,
});
}, },
]);
let jumpPage = (url) => {
uni.navigateTo({
url: url,
});
}; };
onMounted(() => {}); onMounted(() => {});
return { return {
baseInfo, ...toRefs(data),
testList, ...methods,
jumpPage,
}; };
}, },
onLoad() { onLoad() {
......
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view>
<van-button type="warning" size="mini" @click="add">{{title}}</van-button>
<van-icon name="location-o" info="9" size="200rpx" />
</view>
<van-cell-group>
<van-field v-model="yzm" center clearable label="短信验证码" placeholder="请输入短信验证码" use-button-slot>
<van-button slot="button" size="small" type="primary">
发送验证码
</van-button>
</van-field>
<view class="">
<!-- {{count}}{{name.firstname}} -->
</view>
<view class="">
{{firstname}}
</view>
</van-cell-group>
<!-- <van-radio-group v-model="radio" >
<van-radio name='1'>单选框 1</van-radio>
<van-radio name='2'>单选框 2</van-radio>
</van-radio-group> -->
</view>
</template>
<script> <script>
/** /**
* 因为 props 是响应式的,你不能使用 ES6 解构,因为它会消除 prop 的响应性。 * 因为 props 是响应式的,你不能使用 ES6 解构,因为它会消除 prop 的响应性。
如果需要解构 prop,可以通过使用 setup 函数中的 toRefs 来完成此操作 如果需要解构 prop,可以通过使用 setup 函数中的 toRefs 来完成此操作
* // ref和reactive的区别: ref()传入的是js的基本数据类型; reactive()中传入的是object普通对象 * // ref和reactive的区别: ref()传入的是js的基本数据类型; reactive()中传入的是object普通对象
*@reactive:处理的是对象的双向绑定, 对象不能被***解构或展开***,一旦被解构或者展开,返回的值将失去响应式 *@reactive:处理的是对象的双向绑定, 对象不能被***解构或展开***,一旦被解构或者展开,返回的值将失去响应式
* @getCurrentInstance,获取当前页面实例,使用const { ctx,proxy } = getCurrentInstance(); ctx或proxy.$挂载的方法 * @getCurrentInstance,获取当前页面实例,使用const { ctx,proxy } = getCurrentInstance(); ctx或proxy.$挂载的方法
*/ */
import { import {
ref, ref,
reactive, reactive,
toRefs, toRefs,
toRef, toRef,
getCurrentInstance, getCurrentInstance,
watch, watch,
computed, computed,
onMounted onMounted,
} from "vue" } from "vue";
export default { export default {
name: '', name: "",
props: {}, props: {},
components: {}, components: {},
setup(props) { setup(props) {
let { let { titles } = toRefs(props);
titles let { ctx } = getCurrentInstance();
} = toRefs(props) let title = ref("hello");
let { let count = ref(0);
ctx let yzm = ref(1234);
} = getCurrentInstance() let add = () => {
let title = ref("hello") count.value++;
let count = ref(0) name.firstname += "x";
let yzm = ref(1234) console.log(58, titles);
let add = () => { };
count.value++ let name = reactive({
name.firstname += "x" firstname: "x",
console.log(58, titles) lastname: "w",
} });
let name = reactive({ // 第一个参数: 要监听的响应式对象
firstname: "x", // 第二个参数: 回调函数
lastname: "w" // watch(count,(newVal,oldVal)=>{
}) // console.log(51,newVal)
// 第一个参数: 要监听的响应式对象 // })
// 第二个参数: 回调函数 watch(name, (newVal, oldVal) => {
// watch(count,(newVal,oldVal)=>{ console.log(51, newVal);
// console.log(51,newVal) });
// }) // computed 计算属性 : 适合计算一个属性, 并且绑定.
watch(name, (newVal, oldVal) => { // computed将监听它里面所有的变量, 里面变量发生变化就会触发结果重新计算
console.log(51, newVal)
})
// computed 计算属性 : 适合计算一个属性, 并且绑定.
// computed将监听它里面所有的变量, 里面变量发生变化就会触发结果重新计算
// 计算出来的结果是只读的, 所以fullName是不能被改变的
const fullName = computed(() => name.firstname + name.lastname)
// 高级用法: 可以修改值
const fullName2 = computed({
get: () => name.firstname + name.lastname,
set: (val) => {
title.value = val
} // 计算出来的结果是只读的, 所以fullName是不能被改变的
}) const fullName = computed(() => name.firstname + name.lastname);
fullName2.value = 7 // 高级用法: 可以修改值
console.log(76, fullName2) const fullName2 = computed({
onMounted(() => { get: () => name.firstname + name.lastname,
console.log(84, "onmounted") set: (val) => {
}) title.value = val;
return { },
title, });
count, fullName2.value = 7;
add, console.log(76, fullName2);
yzm, onMounted(() => {
// name, console.log(84, "onmounted");
...toRefs(name), });
fullName, return {
fullName2 title,
} count,
}, add,
onLoad() { yzm,
console.log('index load') // name,
}, ...toRefs(name),
onShow() { fullName,
console.log('index Show') fullName2,
}, };
} },
onLoad() {
console.log("index load");
},
onShow() {
console.log("index Show");
},
};
</script> </script>
<style>
.content {
text-align: center;
height: 400rpx;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>
...@@ -16,25 +16,27 @@ ...@@ -16,25 +16,27 @@
<view class="main"> <view class="main">
<van-cell-group> <van-cell-group>
<van-field <van-field
v-model="msg.username" :value="username"
clearable clearable
placeholder="请输入用户名" placeholder="请输入用户名"
clearable clearable
left-icon="manager-o"
@input="usernameInput" @input="usernameInput"
/> >
<i class="iconfont icon-user2 left-iconfont" slot="left-icon"></i>
</van-field>
<van-field <van-field
:value="msg.password" :value="password"
password password
placeholder="请输入密码" placeholder="请输入密码"
clearable clearable
left-icon="manager-o"
@input="passwordInput" @input="passwordInput"
/> >
<i class="iconfont icon-password left-iconfont" slot="left-icon"></i>
</van-field>
</van-cell-group> </van-cell-group>
</view> </view>
<van-button block custom-class="loginBtn">登录</van-button> <van-button block custom-class="loginBtn">登录</van-button>
<view class="auth"> 授权手机号一键登录 </view> <view class="auth" @click="authLogin"> 授权手机号一键登录 </view>
</view> </view>
</template> </template>
...@@ -52,27 +54,92 @@ import { ...@@ -52,27 +54,92 @@ import {
export default { export default {
setup(props, context) { setup(props, context) {
let msg = { let msg = reactive({
username: "123", username: "123123123",
password: "", password: "",
});
let methods = {
usernameInput(val) {
msg.username = val.detail;
console.log(74, msg);
},
passwordInput(val) {
msg.password = val.detail;
},
back() {
uni.navigateBack();
},
authLogin() {
let that = methods;
that.getUserProfile();
},
getUserProfile() {
//新的获取用户资料
var that = methods;
wx.getUserProfile({
desc: "用于完善资料", // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success: (info) => {
console.log(info);
// this.msg = {
// Id: 0,
// AliasName: info.userInfo.nickName,
// Photo: info.userInfo.avatarUrl,
// };
that.getUserInfo(info);
},
fail: () => {
uni.showToast({
title: "微信登录授权失败",
icon: "none",
});
},
});
},
getUserInfo(info) {
uni.getProvider({
service: "oauth",
success: function (res) {
if (~res.provider.indexOf("weixin")) {
uni.login({
provider: "weixin",
success: (_res) => {
console.log(107, _res);
// //这里请求接口
// let obj = {
// Source: 1,
// OpenId: "",
// Name: info.userInfo.nickName,
// Photo: info.userInfo.avatarUrl,
// Gender: info.userInfo.gender,
// Moblie: "",
// SuperiorId: 0,
// code: res.code,
// };
// that.getCode(obj);
},
fail: () => {
uni.showToast({
title: "微信登录授权失败",
icon: "none",
});
},
});
} else {
uni.showToast({
title: "请先安装微信或升级版本",
icon: "none",
});
}
},
});
},
}; };
let usernameInput = (val) => { onMounted(() => {});
msg.username = val.detail;
};
let passwordInput = (val) => {
msg.password = val.detail;
};
let back = () => {
uni.navigateBack();
};
return { return {
msg, ...toRefs(msg),
usernameInput, ...methods,
passwordInput,
back,
}; };
}, },
onLoad() {},
}; };
</script> </script>
...@@ -123,4 +190,9 @@ export default { ...@@ -123,4 +190,9 @@ export default {
color: #00acf9; color: #00acf9;
margin-top: 30rpx; margin-top: 30rpx;
} }
.left-iconfont {
margin-right: 20rpx;
font-size: 30rpx;
color: #111111;
}
</style> </style>
...@@ -80,33 +80,34 @@ import { ...@@ -80,33 +80,34 @@ import {
} from "vue"; } from "vue";
export default { export default {
setup() { setup() {
let showLayer = ref(false); let data = reactive({
let openLayer = () => { showLayer: false,
showLayer.value = true; data: [
}; {
let closeLayer = () => { name: "第一次课",
showLayer.value = false; coursetime: "4课时",
}; children: [
let data = ref([]); {
data.value = [ name: "4.1 第一课活动篇****你好",
{ },
name: "第一次课", {
coursetime: "4课时", name: "4.2 第一课理解篇****平假名",
children: [ },
{ ],
name: "4.1 第一课活动篇****你好", },
}, ],
{ });
name: "4.2 第一课理解篇****平假名", let methods = {
}, openLayer() {
], data.showLayer = true;
}, },
]; closeLayer() {
data.showLayer = false;
},
};
return { return {
showLayer, ...toRefs(data),
openLayer, ...methods,
closeLayer,
data,
}; };
}, },
onLoad() { onLoad() {
......
...@@ -75,34 +75,35 @@ import { ...@@ -75,34 +75,35 @@ import {
} from "vue"; } from "vue";
export default { export default {
setup() { setup() {
let showLayer = ref(false); let data = reactive({
let openLayer = () => { showLayer: false,
showLayer.value = true; data: [
}; {
let closeLayer = () => { classroom: "奈良",
showLayer.value = false; teacherName: "李琴",
}; date: "2021-08-02",
let data = ref([]); children: [
data.value = [ {
{ name: "1节课 09:30-11:00 / 2节课 11:30-12:45",
classroom: "奈良", },
teacherName: "李琴", {
date: "2021-08-02", name: "1节课 09:30-11:00 / 2节课 11:30-12:45",
children: [ },
{ ],
name: "1节课 09:30-11:00 / 2节课 11:30-12:45", },
}, ],
{ });
name: "1节课 09:30-11:00 / 2节课 11:30-12:45", let methods = {
}, openLayer() {
], data.showLayer = true;
}, },
]; closeLayer() {
data.showLayer = false;
},
};
return { return {
showLayer, ...toRefs(data),
openLayer, ...methods,
closeLayer,
data,
}; };
}, },
onLoad() { onLoad() {
......
...@@ -70,6 +70,10 @@ ...@@ -70,6 +70,10 @@
flex-wrap: wrap; flex-wrap: wrap;
} }
.between{
justify-content: space-between;
}
.grow { .grow {
flex-grow: 1; flex-grow: 1;
} }
...@@ -88,3 +92,10 @@ ...@@ -88,3 +92,10 @@
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
overflow: hidden; overflow: hidden;
} }
.fixed_center{
display: fixed;
top: 50vh;
left: 50vw;
transform: translate(-50%,-50%);
z-index: 999;
}
\ No newline at end of file
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