fangwenqiao
/
questionbankvue3
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

考试页面

master
unknown 4 months ago
parent
9e5948ebfc
commit
40775d4ce9
10 changed files with 1299 additions and 14 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      main.js
  2. 12
      pages.json
  3. 262
      pages/exercises/brushQuestions/brushQuestions - 副本 (2).vue
  4. 162
      pages/exercises/brushQuestions/brushQuestions - 副本.vue
  5. 152
      pages/exercises/brushQuestions/brushQuestions.vue
  6. 434
      pages/exercises/exam/exam.vue
  7. 273
      pages/index/index - 副本 (2).vue
  8. 1
      pages/index/index - 副本.vue
  9. 8
      pages/index/index.vue
  10. 3
      uni.scss

4
main.js
View File

@ -1,6 +1,6 @@
import App from './App' import App from './App'
import uviewPlus from '@/uni_modules/uview-plus' import uviewPlus from '@/uni_modules/uview-plus'
import request from './config/request.js'
// import request from './config/request.js'
import { goPage } from '@/utils/utils.js' import { goPage } from '@/utils/utils.js'
// // #ifndef VUE3 // // #ifndef VUE3
// import Vue from 'vue' // import Vue from 'vue'
@ -19,7 +19,7 @@ export function createApp() {
const app = createSSRApp(App) const app = createSSRApp(App)
app.config.globalProperties.$goPage = goPage app.config.globalProperties.$goPage = goPage
app.use(uviewPlus) app.use(uviewPlus)
request(app)
// request(app)
return { return {
app app
} }

12
pages.json
View File

@ -27,8 +27,20 @@
"enablePullDownRefresh": false, "enablePullDownRefresh": false,
"backgroundTextStyle": "dark" , "backgroundTextStyle": "dark" ,
"navigationStyle": "custom" "navigationStyle": "custom"
// "landscape": true
}
},
{
"path": "exam/exam",
"style": {
"navigationBarTitleText": "考试",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark" ,
"navigationStyle": "custom"
// "landscape": true
} }
} }
] ]
} }
], ],

262
pages/exercises/brushQuestions/brushQuestions - 副本 (2).vue
View File

@ -0,0 +1,262 @@
<template>
<view class="content" id="brushQuestions">
<up-navbar leftText=" " title="" :safeAreaInsetTop="false" :autoBack="true">
<template #center>
<view class="u-nav-slot flex">
<view class="btn" @click="changeNav(1)" :class="{active: currentNav==1}">答题模式</view>
<view class="btn" @click="changeNav(2)" :class="{active: currentNav==2}">背题模式</view>
</view>
</template>
</up-navbar>
<view class="con padding">
<view class="h1_row">
<text class="tag">单选</text>
<text class="h1">机动车驾驶人在实习期内驾驶机动车不得牵引挂车。</text>
</view>
<view class="option">
<view class="optionItem flex">
<view class="icon">
<image src="@/static/logo.png" mode=""></image>
</view>
<view class="text">正确</view>
</view>
</view>
<view class="answer flex">
<view class="ans">正确答案是：<text>B</text></view>
<view class="ans">您的答案是：<text>B</text></view>
</view>
<view class="analysis">
<view class="tit">题目解析</view>
<view class="txt">解析解析解析解析解析解析解析解析解析解析解析解析</view>
</view>
</view>
<view class="con padding">
<view class="h1_row">
<text class="tag">单选</text>
<text class="h1">机动车驾驶人在实习期内驾驶机动车不得牵引挂车。</text>
</view>
<view class="option">
<view class="optionItem flex">
<view class="icon">
<image src="@/static/logo.png" mode=""></image>
</view>
<view class="text">正确</view>
</view>
</view>
<view class="answer flex">
<view class="ans">正确答案是：<text>B</text></view>
<view class="ans">您的答案是：<text>B</text></view>
</view>
<view class="analysis">
<view class="tit">题目解析</view>
<view class="txt">解析解析解析解析解析解析解析解析解析解析解析解析</view>
</view>
</view>
<view class="con padding">
<view class="h1_row">
<text class="tag">单选</text>
<text class="h1">机动车驾驶人在实习期内驾驶机动车不得牵引挂车。</text>
</view>
<view class="option">
<view class="optionItem flex">
<view class="icon">
<image src="@/static/logo.png" mode=""></image>
</view>
<view class="text">正确</view>
</view>
</view>
<view class="answer flex">
<view class="ans">正确答案是：<text>B</text></view>
<view class="ans">您的答案是：<text>B</text></view>
</view>
<view class="analysis">
<view class="tit">题目解析</view>
<view class="txt">解析解析解析解析解析解析解析解析解析解析解析解析</view>
</view>
</view>
<u-popup :show="show" mode="center">
<view>
<text>出淤泥而不染，濯清涟而不妖</text>
</view>
</u-popup>
</view>
</template>
<script>
export default {
data() {
return {
currentNav: '1',
show: true,
}
},
mounted() {
this.$nextTick(()=>{
this.detectOrient();
})
},
methods: {
changeNav(val) {
console.log(window)
if(this.currentNav == val) return
this.currentNav = val
},
detectOrient() {
var width = document.documentElement.clientWidth,
height = document.documentElement.clientHeight,
// $wrapper = document.getElementsByTagName('body')[0],
$wrapper = document.querySelector('#brushQuestions'),
style = "";
if (width >= height) { // 横屏
style += "width:" + width + "px;"; // 注意旋转后的宽高切换
style += "height:" + height + "px;";
style += "-webkit-transform: rotate(0); transform: rotate(0);";
style += "-webkit-transform-origin: 0 0;";
style += "transform-origin: 0 0;";
console.log(1)
} else { // 竖屏
style += "width:" + height + "px;";
style += "height:" + width + "px;";
style += "-webkit-transform: rotate(90deg); transform: rotate(90deg);";
// 注意旋转中点的处理
style += "-webkit-transform-origin: " + width / 2 + "px " + width / 2 + "px;";
style += "transform-origin: " + width / 2 + "px " + width / 2 + "px;";
console.log(2)
}
$wrapper.style.cssText = style;
}
}
}
</script>
<style lang="scss" scoped>
uni-page-body {
width: 100%;
height: 100%;
}
html{
width: 100vh;
height: 100vw;
-webkit-transform: rotate(90deg);
-webkit-transform-origin: 50vw 50vw;
transform: rotate(90deg);
transform-origin: 50vw 50vw;
}
image {display: block;width: 100%;height: 100%;}
.content {
padding: 0rpx 0 0rpx 0rpx;
width: 100%;
height: 100%;
overflow: auto;
.u-nav-slot {
width: 306rpx;
height: 54rpx;
border-radius: 10rpx;
border: 1px solid #333333;
display: flex;
.btn {
font-size: 24rpx;
color: #333333;
flex: 1;
text-align: center;
line-height: 54rpx;
&.active {
background-color: #333333;
color: #fff;
}
}
}
.con {
.h1_row {
margin-bottom: 50rpx;
.tag {
display: inline-block;
// width: 66px;
height: 36rpx;
line-height: 36rpx;
padding: 4rpx 6rpx;
background: #63C168;
border-radius: 6rpx;
margin-top: -2rpx;
margin-right: 16rpx;
font-size: 28rpx;
color: #fff;
}
text.h1 {
font-size: 36rpx;
}
}
.option {
width: 100%;
.optionItem {
margin-bottom: 50rpx;
align-items: center;
.icon {
width: 56rpx;
height: 56rpx;
margin-right: 36rpx;
image {
border-radius: 50%;
}
}
.text {
font-size: 32rpx;
}
}
}
.answer {
height: 90rpx;
background: #F4F4F4;
line-height: 90rpx;
padding: 0 30rpx;
margin-top: 20rpx;
.ans {
margin-right: 60rpx;
text {
color: red;
}
}
}
.analysis {
margin-top: 60rpx;
.tit {
font-weight: 700;
font-size: 32rpx;
position: relative;
padding-left: 30rpx;
&::after {
content: '';
position: absolute;
left: 0;
top: 8rpx;
width: 6rpx;
height: 30rpx;
background: linear-gradient(0deg, #43EA80 0%, #38F8D4 100%);
border-radius: 3rpx;
}
}
.txt {
margin-top: 39rpx;
font-size: 32rpx;
color: #333333;
}
}
}
}
</style>

162
pages/exercises/brushQuestions/brushQuestions - 副本.vue
View File

@ -0,0 +1,162 @@
<template>
<view class="content">
<up-navbar leftText=" " title="" :safeAreaInsetTop="false" :autoBack="true">
<template #center>
<view class="u-nav-slot flex">
<view class="btn" @click="changeNav(1)" :class="{active: currentNav==1}">答题模式</view>
<view class="btn" @click="changeNav(2)" :class="{active: currentNav==2}">背题模式</view>
</view>
</template>
</up-navbar>
<view class="con padding">
<view class="h1_row">
<text class="tag">单选</text>
<text class="h1">机动车驾驶人在实习期内驾驶机动车不得牵引挂车。</text>
</view>
<view class="option">
<view class="optionItem flex">
<view class="icon">
<image src="@/static/logo.png" mode=""></image>
</view>
<view class="text">正确</view>
</view>
</view>
<view class="answer flex">
<view class="ans">正确答案是：<text>B</text></view>
<view class="ans">您的答案是：<text>B</text></view>
</view>
<view class="analysis">
<view class="tit">题目解析</view>
<view class="txt">解析解析解析解析解析解析解析解析解析解析解析解析</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
currentNav: '1'
}
},
methods: {
changeNav(val) {
console.log(window)
if(this.currentNav == val) return
this.currentNav = val
}
}
}
</script>
<style lang="scss" scoped>
image {display: block;width: 100%;height: 100%;}
.content {
padding: 120rpx 0 0 0;
.u-nav-slot {
width: 306rpx;
height: 54rpx;
border-radius: 10rpx;
border: 1px solid #333333;
display: flex;
.btn {
font-size: 24rpx;
color: #333333;
flex: 1;
text-align: center;
line-height: 54rpx;
&.active {
background-color: #333333;
color: #fff;
}
}
}
.con {
.h1_row {
margin-bottom: 50rpx;
.tag {
display: inline-block;
// width: 66px;
height: 36rpx;
line-height: 36rpx;
padding: 4rpx 6rpx;
background: #63C168;
border-radius: 6rpx;
margin-top: -2rpx;
margin-right: 16rpx;
font-size: 28rpx;
color: #fff;
}
text.h1 {
font-size: 36rpx;
}
}
.option {
width: 100%;
.optionItem {
margin-bottom: 50rpx;
align-items: center;
.icon {
width: 56rpx;
height: 56rpx;
margin-right: 36rpx;
image {
border-radius: 50%;
}
}
.text {
font-size: 32rpx;
}
}
}
.answer {
height: 90rpx;
background: #F4F4F4;
line-height: 90rpx;
padding: 0 30rpx;
margin-top: 20rpx;
.ans {
margin-right: 60rpx;
text {
color: red;
}
}
}
.analysis {
margin-top: 60rpx;
.tit {
font-weight: 700;
font-size: 32rpx;
position: relative;
padding-left: 30rpx;
&::after {
content: '';
position: absolute;
left: 0;
top: 8rpx;
width: 6rpx;
height: 30rpx;
background: linear-gradient(0deg, #43EA80 0%, #38F8D4 100%);
border-radius: 3rpx;
}
}
.txt {
margin-top: 39rpx;
font-size: 32rpx;
color: #333333;
}
}
}
}
</style>

152
pages/exercises/brushQuestions/brushQuestions.vue
View File

@ -3,23 +3,167 @@
<up-navbar leftText=" " title="" :safeAreaInsetTop="false" :autoBack="true"> <up-navbar leftText=" " title="" :safeAreaInsetTop="false" :autoBack="true">
<template #center> <template #center>
<view class="u-nav-slot flex"> <view class="u-nav-slot flex">
<view class="btn">答题模式</view>
<view class="btn">背题模式</view>
<view class="btn" @click="changeNav(1)" :class="{active: currentNav==1}">答题模式</view>
<view class="btn" @click="changeNav(2)" :class="{active: currentNav==2}">背题模式</view>
</view> </view>
</template> </template>
</up-navbar> </up-navbar>
<u-button type="primary" text="去考试页面" @click="goEmam"></u-button>
<view class="con padding">
<view class="h1_row">
<text class="tag">单选</text>
<text class="h1">机动车驾驶人在实习期内驾驶机动车不得牵引挂车。</text>
</view>
<view class="option">
<view class="optionItem flex">
<view class="icon">
<image src="@/static/logo.png" mode=""></image>
</view>
<view class="text">正确</view>
</view>
</view>
<view class="answer flex">
<view class="ans">正确答案是：<text>B</text></view>
<view class="ans">您的答案是：<text>B</text></view>
</view>
<view class="analysis">
<view class="tit">题目解析</view>
<view class="txt">解析解析解析解析解析解析解析解析解析解析解析解析</view>
</view>
</view>
</view> </view>
</template> </template>
<script> <script>
// 观到一念，不要在注重这些行为的表达，觉得我应该这样做好一点那样做好一点，其实心里怎么想的才是最重要的
// 当你接纳允许的时候自动又想起来了，
export default {
data() {
return {
currentNav: '1'
}
},
methods: {
changeNav(val) {
console.log(window)
if(this.currentNav == val) return
this.currentNav = val
},
goEmam() {
uni.navigateTo({
url: '/pages/exercises/exam/exam'
})
}
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
image {display: block;width: 100%;height: 100%;}
.content {
padding: 120rpx 0 0 0;
.u-nav-slot { .u-nav-slot {
width: 306rpx;
height: 54rpx;
border-radius: 10rpx;
border: 1px solid #333333;
display: flex;
.btn { .btn {
font-size: 24rpx;
color: #333333;
flex: 1;
text-align: center;
line-height: 54rpx;
&.active {
background-color: #333333;
color: #fff;
}
}
}
.con {
.h1_row {
margin-bottom: 50rpx;
.tag {
display: inline-block;
// width: 66px;
height: 36rpx;
line-height: 36rpx;
padding: 4rpx 6rpx;
background: #63C168;
border-radius: 6rpx;
margin-top: -2rpx;
margin-right: 16rpx;
font-size: 28rpx;
color: #fff;
}
text.h1 {
font-size: 36rpx;
}
}
.option {
width: 100%;
.optionItem {
margin-bottom: 50rpx;
align-items: center;
.icon {
width: 56rpx;
height: 56rpx;
margin-right: 36rpx;
image {
border-radius: 50%;
}
}
.text {
font-size: 32rpx;
}
}
}
.answer {
height: 90rpx;
background: #F4F4F4;
line-height: 90rpx;
padding: 0 30rpx;
margin-top: 20rpx;
.ans {
margin-right: 60rpx;
text {
color: red;
}
}
}
.analysis {
margin-top: 60rpx;
.tit {
font-weight: 700;
font-size: 32rpx;
position: relative;
padding-left: 30rpx;
&::after {
content: '';
position: absolute;
left: 0;
top: 8rpx;
width: 6rpx;
height: 30rpx;
background: linear-gradient(0deg, #43EA80 0%, #38F8D4 100%);
border-radius: 3rpx;
}
}
.txt {
margin-top: 39rpx;
font-size: 32rpx;
color: #333333;
}
}
} }
} }
</style> </style>

434
pages/exercises/exam/exam.vue
View File

@ -0,0 +1,434 @@
<template>
<view class="content" id="brushQuestions">
<view class="row row1">
<view class="userInfoBox">
<view class="examNo">
<view class="h3">洛阳学车</view>
<view class="card">第01号台</view>
<view class="back">
<u-icon name="arrow-left" size="16"></u-icon>
</view>
</view>
<view class="user">
<view class="card">
<view class="h3">考生信息</view>
<view class="avatar">
<image src="@/static/logo.png" mode=""></image>
</view>
<view class="txt">姓名：大乔</view>
<view class="txt">性别：男</view>
<view class="txt">类型：小车</view>
<view class="txt">科目：科目一</view>
</view>
</view>
</view>
<view class="examConBox">
<view class="leftBox">
<view class="h3">考试题目</view>
<view class="questionTxt">
<view class="txt">32.如图所示，驾驶机动车遇到这种情况，以下做法正确的是？</view>
<view class="txt">A:减速慢行</view>
<view class="txt">B:减速慢行</view>
<view class="txt">C:减速慢行</view>
<view class="txt">D:减速慢行</view>
</view>
<view class="answer flex-b">
<view class="lab">您的答案：</view>
<view class="rightSelect flex">
<view class="lab">选项：</view>
<view class="optio flex">
<view class="optionItem">A</view>
<view class="optionItem">B</view>
<view class="optionItem active">C</view>
<view class="optionItem">D</view>
</view>
</view>
</view>
</view>
<view class="rightBox">
右边盒子
</view>
</view>
</view>
<view class="row row2">
<view class="timeBox">
<view class="h3">考试时间</view>
<view class="time">15：10</view>
</view>
<view class="leftTpsBox">
<view class="card">
<view class="h3">操作提示</view>
<view class="txt">本题为单选题，请在备选答案中选择一个你认为正确的答案！</view>
</view>
</view>
<view class="rightBtnBox">
<view class="btn hui">上一题</view>
<view class="btn hui">下一题</view>
<view class="btn">交卷</view>
</view>
</view>
<view class="picBox">
<view class="h3">考题图片</view>
<view class="imgBox">
<image src="https://lyjp-bucket-main.oss-cn-beijing.aliyuncs.com/adf614ab07f86aebb0b7b3492e8ae500907389f08d238f49665e7ac47efd4bde.jpg" @click="previewImg" mode="aspectFit"></image>
</view>
<u-popup :show="show" mode="center">
<view class="imgView">
<view class="closeIcon" @click="show=false">
<u-icon name="close-circle" color="#fff" size="28"></u-icon>
</view>
<view class="imgBox">
<image src="https://lyjp-bucket-main.oss-cn-beijing.aliyuncs.com/adf614ab07f86aebb0b7b3492e8ae500907389f08d238f49665e7ac47efd4bde.jpg" mode="widthFix"></image>
</view>
</view>
</u-popup>
</view>
</view>
</template>
<script>
export default {
data() {
return {
currentNav: '1',
show: false,
}
},
mounted() {
this.$nextTick(() => {
this.detectOrient();
})
},
methods: {
previewImg(e) {
this.show = true
// uni.previewImage({
// current: 'https://lyjp-bucket-main.oss-cn-beijing.aliyuncs.com/adf614ab07f86aebb0b7b3492e8ae500907389f08d238f49665e7ac47efd4bde.jpg',
// urls: ['https://lyjp-bucket-main.oss-cn-beijing.aliyuncs.com/adf614ab07f86aebb0b7b3492e8ae500907389f08d238f49665e7ac47efd4bde.jpg']
// });
},
detectOrient() {
var width = document.documentElement.clientWidth,
height = document.documentElement.clientHeight,
// $wrapper = document.getElementsByTagName('body')[0],
$wrapper = document.querySelector('#brushQuestions'),
style = "";
if (width >= height) { // 横屏
style += "width:" + width + "px;"; // 注意旋转后的宽高切换
style += "height:" + height + "px;";
style += "-webkit-transform: rotate(0); transform: rotate(0);";
style += "-webkit-transform-origin: 0 0;";
style += "transform-origin: 0 0;";
console.log(1)
} else { // 竖屏
style += "width:" + height + "px;";
style += "height:" + width + "px;";
style += "-webkit-transform: rotate(90deg); transform: rotate(90deg);";
// 注意旋转中点的处理
style += "-webkit-transform-origin: " + width / 2 + "px " + width / 2 + "px;";
style += "transform-origin: " + width / 2 + "px " + width / 2 + "px;";
console.log(2)
}
$wrapper.style.cssText = style;
}
}
}
</script>
<style lang="scss" scoped>
uni-page-body {
width: 100%;
height: 100%;
}
html {
width: 100vh;
height: 100vw;
-webkit-transform: rotate(90deg);
-webkit-transform-origin: 50vw 50vw;
transform: rotate(90deg);
transform-origin: 50vw 50vw;
}
image {
display: block;
width: 100%;
height: 100%;
}
.imgView {
position: relative;
background: none;
max-width: 80%;
padding: 50px;
.closeIcon {
position: absolute;
color: #fff;
top: 40rpx;
left: 40rpx;
z-index: 99;
background-color: #333;
border-radius: 50%;
}
.imgBox {
width: 100%;
}
}
.content {
padding: 30rpx 30rpx 0rpx 30rpx;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
background-color: #F7FBFE;
font-size: 20rpx;
// display: flex;
.h3 {
position: absolute;
top: -16rpx;
left: 0;
width: 100%;
text-align: center;
color: $themC;
}
.row {
width: 100%;
display: flex;
.userInfoBox {
width: 140rpx;
// height: 408rpx;
// background-color: pink;
display: flex;
flex-direction: column;
.examNo {
width: 100%;
height: 60rpx;
background: #FFFFFF;
border: 1px solid #F0F0F0;
position: relative;
.card {
line-height: 70rpx;
text-align: center;
padding-left: 20rpx;
}
.back {
position: absolute;
left: -20rpx;
top: 50%;
transform: translateY(-50%);
width: 40rpx;
height: 40rpx;
background: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
u-icon {
}
}
}
.user {
// position: relative;
flex: 1;
height: 0;
padding: 10rpx 0 0 0rpx;
.h3 {
}
.card {
padding-left: 15rpx;
position: relative;
background: #FFFFFF;
border: 1px solid #F0F0F0;
height: 100%;
.avatar {
width: 90rpx;
height: 90rpx;
border-radius: 50%;
overflow: hidden;
margin-top: 36rpx;
margin-bottom: 20rpx;
img {
}
}
.txt {
margin: 10px 0;
font-size: 18rpx;
}
}
}
}
.examConBox {
width: 0;
flex: 1;
display: flex;
// height: 408rpx;
padding-left: 20rpx;
.leftBox {
flex: 2;
background-color: #fff;
position: relative;
display: flex;
flex-direction: column;
.h3 {
left: 40rpx;
text-align: left;
}
.questionTxt {
padding: 30rpx;
flex: 1;
line-height: 2em;
.txt {
}
}
.answer.flex-b {
height: 60rpx;
border-top: 1px solid #F0F0F0;
padding-left: 20rpx;
.lab {
}
.rightSelect {
.lab {
}
.optio {
padding-left: 20rpx;
.optionItem {
width: 38rpx;
height: 38rpx;
border: 1px solid #F0F0F0;
font-size: 18rpx;
color: #333;
text-align: center;
line-height: 38rpx;
margin-right: 20rpx;
&.active {
color: #fff;
background-color: $themC;
}
}
}
}
}
}
.rightBox {
flex: 1;
background-color: blanchedalmond;
}
}
&.row1 {
flex: 4;
}
&.row2 {
height: 100rpx;
padding: 20rpx 0;
.timeBox {
width: 140rpx;
height: 100%;
background-color: #fff;
border: 1px solid #F0F0F0;
position: relative;
.h3 {
font-weight: 400;
}
.time {
font-weight: bold;
font-size: 24rpx;
color: #333333;
line-height: 60rpx;
text-align: center;
}
}
.leftTpsBox {
padding-left: 20rpx;
flex: 2;
position: relative;
.card {
background-color: #fff;
height: 100%;
}
.h3 {
text-align: left;
left: 40rpx;
}
.txt {
padding: 14rpx 20rpx 0 20rpx;
}
}
.rightBtnBox {
flex: 1;
padding-left: 20rpx;
display: flex;
// justify-content: space-between;
justify-content: flex-end;
.btn {
width: 123rpx;
// padding: 0 24rpx;
margin-left: 20rpx;
text-align: center;
font-size: 24rpx;
height: 60rpx;
line-height: 60rpx;
background: #F4F4F4;
border: 1px solid #E1DFDF;
line-height: 60rpx;
background: #F4F4F4;
}
}
}
}
.picBox {
width: 100%;
flex: 2;
background-color: #fff;
border: 1px solid #F0F0F0;
padding: 20rpx;
position: relative;
.h3 {
text-align: left;
left: 40rpx;
}
.imgBox {
width: 650px;
// max-height: 163rpx;
// background-color: skyblue;
height: 100%;
overflow: hidden;
margin: 0 auto;
}
}
}
</style>

273
pages/index/index - 副本 (2).vue
View File

@ -0,0 +1,273 @@
<template>
<div class="w-table">
<table id="cus-table" cellspacing="0">
<!-- 综掘 -->
<tr>
<td rowspan="7">综掘</td>
<td>序号</td>
<td>名称</td>
<td>设计断面(m)</td>
<td>巷高(m)</td>
<td>巷宽(m)</td>
<td>日计划(m)</td>
<td>日完成(m)</td>
<td>月累计(m)</td>
<td>欠完原因</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td rowspan="6">
<u-textarea
type="textarea"
:autosize="{ minRows: 10}"
placeholder="请输入"
v-model="diggReasonText">
</u-textarea>
</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<!-- 综采 -->
<tr>
<td rowspan="3">综采</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td rowspan="7">
<u-textarea
type="textarea"
:autosize="{ minRows: 10}"
placeholder="请输入"
v-model="miniingReasonText">
</u-textarea>
</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<!-- 原煤产量 -->
<tr>
<td colspan="2">原煤产量(吨)</td>
<td>日计</td>
<td></td>
<td>月累计</td>
<td></td>
<td></td>
<td>库存量</td>
<td></td>
</tr>
<!-- 销售量 -->
<tr>
<td colspan="2">销售量(吨)</td>
<td>日计</td>
<td></td>
<td>月累计</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<!-- 洗煤产量 -->
<tr>
<td colspan="2">洗煤产量(吨)</td>
<td>日计</td>
<td></td>
<td>月累计</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<!-- 矿值班领导 -->
<tr>
<td>矿值班领导</td>
<td></td>
<td>生产口</td>
<td colspan="2"></td>
<td colspan="2">行政口</td>
<td colspan="2"></td>
</tr>
<!-- 带班领导 -->
<tr>
<td>带班领导</td>
<td>0点班</td>
<td colspan="2"></td>
<td>8点班</td>
<td colspan="2"></td>
<td>4点班</td>
<td colspan="2"></td>
</tr>
<!-- 下井人数 -->
<tr>
<td>下井人数</td>
<td>0点班</td>
<td></td>
<td>8点班</td>
<td></td>
<td>4点班</td>
<td></td>
<td>合计</td>
<td></td>
<td></td>
</tr>
<!-- 安全生产信息汇总 -->
<tr>
<td rowspan="6">安全生产信息汇总</td>
<td rowspan="2">生产影响:</td>
<td colspan="8"></td>
</tr>
<tr>
<td colspan="8"></td>
</tr>
<tr>
<td rowspan="2">安全事故：</td>
<td colspan="8"></td>
</tr>
<tr>
<td colspan="8"></td>
</tr>
<tr>
<td rowspan="2">其他:</td>
<td colspan="8"></td>
</tr>
<tr>
<td colspan="8"></td>
</tr>
<tr>
<td>调度主任：</td>
<td colspan="6">
<u-textarea
type="textarea"
:autosize="{ minRows: 1}"
placeholder="请输入"
v-model="directorReasonText">
</u-textarea>
</td>
<td>填写人：</td>
<td colspan="2">
<u-textarea
type="textarea"
:autosize="{ minRows: 1}"
placeholder="请输入"
v-model="filledBy">
</u-textarea>
</td>
</tr>
</table>
</div>
</template>
<script>
export default {
data() {
return {
diggReasonText: '什么？', // 综掘原因
miniingReasonText: '', // 综采原因
directorReasonText: '', // 调度主任
filledBy: '' // 填写人
};
},
};
</script>
<style scoped>
.w-table {
width: 100%;
height: 100%;
}
table td {
width: 168px;
height: 30px;
border: 1px solid rgba(0, 118, 200, .3);
background: transparent;
color: #7a9cc2;
font-size: 14px;
text-align: center;
padding: 0;
margin: 0;
}
::v-deep .el-textarea__inner {
background: transparent;
color: #fff;
border-radius: 0;
border: 1px solid rgba(0, 118, 200, .5);
}
::v-deep .el-textarea .u-textarea__count {
background: transparent;
}
</style>

1
pages/index/index - 副本.vue
View File

@ -1,5 +1,6 @@
<template> <template>
<view class="content"> <view class="content">
<up-button type="primary" text="点我啊" @click="$goPage('/pages/exercises/chapter/chapter')"></up-button>
</view> </view>
</template> </template>

8
pages/index/index.vue
View File

@ -1,17 +1,11 @@
<template> <template>
<view class="content"> <view class="content">
<up-button type="primary" text="点我啊" @click="$goPage('/pages/exercises/chapter/chapter')"></up-button> <up-button type="primary" text="点我啊" @click="$goPage('/pages/exercises/chapter/chapter')"></up-button>
<!-- <u-view>点我啊</u-view> -->
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref,reactive } from 'vue'; import { ref,reactive } from 'vue';
import {onLoad,onReady} from "@dcloudio/uni-app" import {onLoad,onReady} from "@dcloudio/uni-app"
import { getBannerList } from '@/config/api.js'
async function getBannerListFn() {
const {data: res} = await getBannerList()
console.log(res)
}
getBannerListFn()
</script> </script>

3
uni.scss
View File

@ -74,3 +74,6 @@ $uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle:26px; $uni-font-size-subtitle:26px;
$uni-color-paragraph: #3F536E; // 文章段落颜色 $uni-color-paragraph: #3F536E; // 文章段落颜色
$uni-font-size-paragraph:15px; $uni-font-size-paragraph:15px;
// 自已定义的
$themC: #1989FA;
Write Preview
Loading…
Cancel
Save