chore: v3.0.0-40306202411280010quiz_out_class

main
刘东阳 2 months ago
parent 8899a13906
commit 6a658bc18d

@ -70,6 +70,7 @@
"@dcloudio/vite-plugin-uni": "3.0.0-4030620241128001",
"@vue/runtime-core": "^3.4.21",
"@vue/tsconfig": "^0.1.3",
"rollup-plugin-visualizer": "^6.0.1",
"sass": "^1.69.0",
"sass-loader": "^10.1.1",
"typescript": "^4.9.4",

@ -52,9 +52,14 @@
"mp-weixin" : {
"appid" : "",
"setting" : {
"urlCheck" : false
"urlCheck" : false,
"minified" : true
},
"usingComponents" : true
"usingComponents" : true,
"optimization" : {
"subPackages" : true
},
"lazyCodeLoading": "requiredComponents"
},
"mp-alipay" : {
"usingComponents" : true

@ -117,18 +117,6 @@
"style": {
"navigationBarTitleText": "quiz"
}
},
{
"path": "pages/exam/exam",
"style": {
"navigationBarTitleText": "exam"
}
},
{
"path": "pages/shangke/shangke",
"style": {
"navigationBarTitleText": "shnagke"
}
},{
"path": "pages/quiz_outclass/quiz_outclass",
"style": {
@ -141,6 +129,29 @@
}
}
],
"subPackages": [{
"root": "pages_A",
"pages": [{
"path": "exam/selectexam",
"style": {
"navigationBarTitleText": "课程考试"
}
},{
"path": "exam/exam",
"style": {
"navigationBarTitleText": "exam2"
}
},
{
"path": "shangke/shangke",
"style": {
"navigationBarTitleText": "shnagke"
}
}
]
}],
"tabBar": {
"color": "#7A7E83",
"selectedColor": "#007AFF",

@ -1,10 +0,0 @@
<script setup lang="ts">
import { ref } from 'vue'
</script>
<template>
<view>课程考试</view>
</template>
<style scoped>
</style>

@ -71,7 +71,7 @@
{
name: '考试',
icon: '/static/student-course/exam.png',
page: '/pages/exam/exam'
page: '/pages_A/exam/selectexam'
},
{
name: '扫码',

@ -0,0 +1,949 @@
<template>
<view class="quiz-container">
<!-- 顶部栏 -->
<view >
<view class="top-bar">
<view class="question-info">
<text class="question-text" v-if="quizData[activeIndex]">{{ }} ({{ }} )</text>
</view>
<button class="answer-card-btn" @click="showAnswerCard"></button>
</view>
<view>
<text>{{ moment.utc(totaltime * 1000).format('hh:mm:ss')}}</text>
</view>
<!-- 动态渲染题目 -->
<view v-for="(question, index) in quizData" :key="question.uuid" class="question">
<view>
<view>
<!-- 题目文本 -->
<view>
<image v-if="question.tm.lx==='pic'" :src="question.tm.pic" mode="aspectFit" class="question-image" />
<text v-if="question.tm.lx==='wb'">{{ question.tm.wb}}</text>
</view>
<text>{{question.leixing}}</text>
<!-- 选项支持图片或文本 -->
<view v-if="question.lx==='单选题'">
<view v-for="(item_choose, index_choose) in question.xuexiang" :key="index_choose" >
<view class="choose-xx" @click="danchoose(index,zm[index_choose])" >
<button
:style="{backgroundColor:question.daan===zm[index_choose]?'blue':'#aaa'}"
class="choose-button"
>
{{zm[index_choose]}}
</button>
<view class="choose-wborpic" >
<image v-if="item_choose.lx==='pic'" :src="item_choose.pic" class="choose-image" mode="aspectFit" />
<text v-if="item_choose.lx==='wb'" >{{item_choose.wb}}</text>
</view>
</view>
</view>
</view>
<view v-if="question.lx==='简答题'" class="duoxuanti_all">
<button type="button" @click="scpic"></button>
<text>12345</text>
</view>
<view v-if="question.lx==='多选题'" class="duoxuanti_all">
<view v-for="(item_choose, index_choose) in question.xuexiang" :key="index_choose" >
<view class="choose-xx" @click="duochoose(index,zm[index_choose])">
<button
:style="{backgroundColor:question.daan.includes(zm[index_choose])?'blue':'#aaa'}"
class="choose-button"
>
{{zm[index_choose]}}
</button>
<view class="choose-wborpic">
<image v-if="item_choose.lx==='pic'" :src="item_choose.pic" class="choose-image" mode="aspectFit" />
<text v-if="item_choose.lx==='wb'">{{item_choose.wb}}</text>
</view>
</view>
</view>
</view>
<view v-if="question.lx==='填空题'">
<view >
<input :value="question.sr" @input="val=>{tkt_one(val.detail.value,index);}" type="text" class="tkt-input" />
</view>
</view>
<view v-if="question.lx==='判断题'">
<view class="grid-container-pd" >
<view key="2" class="grid-item">
<button
:style="{backgroundColor:question.daan==='对'?'blue':''}"
class="choose-button1"
@click="pdt_one('对',index)"
>
</button>
</view>
<view key="index" class="grid-item">
</view>
<view key="index+1" class="grid-item">
<button
:style="{backgroundColor:question.daan==='错'?'blue':''}"
class="choose-button1"
@click="pdt_one('错',index)"
>
×
</button>
</view>
</view>
</view>
<!-- 其他题型类似处理 -->
</view>
</view>
</view>
<!-- 答案反馈 -->
<view v-if="showResult" class="result">
<text v-for="(res, key) in results" :key="key" :style="{ color: res ? 'green' : 'red' }">
{{ key + 1 }} {{ res ? '✅ 正确' : '❌ 错误' }}
</text>
</view>
<view v-if="quizData[activeIndex]">
<view v-if="isNumber(quizData[activeIndex].stuprint)" class="score-and-answer">
<text>本题得分{{ quizData[activeIndex].stuprint }}</text>
<view v-if="quizData[activeIndex].leixing==='多选题'">
<text>我的答案{{quizData[activeIndex].duoxuexiang.sort().join(",") }}</text><br/>
<text>正确答案{{JSON.parse(quizData[activeIndex].information).daan.sort().join(",") }}</text>
</view>
<view v-if="quizData[activeIndex].leixing==='单选题'">
<text>我的答案{{quizData[activeIndex].xuexiang }}</text><br/>
<text>正确答案{{JSON.parse(quizData[activeIndex].information).daan }}</text>
</view>
<view v-if="quizData[activeIndex].leixing==='判断题'">
<text>我的答案{{quizData[activeIndex].xuexiang }}</text><br/>
<text>正确答案{{JSON.parse(quizData[activeIndex].information).daan }}</text>
</view>
<view v-if="quizData[activeIndex].leixing==='填空题'">
<view v-for="(item_choose, index_tkx) in JSON.parse(quizData[activeIndex].information).daan" :key="index_tkx" >
<text>我的答案{{quizData[activeIndex].tk[index_tkx]}}</text>
<text>正确答案{{item_choose.daan }}</text>
</view><br/>
</view>
</view>
</view>
</view>
<!-- 答题卡 --><br/>
<view v-if="showAnswerCardFlag" class="answer-card">
<view class="dtk-top">
<view class="dtk-left">
<text>刘东阳</text>
<text class="stuxuehao">202413501062</text>
</view>
<view class="dtk-right">
<text class="dtk-print-title">作业得分</text>
<text class="dtk-print-stu">100</text>
<text class="dtk-print-all">/100</text>
</view>
</view>
<br/>
<view>题目列表</view>
<view class="tm-list">
<view v-for="(question, index) in quizData" :key="question.id" :class="index===activeIndex?'card-item-choose':(isNumber(question.stuprint)?'card-item-nochoose':'card-item-choose-noprint')" @click="goToQuestion(question.id)">
<view v-if="isNumber(question.stuprint)">
<view v-if="question.stuprint==getprint(question)">
<uni-badge class="uni-badge-left-margin" text="√" absolute="rightTop" :offset="[-16, -4]" size="small" :customStyle="{background: 'green'}">
<view>
<text>{{ index + 1 }} </text>
</view>
</uni-badge>
</view>
<view v-if="question.stuprint!==getprint(question)">
<uni-badge class="uni-badge-left-margin" :text='question.stuprint.toString()' absolute="rightTop" :offset="[-16, -4]" size="small" :customStyle="{background: 'red'}">
<view>
<text>{{ index + 1 }}</text>
</view>
</uni-badge>
</view>
</view>
<view v-if="!isNumber(question.stuprint)" >
<view>
<text>{{ index + 1 }}</text>
</view>
</view>
</view>
</view>
<view>
<button class="return-button" @click="returndati"></button>
</view>
<view :style="{height: '20px'}">
</view>
</view>
</view>
<!-- 得分与正确答案展示 -->
<!-- 底部控制按钮 -->
<view class="bottom-controls">
<button @click="prevQuestion"></button>
<button @click="submitAnswers" type="primary">提交答案</button>
<button @click="nextQuestion"></button>
</view>
</template>
<script setup lang="ts">
import {ref, computed, watch, watchEffect} from 'vue'
import {onLoad} from "@dcloudio/uni-app";
import UniBadge from "@/uni_modules/uni-badge/components/uni-badge/uni-badge.vue";
const zm=['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
import moment from "moment/moment";
import path from "path";
import {info} from "sass";
//
const quizData = ref([])
const uid=ref("0")
//
const fujianuuid=ref("0")
const intervalId = ref<number | null>(null);
const activeIndex = ref(0)
const dati_able=ref(true)
//
const showResult = ref(false)
// /
const showAnswerCardFlag = ref(false)
const endtime=ref("")
//
const currentQuestion = computed(() => {
return quizData[activeIndex.value] || {}
})
// ID
const userAnswers = ref<Record<number, any>>({})
// true/false
const results = ref<boolean[]>([])
//
function handleRadioChange(id: number, value: string) {
userAnswers.value[id] = value
}
//
function prevQuestion() {
if (activeIndex.value > 0) activeIndex.value--
}
//
function nextQuestion() {
if (activeIndex.value < quizData.length - 1) activeIndex.value++
}
//
function goToQuestion(index: number) {
const id=quizData.value.findIndex(item=>item.id==index)
if(id!==-1) {
activeIndex.value = id
showAnswerCardFlag.value = false //
}
}
watch(quizData,function (newValue, oldValue) {
if(1===3) {
uni.request({
url: 'http://localhost:3400/api/updatezxdt_ex',
method: 'POST',
data: { // GET `data` `params` :ml-citation{ref="8" data="citationList"}
alltm: newValue,
ksh: uid.value,
xuehao: "202413501062"
},
success: (res) => { /* ... */
console.log(res.data)
}
});
}
},{deep: true});
//
const totaltime=ref(5)
function getprint(question){
if(question.leixing==='填空题'){
let print =0;
JSON.parse(question.information).daan.map((daan, key) => {
print+=parseInt(daan.print);
})
return print;
}else if(question.leixing==='多选题'){
return parseInt(JSON.parse(question.information).df);
}else if(question.leixing==='单选题'){
return parseInt(JSON.parse(question.information).df);
}else if(question.leixing==='判断题'){
return parseInt(JSON.parse(question.information).df);
}
}
function submitAnswers() {
//
console.log(quizData.value[activeIndex.value])
if(quizData.value[activeIndex.value].leixing==="填空题"){
let print =0;
JSON.parse(quizData.value[activeIndex.value].information).daan.map((daan, key) => {
if(daan.daan===quizData.value[activeIndex.value].tk[key]){
print+=parseInt(daan.print);
}
})
console.log(print)
quizData.value[activeIndex.value].stuprint=print;
}
if(quizData.value[activeIndex.value].leixing==="多选题"){
let print =0;
let zq=true;
JSON.parse(quizData.value[activeIndex.value].information).daan.map((choose_one)=>{
if(!quizData.value[activeIndex.value].duoxuexiang.includes(choose_one)){
zq=false;
}
})
if(quizData.value[activeIndex.value].duoxuexiang.length!==JSON.parse(quizData.value[activeIndex.value].information).daan.length){
zq=false;
}
if(zq){
print=parseInt(JSON.parse(quizData.value[activeIndex.value].information).df)
}
console.log(print)
quizData.value[activeIndex.value].stuprint= print;
}else if(quizData.value[activeIndex.value].leixing==="单选题"){
if(quizData.value[activeIndex.value].xuexiang===JSON.parse(quizData.value[activeIndex.value].information).daan){
quizData.value[activeIndex.value].stuprint=parseInt(JSON.parse(quizData.value[activeIndex.value].information).df)
}else {
quizData.value[activeIndex.value].stuprint=0
}
}else if(quizData.value[activeIndex.value].leixing==="判断题"){
if(quizData.value[activeIndex.value].xuexiang===JSON.parse(quizData.value[activeIndex.value].information).daan){
quizData.value[activeIndex.value].stuprint=JSON.parse(quizData.value[activeIndex.value].information).df
}else {
quizData.value[activeIndex.value].stuprint=0
}
}
//////
if(1===3) {
results.value[activeIndex.value] = false
const currentQuestion = quizData[activeIndex.value]
const userAnswer = userAnswers.value[currentQuestion.id] ?? ''
const correctAnswer = String(currentQuestion.answer)
const normalizedUserAnswer = String(userAnswer).trim().toUpperCase()
const normalizedCorrectAnswer = correctAnswer.trim().toUpperCase()
const isCorrect = normalizedUserAnswer == normalizedCorrectAnswer
results.value[activeIndex.value] = isCorrect
showResult.value = true
}
}
//
const score = computed(() => {
const currentResult = results.value[activeIndex.value]
return currentResult ? currentQuestion.value.score : 0
})
//
const correctAnswer = computed(() => {
const currentQuestion = quizData[activeIndex.value]
if (!currentQuestion) return ''
const correctOption = currentQuestion.options.find(
option => option.value === currentQuestion.answer
)
return correctOption ? correctOption.text : ''
})
function pdt_one(xx:string,index:number){
quizData.value[index].daan = xx
}
const startTimer = () => {
intervalId.value = setInterval(() => {
if (totaltime.value>0) {
totaltime.value=moment(endtime.value).diff(moment(),'seconds')
} else {
stopTimer();
}
}, 1000);
};
//
const stopTimer = () => {
if (intervalId.value !== null) {
clearInterval(intervalId.value);
intervalId.value = null;
}
};
function danchoose(index: number,choose:string) {
console.log(choose);
console.log(index)
quizData.value[index].daan = choose
}
function duochoose(index: number,choose:string) {
console.log(choose);
console.log(index)
if(quizData.value[index].daan.includes(choose)) {
quizData.value[index].daan = quizData.value[index].daan.filter(item => item !== choose);
}else {
quizData.value[index].daan.push(choose);
}
}
//
function showAnswerCard() {
showAnswerCardFlag.value = true
}
function isNumber(value) {
return typeof value === 'number';
}
function updatwfujianuuid(){
uni.request({
url: 'http://localhost:3400/helpwx/uuid',
method: 'GET',
data: { // GET `data` `params` :ml-citation{ref="8" data="citationList"}
}, success: (res) => { /* ... */
console.log(res.data)
fujianuuid.value=res.data
}
})
}
function tkt_one(xx:string,index:number){
quizData.value[index].sr=xx;
}
onLoad((options) => {
console.log(options)
uid.value=options.uuid;
updatwfujianuuid()
uni.request({
url: 'http://localhost:3400/kaoshi/select',
method: 'GET',
data: { // GET `data` `params` :ml-citation{ref="8" data="citationList"}
ks:options.uuid,
xuehao:"202413501062"
},
success: (res) => { /* ... */
console.log(res.data)
let temp=[...res.data.infor]
res.data.infor.map((value,index)=>{
if(value.lx==="多选题"){
if (!temp[index].daan)
temp[index].daan=[]
}else if(value.lx==="简答题"){
if (!temp[index].filelist)
temp[index].filelist=[]
}
})
console.log(temp)
quizData.value=temp;
console.log(quizData)
if(res.data.end==="end"){
// setTishi("")
dati_able.value=false
//clearInterval(timer)
}else {
// const seconds=JSON.parse(res.data.information).seconds;
// let end=moment(res.data.stustart)
// end.add(seconds,'seconds');
// endtime.value=end.format('YYYY-MM-DD HH:mm:ss');
// console.log(end.format('YYYY-MM-DD HH:mm:ss'))
startTimer();
}
}
});
})
function returndati(){
showAnswerCardFlag.value = false
}
// function uppic(imageUrl,uuid) {
// return new Promise((resolve, reject) => {
// uni.chooseMedia({
// count: 1, //
// mediaType: ['image'], //
// sourceType: ['album', 'camera'], //
// sizeType: ['original', 'compressed'], //
// success(res) {
// const tempFilePath = res.tempFiles[0].tempFilePath
// uni.uploadFile({
// url: imageUrl, //
// filePath: tempFilePath, //
// name: 'file', //
// header: {
// accept: 'application/json',
// th: uid.value ,
// xx: uuid,
// lx: "kaoshi"
// },
// success: (uploadFileRes) => { //
// console.log(uploadFileRes);
// let src=uid.value + "/" + uuid + path.extname(tempFilePath)
//
// resolve({value1:uploadFileRes,src:src,lujing:res.tempFiles[0].tempFilePath})
// }
// });
// }
// })
// })
// }
function scpic(){
//console.log(uppic("http://localhost:3400/api/uploadtm",fujianuuid.value))
}
</script>
<style scoped>
.quiz-container {
padding: 5px;
position: relative;
}
/* 顶部栏样式 */
.top-bar {
display: flex;
justify-content: space-between;
align-items: center;
padding: 3px;
border-bottom: 1px solid #e0e0e0;
background-color: #d97e7e;
}
.top-bar1 {
display: inline;
justify-content: space-between;
align-items: center;
padding: 3px;
border-bottom: 1px solid #e0e0e0;
background-color: #d97e7e;
width: 100vw;
}
.question-text1 {
font-size: 16px;
color: #333;
font-weight: bold;
margin-left: 10px;
}
.answer-card-btn1 {
background-color: #63a2cf;
border: 1px solid #a8d5ff;
color: #000;
padding: 3px 6px;
border-radius: 4px;
font-size: 12px;
margin-left: auto;
}
/* 新增左侧竖线装饰 */
.question-info1::before {
content: '';
display: inline-block;
width: 4px;
height: 20px;
background-color: #007bff;
margin-right: 3px;
}
.question-text {
font-size: 16px;
color: #333;
font-weight: bold;
margin-left: 10px;
}
.answer-card-btn {
background-color: #63a2cf;
border: 1px solid #a8d5ff;
color: #000;
padding: 3px 6px;
border-radius: 4px;
font-size: 12px;
background-color: #4490ca;
margin-left: auto;
}
/* 新增左侧竖线装饰 */
.question-info::before {
content: '';
display: inline-block;
width: 4px;
height: 20px;
background-color: #007bff;
margin-right: 3px;
}
.question {
margin-bottom: 20px;
display: flex;
flex-direction: column; /* 设置主轴为纵向 */
}
.question-text {
font-size: 16px;
margin-bottom: 10px;
}
.option {
display: flex;
align-items: center;
margin: 5px 0;
}
.option-image {
width: 50px;
height: 50px;
margin-left: 10px;
}
.result {
margin-top: 20px;
}
.answer-card {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 20px;
flex-direction: column;
}
.card-item-choose {
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
cursor: pointer;
width: 20px;
height: 20px;
background-color: #0ef306;
margin-left: 20px;
}
.card-item-nochoose {
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
cursor: pointer;
width: 20px;
height: 20px;
background-color: #fcffea;
margin-left: 20px;
}
.card-item-choose-noprint {
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
cursor: pointer;
width: 20px;
height: 20px;
background-color: #fbfbfb;
}
.score-and-answer {
margin-top: 20px;
background-color: #f0f0f0;
padding: 10px;
border-radius: 8px;
}
.bottom-controls {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
padding: 5px;
display: flex;
justify-content: space-between;
align-items: center;
box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.1);
}
.bottom-controls button {
padding: 5px 10px;
font-size: 14px;
border-radius: 4px;
background-color: #f0f0f0;
color: #333;
border: none;
transition: all 0.3s ease;
}
.bottom-controls button:hover {
background-color: #e0e0e0;
}
.bottom-controls button[type="primary"] {
background-color: #2196f3;
color: #fff;
}
.question-image{
margin-left: 35px;
}
.bottom-controls button[type="primary"]:hover {
background-color: #1976d2;
}
.choose-button{
font-size: 18px;
position: absolute;
left: 3vw;
font-weight: bold;
height: 14vw;
width: 14vw;
border-radius: 50%;
}
.choose-wborpic{
position: relative;
left: 17vw;
top: 1vh;
}
.choose-image{
height: 12vh;
max-width: 70vw;
position: absolute;
left: 0;
top: -2vh;
}
.choose-xx{
margin-bottom: 40px;
}
.tkt-input {
border: 1rpx solid black;
border-radius: 8rpx;
padding: 10rpx 20rpx;
margin: 20rpx 0;
width: 60vw;
color: #00f0ff;
display: inline-block;
position: relative;
top: 24px;
left: 10px;
}
.xuhao{
width: 35px;
height: 35px;
border-radius: 50%;
background-color: #4a90e2;
display: inline-block;
}
.xuhao_wb{
display: inline-block;
font-size:25px;
margin-left: 6px;
}
.print-wb{
display: inline-block;
margin-left: 20px;
}
.grid-container-pd
{
display: flex;
flex-wrap: wrap;
margin-left: 60px;
}
.grid-container {
display: flex;
flex-wrap: wrap;
margin-left: 10vw;
}
.grid-item {
width: calc(25% - 10px); /* 每个项目宽度为25%,减去间距 */
margin: 5px; /* 项目之间的间距 */
box-sizing: border-box; /* 确保padding和border不会影响宽度 */
}
.choose-button1{
margin-top: 20px;
font-size: 18px;
margin-left: 10px;
font-weight: bold;
height: 18vw;
width: 18vw;
display: flex;
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
border-radius: 50%;
}
.container1 {
padding: 20rpx;
background-color: #f5f5f5;
min-height: 100vh;
}
.user-info {
display: flex;
align-items: center;
padding: 30rpx;
background-color: #fff;
border-radius: 16rpx;
margin-bottom: 30rpx;
}
.avatar {
width: 120rpx;
height: 120rpx;
border-radius: 50%;
margin-right: 30rpx;
}
.user-text {
display: flex;
flex-direction: column;
}
.username {
font-size: 36rpx;
font-weight: bold;
margin-bottom: 10rpx;
}
.user-id {
font-size: 28rpx;
color: #999;
}
.score-card {
background-color: #fff;
border-radius: 16rpx;
padding: 30rpx;
}
.card-header {
margin-bottom: 30rpx;
}
.card-title {
font-size: 32rpx;
font-weight: bold;
display: block;
margin-bottom: 10rpx;
}
.card-subtitle {
font-size: 26rpx;
color: #999;
}
.score-content {
display: flex;
justify-content: space-between;
}
.score-item {
flex: 1;
text-align: center;
}
.score-label {
font-size: 28rpx;
color: #666;
display: block;
margin-bottom: 10rpx;
}
.score-value {
font-size: 40rpx;
font-weight: bold;
color: #07c160;
}
.dtk-left{
display:flex ;
flex-direction:column;
}
.dtk-right {
display:flex;
position: absolute; /* 绝对定位 */
right: 5px; /* 右对齐 */
align-items: end; /* 使子元素垂直对齐到容器的底部 */
}
.dtk-top {
display: flex;
width: 100vw;
}
.dtk-print-stu{
font-size: 25px;
}
.dtk-print-all{
font-size: 11px;
position: relative;
top: 12px;
}
.dtk-print-title{
font-size: 11px;
position: relative;
top: 12px;
margin-right: 20px;
}
.stuname{
}
.stuxuehao{
font-size: 10px;
}
.tm-list{
display: flex;
}
.return-button{
width: 80vw;
background-color: #ffffff;
color: green;
border: 3px solid green;
}
.duoxuanti_all{
}
.danxuanti_all{
display: flex;
flex-direction: row;
}
</style>

@ -0,0 +1,223 @@
<template>
<div class="question-list">
<ul>
<li
v-for="question in questions"
:key="question.uuid"
:class="['question-item', { selected: question.selected }]"
@click="handleSelect(question.uuid)"
>
<div class="info">
<span class="title">{{ JSON.parse(question.xx).name }}</span>
<div class="meta">
<span class="teacher">教师{{ question.teaname}}</span>
<span class="time">时间{{ moment(JSON.parse(question.xx).timestart).format('YYYY-MM-DD HH:mm:ss') }} - {{ moment(JSON.parse(question.xx).timeend).format('YYYY-MM-DD HH:mm:ss') }}</span>
</div>
</div>
<div class="stats">
<span class="num">{{question.paper? JSON.parse(question.paper).length:0 }}</span>
<span class="total">总分{{ allprint(question.std) }}</span>
</div>
</li>
</ul>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import {onLoad} from "@dcloudio/uni-app";
import moment from "moment";
//
interface Question {
uuid: string
title: string
course: string
teacher: string
startTime: string
endTime: string
num: number
total: number
selected: boolean
}
function allprint(std){
const stdlist=JSON.parse(std)
let print =0;
stdlist.map((stdone,index)=>{
if(stdone.print){
print+=stdone.print;
}
})
return print;
}
//
const questions = ref([
{
uuid: '1',
title: '题目1',
course: '课程1',
teacher: '教师1',
startTime: '2023-10-01T08:00:00',
endTime: '2023-10-01T09:00:00',
num: 1,
total: 100,
selected: false
},
{
uuid: '2',
title: '题目2',
course: '课程2',
teacher: '教师2',
startTime: '2023-10-02T08:00:00',
endTime: '2023-10-02T09:00:00',
num: 2,
total: 200,
selected: false
}
])
onLoad((options)=>{
uni.request({
url: 'http://localhost:3400/kaoshi/selectlist',
method: 'GET',
data: { // GET `data` `params` :ml-citation{ref="8" data="citationList"}
xuehao:'202413501062'
},
success: (res) => { /* ... */
console.log(res.data)
questions.value=res.data
}
});
})
//
const handleSelect = (uuid) => {
console.log(uuid)
uni.navigateTo({
url: '/pages/pages_A/exam/exam?uuid='+uuid
});
}
//
const formatTime = (time: string): string => {
const date = new Date(time)
return `${date.getHours()}:${date.getMinutes().toString().padStart(2, '0')}`
}
</script>
<style scoped>
.question-list {
background: linear-gradient(135deg, #0f2027, #203a43, #2c5364);
min-height: 100vh;
padding: 40px 20px;
color: #fff;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.question-list h2 {
text-align: center;
font-size: 2rem;
margin-bottom: 20px;
color: #00ffff;
text-shadow: 0 0 10px #00ffff;
}
ul {
list-style-type: none;
padding: 0;
max-width: 900px;
margin: 0 auto;
}
.question-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px;
margin-bottom: 16px;
border-radius: 12px;
background: rgba(255, 255, 255, 0.05);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
cursor: pointer;
transition: all 0.3s ease-in-out;
border-left: 4px solid transparent;
}
.question-item:hover {
transform: scale(1.02);
background: rgba(255, 255, 255, 0.1);
box-shadow: 0 8px 24px rgba(0, 255, 255, 0.2);
}
.question-item.selected {
background-color: rgba(0, 255, 255, 0.2);
border-left-color: #00ffff;
box-shadow: 0 0 10px #00ffff;
}
.info {
display: flex;
flex-direction: column;
}
.title {
font-size: 18px;
font-weight: bold;
color: #ffffff;
margin-bottom: 6px;
}
.meta {
display: flex;
flex-wrap: wrap;
gap: 8px;
font-size: 12px;
color: #ccc;
}
.meta span {
padding: 4px 8px;
border-radius: 6px;
font-weight: 500;
}
.course {
background-color: rgba(0, 255, 255, 0.2);
color: #00ffff;
}
.teacher {
background-color: rgba(255, 255, 0, 0.2);
color: #fffa86;
}
.time {
background-color: rgba(255, 255, 255, 0.15);
color: #ddd;
width: 60vw;
}
.stats {
display: flex;
flex-direction: column;
align-items: flex-end;
}
.num {
font-size: 12px;
background-color: rgba(0, 255, 127, 0.2);
color: #00ff7f;
padding: 4px 8px;
border-radius: 6px;
}
.total {
font-size: 12px;
background-color: rgba(255, 105, 180, 0.2);
color: #ff69b4;
padding: 4px 8px;
border-radius: 6px;
margin-top: 6px;
}
</style>

@ -60,7 +60,7 @@ import moment from "moment/min/moment-with-locales";
import io from '@hyoga/uni-socket.io'
import { ref } from 'vue'
import { onLoad } from "@dcloudio/uni-app";
import uvDivider from '@/pages/shangke/fgx.vue';
import uvDivider from '@/pages_A/shangke/fgx.vue';
// and PPT
const kctivityAndPPT = ref([
{ id: 0, lx: 'notice', wb: '上课了' },

@ -0,0 +1,33 @@
## 1.2.22023-01-28
- 修复 运行/打包 控制台警告问题
## 1.2.12022-09-05
- 修复 当 text 超过 max-num 时badge 的宽度计算是根据 text 的长度计算,更改为 css 计算实际展示宽度,详见:[https://ask.dcloud.net.cn/question/150473](https://ask.dcloud.net.cn/question/150473)
## 1.2.02021-11-19
- 优化 组件UI并提供设计资源详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-badge](https://uniapp.dcloud.io/component/uniui/uni-badge)
## 1.1.72021-11-08
- 优化 升级ui
- 修改 size 属性默认值调整为 small
- 修改 type 属性,默认值调整为 errorinfo 替换 default
## 1.1.62021-09-22
- 修复 在字节小程序上样式不生效的 bug
## 1.1.52021-07-30
- 组件兼容 vue3如何创建vue3项目详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.42021-07-29
- 修复 去掉 nvue 不支持css 的 align-self 属性nvue 下不暂支持 absolute 属性
## 1.1.32021-06-24
- 优化 示例项目
## 1.1.12021-05-12
- 新增 组件示例地址
## 1.1.02021-05-12
- 新增 uni-badge 的 absolute 属性,支持定位
- 新增 uni-badge 的 offset 属性,支持定位偏移
- 新增 uni-badge 的 is-dot 属性,支持仅显示有一个小点
- 新增 uni-badge 的 max-num 属性,支持自定义封顶的数字值,超过 99 显示99+
- 优化 uni-badge 属性 custom-style 支持以对象形式自定义样式
## 1.0.72021-05-07
- 修复 uni-badge 在 App 端数字小于10时不是圆形的bug
- 修复 uni-badge 在父元素不是 flex 布局时宽度缩小的bug
- 新增 uni-badge 属性 custom-style 支持自定义样式
## 1.0.62021-02-04
- 调整为uni_modules目录规范

@ -0,0 +1,268 @@
<template>
<view class="uni-badge--x">
<slot />
<text v-if="text" :class="classNames" :style="[positionStyle, customStyle, dotStyle]"
class="uni-badge" @click="onClick()">{{displayValue}}</text>
</view>
</template>
<script>
/**
* Badge 数字角标
* @description 数字角标一般和其它控件列表9宫格等配合使用用于进行数量提示默认为实心灰色背景
* @tutorial https://ext.dcloud.net.cn/plugin?id=21
* @property {String} text 角标内容
* @property {String} size = [normal|small] 角标内容
* @property {String} type = [info|primary|success|warning|error] 颜色类型
* @value info 灰色
* @value primary 蓝色
* @value success 绿色
* @value warning 黄色
* @value error 红色
* @property {String} inverted = [true|false] 是否无需背景颜色
* @property {Number} maxNum 展示封顶的数字值超过 99 显示 99+
* @property {String} absolute = [rightTop|rightBottom|leftBottom|leftTop] 开启绝对定位, 角标将定位到其包裹的标签的四角上
* @value rightTop 右上
* @value rightBottom 右下
* @value leftTop 左上
* @value leftBottom 左下
* @property {Array[number]} offset 距定位角中心点的偏移量只有存在 absolute 属性时有效例如[-10, -10] 表示向外偏移 10px[10, 10] 表示向 absolute 指定的内偏移 10px
* @property {String} isDot = [true|false] 是否显示为一个小点
* @event {Function} click 点击 Badge 触发事件
* @example <uni-badge text="1"></uni-badge>
*/
export default {
name: 'UniBadge',
emits: ['click'],
props: {
type: {
type: String,
default: 'error'
},
inverted: {
type: Boolean,
default: false
},
isDot: {
type: Boolean,
default: false
},
maxNum: {
type: Number,
default: 99
},
absolute: {
type: String,
default: ''
},
offset: {
type: Array,
default () {
return [0, 0]
}
},
text: {
type: [String, Number],
default: ''
},
size: {
type: String,
default: 'small'
},
customStyle: {
type: Object,
default () {
return {}
}
}
},
data() {
return {};
},
computed: {
width() {
return String(this.text).length * 8 + 12
},
classNames() {
const {
inverted,
type,
size,
absolute
} = this
return [
inverted ? 'uni-badge--' + type + '-inverted' : '',
'uni-badge--' + type,
'uni-badge--' + size,
absolute ? 'uni-badge--absolute' : ''
].join(' ')
},
positionStyle() {
if (!this.absolute) return {}
let w = this.width / 2,
h = 10
if (this.isDot) {
w = 5
h = 5
}
const x = `${- w + this.offset[0]}px`
const y = `${- h + this.offset[1]}px`
const whiteList = {
rightTop: {
right: x,
top: y
},
rightBottom: {
right: x,
bottom: y
},
leftBottom: {
left: x,
bottom: y
},
leftTop: {
left: x,
top: y
}
}
const match = whiteList[this.absolute]
return match ? match : whiteList['rightTop']
},
dotStyle() {
if (!this.isDot) return {}
return {
width: '10px',
minWidth: '0',
height: '10px',
padding: '0',
borderRadius: '10px'
}
},
displayValue() {
const {
isDot,
text,
maxNum
} = this
return isDot ? '' : (Number(text) > maxNum ? `${maxNum}+` : text)
}
},
methods: {
onClick() {
this.$emit('click');
}
}
};
</script>
<style lang="scss" >
$uni-primary: #2979ff !default;
$uni-success: #4cd964 !default;
$uni-warning: #f0ad4e !default;
$uni-error: #dd524d !default;
$uni-info: #909399 !default;
$bage-size: 12px;
$bage-small: scale(0.8);
.uni-badge--x {
/* #ifdef APP-NVUE */
// align-self: flex-start;
/* #endif */
/* #ifndef APP-NVUE */
display: inline-block;
/* #endif */
position: relative;
}
.uni-badge--absolute {
position: absolute;
}
.uni-badge--small {
transform: $bage-small;
transform-origin: center center;
}
.uni-badge {
/* #ifndef APP-NVUE */
display: flex;
overflow: hidden;
box-sizing: border-box;
font-feature-settings: "tnum";
min-width: 20px;
/* #endif */
justify-content: center;
flex-direction: row;
height: 20px;
padding: 0 4px;
line-height: 18px;
color: #fff;
border-radius: 100px;
background-color: $uni-info;
background-color: transparent;
border: 1px solid #fff;
text-align: center;
font-family: 'Helvetica Neue', Helvetica, sans-serif;
font-size: $bage-size;
/* #ifdef H5 */
z-index: 999;
cursor: pointer;
/* #endif */
&--info {
color: #fff;
background-color: $uni-info;
}
&--primary {
background-color: $uni-primary;
}
&--success {
background-color: $uni-success;
}
&--warning {
background-color: $uni-warning;
}
&--error {
background-color: $uni-error;
}
&--inverted {
padding: 0 5px 0 0;
color: $uni-info;
}
&--info-inverted {
color: $uni-info;
background-color: transparent;
}
&--primary-inverted {
color: $uni-primary;
background-color: transparent;
}
&--success-inverted {
color: $uni-success;
background-color: transparent;
}
&--warning-inverted {
color: $uni-warning;
background-color: transparent;
}
&--error-inverted {
color: $uni-error;
background-color: transparent;
}
}
</style>

@ -0,0 +1,85 @@
{
"id": "uni-badge",
"displayName": "uni-badge 数字角标",
"version": "1.2.2",
"description": "数字角标(徽章)组件,在元素周围展示消息提醒,一般用于列表、九宫格、按钮等地方。",
"keywords": [
"",
"badge",
"uni-ui",
"uniui",
"数字角标",
"徽章"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "y",
"联盟": "y"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

@ -0,0 +1,10 @@
## Badge 数字角标
> **组件名uni-badge**
> 代码块: `uBadge`
数字角标一般和其它控件列表、9宫格等配合使用用于进行数量提示默认为实心灰色背景
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-badge)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839

@ -0,0 +1,8 @@
## 1.0.32022-01-21
- 优化 组件示例
## 1.0.22021-11-22
- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题
## 1.0.12021-11-22
- 修复 vue3中scss语法兼容问题
## 1.0.02021-11-18
- init

@ -0,0 +1 @@
@import './styles/index.scss';

@ -0,0 +1,82 @@
{
"id": "uni-scss",
"displayName": "uni-scss 辅助样式",
"version": "1.0.3",
"description": "uni-sass是uni-ui提供的一套全局样式 通过一些简单的类名和sass变量实现简单的页面布局操作比如颜色、边距、圆角等。",
"keywords": [
"uni-scss",
"uni-ui",
"辅助样式"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"JS SDK",
"通用 SDK"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "u"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "n",
"联盟": "n"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

@ -0,0 +1,4 @@
`uni-sass``uni-ui`提供的一套全局样式 ,通过一些简单的类名和`sass`变量,实现简单的页面布局操作,比如颜色、边距、圆角等。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839

@ -0,0 +1,7 @@
@import './setting/_variables.scss';
@import './setting/_border.scss';
@import './setting/_color.scss';
@import './setting/_space.scss';
@import './setting/_radius.scss';
@import './setting/_text.scss';
@import './setting/_styles.scss';

@ -0,0 +1,3 @@
.uni-border {
border: 1px $uni-border-1 solid;
}

@ -0,0 +1,66 @@
// TODO class 使 使
// @mixin get-styles($k,$c) {
// @if $k == size or $k == weight{
// font-#{$k}:#{$c}
// }@else{
// #{$k}:#{$c}
// }
// }
$uni-ui-color:(
//
primary: $uni-primary,
primary-disable: $uni-primary-disable,
primary-light: $uni-primary-light,
//
success: $uni-success,
success-disable: $uni-success-disable,
success-light: $uni-success-light,
warning: $uni-warning,
warning-disable: $uni-warning-disable,
warning-light: $uni-warning-light,
error: $uni-error,
error-disable: $uni-error-disable,
error-light: $uni-error-light,
info: $uni-info,
info-disable: $uni-info-disable,
info-light: $uni-info-light,
//
main-color: $uni-main-color,
base-color: $uni-base-color,
secondary-color: $uni-secondary-color,
extra-color: $uni-extra-color,
//
bg-color: $uni-bg-color,
//
border-1: $uni-border-1,
border-2: $uni-border-2,
border-3: $uni-border-3,
border-4: $uni-border-4,
//
black:$uni-black,
//
white:$uni-white,
//
transparent:$uni-transparent
) !default;
@each $key, $child in $uni-ui-color {
.uni-#{"" + $key} {
color: $child;
}
.uni-#{"" + $key}-bg {
background-color: $child;
}
}
.uni-shadow-sm {
box-shadow: $uni-shadow-sm;
}
.uni-shadow-base {
box-shadow: $uni-shadow-base;
}
.uni-shadow-lg {
box-shadow: $uni-shadow-lg;
}
.uni-mask {
background-color:$uni-mask;
}

@ -0,0 +1,55 @@
@mixin radius($r,$d:null ,$important: false){
$radius-value:map-get($uni-radius, $r) if($important, !important, null);
// Key exists within the $uni-radius variable
@if (map-has-key($uni-radius, $r) and $d){
@if $d == t {
border-top-left-radius:$radius-value;
border-top-right-radius:$radius-value;
}@else if $d == r {
border-top-right-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == b {
border-bottom-left-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == l {
border-top-left-radius:$radius-value;
border-bottom-left-radius:$radius-value;
}@else if $d == tl {
border-top-left-radius:$radius-value;
}@else if $d == tr {
border-top-right-radius:$radius-value;
}@else if $d == br {
border-bottom-right-radius:$radius-value;
}@else if $d == bl {
border-bottom-left-radius:$radius-value;
}
}@else{
border-radius:$radius-value;
}
}
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $key} {
@include radius($key)
}
}@else{
.uni-radius {
@include radius($key)
}
}
}
@each $direction in t, r, b, l,tl, tr, br, bl {
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $direction}-#{"" + $key} {
@include radius($key,$direction,false)
}
}@else{
.uni-radius-#{$direction} {
@include radius($key,$direction,false)
}
}
}
}

@ -0,0 +1,56 @@
@mixin fn($space,$direction,$size,$n) {
@if $n {
#{$space}-#{$direction}: #{$size*$uni-space-root}px
} @else {
#{$space}-#{$direction}: #{-$size*$uni-space-root}px
}
}
@mixin get-styles($direction,$i,$space,$n){
@if $direction == t {
@include fn($space, top,$i,$n);
}
@if $direction == r {
@include fn($space, right,$i,$n);
}
@if $direction == b {
@include fn($space, bottom,$i,$n);
}
@if $direction == l {
@include fn($space, left,$i,$n);
}
@if $direction == x {
@include fn($space, left,$i,$n);
@include fn($space, right,$i,$n);
}
@if $direction == y {
@include fn($space, top,$i,$n);
@include fn($space, bottom,$i,$n);
}
@if $direction == a {
@if $n {
#{$space}:#{$i*$uni-space-root}px;
} @else {
#{$space}:#{-$i*$uni-space-root}px;
}
}
}
@each $orientation in m,p {
$space: margin;
@if $orientation == m {
$space: margin;
} @else {
$space: padding;
}
@for $i from 0 through 16 {
@each $direction in t, r, b, l, x, y, a {
.uni-#{$orientation}#{$direction}-#{$i} {
@include get-styles($direction,$i,$space,true);
}
.uni-#{$orientation}#{$direction}-n#{$i} {
@include get-styles($direction,$i,$space,false);
}
}
}
}

@ -0,0 +1,167 @@
/* #ifndef APP-NVUE */
$-color-white:#fff;
$-color-black:#000;
@mixin base-style($color) {
color: #fff;
background-color: $color;
border-color: mix($-color-black, $color, 8%);
&:not([hover-class]):active {
background: mix($-color-black, $color, 10%);
border-color: mix($-color-black, $color, 20%);
color: $-color-white;
outline: none;
}
}
@mixin is-color($color) {
@include base-style($color);
&[loading] {
@include base-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&[loading],
&:not([hover-class]):active {
color: $-color-white;
border-color: mix(darken($color,10%), $-color-white);
background-color: mix($color, $-color-white);
}
}
}
@mixin base-plain-style($color) {
color:$color;
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 70%);
&:not([hover-class]):active {
background: mix($-color-white, $color, 80%);
color: $color;
outline: none;
border-color: mix($-color-white, $color, 50%);
}
}
@mixin is-plain($color){
&[plain] {
@include base-plain-style($color);
&[loading] {
@include base-plain-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&:active {
color: mix($-color-white, $color, 40%);
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 80%);
}
}
}
}
.uni-btn {
margin: 5px;
color: #393939;
border:1px solid #ccc;
font-size: 16px;
font-weight: 200;
background-color: #F9F9F9;
// TODO
overflow: visible;
&::after{
border: none;
}
&:not([type]),&[type=default] {
color: #999;
&[loading] {
background: none;
&::before {
margin-right:5px;
}
}
&[disabled]{
color: mix($-color-white, #999, 60%);
&,
&[loading],
&:active {
color: mix($-color-white, #999, 60%);
background-color: mix($-color-white,$-color-black , 98%);
border-color: mix($-color-white, #999, 85%);
}
}
&[plain] {
color: #999;
background: none;
border-color: $uni-border-1;
&:not([hover-class]):active {
background: none;
color: mix($-color-white, $-color-black, 80%);
border-color: mix($-color-white, $-color-black, 90%);
outline: none;
}
&[disabled]{
&,
&[loading],
&:active {
background: none;
color: mix($-color-white, #999, 60%);
border-color: mix($-color-white, #999, 85%);
}
}
}
}
&:not([hover-class]):active {
color: mix($-color-white, $-color-black, 50%);
}
&[size=mini] {
font-size: 16px;
font-weight: 200;
border-radius: 8px;
}
&.uni-btn-small {
font-size: 14px;
}
&.uni-btn-mini {
font-size: 12px;
}
&.uni-btn-radius {
border-radius: 999px;
}
&[type=primary] {
@include is-color($uni-primary);
@include is-plain($uni-primary)
}
&[type=success] {
@include is-color($uni-success);
@include is-plain($uni-success)
}
&[type=error] {
@include is-color($uni-error);
@include is-plain($uni-error)
}
&[type=warning] {
@include is-color($uni-warning);
@include is-plain($uni-warning)
}
&[type=info] {
@include is-color($uni-info);
@include is-plain($uni-info)
}
}
/* #endif */

@ -0,0 +1,24 @@
@mixin get-styles($k,$c) {
@if $k == size or $k == weight{
font-#{$k}:#{$c}
}@else{
#{$k}:#{$c}
}
}
@each $key, $child in $uni-headings {
/* #ifndef APP-NVUE */
.uni-#{$key} {
@each $k, $c in $child {
@include get-styles($k,$c)
}
}
/* #endif */
/* #ifdef APP-NVUE */
.container .uni-#{$key} {
@each $k, $c in $child {
@include get-styles($k,$c)
}
}
/* #endif */
}

@ -0,0 +1,146 @@
// @use "sass:math";
@import '../tools/functions.scss';
//
$uni-space-root: 2 !default;
//
$uni-radius-root:5px !default;
$uni-radius: () !default;
//
$uni-radius: map-deep-merge(
(
0: 0,
// TODO sm
// 'sm': math.div($uni-radius-root, 2),
null: $uni-radius-root,
'lg': $uni-radius-root * 2,
'xl': $uni-radius-root * 6,
'pill': 9999px,
'circle': 50%
),
$uni-radius
);
//
$body-font-family: 'Roboto', sans-serif !default;
//
$heading-font-family: $body-font-family !default;
$uni-headings: () !default;
$letterSpacing: -0.01562em;
$uni-headings: map-deep-merge(
(
'h1': (
size: 32px,
weight: 300,
line-height: 50px,
// letter-spacing:-0.01562em
),
'h2': (
size: 28px,
weight: 300,
line-height: 40px,
// letter-spacing: -0.00833em
),
'h3': (
size: 24px,
weight: 400,
line-height: 32px,
// letter-spacing: normal
),
'h4': (
size: 20px,
weight: 400,
line-height: 30px,
// letter-spacing: 0.00735em
),
'h5': (
size: 16px,
weight: 400,
line-height: 24px,
// letter-spacing: normal
),
'h6': (
size: 14px,
weight: 500,
line-height: 18px,
// letter-spacing: 0.0125em
),
'subtitle': (
size: 12px,
weight: 400,
line-height: 20px,
// letter-spacing: 0.00937em
),
'body': (
font-size: 14px,
font-weight: 400,
line-height: 22px,
// letter-spacing: 0.03125em
),
'caption': (
'size': 12px,
'weight': 400,
'line-height': 20px,
// 'letter-spacing': 0.03333em,
// 'text-transform': false
)
),
$uni-headings
);
//
$uni-primary: #2979ff !default;
$uni-primary-disable:lighten($uni-primary,20%) !default;
$uni-primary-light: lighten($uni-primary,25%) !default;
//
// 使
$uni-success: #18bc37 !default;
$uni-success-disable:lighten($uni-success,20%) !default;
$uni-success-light: lighten($uni-success,25%) !default;
$uni-warning: #f3a73f !default;
$uni-warning-disable:lighten($uni-warning,20%) !default;
$uni-warning-light: lighten($uni-warning,25%) !default;
$uni-error: #e43d33 !default;
$uni-error-disable:lighten($uni-error,20%) !default;
$uni-error-light: lighten($uni-error,25%) !default;
$uni-info: #8f939c !default;
$uni-info-disable:lighten($uni-info,20%) !default;
$uni-info-light: lighten($uni-info,25%) !default;
//
//
$uni-main-color: #3a3a3a !default; //
$uni-base-color: #6a6a6a !default; //
$uni-secondary-color: #909399 !default; //
$uni-extra-color: #c7c7c7 !default; //
//
$uni-border-1: #F0F0F0 !default;
$uni-border-2: #EDEDED !default;
$uni-border-3: #DCDCDC !default;
$uni-border-4: #B9B9B9 !default;
//
$uni-black: #000000 !default;
$uni-white: #ffffff !default;
$uni-transparent: rgba($color: #000000, $alpha: 0) !default;
//
$uni-bg-color: #f7f7f7 !default;
/* 水平间距 */
$uni-spacing-sm: 8px !default;
$uni-spacing-base: 15px !default;
$uni-spacing-lg: 30px !default;
//
$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5) !default;
$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default;
$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5) !default;
//
$uni-mask: rgba($color: #000000, $alpha: 0.4) !default;

@ -0,0 +1,19 @@
// map
@function map-deep-merge($parent-map, $child-map){
$result: $parent-map;
@each $key, $child in $child-map {
$parent-has-key: map-has-key($result, $key);
$parent-value: map-get($result, $key);
$parent-type: type-of($parent-value);
$child-type: type-of($child);
$parent-is-map: $parent-type == map;
$child-is-map: $child-type == map;
@if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){
$result: map-merge($result, ( $key: $child ));
}@else {
$result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) ));
}
}
@return $result;
};

@ -0,0 +1,31 @@
//
$uni-space-root: 2;
//
$uni-radius-root:5px;
//
$uni-primary: #2979ff;
//
$uni-success: #4cd964;
//
$uni-warning: #f0ad4e;
//
$uni-error: #dd524d;
//
$uni-info: #909399;
//
$uni-main-color: #303133;
$uni-base-color: #606266;
$uni-secondary-color: #909399;
$uni-extra-color: #C0C4CC;
//
$uni-bg-color: #f5f5f5;
//
$uni-border-1: #DCDFE6;
$uni-border-2: #E4E7ED;
$uni-border-3: #EBEEF5;
$uni-border-4: #F2F6FC;
//
$uni-black: #000000;
$uni-white: #ffffff;
$uni-transparent: rgba($color: #000000, $alpha: 0);

@ -0,0 +1,62 @@
@import './styles/setting/_variables.scss';
//
$uni-space-root: 2;
//
$uni-radius-root:5px;
//
$uni-primary: #2979ff;
$uni-primary-disable:mix(#fff,$uni-primary,50%);
$uni-primary-light: mix(#fff,$uni-primary,80%);
//
// 使
$uni-success: #18bc37;
$uni-success-disable:mix(#fff,$uni-success,50%);
$uni-success-light: mix(#fff,$uni-success,80%);
$uni-warning: #f3a73f;
$uni-warning-disable:mix(#fff,$uni-warning,50%);
$uni-warning-light: mix(#fff,$uni-warning,80%);
$uni-error: #e43d33;
$uni-error-disable:mix(#fff,$uni-error,50%);
$uni-error-light: mix(#fff,$uni-error,80%);
$uni-info: #8f939c;
$uni-info-disable:mix(#fff,$uni-info,50%);
$uni-info-light: mix(#fff,$uni-info,80%);
//
//
$uni-main-color: #3a3a3a; //
$uni-base-color: #6a6a6a; //
$uni-secondary-color: #909399; //
$uni-extra-color: #c7c7c7; //
//
$uni-border-1: #F0F0F0;
$uni-border-2: #EDEDED;
$uni-border-3: #DCDCDC;
$uni-border-4: #B9B9B9;
//
$uni-black: #000000;
$uni-white: #ffffff;
$uni-transparent: rgba($color: #000000, $alpha: 0);
//
$uni-bg-color: #f7f7f7;
/* 水平间距 */
$uni-spacing-sm: 8px;
$uni-spacing-base: 15px;
$uni-spacing-lg: 30px;
//
$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5);
$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2);
$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5);
//
$uni-mask: rgba($color: #000000, $alpha: 0.4);

File diff suppressed because one or more lines are too long

@ -2,9 +2,17 @@
import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'
import path from 'path'
import { visualizer } from 'rollup-plugin-visualizer';
export default defineConfig({
plugins: [uni()],
plugins: [uni(),
visualizer({
open: true, // 构建后自动打开分析页面
gzipSize: true, // 显示gzip压缩后体积
brotliSize: true, // 显示brotli压缩后体积
filename: 'stats.html', // 输出文件名
template: 'treemap' // 可选模板sunburst/flamegraph/network等:ml-citation{ref="2,3" data="citationList"}
})
],
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'),

Loading…
Cancel
Save