You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
836 lines
19 KiB
836 lines
19 KiB
<!--作业列表-->
|
|
<template>
|
|
<view class="main_section">
|
|
|
|
<scroll-view class="section_3" scroll-y="true" :lower-threshold="lowerThreshold" @scrolltolower="loadMoreData"
|
|
style="height: 80vh;">
|
|
<view class="ul">
|
|
<view class="li" v-for="(v,k) in tableList" :key="k" @click="openViewWorkDetails(v)">
|
|
<!-- <view class="left_box">
|
|
<view class="date_box">
|
|
<text>{{v.wc_count}}</text>
|
|
<text>/</text>
|
|
<text>{{v.student_count}}</text>
|
|
</view>
|
|
<view class="ratio">
|
|
完成率：{{v.rate}}%
|
|
</view>
|
|
</view> -->
|
|
<view class="center_box">
|
|
<view>班级：{{v.class_name}}</view>
|
|
<view>时间：{{v.create_time}}</view>
|
|
<view>课程：{{v.course_name}}
|
|
</view>
|
|
</view>
|
|
<view class="right_box">
|
|
<view class="tag" v-if="v.status == 1" style="background:#1cd188;">未提交</view>
|
|
<view class="tag" v-if="v.status == 2" style="background:#1cd188;">已提交</view>
|
|
<view class="tag" v-if="v.status == 3" style="background:#1cd188;">待批改</view>
|
|
<view class="tag" v-if="v.status == 4" style="background:#1cd188;">已批改</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
|
|
<!-- 底部发布作业按钮 -->
|
|
<view class="publish-btn" @click="openPublishPopup">
|
|
<text class="btn-text">发布作业</text>
|
|
</view>
|
|
|
|
<!-- 底部导航-->
|
|
<AQTabber />
|
|
|
|
<!-- 发布作业弹窗 -->
|
|
<uni-popup ref="publishPopup" type="center">
|
|
<view class="popup-content">
|
|
<view class="popup-title">发布作业</view>
|
|
<!--
|
|
<view class="form-item">
|
|
<text class="form-label">类型</text>
|
|
<input class="form-input" type="number" v-model="formData.type" placeholder="请输入类型" />
|
|
</view>
|
|
-->
|
|
<view class="form-item">
|
|
<text class="form-label">班级</text>
|
|
<!-- <input class="form-input" type="number" v-model="formData.class_id" placeholder="请输入班级ID" /> -->
|
|
|
|
<picker mode="selector" :range="class_id_options" range-key="name" @change="handleClassChange"
|
|
class="form-picker">
|
|
<view v-if="selectedClassName" class="picker-text">{{ selectedClassName }}</view>
|
|
<view v-else class="picker-placeholder">请选择班级</view>
|
|
</picker>
|
|
</view>
|
|
|
|
|
|
<view class="form-item">
|
|
<text class="form-label">课程</text>
|
|
<!-- <input class="form-input" type="number" v-model="formData.course_id" placeholder="请输入课程" /> -->
|
|
|
|
<picker mode="selector" :range="course_list" range-key="name" @change="handleCourseChange"
|
|
class="form-picker">
|
|
<view v-if="selectedCourseName" class="picker-text">{{ selectedCourseName }}</view>
|
|
<view v-else class="picker-placeholder">请选择课程</view>
|
|
</picker>
|
|
|
|
</view>
|
|
|
|
<view class="form-item">
|
|
<text class="form-label">学生</text>
|
|
<!-- <input class="form-input" type="number" v-model="formData.student_id" placeholder="请输入学生ID" /> -->
|
|
<picker mode="selector" :range="student_list" range-key="name" @change="handleStudentChange"
|
|
class="form-picker">
|
|
<view v-if="selectedStudentName" class="picker-text">{{ selectedStudentName }}</view>
|
|
<view v-else class="picker-placeholder">请选择学生</view>
|
|
</picker>
|
|
</view>
|
|
|
|
<view class="form-item">
|
|
<text class="form-label">作业描述</text>
|
|
<textarea class="form-textarea" v-model="formData.description" placeholder="请输入作业描述" />
|
|
</view>
|
|
|
|
<!-- <view class="form-item">
|
|
<text class="form-label">内容类型</text>
|
|
<picker class="form-picker" :value="contentTypeIndex" :range="contentTypes"
|
|
@change="contentTypeChange">
|
|
<view class="picker-text">{{contentTypes[contentTypeIndex]}}</view>
|
|
</picker>
|
|
</view> -->
|
|
|
|
<!-- 根据内容类型显示不同的上传控件 -->
|
|
<!-- 图片类型 -->
|
|
<!-- <view class="form-item" v-if="formData.content_type === '1'">
|
|
<text class="form-label">上传图片</text>
|
|
<view class="upload-container">
|
|
<view class="image-preview" v-if="uploadedFiles.image">
|
|
<image class="preview-image" :src="uploadedFiles.image" mode="aspectFill"></image>
|
|
<view class="delete-btn" @click="deleteFile('image')">
|
|
<text class="delete-icon">×</text>
|
|
</view>
|
|
</view>
|
|
<view class="upload-btn" v-if="!uploadedFiles.image" @click="chooseFile('image')">
|
|
<text class="upload-icon">+</text>
|
|
<text class="upload-text">上传图片</text>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
|
|
<!-- 视频类型 -->
|
|
<!-- <view class="form-item" v-if="formData.content_type === '2'">
|
|
<text class="form-label">上传视频</text>
|
|
<view class="upload-container">
|
|
<view class="video-preview" v-if="uploadedFiles.video">
|
|
<video class="preview-video" :src="uploadedFiles.video" controls></video>
|
|
<view class="delete-btn" @click="deleteFile('video')">
|
|
<text class="delete-icon">×</text>
|
|
</view>
|
|
</view>
|
|
<view class="upload-btn" v-if="!uploadedFiles.video" @click="chooseFile('video')">
|
|
<text class="upload-icon">+</text>
|
|
<text class="upload-text">上传视频</text>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
|
|
<!-- 文本类型 -->
|
|
<!-- <view class="form-item" v-if="formData.content_type === '3'">
|
|
<text class="form-label">内容文本</text>
|
|
<textarea class="form-textarea" v-model="formData.content_text" placeholder="请输入内容文本" />
|
|
</view> -->
|
|
|
|
<view class="form-buttons">
|
|
<button class="btn-cancel" @click="closePublishPopup">取消</button>
|
|
<button class="btn-submit" @click="submitForm">提交</button>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import memberApi from '@/api/member.js';
|
|
import AQTabber from "@/components/AQ/AQTabber.vue"
|
|
import apiRoute from '@/api/apiRoute.js';
|
|
|
|
export default {
|
|
components: {
|
|
AQTabber,
|
|
},
|
|
data() {
|
|
return {
|
|
loading: false, //加载状态
|
|
lowerThreshold: 100, //距离底部多远触发
|
|
isReachedBottom: false, //防止重复加载|true=不可加载|false=可加载
|
|
|
|
//筛选条件
|
|
filteredData: {
|
|
page: 1, //当前页码
|
|
limit: 10, //每页返回数据条数
|
|
total: 10, //数据总条数
|
|
},
|
|
tableList: [], //数据列表
|
|
|
|
// 发布作业表单数据
|
|
formData: {
|
|
class_id: '',
|
|
course_id: '',
|
|
student_id: '',
|
|
description: '',
|
|
},
|
|
class_id_options: [
|
|
|
|
],
|
|
selectedClassName:'',
|
|
course_list:[],
|
|
selectedCourseName:'',
|
|
student_list:[],
|
|
selectedStudentName:'',
|
|
// 内容类型选择器
|
|
contentTypes: ['图片', '视频', '文本'],
|
|
contentTypeIndex: 0,
|
|
|
|
// 上传的文件
|
|
uploadedFiles: {
|
|
image: '',
|
|
video: ''
|
|
},
|
|
|
|
// 模拟数据
|
|
mockData: []
|
|
}
|
|
},
|
|
onLoad() {
|
|
|
|
},
|
|
onShow() {
|
|
this.init()
|
|
// this.getData()
|
|
},
|
|
methods: {
|
|
handleClassChange(e) {
|
|
const index = e.detail.value;
|
|
const selectedClass = this.class_id_options[index];
|
|
this.formData.class_id = selectedClass.id;
|
|
this.selectedClassName = selectedClass.name;
|
|
},
|
|
|
|
handleCourseChange(e) {
|
|
const index = e.detail.value;
|
|
const selectedCourse = this.course_list[index];
|
|
this.formData.course_id = selectedCourse.id;
|
|
this.selectedCourseName = selectedCourse.name;
|
|
},
|
|
handleStudentChange(e) {
|
|
const index = e.detail.value;
|
|
const selectedStudent = this.student_list[index];
|
|
this.formData.student_id = selectedStudent.id;
|
|
this.selectedStudentName = selectedStudent.name;
|
|
},
|
|
async getClassList() {
|
|
let params = {
|
|
status: 1, //班级状态(1开启 2关闭)
|
|
}
|
|
|
|
let res = await apiRoute.common_getClassAll(params)
|
|
if (res.code != 1) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
console.log('班级列表', res.data)
|
|
let arr = []
|
|
res.data.forEach((v, k) => {
|
|
arr.push({
|
|
name: `${v.campus_name}-${v.class_name}`,
|
|
id: v.id,
|
|
})
|
|
})
|
|
this.class_id_options = arr
|
|
this.getCourseList()
|
|
},
|
|
async getCourseList() {
|
|
|
|
let res = await apiRoute.common_getCourseAll({})
|
|
if (res.code != 1) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
let arr = []
|
|
res.data.forEach((v, k) => {
|
|
arr.push({
|
|
name: `${v.course_name}`,
|
|
id: v.id,
|
|
})
|
|
})
|
|
this.course_list = arr
|
|
this.getStudentList()
|
|
},
|
|
async getStudentList() {
|
|
|
|
let res = await apiRoute.jlGetStudentList({})
|
|
if (res.code != 1) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
let arr = []
|
|
res.data.forEach((v, k) => {
|
|
arr.push({
|
|
name: `${v.name}`,
|
|
id: v.id,
|
|
})
|
|
})
|
|
this.student_list = arr
|
|
},
|
|
|
|
async init() {
|
|
this.getList()
|
|
},
|
|
async getData() {
|
|
this.getClassList()
|
|
},
|
|
|
|
//加载更多(下一页)
|
|
loadMoreData() {
|
|
//判断是否加载
|
|
if (!this.isReachedBottom) {
|
|
this.isReachedBottom = true; //设置为不可请求状态
|
|
this.getList();
|
|
}
|
|
},
|
|
//重置为第一页
|
|
async resetFilteredData() {
|
|
this.isReachedBottom = false; // 重置状态，以便下次触发加载更多
|
|
|
|
this.filteredData.page = 1 //当前页码
|
|
this.filteredData.limit = 10 //每页返回数据条数
|
|
this.filteredData.total = 10 //数据总条数
|
|
},
|
|
//获取列表
|
|
async getList() {
|
|
this.loading = true
|
|
|
|
let data = {
|
|
...this.filteredData
|
|
}
|
|
|
|
//判断是否还有数据
|
|
if ((this.filteredData.page - 1) * this.filteredData.limit >= this.filteredData.total) {
|
|
this.loading = false
|
|
uni.showToast({
|
|
title: '暂无更多',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
if (data.page == 1) {
|
|
this.tableList = []
|
|
}
|
|
|
|
let res = await memberApi.jsGetAssignmentsList(data)
|
|
this.loading = false
|
|
this.isReachedBottom = false;
|
|
if (res.code != 1) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
this.tableList = this.tableList.concat(res.data.data); // 使用 concat 方法 将新数据追加到数组中
|
|
|
|
console.log('列表', this.tableList)
|
|
this.filteredData.total = res.data.total
|
|
this.filteredData.page++
|
|
|
|
this.getData()
|
|
},
|
|
|
|
//跳转页面-作业详情
|
|
openViewWorkDetails(item) {
|
|
let id = item.id
|
|
this.$navigateTo({
|
|
url: `/pages/coach/student/work_details?id=${id}`
|
|
})
|
|
},
|
|
|
|
// 打开发布作业弹窗
|
|
openPublishPopup() {
|
|
this.$refs.publishPopup.open()
|
|
},
|
|
|
|
// 关闭发布作业弹窗
|
|
closePublishPopup() {
|
|
this.$refs.publishPopup.close()
|
|
},
|
|
|
|
// 内容类型选择器变化
|
|
contentTypeChange(e) {
|
|
this.contentTypeIndex = e.detail.value
|
|
this.formData.content_type = String(parseInt(e.detail.value) + 1)
|
|
},
|
|
|
|
// 选择文件（图片或视频）
|
|
chooseFile(type) {
|
|
if (type === 'image') {
|
|
// 选择图片
|
|
uni.chooseImage({
|
|
count: 1,
|
|
sizeType: ['compressed'],
|
|
sourceType: ['album', 'camera'],
|
|
success: (res) => {
|
|
// 模拟上传
|
|
uni.showLoading({
|
|
title: '上传中...'
|
|
})
|
|
|
|
setTimeout(() => {
|
|
uni.hideLoading()
|
|
this.uploadedFiles.image = res.tempFilePaths[0]
|
|
|
|
// 模拟上传成功
|
|
uni.showToast({
|
|
title: '图片上传成功',
|
|
icon: 'success'
|
|
})
|
|
|
|
// 设置内容文本为图片路径
|
|
this.formData.content_text = res.tempFilePaths[0]
|
|
}, 1000)
|
|
}
|
|
})
|
|
} else if (type === 'video') {
|
|
// 选择视频
|
|
uni.chooseVideo({
|
|
count: 1,
|
|
sourceType: ['album', 'camera'],
|
|
maxDuration: 60,
|
|
camera: 'back',
|
|
success: (res) => {
|
|
// 模拟上传
|
|
uni.showLoading({
|
|
title: '上传中...'
|
|
})
|
|
|
|
setTimeout(() => {
|
|
uni.hideLoading()
|
|
this.uploadedFiles.video = res.tempFilePath
|
|
|
|
// 模拟上传成功
|
|
uni.showToast({
|
|
title: '视频上传成功',
|
|
icon: 'success'
|
|
})
|
|
|
|
// 设置内容文本为视频路径
|
|
this.formData.content_text = res.tempFilePath
|
|
}, 1500)
|
|
}
|
|
})
|
|
}
|
|
},
|
|
|
|
// 删除已上传的文件
|
|
deleteFile(type) {
|
|
if (type === 'image') {
|
|
this.uploadedFiles.image = ''
|
|
this.formData.content_text = ''
|
|
} else if (type === 'video') {
|
|
this.uploadedFiles.video = ''
|
|
this.formData.content_text = ''
|
|
}
|
|
},
|
|
|
|
// 预览文件
|
|
previewFile(type) {
|
|
if (type === 'image' && this.uploadedFiles.image) {
|
|
uni.previewImage({
|
|
urls: [this.uploadedFiles.image]
|
|
})
|
|
}
|
|
// 视频不需要额外预览，因为已经有视频播放器
|
|
},
|
|
|
|
// 提交表单
|
|
async submitForm() {
|
|
// 检查必填项
|
|
if (!this.formData.class_id) {
|
|
uni.showToast({
|
|
title: '请输入班级ID',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
if (!this.formData.course_id) {
|
|
uni.showToast({
|
|
title: '请输入课程ID',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
if (!this.formData.description) {
|
|
uni.showToast({
|
|
title: '请输入作业描述',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
// 检查内容
|
|
// if (this.formData.content_type === '1' && !this.uploadedFiles.image) {
|
|
// uni.showToast({
|
|
// title: '请上传图片',
|
|
// icon: 'none'
|
|
// })
|
|
// return
|
|
// }
|
|
|
|
// if (this.formData.content_type === '2' && !this.uploadedFiles.video) {
|
|
// uni.showToast({
|
|
// title: '请上传视频',
|
|
// icon: 'none'
|
|
// })
|
|
// return
|
|
// }
|
|
|
|
// if (this.formData.content_type === '3' && !this.formData.content_text) {
|
|
// uni.showToast({
|
|
// title: '请输入内容文本',
|
|
// icon: 'none'
|
|
// })
|
|
// return
|
|
// }
|
|
|
|
|
|
|
|
let res = await apiRoute.jlPublishJob(this.formData)
|
|
if (res.code != 1) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
|
|
uni.showToast({
|
|
title: '发布成功',
|
|
icon: 'success'
|
|
})
|
|
|
|
// 关闭弹窗
|
|
this.closePublishPopup()
|
|
|
|
// 重置表单
|
|
this.formData = {
|
|
class_id: '',
|
|
course_id: '',
|
|
student_id: '',
|
|
description: '',
|
|
}
|
|
|
|
this.init()
|
|
// this.contentTypeIndex = 0
|
|
// this.uploadedFiles = {
|
|
// image: '',
|
|
// video: ''
|
|
// }
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.main_section {
|
|
min-height: 100vh;
|
|
background: #292929 100%;
|
|
padding: 0 24rpx;
|
|
padding-top: 40rpx;
|
|
padding-bottom: 150rpx;
|
|
font-size: 28rpx;
|
|
|
|
.section_3 {
|
|
margin-top: 36rpx;
|
|
color: #fff;
|
|
font-size: 24rpx;
|
|
|
|
.title_box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.top_box {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
text {
|
|
font-size: 30rpx;
|
|
}
|
|
}
|
|
|
|
.line {
|
|
width: 90rpx;
|
|
height: 2px;
|
|
background: #29D3B4;
|
|
}
|
|
}
|
|
|
|
.ul {
|
|
margin-top: 30rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 20rpx;
|
|
|
|
.li {
|
|
position: relative;
|
|
border-radius: 22rpx;
|
|
background: #434544 100%;
|
|
padding: 14rpx 0;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.left_box {
|
|
margin-left: 28rpx;
|
|
width: 146rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10rpx;
|
|
|
|
.date_box {
|
|
display: flex;
|
|
font-size: 48rpx;
|
|
|
|
text:nth-child(1) {
|
|
color: #29D3B4;
|
|
}
|
|
}
|
|
|
|
.ratio {
|
|
color: #AAAAAA;
|
|
}
|
|
}
|
|
|
|
.center_box {
|
|
margin-left: 52rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10rpx;
|
|
}
|
|
|
|
.right_box {
|
|
.tag {
|
|
position: absolute;
|
|
top: 0rpx;
|
|
right: 0rpx;
|
|
padding: 10rpx;
|
|
width: 102rpx;
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
border-bottom-left-radius: 20rpx;
|
|
border-top-right-radius: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 发布作业按钮样式
|
|
.publish-btn {
|
|
position: fixed;
|
|
bottom: 220rpx;
|
|
right: 40rpx;
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
background: #29D3B4;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
box-shadow: 0 4rpx 20rpx rgba(41, 211, 180, 0.4);
|
|
z-index: 99;
|
|
|
|
.btn-text {
|
|
color: #fff;
|
|
font-size: 26rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
// 弹窗内容样式
|
|
.popup-content {
|
|
width: 650rpx;
|
|
background: #333;
|
|
border-radius: 20rpx;
|
|
padding: 30rpx;
|
|
max-height: 80vh;
|
|
overflow-y: auto;
|
|
|
|
.popup-title {
|
|
font-size: 36rpx;
|
|
color: #fff;
|
|
text-align: center;
|
|
margin-bottom: 30rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.form-item {
|
|
margin-bottom: 20rpx;
|
|
|
|
.form-label {
|
|
display: block;
|
|
color: #fff;
|
|
font-size: 28rpx;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
|
|
.form-input,
|
|
.form-textarea,
|
|
.form-picker {
|
|
width: 100%;
|
|
background: #444;
|
|
border-radius: 10rpx;
|
|
padding: 16rpx;
|
|
color: #fff;
|
|
font-size: 28rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.form-textarea {
|
|
height: 150rpx;
|
|
}
|
|
|
|
.picker-text {
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
}
|
|
|
|
// 上传控件样式
|
|
.upload-container {
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.upload-btn {
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
background: #444;
|
|
border-radius: 10rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border: 1px dashed #666;
|
|
|
|
.upload-icon {
|
|
font-size: 60rpx;
|
|
color: #29D3B4;
|
|
line-height: 60rpx;
|
|
}
|
|
|
|
.upload-text {
|
|
font-size: 24rpx;
|
|
color: #aaa;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
|
|
// 图片预览
|
|
.image-preview {
|
|
position: relative;
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
border-radius: 10rpx;
|
|
overflow: hidden;
|
|
|
|
.preview-image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.delete-btn {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
background: rgba(0, 0, 0, 0.6);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
.delete-icon {
|
|
color: #fff;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 视频预览
|
|
.video-preview {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 300rpx;
|
|
border-radius: 10rpx;
|
|
overflow: hidden;
|
|
|
|
.preview-video {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.delete-btn {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
background: rgba(0, 0, 0, 0.6);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
.delete-icon {
|
|
color: #fff;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.form-buttons {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top: 40rpx;
|
|
|
|
button {
|
|
width: 45%;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
border-radius: 40rpx;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.btn-cancel {
|
|
background: #555;
|
|
color: #fff;
|
|
}
|
|
|
|
.btn-submit {
|
|
background: #29D3B4;
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|