提交 4b27f50d authored 作者: 刘旭's avatar 刘旭

初步完成前端页面

上级
# Windows
[Dd]esktop.ini
Thumbs.db
$RECYCLE.BIN/
# macOS
.DS_Store
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
# Node.js
node_modules/
dist
.git
.idea
.hbuilderx
*.iml
pnpm-lock.yaml
# 默认忽略的文件
/shelf/
/workspace.xml
# 基于编辑器的 HTTP 客户端请求
/httpRequests/
# mini-shop
#### Description
基于uniapp构建的小程序商城
#### Software Architecture
Software architecture description
#### Installation
1. xxxx
2. xxxx
3. xxxx
#### Instructions
1. xxxx
2. xxxx
3. xxxx
#### Contribution
1. Fork the repository
2. Create Feat_xxx branch
3. Commit your code
4. Create Pull Request
# mini-shop
#### 介绍
永兴达h5商城项目
#### 软件架构
uniapp(vue3) + vite + typescript + uni-ui
#### 安装教程
1. xxxx
2. xxxx
3. xxxx
#### 使用说明
1. xxxx
2. xxxx
3. xxxx
#### 参与贡献
1. Fork 本仓库
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request
[core]
bare = true
repositoryformatversion = 0
filemode = false
symlinks = false
ignorecase = true
Unnamed repository; edit this file 'description' to name the repository.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="" type="png/x-icon" />
<link rel="stylesheet" href="./src/static/iconfont/iconfont.css" />
<script>
var coverSupport =
'CSS' in window &&
typeof CSS.supports === 'function' &&
(CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
document.write(
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
(coverSupport ? ', viewport-fit=cover' : '') +
'" />'
)
</script>
</head>
<page>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</page>
</html>
{
"name": "XBRLPX-h5",
"version": "0.0.0",
"scripts": {
"dev": "yarn dev:h5",
"dev:h5": "uni preview --open",
"dev:h5:ssr": "uni --ssr",
"dev:mp-weixin": "uni -p mp-weixin",
"build:app": "uni build -p app",
"build:h5": "uni build",
"build:h5:ssr": "uni build --ssr",
"build:mp-weixin": "uni build -p mp-weixin"
},
"dependencies": {
"@dcloudio/uni-app": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-app-plus": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-components": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-h5": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-mp-alipay": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-mp-baidu": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-mp-kuaishou": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-mp-lark": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-mp-qq": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-mp-toutiao": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-mp-weixin": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-quickapp-webview": "3.0.0-alpha-3061620221230002",
"dayjs": "^1.11.8",
"node-sass": "^7.0.1",
"pinia": "^2.0.21",
"pinia-plugin-persistedstate": "^3.1.0",
"vite-plugin-mkcert": "^1.16.0",
"vk-uview-ui": "^1.4.8",
"vue": "^3.2.45",
"vue-i18n": "^9.1.9"
},
"devDependencies": {
"@dcloudio/types": "^3.2.7",
"@dcloudio/uni-automator": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-cli-shared": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-stacktracey": "3.0.0-alpha-3061620221230002",
"@dcloudio/uni-ui": "^1.4.20",
"@dcloudio/vite-plugin-uni": "3.0.0-alpha-3061620221230002",
"@types/node": "^18.7.14",
"@vue/tsconfig": "^0.1.3",
"sass": "^1.54.8",
"sass-loader": "^13.0.2",
"typescript": "^4.9.4",
"unplugin-auto-import": "^0.16.6",
"unplugin-vue-components": "^0.25.1",
"vite": "4.0.4",
"vite-plugin-svg-icons": "^2.0.1"
}
}
<script setup lang="ts">
import { onLaunch, onShow, onHide } from '@dcloudio/uni-app';
</script>
<style lang="scss">
@import './static/iconfont.css';
@import './scss/common.scss';
@import "vk-uview-ui/index.scss";
.uni-tabbar {
max-width: 420px;
margin: 0 auto;
border-left: #f6f6f6 solid 1px;
border-right: #f6f6f6 solid 1px;
}
page {
background: #f5f5f5;
}
</style>
<template>
<!-- <headers title='考勤地点设置' />
<view class="map" :style="{ height: mapState.windowHeight * 0.5 + 'px', top: mapState.searchStatus ? '-10%' : 0 }">
<map :longitude="mapState.longitude" :latitude="mapState.latitude" :show-location="true">
<view class="cotrons">
<u-button size="mini" type="primary">完成</u-button>
</view>
</map>
</view>
<view class="addr"
:style="{ height: mapState.windowHeight * 0.7 + 'px', top: mapState.searchStatus ? '50%' : '30%' }">
<uni-search-bar placeholder="课程名称/班级名称" clearButton="auto" @confirm="search" @focus="onFocus"
@cancel="onCancel" />
</view> -->
</template>
<script setup lang='ts'>
// import headers from '@/components/header/index.vue'
// import QQMapWX from '@/utils/qqmap-wx-jssdk'
// import { jsonp } from '@/utils/util';
// new QQMapWX({
// key: '3M5BZ-SFCRJ-AHSF7-XRA5Q-Y6NIJ-DXBH4' // 必填
// });
// const flag = ref(true)
// const mapState = reactive({
// windowWidth: uni.getSystemInfoSync().windowWidth,
// windowHeight: uni.getSystemInfoSync().windowHeight,
// searchStatus: true,
// longitude: '139.7902',
// latitude: '35.6513',
// markers: [
// {
// id: "gyqy",
// latitude: "29.595587852178966",
// longitude: "106.22169495575275",
// title: "企业",
// iconPath: "./images/map/currentPos.png",
// },
// ] as any,
// })
// //触发关键词输入提示事件
// const getsuggest = (e?: any) => {
// uni.getLocation({
// type: 'gcj02',
// success: function (res) {
// console.log('当前位置的经度:' + res.longitude);
// console.log('当前位置的纬度:' + res.latitude);
// }
// });
// // console.log("e", e.detail.value)
// let url = 'https://apis.map.qq.com/ws/place/v1/suggestion/?keyword=';
// jsonp(url, {
// key: '3M5BZ-SFCRJ-AHSF7-XRA5Q-Y6NIJ-DXBH4',
// keyword: '湖南',
// output: 'jsonp'
// }).then((res: any) => {
// console.log("jsonp", res)
// var sug = [];
// // for (var i = 0; i < res.data.length; i++) {
// // sug.push({ // 获取返回结果,放到sug数组中
// // title: res.data[i].title,
// // id: res.data[i].id,
// // addr: res.data[i].address,
// // city: res.data[i].city,
// // district: res.data[i].district,
// // latitude: res.data[i].location.lat,
// // longitude: res.data[i].location.lng
// // });
// // }
// })
// }
// // getsuggest()
// const search = () => {
// }
// const onFocus = () => {
// mapState.searchStatus = false
// }
// const onCancel = () => {
// mapState.searchStatus = true
// }
// const init = () => {
// uni.getLocation({
// type: 'gcj02',
// success: function (res: any) {
// console.log('当前位置的经度:' + res.longitude);
// console.log('当前位置的纬度:' + res.latitude);
// setTimeout(function () {
// mapState.longitude = res.longitude
// mapState.latitude = res.latitude
// }, 2000);
// // console.log(mapState);
// }
// });
// }
// onMounted(() => {
// init()
// })
// </script>
// <style lang="scss" scoped>
// .map {
// width: 100%;
// transition: height .3s;
// map {
// width: 100%;
// height: 100%;
// }
// .cotrons {
// text-align: end;
// padding: 20rpx;
// }
// }
// .addr {
// position: fixed;
// bottom: 0;
// width: 100%;
// background-color: #ffffff;
// // height: 500px;
// padding: 10rpx;
// transition: height .3s;
// border-top-left-radius: 20rpx;
// border-top-right-radius: 20rpx;
// }
//
</style>
\ No newline at end of file
import request from '@/utils/request'
// 登录
export const login = (data: any) => request('/lowcodeplatform-system/auth/login/app', 'POST', data)
/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// noinspection JSUnusedGlobalSymbols
// Generated by unplugin-auto-import
export {}
declare global {
const EffectScope: typeof import('vue')['EffectScope']
const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
const computed: typeof import('vue')['computed']
const createApp: typeof import('vue')['createApp']
const createPinia: typeof import('pinia')['createPinia']
const customRef: typeof import('vue')['customRef']
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
const defineComponent: typeof import('vue')['defineComponent']
const defineStore: typeof import('pinia')['defineStore']
const effectScope: typeof import('vue')['effectScope']
const getActivePinia: typeof import('pinia')['getActivePinia']
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
const getCurrentScope: typeof import('vue')['getCurrentScope']
const h: typeof import('vue')['h']
const inject: typeof import('vue')['inject']
const isProxy: typeof import('vue')['isProxy']
const isReactive: typeof import('vue')['isReactive']
const isReadonly: typeof import('vue')['isReadonly']
const isRef: typeof import('vue')['isRef']
const mapActions: typeof import('pinia')['mapActions']
const mapGetters: typeof import('pinia')['mapGetters']
const mapState: typeof import('pinia')['mapState']
const mapStores: typeof import('pinia')['mapStores']
const mapWritableState: typeof import('pinia')['mapWritableState']
const markRaw: typeof import('vue')['markRaw']
const nextTick: typeof import('vue')['nextTick']
const onActivated: typeof import('vue')['onActivated']
const onAddToFavorites: typeof import('@dcloudio/uni-app')['onAddToFavorites']
const onBackPress: typeof import('@dcloudio/uni-app')['onBackPress']
const onBeforeMount: typeof import('vue')['onBeforeMount']
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
const onDeactivated: typeof import('vue')['onDeactivated']
const onError: typeof import('@dcloudio/uni-app')['onError']
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
const onHide: typeof import('@dcloudio/uni-app')['onHide']
const onLaunch: typeof import('@dcloudio/uni-app')['onLaunch']
const onLoad: typeof import('@dcloudio/uni-app')['onLoad']
const onMounted: typeof import('vue')['onMounted']
const onNavigationBarButtonTap: typeof import('@dcloudio/uni-app')['onNavigationBarButtonTap']
const onNavigationBarSearchInputChanged: typeof import('@dcloudio/uni-app')['onNavigationBarSearchInputChanged']
const onNavigationBarSearchInputClicked: typeof import('@dcloudio/uni-app')['onNavigationBarSearchInputClicked']
const onNavigationBarSearchInputConfirmed: typeof import('@dcloudio/uni-app')['onNavigationBarSearchInputConfirmed']
const onNavigationBarSearchInputFocusChanged: typeof import('@dcloudio/uni-app')['onNavigationBarSearchInputFocusChanged']
const onPageNotFound: typeof import('@dcloudio/uni-app')['onPageNotFound']
const onPageScroll: typeof import('@dcloudio/uni-app')['onPageScroll']
const onPullDownRefresh: typeof import('@dcloudio/uni-app')['onPullDownRefresh']
const onReachBottom: typeof import('@dcloudio/uni-app')['onReachBottom']
const onReady: typeof import('@dcloudio/uni-app')['onReady']
const onRenderTracked: typeof import('vue')['onRenderTracked']
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
const onResize: typeof import('@dcloudio/uni-app')['onResize']
const onScopeDispose: typeof import('vue')['onScopeDispose']
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
const onShareAppMessage: typeof import('@dcloudio/uni-app')['onShareAppMessage']
const onShareTimeline: typeof import('@dcloudio/uni-app')['onShareTimeline']
const onShow: typeof import('@dcloudio/uni-app')['onShow']
const onTabItemTap: typeof import('@dcloudio/uni-app')['onTabItemTap']
const onThemeChange: typeof import('@dcloudio/uni-app')['onThemeChange']
const onUnhandledRejection: typeof import('@dcloudio/uni-app')['onUnhandledRejection']
const onUnload: typeof import('@dcloudio/uni-app')['onUnload']
const onUnmounted: typeof import('vue')['onUnmounted']
const onUpdated: typeof import('vue')['onUpdated']
const provide: typeof import('vue')['provide']
const reactive: typeof import('vue')['reactive']
const readonly: typeof import('vue')['readonly']
const ref: typeof import('vue')['ref']
const resolveComponent: typeof import('vue')['resolveComponent']
const setActivePinia: typeof import('pinia')['setActivePinia']
const setMapStoreSuffix: typeof import('pinia')['setMapStoreSuffix']
const shallowReactive: typeof import('vue')['shallowReactive']
const shallowReadonly: typeof import('vue')['shallowReadonly']
const shallowRef: typeof import('vue')['shallowRef']
const storeToRefs: typeof import('pinia')['storeToRefs']
const toRaw: typeof import('vue')['toRaw']
const toRef: typeof import('vue')['toRef']
const toRefs: typeof import('vue')['toRefs']
const toValue: typeof import('vue')['toValue']
const triggerRef: typeof import('vue')['triggerRef']
const unref: typeof import('vue')['unref']
const useAttrs: typeof import('vue')['useAttrs']
const useCssModule: typeof import('vue')['useCssModule']
const useCssVars: typeof import('vue')['useCssVars']
const useSlots: typeof import('vue')['useSlots']
const watch: typeof import('vue')['watch']
const watchEffect: typeof import('vue')['watchEffect']
const watchPostEffect: typeof import('vue')['watchPostEffect']
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
}
// for type re-export
declare global {
// @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, InjectionKey, PropType, Ref, VNode } from 'vue'
}
/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// Generated by unplugin-vue-components
// Read more: https://github.com/vuejs/core/pull/3399
export {}
declare module 'vue' {
export interface GlobalComponents {
Header: typeof import('./components/header/index.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SvgIcon: typeof import('./components/svgIcon/index.vue')['default']
}
}
<template>
<u-navbar back-text="" :title="title" :is-back="isBack" :back-icon-name="backIconName" title-color="#000000"
:background="{ background }" title-width="400" height="48" back-icon-color="#000000"
@click-left="handleLeftIconClick">
<template #default>
<u-icon :name="backIconName" :size="22" color="#000000" style="padding: 14rpx 14rpx 14rpx 24rpx;"
@tap="handleLeftIconClick" />
</template>
<template #right>
<u-icon :name="iconName" :size="22" color="#000000" style="padding: 14rpx 14rpx 14rpx 24rpx;"
@tap="handleRight" />
</template>
</u-navbar>
<u-action-sheet :list="sheetState.list" v-model="sheetState.show" @click="onConfirm" />
</template>
<script setup lang='ts'>
const props = defineProps({
title: {
type: String,
default: ''
},
backIconName: {
type: String,
default: 'arrow-left'
},
iconName: {
type: String,
default: 'more-dot-fill'
},
background: {
type: String,
default: '#eeeeee'
},
sheetList: {
type: Object,
default: []
},
isBack: {
type: Boolean,
default: false
}
})
const emits = defineEmits(['handleRight', 'goback'])
const handleRight = () => {
sheetState.show = true
// emits('handleRight')
}
// 点击左侧返回图标
const handleLeftIconClick = () => {
uni.navigateBack()
}
const sheetState = reactive({
list: [{
text: '点赞',
color: 'blue',
fontSize: 28,
subText: '感谢您的点赞'
}, {
text: '分享'
}, {
text: '评论'
}],
show: false
})
const onConfirm = (index: number) => {
const item = sheetState.list[index]
console.log(item);
// switch (item.options.operate) {
// case 'save':
// break;
// }
}
</script>
<style lang = "scss" scoped>
:deep(.u-line-1) {
font-weight: bold !important;
font-size: 16px !important;
}
:deep(.u-icon__icon) {
font-size: 20px !important;
font-weight: bold !important;
}
</style>
\ No newline at end of file
<template>
<svg :style="iconStyle" aria-hidden="true" :fill="iconColor">
<use :xlink:href="symbolId" />
</svg>
</template>
<script lang="ts" setup>
import { computed, CSSProperties } from 'vue';
interface SvgProps {
name: string; // 图标名称 ==> 必传
prefix?: string, // 图标的前缀 ==> 非必传(默认为"icon")
iconStyle?: CSSProperties, // 图标的样式 ==> 非必传
iconColor?: string
}
// 接收父组件参数并设置默认值
// withDefaults 作用是给defineProps绑定默认值的api
const props = withDefaults(defineProps<SvgProps>(), {
prefix: 'icon',
iconStyle: () => ({ width: '23px', height: '23px' }),
iconColor: 'pink'
})
const symbolId = computed(() => `#${props.prefix}-${props.name}`)
</script>
\ No newline at end of file
/// <reference types="vite/client" />
declare module '*.vue' {
import { DefineComponent } from 'vue'
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
const component: DefineComponent<{}, {}, any>
export default component
}
import { createSSRApp } from 'vue'
import App from './App.vue'
import uView from 'vk-uview-ui'
import pinia from './store/useStore'
import 'virtual:svg-icons-register'
export function createApp() {
const app = createSSRApp(App)
app.use(uView)
app.use(pinia)
return {
app
}
}
{
"name" : "wms测试",
"appid" : "__UNI__6D85B85",
"description" : "",
"versionName" : "1.0.1",
"versionCode" : "100",
"transformPx" : false,
/* 5+App特有相关 */
"app-plus" : {
"usingComponents" : true,
"nvueStyleCompiler" : "uni-app",
"compilerVersion" : 3,
"splashscreen" : {
"alwaysShowBeforeRender" : true,
"waiting" : true,
"autoclose" : true,
"delay" : 0
},
"compatible" : {
"ignoreVersion" : true
},
/* 模块配置 */
"modules" : {
"Bluetooth" : {},
"Barcode" : {},
"Geolocation" : {},
"Webview-x5" : {}
},
/* 应用发布信息 */
"distribute" : {
/* android打包配置 */
"android" : {
"permissions" : [
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.BLUETOOTH\"/>",
"<uses-permission android:name=\"android.permission.BLUETOOTH_ADMIN\"/>",
"<uses-permission android:name=\"android.permission.BLUETOOTH_PRIVILEGED\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>",
"<uses-permission android:name=\"android.permission.BLUETOOTH\"/>",
"<uses-permission android:name=\"android.permission.BLUETOOTH_ADMIN\"/>"
],
"minSdkVersion" : 21
},
/* ios打包配置 */
"ios" : {
"dSYMs" : false
},
/* SDK配置 */
"sdkConfigs" : {
"ad" : {},
"geolocation" : {
"system" : {
"__platform__" : [ "android" ]
}
}
}
}
},
/* 快应用特有相关 */
"quickapp" : {},
/* 小程序特有相关 */
"mp-weixin" : {
"appid" : "wx3c4c615b24d3b72b",
"setting" : {
"urlCheck" : false
},
"usingComponents" : true
},
"mp-alipay" : {
"usingComponents" : true
},
"mp-baidu" : {
"usingComponents" : true
},
"mp-toutiao" : {
"usingComponents" : true
},
"uniStatistics" : {
"enable" : false,
"version" : "2"
},
"vueVersion" : "3",
"h5" : {
"template" : "index.html",
"sdkConfigs" : {
"maps" : {
"qqmap" : {
"key" : "3M5BZ-SFCRJ-AHSF7-XRA5Q-Y6NIJ-DXBH4"
}
}
}
}
}
{
"easycom": {
"autoscan": true,
"custom": {
"^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue",
"^u-(.*)": "vk-uview-ui/components/u-$1/u-$1.vue"
}
},
"pages": [
{
"path": "pages/login/index",
"style": {
"navigationBarTitleText": "登录",
"navigationStyle": "custom"
}
},
{
"path": "pages/home/index",
"style": {
"navigationBarTitleText": "主页",
"navigationStyle": "custom"
}
},
{
"path": "pages/class/index",
"style": {
"navigationBarTitleText": "我的班级",
"navigationStyle": "custom"
}
},
{
"path": "pages/class/addressBook",
"style": {
"navigationBarTitleText": "班级通讯录",
"navigationStyle": "custom"
}
},
{
"path": "pages/class/classEvaluate",
"style": {
"navigationBarTitleText": "我的班级",
"navigationStyle": "custom"
}
},
{
"path": "pages/class/evaluate",
"style": {
"navigationBarTitleText": "培训评价",
"navigationStyle": "custom"
}
},
{
"path": "pages/course/index",
"style": {
"navigationBarTitleText": "我的课程",
"navigationStyle": "custom"
}
},
{
"path": "pages/course/seeMore",
"style": {
"navigationBarTitleText": "查看更多",
"navigationStyle": "custom"
}
},
{
"path": "pages/course/attendanceDetails",
"style": {
"navigationBarTitleText": "考勤详情",
"navigationStyle": "custom"
}
},
{
"path": "pages/setPositioning/index",
"style": {
"navigationBarTitleText": "设置考勤定位",
"navigationStyle": "custom"
}
},
{
"path": "pages/setPositioning/map",
"style": {
"navigationBarTitleText": "考勤地点设置",
"navigationStyle": "custom"
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#fff",
"backgroundColor": "#ccc"
}
}
<template>
<headers title='班级通讯录' />
<div class='address-book-item-container'>
<uni-search-bar placeholder="姓名/单位/电话" bgColor="#ffffff" clearButton="auto" cancelButton="none"
@confirm="search" />
<text style="margin-bottom: 20rpx; display: block;">为你找到10个的同学</text>
<view>
<block v-for="(item, i) in 6" :key="i">
<addressBookItem button-title="联系TA" />
</block>
</view>
</div>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import addressBookItem from './components/addressBookItem.vue'
const search = (val: string) => {
console.log('我的同学' + val);
}
</script>
<style lang="scss" scoped>
.address-book-item-container {
padding: 0 30rpx;
.uni-searchbar {
padding: 0;
margin: 20rpx 0;
}
}
</style>
\ No newline at end of file
<template>
<headers title='我的班级' />
<view class='eval-container'>
<u-tabs :list="tabsState.list" :is-scroll="false" v-model="tabsState.current" bg-color="#f5f5f5"
@change="tabsChange" />
<!-- 内容 -->
<view v-if="true">
<!-- 搜索 -->
<uni-search-bar placeholder="班级名称" bgColor="#ffffff" clearButton="auto" cancelButton="none"
@confirm="search" />
<text style="margin-bottom: 20rpx; display: block;">为你找到10个的班级</text>
<view>
<block v-for="(item, i) in 6" :key="i">
<addressBookItem :button-title="buttonTitle" @tapButton="tapButton" />
</block>
</view>
</view>
<view v-else class="empty">
<u-empty text="暂无数据" mode="list"></u-empty>
</view>
</view>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import addressBookItem from './components/addressBookItem.vue'
const tabsState = reactive({
list: [{
name: '已评价'
}, {
name: '未评价'
}],
current: 0
})
const buttonTitle = ref('查看评价')
const tabsChange = (index: number) => {
console.log(index);
if (index) {
buttonTitle.value = ''
} else buttonTitle.value = '查看评价'
}
const search = (val: string) => {
console.log('我的班级' + val);
}
const tapButton = () => {
uni.navigateTo({
url: '/pages/class/evaluate'
})
}
</script>
<style lang="scss" scoped>
.eval-container {
padding: 0 30rpx 30rpx;
.uni-searchbar {
padding: 0;
margin: 20rpx 0;
}
}
</style>
\ No newline at end of file
<template>
<div class='address-book-container'>
<u-card :show-head="false" :show-foot="false" margin="0" border-radius="20">
<template #body>
<view class="address-book-content">
<view class="left">
<u-image width="160rpx" height="160rpx" :src="src"></u-image>
<view class="content">
<h4>刘芳芳</h4>
<text class="tel">15611111111</text>
<text>单位:南山区南山街道办</text>
</view>
</view>
<u-button v-show="buttonTitle" size="mini" type="primary" @tap="tapButton">{{ buttonTitle }}
</u-button>
</view>
</template>
</u-card>
</div>
</template>
<script setup lang='ts'>
import { src } from '@/utils/example';
defineProps({
buttonTitle: String
})
const emits = defineEmits(['tapButton'])
const tapButton = () => {
emits('tapButton')
}
</script>
<style lang="scss" scoped>
.address-book-container {
margin-bottom: 32rpx;
height: 200rpx;
.address-book-content {
display: flex;
justify-content: space-between;
align-items: center;
.left {
display: flex;
.content {
display: flex;
flex-direction: column;
justify-content: flex-end;
margin-left: 20rpx;
.tel {
margin: 20rpx 0;
}
}
}
uni-button {
margin: 0;
}
}
}
</style>
\ No newline at end of file
<template>
<view class='arrange-item-container'>
<h3>{{ arrangeList.date }}</h3>
<u-card :show-head="false" margin="0">
<template #body>
<view class="arrange-header">
<h3>{{ arrangeList.title }}</h3>
<u-button size="mini" plain :type="arrangeStatus.type">{{ arrangeStatus.detail }}</u-button>
</view>
<view class="item">
<u-icon name="account" />
<text>{{ arrangeList.classTeacher }}</text>
</view>
<view class="item">
<u-icon name="map" />
<text>{{ arrangeList.address }}</text>
</view>
</template>
<template #foot>
<view class="arrange-footer">
<u-icon name="order" />
<text>课程安排</text>
</view>
</template>
</u-card>
</view>
</template>
<script setup lang='ts'>
const props = defineProps({
arrangeList: {
type: Array,
default: () => []
} as any
})
const arrangeDetail = ['未开始', '上课中', '已下课']
const arrangeStatus = computed(() => {
const statusObj = {
type: '',
detail: ''
};
switch (props.arrangeList.type) {
case 0:
statusObj.type = 'warning';
break;
case 1:
statusObj.type = 'primary';
break;
case 2:
statusObj.type = 'info';
break;
}
statusObj.detail = arrangeDetail[props.arrangeList.type]
return statusObj;
});
</script>
<style lang="scss" scoped>
.arrange-item-container {
h3 {
margin-bottom: 32rpx;
}
.arrange-header {
display: flex;
justify-content: space-between;
align-items: center;
h3 {
margin: 0;
}
uni-button {
margin: 0;
}
}
.item {
margin: 20rpx 0;
}
.arrange-footer {
text-align: end;
text {
color: #2979ff;
}
}
}
</style>
\ No newline at end of file
<template>
<div class='class-item-container'>
<u-card :show-head="false" margin="0" border-radius="20">
<template #body>
<view class="calss-header">
<h3>{{ classList.title }}</h3>
<!-- <u-button v-show="current == 2" size="mini" type="primary" @tap="toEvaluate">去评价</u-button> -->
</view>
<view class="item">
<text>课程时间:</text>
<text>{{ classList.dateStart }}{{ classList.dateEnd }}</text>
</view>
<view class="item">
<text>教室地点:</text>
<text>{{ classList.address }}</text>
</view>
<view>
</view>
<view class="progress item">
<text>课程进度:</text>
<u-line-progress active-color="#2979ff" :percent="percent" :height="25" />
</view>
<view class="class-teacher item">
<text>班主任:</text>
<u-tag v-for="(item, index) in classList.classTeacher" :key="index" :text="item" shape="circle" />
</view>
</template>
<template #foot>
<view class="class-footer">
<u-button size="mini" plain @tap="toAddressBook">班级通讯录</u-button>
<u-button size="mini" plain>班级二维码</u-button>
<u-button type="primary" size="mini" plain @tap="toClassEvaluate">培训评价</u-button>
</view>
</template>
</u-card>
</div>
</template>
<script setup lang='ts'>
const props = defineProps({
classList: {
type: Array,
default: () => []
} as any,
current: {
type: Number,
default: 0
}
})
const percent = computed(() => {
return props.classList.currentProgress / props.classList.overallProgress * 100
})
const toAddressBook = () => {
uni.navigateTo({
url: '/pages/class/addressBook'
})
}
const toClassEvaluate = () => {
uni.navigateTo({
url: '/pages/class/classEvaluate'
})
}
const toEvaluate = () => {
uni.navigateTo({
url: '/pages/class/evaluate'
})
}
</script>
<style lang="scss" scoped>
.class-item-container {
margin-bottom: 20rpx;
.calss-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16rpx;
h3 {
margin: 0
}
uni-button {
margin: 0;
}
}
.item {
display: flex;
align-items: flex-start;
text {
display: block;
padding: 12rpx 0;
font-size: 32rpx;
}
text:first-child {
width: 160rpx;
}
text:last-child {
flex: 1;
}
}
.progress {
display: flex;
align-items: center;
text {
white-space: nowrap;
}
.registered {
margin-left: 30rpx;
color: #3b99fc;
}
}
.class-teacher {
display: flex;
align-items: center;
.u-tag {
margin-right: 20rpx;
}
}
.class-footer {
width: 100%;
display: flex;
justify-content: end;
uni-button {
margin-left: 30rpx;
margin-right: 0;
}
}
}
</style>
\ No newline at end of file
<template>
<headers title='培训评价' />
<div class='evaluate-container'>
<u-card :show-head="false" :show-foot="false" margin="0" border-radius="20">
<template #body>
<h4>尊敬的各位学员:</h4>
<text class="detail">
感谢您参加本次培训班!请各位学员对此次授课老师及教学安排进行满意度评价,同时我们也欢迎您提出意见和建议,您的感受及观点对我们非常重要谢谢!
</text>
</template>
</u-card>
<u-card :show-head="false" :show-foot="false" margin="0" border-radius="20">
<template #body>
<view>
<view class="rateItem">
<h4>课程内容</h4>
<u-rate :count="5" v-model="rate.content" size="42" />
</view>
<view class="rateItem">
<h4>授课讲师</h4>
<u-rate :count="5" v-model="rate.lecturer" size="42" />
</view>
<view class="rateItem">
<h4>后期服务</h4>
<u-rate :count="5" v-model="rate.postService" size="42" />
</view>
<view class="rateItem">
<h4>班主任服务</h4>
<u-rate :count="5" v-model="rate.teacherService" size="42" />
</view>
</view>
</template>
</u-card>
<u-card :show-head="false" :show-foot="false" margin="0" border-radius="20">
<template #body>
<text>
哪位教师、哪堂课给您留下了深刻印象? 能否告诉我们具体“亮点”?
</text>
<view class="evaluate-textarea">
<u-input v-model="evaluateData.evaluate" type="textarea"
placeholder-style="background-color: #f5f5f5;font-size: 24rpx;overflow-y: auto;" height="200"
maxlength="1400" :auto-height="false" placeholder="快来说说您的想法~" />
</view>
<text style="margin-top: 40rpx;">
您认为还需要补充哪方面的专题课程?
</text>
<view class="evaluate-textarea">
<u-input v-model="evaluateData.evaluate2" type="textarea"
placeholder-style="background-color: #f5f5f5;font-size: 24rpx;overflow-y: auto;" height="160"
maxlength="1400" :auto-height="false" placeholder="快来说说您的想法~" />
</view>
<text style="margin-top: 40rpx;">
您的培训收获与意见建议:
</text>
<view class="evaluate-textarea last">
<u-input v-model="evaluateData.evaluate3" type="textarea"
placeholder-style="background-color: #f5f5f5;font-size: 24rpx;overflow-y: auto;" height="160"
maxlength="1400" :auto-height="false" placeholder="快来说说您的想法~" />
</view>
</template>
</u-card>
<view class="submit">
<u-button type="primary" @tap="submit">确定提交</u-button>
</view>
</div>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
const rate = reactive({
content: 0,
lecturer: 0,
postService: 0,
teacherService: 0,
})
const evaluateData = reactive({
evaluate: '',
evaluate2: '',
evaluate3: ''
})
const submit = () => {
console.log('确定提交');
}
</script>
<style lang="scss" scoped>
.evaluate-container {
padding: 30rpx;
.u-card {
margin-bottom: 10rpx !important;
text {
display: block;
}
.detail {
text-indent: 2em;
display: block;
font-size: 28rpx;
margin-top: 10rpx;
}
.rateItem {
font-size: 28rpx;
display: flex;
align-items: center;
margin-bottom: 20rpx;
text-align: justify;
text-align-last: justify;
/*兼容ie*/
text-justify: distribute-all-lines;
h4 {
width: 140rpx;
margin-right: 20rpx;
}
}
.evaluate-textarea {
background-color: #f5f5f5;
padding: 0 10rpx;
box-sizing: border-box;
margin: 20rpx 0;
}
.last {
margin-bottom: 0;
}
}
}
.submit {
margin: 40rpx 40rpx 0;
}
</style>
\ No newline at end of file
<template>
<headers title='我的班级' />
<view class='class-container'>
<u-tabs :list="tabsState.list" :is-scroll="false" v-model="tabsState.current" bg-color="#f5f5f5"
@change="tabsChange" />
<!-- 内容 -->
<view v-if="classList.length">
<!-- 搜索 -->
<uni-search-bar placeholder="班级名称" bgColor="#ffffff" clearButton="auto" cancelButton="none"
@confirm="search" />
<text style="margin-bottom: 20rpx; display: block;">为你找到10个的班级</text>
<template v-for="(item, index) in classList" :key="index">
<classItem :classList="item" :current="tabsState.current" />
</template>
</view>
<view v-else class="empty">
<u-empty text="暂无数据" mode="list"></u-empty>
</view>
</view>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import classItem from './components/classItem.vue'
const tabsState = reactive({
list: [{
name: '进行中'
}, {
name: '未开课'
},
{
name: '已结课'
}],
current: 0
})
const tabsChange = (index: number) => {
console.log(index);
}
const search = (val: string) => {
console.log('我的班级' + val);
}
const classList = ref([{
title: '党支部书记班',
dateStart: '2022-04-01 09:00', // 课程开始时间
dateEnd: '2022-04-07 09:00', // 课程结束时间
address: '深圳市南山区西丽街道办公室', // 课程地点
overallProgress: 6, // 总进度
currentProgress: 3, // 当前进度
classTeacher: ['郭敬明', '王少龙'] // 班主任
}])
</script>
<style lang="scss" scoped>
.class-container {
padding: 0 30rpx 30rpx;
.uni-searchbar {
padding: 0;
margin: 20rpx 0;
}
}
</style>
\ No newline at end of file
<template>
<headers title='考勤详情' />
<div class='deatils-container'>
<!-- 内容 -->
<!-- 搜索 -->
<uni-search-bar placeholder="课程名称/班级名称" bgColor="#ffffff" clearButton="auto" cancelButton="none"
@confirm="search" />
<view class="tag">
<u-tag v-for="(item, i) in tagList" :key="i" :text="item.name" shape="circle" mode="plain" :type="item.type"
@click="changeTagType(i)" />
</view>
<text style="margin-bottom: 20rpx; display: block;">为你找到10个的班级</text>
<block v-for="(item, index) in 2" :key="index">
<detailsItem :courseList="item" />
</block>
<!-- <view v-else class="empty">
<u-empty text="暂无数据" mode="list" />
</view> -->
</div>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import detailsItem from './components/detailsItem.vue';
const tagList = ref([
{ type: 'primary', name: '全部' },
{ type: 'info', name: '正常' },
{ type: 'info', name: '缺勤' },
{ type: 'info', name: '请假' },
{ type: 'info', name: '补签' }
])
const changeTagType = (index: number) => {
tagList.value.map((item: any, i: number) => {
if (index === i) item.type = 'primary'
else item.type = 'info'
})
}
const search = (val: string) => {
console.log('我的课程' + val);
}
</script>
<style lang="scss" scoped>
.deatils-container {
padding: 0 30rpx 30rpx;
padding-top: 20rpx;
.tag {
margin-bottom: 30rpx;
.u-tag {
margin-right: 20rpx;
}
}
}
</style>
\ No newline at end of file
<template>
<view class='course-item-container'>
<u-card :show-head="false" margin="0">
<template #body>
<view class="course-header">
<h3>{{ courseList.title }}</h3>
<view @tap="openInfo">
<u-icon name="order" size="32" />
<text>课件资料</text>
</view>
</view>
<view class="item">
<u-icon name="account" />
<text>{{ courseList.teacher }}</text>
</view>
<view class="item">
<u-icon name="map" />
<text>{{ courseList.address }}</text>
</view>
<view class="item">
<u-icon name="clock" />
<text>{{ courseList.date }}</text>
</view>
</template>
<template #foot>
<view class="course-footer">
<view>所属班级:{{ courseList.class }}</view>
<view @tap="toSeeMore">
<text>查看更多 </text>
<u-icon name="arrow-right-double" color="#2979ff" size="24" />
</view>
</view>
<u-collapse v-if="current !== 1">
<u-collapse-item title="赏识在于角度的转换">
<template #title-all>
<view class="collapse-item">
<text>出勤情况</text>
<view>
<!-- arrow-up -->
<u-icon name="arrow-down" size="24" />
</view>
</view>
</template>
<template #default>
<u-row gutter="18">
<u-col span="5">
<view class="">应出勤: <text>100</text></view>
</u-col>
<u-col span="7">
<view class="">正常出勤:<text>100</text></view>
</u-col>
<u-col span="5">
<view class="">缺勤:<text>100</text></view>
</u-col>
<u-col span="3.5">
<view class="">请假:<text>100</text></view>
</u-col>
<u-col span="3.5">
<view class="">补签:<text>100</text></view>
</u-col>
</u-row>
<view class="course-collapse-footer">
<view @tap="toAttendanceDetails">
<text>考勤明细 </text>
<u-icon name="arrow-right-double" color="#2979ff" size="24" />
</view>
</view>
</template>
</u-collapse-item>
</u-collapse>
</template>
</u-card>
</view>
<infoPopup v-model:show="infoState.show" />
</template>
<script setup lang='ts'>
import infoPopup from './infoPopup.vue';
const props = defineProps({
courseList: {
type: Array,
default: () => []
} as any,
current: {
type: Number,
default: 0
}
})
const emits = defineEmits(['openInfo'])
const infoState = reactive({
show: false
})
const toSeeMore = () => {
uni.navigateTo({
url: '/pages/course/seeMore'
})
}
const toAttendanceDetails = () => {
uni.navigateTo({
url: '/pages/course/attendanceDetails'
})
}
const openInfo = () => {
infoState.show = true
}
</script>
<style lang="scss" scoped>
.course-item-container {
margin-top: 20rpx;
h3 {
margin-bottom: 32rpx;
}
.course-header {
display: flex;
justify-content: space-between;
align-items: center;
text {
font-size: 32rpx;
color: #2979ff;
}
h3 {
margin: 0;
}
uni-button {
margin: 0;
}
}
.item {
margin: 20rpx 0;
}
.course-footer,
.course-collapse-footer {
display: flex;
justify-content: space-between;
align-items: center;
text {
font-size: 24rpx;
color: #2979ff;
}
}
.course-collapse-footer {
justify-content: center;
align-items: center;
margin-bottom: 10rpx;
}
.u-collapse-item {
background-color: #f3faff;
:deep(.u-collapse-head) {
padding: 0;
margin-top: 30rpx;
}
:deep(.u-collapse-content) {
padding: 20rpx;
}
.collapse-item {
display: flex;
justify-content: space-between;
width: 100%;
padding: 20rpx;
border-radius: 10rpx;
view,
text {
color: #2979ff;
}
}
.u-col {
margin-bottom: 20rpx;
color: $u-main-color;
text {
font-weight: bolder;
font-size: 32rpx;
}
}
.line-content {
display: flex;
}
}
.class-teacher {
display: flex;
align-items: center;
.u-tag {
margin-right: 20rpx;
}
}
.prompt {
font-size: 24rpx;
color: $u-type-info-dark;
}
}
</style>
\ No newline at end of file
<template>
<view class='details-item-container'>
<u-card :show-head="false" :show-foot="false" margin="0">
<template #body>
<view class="details-item-header">
<h4>刘芳芳</h4>
<text>正常出勤</text>
</view>
<view style="margin-bottom: 20rpx;">
<text>15611111111</text>
<u-icon name="phone" style="margin-left: 10rpx;" />
</view>
<u-time-line>
<u-time-line-item>
<template #content>
<view class="line-content">
<text>上课签到:</text>
<view class="content">
<text>已签到</text>
<text style="color: #c0c4cc">(补签原因: 个人原因)</text>
</view>
</view>
</template>
</u-time-line-item>
<u-time-line-item>
<template #content>
<view class="line-content">
<text>上课签到:</text>
<view class="content">
<text>已签到</text>
<text style="color: #c0c4cc">(补签原因: 个人原因)</text>
</view>
</view>
</template>
</u-time-line-item>
</u-time-line>
<view class="footer">
<u-button type="primary" size="mini" plain>请假</u-button>
<u-button type="primary" size="mini">补签</u-button>
</view>
</template>
</u-card>
</view>
</template>
<script setup lang='ts'>
</script>
<style lang="scss" scoped>
.details-item-container {
margin-bottom: 10rpx;
.details-item-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10rpx;
}
.line-content {
display: flex;
}
.footer {
display: flex;
width: 100%;
.u-btn {
width: 47%;
}
}
.content {
display: flex;
flex-direction: column;
}
}
</style>
\ No newline at end of file
<template>
<u-popup v-model="props.show" mode="bottom" closeable height="40%" border-radius="30" @close="handeClose">
<view class="info">
<text class="title">课程资料</text>
<view v-for="(item, i) in 10" class="item">
<view>
<u-icon name="order" size="50"></u-icon>
<text>党性学习第一节课件.pdf</text>
</view>
<view>
<u-icon name="eye-fill" size="50" style="margin-right: 30rpx;"></u-icon>
<u-icon name="download" size="50"></u-icon>
</view>
</view>
</view>
</u-popup>
</template>
<script setup lang='ts'>
const props = defineProps({
show: {
type: Boolean,
default: false
}
})
const emits = defineEmits(['update:show'])
const handeClose = () => {
emits('update:show', false)
}
</script>
<style lang="scss" scoped>
.info {
display: flex;
flex-direction: column;
align-items: center;
padding: 0 30rpx;
.title {
// position: sticky;
// top: 0;
// left: 0;
height: 90rpx;
line-height: 90rpx;
font-size: 32rpx;
font-weight: bolder;
color: $u-main-color;
text-align: center;
width: 100%;
}
.item {
display: flex;
justify-content: space-between;
align-items: center;
background-color: $u-type-info-light;
width: 100%;
height: 100rpx;
padding: 20rpx;
border-radius: 10rpx;
margin-bottom: 20rpx;
view {
display: flex;
align-items: center;
text {
margin-left: 10rpx;
display: block;
font-size: 32rpx;
color: #000000;
}
}
}
}
</style>
\ No newline at end of file
export const inClass = [{
title: '党支部书记班',
date: '2022-04-01 09:00~12:00', // 课程时间
address: '深圳市南山区西丽街道办公室', // 课程地点
teacher: '王少龙', // 老师
class: '党支部培训班',
signInInfo: {
signInStatus: 0, // // 0 点击签到, 1 点击签退, 2 签到成功, 3 xx分钟后签到, 4 未签到, 5 签退成功, 6 未签退
classTime: '09:00', // 上课时间
endClassTime: '12:00', // 下课时间
classTeacher: ['郭敬明', '王少龙'] // 班主任
} // 签到信息
}]
export const notStarted = [{
title: '党支部书记班',
date: '2022-04-01 09:00~12:00', // 课程时间
address: '深圳市南山区西丽街道办公室', // 课程地点
teacher: '王少龙', // 班主任
class: '党支部培训班',
},
{
title: '党支部书记班',
date: '2022-04-01 09:00~12:00', // 课程时间
address: '深圳市南山区西丽街道办公室', // 课程地点
teacher: '王少龙', // 班主任
class: '党支部培训班',
},
{
title: '党支部书记班',
date: '2022-04-01 09:00~12:00', // 课程时间
address: '深圳市南山区西丽街道办公室', // 课程地点
teacher: '王少龙', // 班主任
class: '党支部培训班',
}]
\ No newline at end of file
<template>
<headers title='我的课程' />
<view class='course-container'>
<u-tabs :list="tabsState.list" :is-scroll="false" v-model="tabsState.current" bg-color="#f5f5f5"
@change="tabsChange" />
<!-- 内容 -->
<view v-if="courseList.length">
<!-- 搜索 -->
<uni-search-bar placeholder="班级名称" bgColor="#ffffff" clearButton="auto" cancelButton="none"
@confirm="search" />
<text style="margin-bottom: 20rpx; display: block;">为你找到10个的班级</text>
<block v-for="(item, index) in courseList" :key="index">
<courseItem :courseList="item" :current="tabsState.current" />
</block>
</view>
<view v-else class="empty">
<u-empty text="暂无数据" mode="list" />
</view>
</view>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import courseItem from './components/courseItem.vue';
import { inClass, notStarted } from './demo'
const tabsState = reactive({
list: [{
name: '上课中'
}, {
name: '未开始'
}, {
name: '已下课'
}
],
current: 0
})
const courseList: any = ref(inClass)
const tabsChange = (index: number) => {
if (index) courseList.value = notStarted
else courseList.value = inClass
}
const search = (val: string) => {
console.log('我的课程' + val);
}
</script>
<style lang="scss" scoped>
.course-container {
padding: 0 30rpx 30rpx;
padding-top: 20rpx;
.uni-searchbar {
padding: 0;
margin: 20rpx 0;
}
.tag .u-tag {
margin-right: 20rpx;
}
}
</style>
\ No newline at end of file
<template>
<headers title='查看更多' />
<view class='see-more-container'>
<u-card :show-head="false" :show-foot="false" margin="0">
<template #body>
<u-section title="讲师介绍" font-size="34" :arrow="false" :right="false" line-color="#2979ff" />
<view class="info">
<u-image width="100rpx" height="100rpx" border-radius="10" :src="src" />
<view class="info-text">
<text>王少龙</text>
<text>教授</text>
</view>
</view>
<view class="detail">
Lorem ipsum dolor sit amet, consecteturadipiscing elit. Aenean euismod bibendumlaoreet. Proin
gravida dolor sit amet lacusaccumsan et viverra justo commodo. Proinsodales pulvinar sic tempor.
Sociis natoquepenatibus et magnis dis parturient montes,nascetur ridiculus mus. Nam fermentum,
nullaluctus pharetra vulputate, felis tellus mollis orci,sed rhoncus pronin sapien nunc accuan
eget.
</view>
</template>
</u-card>
<u-card :show-head="false" :show-foot="false" margin="0">
<template #body>
<u-section title="课程介绍" font-size="34" :arrow="false" :right="false" line-color="#2979ff" />
<view class="detail">
Lorem ipsum dolor sit amet, consecteturadipiscing elit. Aenean euismod bibendumlaoreet. Proin
gravida dolor sit amet lacusaccumsan et viverra justo commodo. Proinsodales pulvinar sic tempor.
Sociis natoquepenatibus et magnis dis parturient montes,nascetur ridiculus mus. Nam fermentum,
nullaluctus pharetra vulputate, felis tellus mollis orci,sed rhoncus pronin sapien nunc accuan
eget.
</view>
</template>
</u-card>
</view>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import { src } from '@/utils/example';
</script>
<style lang="scss" scoped>
.see-more-container {
padding: 20rpx 30rpx;
.u-card {
margin-bottom: 24rpx !important;
.info {
display: flex;
margin-top: 20rpx;
.info-text {
display: flex;
flex-direction: column;
margin-left: 20rpx;
justify-content: space-around;
text:nth-child(1) {
font-size: 34rpx;
font-weight: bold;
color: #303133;
}
}
}
.detail {
text-indent: 2.5em;
margin-top: 30rpx;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 32rpx;
line-height: 1.25;
}
}
}
</style>
\ No newline at end of file
<template>
<headers title='西部人力培训中心' backIconName="close" />
<view class="home-container">
<!-- 用户信息部分 -->
<view class="user-info">
<u-image width="260rpx" height="260rpx" :src="src" border-radius="30" />
<text class="name">小美</text>
<view class="info">
<text>宝安研发部</text>
<u-line color="#eee" direction="col" length="30rpx" :hair-line="false" margin="0 20rpx" />
<text>开发人员</text>
</view>
</view>
<view class="user-menu">
<text class="menu-title">服务功能</text>
<view class="content">
<u-grid :col="3">
<u-grid-item @tap="toClass">
<u-badge count="2" :offset="[20, 20]"></u-badge>
<u-icon name="man-add-fill" :size="53"></u-icon>
<view class="grid-text">管理班级</view>
</u-grid-item>
<u-grid-item @tap="toCourse">
<u-icon name="grid-fill" :size="53"></u-icon>
<view class="grid-text">我的课程</view>
</u-grid-item>
<u-grid-item @tap="toSetPositioning">
<u-badge count="3" :offset="[20, 20]"></u-badge>
<u-icon name="list-dot" :size="53"></u-icon>
<view class="grid-text">设置考勤定位</view>
</u-grid-item>
</u-grid>
</view>
</view>
</view>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import { src } from '@/utils/example'
const toClass = () => {
uni.navigateTo({
url: '/pages/class/index'
})
}
const toCourse = () => {
uni.navigateTo({
url: '/pages/course/index'
})
}
const toSetPositioning = () => {
uni.navigateTo({
url: '/pages/setPositioning/index'
})
}
</script>
<style lang="scss" scoped>
page {
background-image: url("https://img2.baidu.com/it/u=460732253,1892860896&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=888");
background-size: cover;
/* 背景图片自适应屏幕大小 */
/* 其他样式设置 */
}
.home-container {
width: 100%;
height: calc(100% - 48px);
.user-info {
margin: 40rpx 0 100rpx 0;
width: 100%;
height: 30%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.name {
font-size: 36rpx;
font-weight: bold;
padding: 20rpx 0;
color: #000;
}
.info {
display: flex;
justify-content: center;
align-items: center;
}
}
.user-menu {
display: flex;
flex-direction: column;
box-sizing: border-box;
margin: 16rpx;
border-radius: 8rpx;
// border: 1px solid #e4e7ed;
background-color: #ffffff;
overflow: hidden;
color: #303133;
transition: 0.3s;
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.05);
.menu-title {
box-sizing: border-box;
width: 100%;
font-size: 36rpx;
font-weight: bold;
padding: 32rpx 0 32rpx 50rpx;
background: linear-gradient(to right, #f4f8ff, #cce3fe);
}
.content {
padding: 30rpx 0 80rpx 0;
}
}
}
</style>
\ No newline at end of file
<template>
<u-form :model="loginForm" ref="loginFormRef" :rules="loginFormRules" style="margin-top: 40rpx;" label-posi>
<u-form-item :leftIconStyle="{ color: '#888', fontSize: '32rpx' }" left-icon="account" label-width="150"
label-position="left" label="用户名" prop="username">
<u-input placeholder="请输入用户名" v-model="loginForm.username" type="text" />
</u-form-item>
<u-form-item label="密码" :leftIconStyle="{ color: '#888', fontSize: '32rpx' }" left-icon="lock"
label-width="150rpx" prop="password">
<u-input type="password" v-model="loginForm.password" placeholder="请输入密码" />
</u-form-item>
</u-form>
<button @tap="tapLogin" class="getCaptcha">登录</button>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { Login } from '../interface';
import { login } from '@/api/login'
import { useGlobalStore } from '@/store/useStore';
const globalStore = useGlobalStore()
const loginFormRef = ref()
const loginForm = reactive<Login.LoginForm>({
username: 'admin',
password: '123456'
})
const loginFormRules = reactive({
username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
})
let tapLogin = () => {
uni.navigateTo({
url: '/pages/home/index'
})
// loginFormRef.value?.validate(async (valid: boolean) => {
// if (valid) {
// const { data: res } = await login(loginForm)
// if (res.code === 200) {
// globalStore.setToken(res.data.token)
// uni.reLaunch({
// url: '/pages/home/index'
// })
// }
// } else {
// console.log('验证失败');
// }
// });
};
onMounted(() => loginFormRef.value?.setRules(loginFormRules))
</script>
<style lang="scss" scoped>
.getCaptcha {
width: 500rpx;
background-color: rgb(253, 243, 208);
color: $u-tips-color;
border: none;
font-size: 30rpx;
margin-top: 20rpx;
&::after {
border: none;
}
}
:deep(.uicon-eye:before) {
font-size: 40rpx;
}
:deep(.uicon-eye-fill:before) {
font-size: 40rpx;
}
:deep(.u-input) {
justify-content: center;
align-items: center;
}
</style>
<template>
<headers title='西部人力培训中心' backIconName='close' />
<view style="box-sizing: border-box;">
<view class="login-container">
<text class="login-text">欢迎登陆</text>
<loginForm />
</view>
</view>
</template>
<script setup lang="ts">
import headers from '@/components/header/index.vue'
import loginForm from './components/loginForm.vue';
</script>
<style lang="scss" scoped>
:deep(uni-page-wrapper) {
background-color: #fff;
}
:deep(uni-page) {
padding: 0 6rpx;
box-sizing: border-box;
}
.login-container {
box-sizing: border-box;
padding-top: 20%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
background-color: #fff;
.login-text {
margin-top: 10%;
font-weight: 700;
font-size: 40rpx;
color: #1d2b5f;
}
}
</style>
export namespace Login {
export interface LoginForm {
username: string,
password: string
}
}
\ No newline at end of file
<template>
<div class='position-container'>
<u-card :show-head="false" margin="0">
<template #body>
<view class="position-header">
<h3>上课地点:{{ positionList.title }}</h3>
</view>
<view class="item">
<text>上课地点:{{ positionList.address }}</text>
</view>
<view class="item">
<text>考勤定位:{{ positionList.isSetPosition ? '已设置' : '未设置' }}</text>
</view>
<view class="item">
<text>应用范围:{{ positionList.range }}</text>
</view>
</template>
<template #foot>
<view class="position-footer">
<text>所属班级:{{ positionList.class }}</text>
<u-button type="primary" size="mini" @tap="openMap">{{ current ? '修改定位' : '设置定位' }}</u-button>
</view>
</template>
</u-card>
</div>
</template>
<script setup lang='ts'>
const props = defineProps({
positionList: {
type: Array,
default: () => []
} as any,
current: {
type: Number,
default: 0
}
})
const openMap = () => {
// uni.getLocation({
// type: 'gcj02',
// success(res: any) {
// console.log(res, 'kkk');
// state.coord = res.latitude + ',' + res.longitude
// // alert(state.coord)
// var geolocation = new window.qq.maps.Geolocation(
// "3M5BZ-SFCRJ-AHSF7-XRA5Q-Y6NIJ-DXBH4",
// "myapp"
// )
// geolocation.getLocation(showPosition, showErr)
// function showPosition(position: any) {
// console.log(position, '打印位置信息');
// let backurl = '/pages/setPositioning/map'
// let url = `https://apis.map.qq.com/tools/locpicker?search=1&type=0&backurl=${backurl}&key=3M5BZ-SFCRJ-AHSF7-XRA5Q-Y6NIJ-DXBH4&referer=myapp`
// window.open(url)
// }
// function showErr() { }
// }
// })
uni.navigateTo({
url: '/pages/setPositioning/map'
})
}
</script>
<style lang="scss" scoped>
.position-container {
.position-header {
margin-bottom: 30rpx;
}
.item {
margin-bottom: 20rpx;
}
.position-footer {
display: flex;
justify-content: space-between;
.u-btn {
margin: 0;
}
}
}
</style>
\ No newline at end of file
<template>
<headers title='设置考勤定位' />
<div class='set-position-container'>
<u-tabs :list="tabsState.list" :is-scroll="false" v-model="tabsState.current" bg-color="#f5f5f5"
@change="tabsChange" />
<!-- 内容 -->
<view v-if="positionList.length">
<!-- 搜索 -->
<uni-search-bar placeholder="课程名称/班级名称" bgColor="#ffffff" clearButton="auto" cancelButton="none"
@confirm="search" />
<text style="margin-bottom: 20rpx; display: block;">为你找到10个的课程</text>
<block v-for="(item, index) in positionList" :key="index">
<setPositionItem :positionList="item" :current="tabsState.current" />
</block>
</view>
<view v-else class="empty">
<u-empty text="暂无数据" mode="list" />
</view>
</div>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import setPositionItem from './components/setPositionItem.vue';
const tabsState = reactive({
list: [{
name: '未设置'
}, {
name: '已设置'
}
],
current: 0
})
const positionList: any = ref([{
title: '第一节党性学习',
address: '深圳市南山区西丽街道办公室', // 上课地点
isSetPosition: false, // 考勤定位
range: '未设置',
class: '党支部培训班'
}])
const tabsChange = (index: number) => {
}
const search = (val: string) => {
console.log('我的课程' + val);
}
</script>
<style lang="scss" scoped>
.set-position-container {
padding: 0 30rpx 30rpx;
padding-top: 20rpx;
.tag {
margin-bottom: 30rpx;
.u-tag {
margin-right: 20rpx;
}
}
}
</style>
\ No newline at end of file
<template>
<headers title='考勤地点设置' />
<view v-if="flag" style="width: 100%; height: 100vh">
<iframe id="mapPage" width="100%" height="100%" frameborder=0 :src="src">
</iframe>
</view>
</template>
<script setup lang='ts'>
import headers from '@/components/header/index.vue'
import { zalert } from '@/utils/util'
const state = reactive({
key: '3M5BZ-SFCRJ-AHSF7-XRA5Q-Y6NIJ-DXBH4',
coord: ''
})
const src = ref()
const flag = ref(false)
window.addEventListener('message', function (event) {
// 接收位置信息,用户选择确认位置点后选点组件会触发该事件,回传用户的位置信息
var loc = event.data;
if (loc && loc.module == 'locationPicker') {//防止其他应用也会向该页面post信息,需判断module是否为'locationPicker'
console.log('location', loc);
// uni.navigateBack()
zalert('确定设置为该地址?', () => {
uni.navigateBack()
})
}
}, false)
onMounted(() => {
uni.getLocation({
type: 'gcj02',
success(res: any) {
state.coord = res.latitude + ',' + res.longitude
src.value = `https://apis.map.qq.com/tools/locpicker?search=1&type=1&key=${state.key}&referer=XBRLPX&coord=${state.coord}&zoom=18`
setTimeout(() => {
flag.value = true
}, 100)
}
})
})
</script>
<style lang="scss" scoped>
.map {
width: 100%;
transition: height .3s;
map {
width: 100%;
height: 100%;
}
.cotrons {
text-align: end;
padding: 20rpx;
}
}
.addr {
position: fixed;
bottom: 0;
width: 100%;
background-color: #ffffff;
// height: 500px;
padding: 10rpx;
transition: height .3s;
border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx;
}
</style>
\ No newline at end of file
.card {
box-sizing: border-box;
margin: 16rpx;
padding: 16rpx;
border-radius: 8rpx;
border: 1px solid #e4e7ed;
background-color: #ffffff;
overflow: hidden;
color: #303133;
transition: 0.3s;
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.05);
.card-text {
padding: 20rpx;
}
.grid-text {
font-size: 28rpx;
margin-top: 4rpx;
color: #303133;
padding: 0 10rpx;
white-space: 'nowrap';
text-overflow: 'ellipsis';
overflow: 'hidden';
}
}
@font-face {
font-family: "custom-icon";
/* Project id 3607036 */
src: url('https://at.alicdn.com/t/c/font_3607036_y4hl42aa2g.woff2?t=1686627317404') format('woff2'),
url('https://at.alicdn.com/t/c/font_3607036_y4hl42aa2g.woff?t=1686627317404') format('woff'),
url('https://at.alicdn.com/t/c/font_3607036_y4hl42aa2g.ttf?t=1686627317404') format('truetype');
}
.custom-icon {
font-family: "custom-icon" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.custom-icon-lanya1:before {
content: "\e65f";
}
.custom-icon-lanya:before {
content: "\ec4a";
}
.custom-icon-fujian:before {
content: "\e601";
}
.custom-icon-shangchuandaochu:before {
content: "\e8c6";
}
.custom-icon-shouyefill:before {
content: "\e750";
}
.custom-icon-sandiantu:before {
content: "\e679";
}
.custom-icon-tubiao-zhexiantu:before {
content: "\eb96";
}
.custom-icon-shezhixitongshezhigongnengshezhishuxing:before {
content: "\e795";
}
.custom-icon-caidan1:before {
content: "\e653";
}
.custom-icon-bingtu:before {
content: "\e6bb";
}
.custom-icon-shujudaping:before {
content: "\e742";
}
.custom-icon-zhuzhuangtu:before {
content: "\e650";
}
.custom-icon-list2:before {
content: "\e655";
}
.custom-icon-caidan:before {
content: "\e652";
}
.custom-icon-erweima:before {
content: "\e6bd";
}
.custom-icon-shuxingguanli:before {
content: "\e625";
}
.custom-icon-line-barcodeboxtiaoxingma-02:before {
content: "\e717";
}
.custom-icon-Icon_kebianjibiaoge:before {
content: "\e60b";
}
.custom-icon-sousuo:before {
content: "\e600";
}
.custom-icon-dingdan:before {
content: "\e737";
}
.custom-icon-wodeyushe:before {
content: "\e633";
}
.custom-icon-dingdan-copy:before {
content: "\e738";
}
.custom-icon-sousuo-copy:before {
content: "\e739";
}
.custom-icon-wodeyushe-copy:before {
content: "\e73a";
}
\ No newline at end of file
@font-face {
font-family: "custom-icon";
/* Project id 3607036 */
src:
url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2');
}
.custom-icon {
font-family: "custom-icon" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.custom-icon-lanya1:before {
content: "\e65f";
}
.custom-icon-lanya:before {
content: "\ec4a";
}
.custom-icon-fujian:before {
content: "\e601";
}
.custom-icon-shangchuandaochu:before {
content: "\e8c6";
}
.custom-icon-shouyefill:before {
content: "\e750";
}
.custom-icon-sandiantu:before {
content: "\e679";
}
.custom-icon-tubiao-zhexiantu:before {
content: "\eb96";
}
.custom-icon-shezhixitongshezhigongnengshezhishuxing:before {
content: "\e795";
}
.custom-icon-caidan1:before {
content: "\e653";
}
.custom-icon-bingtu:before {
content: "\e6bb";
}
.custom-icon-shujudaping:before {
content: "\e742";
}
.custom-icon-zhuzhuangtu:before {
content: "\e650";
}
.custom-icon-list2:before {
content: "\e655";
}
.custom-icon-caidan:before {
content: "\e652";
}
.custom-icon-erweima:before {
content: "\e6bd";
}
.custom-icon-shuxingguanli:before {
content: "\e625";
}
.custom-icon-line-barcodeboxtiaoxingma-02:before {
content: "\e717";
}
.custom-icon-Icon_kebianjibiaoge:before {
content: "\e60b";
}
.custom-icon-sousuo:before {
content: "\e600";
}
.custom-icon-dingdan:before {
content: "\e737";
}
.custom-icon-wodeyushe:before {
content: "\e633";
}
.custom-icon-dingdan-copy:before {
content: "\e738";
}
.custom-icon-sousuo-copy:before {
content: "\e739";
}
.custom-icon-wodeyushe-copy:before {
content: "\e73a";
}
\ No newline at end of file
import { PersistedStateOptions } from 'pinia-plugin-persistedstate'
const piniaPersistOption = (key: string, paths?: any[]) => {
const persist: PersistedStateOptions = {
key,
storage: localStorage,
paths
}
return persist
}
export default piniaPersistOption
\ No newline at end of file
import { defineStore } from "pinia";
import { getMetadataList } from '@/api/apply'
export const useFormData = defineStore({
id: 'formData',
state: () => ({
metadataList: []
}),
getters: {
metaListGet: (state) => state.metadataList
},
actions: {
async getMetaList() {
const { data: res } = await getMetadataList()
this.metadataList = res.records
}
}
})
\ No newline at end of file
import { defineStore, createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
import piniaPersistOption from './config/piniaPersist'
export const useGlobalStore = defineStore({
id: 'globalStore',
state() {
return {
token: '',
statusBarHeight: 0,
}
},
getters: {
},
actions: {
setToken(token: string) {
this.token = token
},
async setStatusBarHeight() {
let that = this
await uni.getSystemInfo({
success(res: any) {
that.statusBarHeight = res.statusBarHeight || 0;
}
});
}
},
persist: piniaPersistOption('globalStore')
})
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)
export default pinia
// 解析 单据头与单据体数据
export const documentFilter = (list: any) => {
const headerList: any[] = []; // 单据头数据
const bodyList: any[] = []; // 单据体数据
const recursiveFilter = (item: any) => {
if (item.columns) {
item.columns[0].list.forEach((res: any) => {
bodyList.push(res);
});
}
if (item.detailColumns) {
item.detailColumns[0].list.forEach((res: any) => {
if (res.type === 'table') {
recursiveFilter(res);
} else if (res.type === 'grid') {
res.columns.forEach((col: any) => {
col.list.forEach((cols: any) => {
bodyList.push(cols);
});
});
} else if (res.type !== 'menu_bar') {
bodyList.push(res);
}
});
}
bodyList.push(item);
};
list.forEach((item: any) => {
if (item.type === 'table') recursiveFilter(item);
else if (item.type === 'grid')
item.columns.forEach((col: any) => {
col.list.forEach((res: any) => {
headerList.push(res);
});
});
else if (item.type !== 'menu_bar') headerList.push(item);
});
console.log(headerList, bodyList);
return { headerList, bodyList }
};
\ No newline at end of file
declare module 'vk-uview-ui'
\ No newline at end of file
@import '../node_modules/@dcloudio/uni-ui/lib/uni-scss/variables.scss';
@import 'vk-uview-ui/theme.scss';
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
* 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
*/
/* 颜色变量 */
/* 行为相关颜色 */
$uni-color-primary: #007aff;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;
/* 文字基本颜色 */
$uni-text-color: #333; //基本色
$uni-text-color-inverse: #fff; //反色
$uni-text-color-grey: #999; //辅助灰色,如加载更多的提示信息
$uni-text-color-placeholder: #808080;
$uni-text-color-disable: #c0c0c0;
/* 背景颜色 */
$uni-bg-color: #ffffff;
$uni-bg-color-grey: #f8f8f8;
$uni-bg-color-hover: #f1f1f1; //点击状态颜色
$uni-bg-color-mask: rgba(0, 0, 0, 0.4); //遮罩颜色
/* 边框颜色 */
$uni-border-color: #c8c7cc;
/* 尺寸变量 */
/* 文字尺寸 */
$uni-font-size-sm: 24rpx;
$uni-font-size-base: 28rpx;
$uni-font-size-lg: 32rpx;
/* 图片尺寸 */
$uni-img-size-sm: 40rpx;
$uni-img-size-base: 52rpx;
$uni-img-size-lg: 80rpx;
/* Border Radius */
$uni-border-radius-sm: 4rpx;
$uni-border-radius-base: 6rpx;
$uni-border-radius-lg: 12rpx;
$uni-border-radius-circle: 50%;
/* 水平间距 */
$uni-spacing-row-sm: 10px;
$uni-spacing-row-base: 20rpx;
$uni-spacing-row-lg: 30rpx;
/* 垂直间距 */
$uni-spacing-col-sm: 8rpx;
$uni-spacing-col-base: 16rpx;
$uni-spacing-col-lg: 24rpx;
/* 透明度 */
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
/* 文章场景相关 */
$uni-color-title: #2c405a; // 文章标题颜色
$uni-font-size-title: 40rpx;
$uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle: 36rpx;
$uni-color-paragraph: #3f536e; // 文章段落颜色
$uni-font-size-paragraph: 30rpx;
## 2.2.24(2023-06-02)
- 修复 部分情况修改时间,开始、结束时间显示异常的Bug [详情](https://ask.dcloud.net.cn/question/171146)
- 优化 当前月可以选择上月、下月的日期
## 2.2.23(2023-05-02)
- 修复 部分情况修改时间,开始时间未更新 [详情](https://github.com/dcloudio/uni-ui/issues/737)
- 修复 部分平台及设备第一次点击无法显示弹框
- 修复 ios 日期格式未补零显示及使用异常 [详情](https://ask.dcloud.net.cn/question/162979)
## 2.2.22(2023-03-30)
- 修复 日历 picker 修改年月后,自动选中当月1日 [详情](https://ask.dcloud.net.cn/question/165937)
- 修复 小程序端 低版本 ios NaN [详情](https://ask.dcloud.net.cn/question/162979)
## 2.2.21(2023-02-20)
- 修复 firefox 浏览器显示区域点击无法拉起日历弹框的Bug [详情](https://ask.dcloud.net.cn/question/163362)
## 2.2.20(2023-02-17)
- 优化 值为空依然选中当天问题
- 优化 提供 default-value 属性支持配置选择器打开时默认显示的时间
- 优化 非范围选择未选择日期时间,点击确认按钮选中当前日期时间
- 优化 字节小程序日期时间范围选择,底部日期换行问题
## 2.2.19(2023-02-09)
- 修复 2.2.18 引起范围选择配置 end 选择无效的Bug [详情](https://github.com/dcloudio/uni-ui/issues/686)
## 2.2.18(2023-02-08)
- 修复 移动端范围选择change事件触发异常的Bug [详情](https://github.com/dcloudio/uni-ui/issues/684)
- 优化 PC端输入日期格式错误时返回当前日期时间
- 优化 PC端输入日期时间超出 start、end 限制的Bug
- 优化 移动端日期时间范围用法时间展示不完整问题
## 2.2.17(2023-02-04)
- 修复 小程序端绑定 Date 类型报错的Bug [详情](https://github.com/dcloudio/uni-ui/issues/679)
- 修复 vue3 time-picker 无法显示绑定时分秒的Bug
## 2.2.16(2023-02-02)
- 修复 字节小程序报错的Bug
## 2.2.15(2023-02-02)
- 修复 某些情况切换月份错误的Bug
## 2.2.14(2023-01-30)
- 修复 某些情况切换月份错误的Bug [详情](https://ask.dcloud.net.cn/question/162033)
## 2.2.13(2023-01-10)
- 修复 多次加载组件造成内存占用的Bug
## 2.2.12(2022-12-01)
- 修复 vue3 下 i18n 国际化初始值不正确的Bug
## 2.2.11(2022-09-19)
- 修复 支付宝小程序样式错乱的Bug [详情](https://github.com/dcloudio/uni-app/issues/3861)
## 2.2.10(2022-09-19)
- 修复 反向选择日期范围,日期显示异常的Bug [详情](https://ask.dcloud.net.cn/question/153401?item_id=212892&rf=false)
## 2.2.9(2022-09-16)
- 可以使用 uni-scss 控制主题色
## 2.2.8(2022-09-08)
- 修复 close事件无效的Bug
## 2.2.7(2022-09-05)
- 修复 移动端 maskClick 无效的Bug [详情](https://ask.dcloud.net.cn/question/140824)
## 2.2.6(2022-06-30)
- 优化 组件样式,调整了组件图标大小、高度、颜色等,与uni-ui风格保持一致
## 2.2.5(2022-06-24)
- 修复 日历顶部年月及底部确认未国际化的Bug
## 2.2.4(2022-03-31)
- 修复 Vue3 下动态赋值,单选类型未响应的Bug
## 2.2.3(2022-03-28)
- 修复 Vue3 下动态赋值未响应的Bug
## 2.2.2(2021-12-10)
- 修复 clear-icon 属性在小程序平台不生效的Bug
## 2.2.1(2021-12-10)
- 修复 日期范围选在小程序平台,必须多点击一次才能取消选中状态的Bug
## 2.2.0(2021-11-19)
- 优化 组件UI,并提供设计资源 [详情](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移 [https://uniapp.dcloud.io/component/uniui/uni-datetime-picker](https://uniapp.dcloud.io/component/uniui/uni-datetime-picker)
## 2.1.5(2021-11-09)
- 新增 提供组件设计资源,组件样式调整
## 2.1.4(2021-09-10)
- 修复 hide-second 在移动端的Bug
- 修复 单选赋默认值时,赋值日期未高亮的Bug
- 修复 赋默认值时,移动端未正确显示时间的Bug
## 2.1.3(2021-09-09)
- 新增 hide-second 属性,支持只使用时分,隐藏秒
## 2.1.2(2021-09-03)
- 优化 取消选中时(范围选)直接开始下一次选择, 避免多点一次
- 优化 移动端支持清除按钮,同时支持通过 ref 调用组件的 clear 方法
- 优化 调整字号大小,美化日历界面
- 修复 因国际化导致的 placeholder 失效的Bug
## 2.1.1(2021-08-24)
- 新增 支持国际化
- 优化 范围选择器在 pc 端过宽的问题
## 2.1.0(2021-08-09)
- 新增 适配 vue3
## 2.0.19(2021-08-09)
- 新增 支持作为 uni-forms 子组件相关功能
- 修复 在 uni-forms 中使用时,选择时间报 NAN 错误的Bug
## 2.0.18(2021-08-05)
- 修复 type 属性动态赋值无效的Bug
- 修复 ‘确认’按钮被 tabbar 遮盖 bug
- 修复 组件未赋值时范围选左、右日历相同的Bug
## 2.0.17(2021-08-04)
- 修复 范围选未正确显示当前值的Bug
- 修复 h5 平台(移动端)报错 'cale' of undefined 的Bug
## 2.0.16(2021-07-21)
- 新增 return-type 属性支持返回 date 日期对象
## 2.0.15(2021-07-14)
- 修复 单选日期类型,初始赋值后不在当前日历的Bug
- 新增 clearIcon 属性,显示框的清空按钮可配置显示隐藏(仅 pc 有效)
- 优化 移动端移除显示框的清空按钮,无实际用途
## 2.0.14(2021-07-14)
- 修复 组件赋值为空,界面未更新的Bug
- 修复 start 和 end 不能动态赋值的Bug
- 修复 范围选类型,用户选择后再次选择右侧日历(结束日期)显示不正确的Bug
## 2.0.13(2021-07-08)
- 修复 范围选择不能动态赋值的Bug
## 2.0.12(2021-07-08)
- 修复 范围选择的初始时间在一个月内时,造成无法选择的bug
## 2.0.11(2021-07-08)
- 优化 弹出层在超出视窗边缘定位不准确的问题
## 2.0.10(2021-07-08)
- 修复 范围起始点样式的背景色与今日样式的字体前景色融合,导致日期字体看不清的Bug
- 优化 弹出层在超出视窗边缘被遮盖的问题
## 2.0.9(2021-07-07)
- 新增 maskClick 事件
- 修复 特殊情况日历 rpx 布局错误的Bug,rpx -> px
- 修复 范围选择时清空返回值不合理的bug,['', ''] -> []
## 2.0.8(2021-07-07)
- 新增 日期时间显示框支持插槽
## 2.0.7(2021-07-01)
- 优化 添加 uni-icons 依赖
## 2.0.6(2021-05-22)
- 修复 图标在小程序上不显示的Bug
- 优化 重命名引用组件,避免潜在组件命名冲突
## 2.0.5(2021-05-20)
- 优化 代码目录扁平化
## 2.0.4(2021-05-12)
- 新增 组件示例地址
## 2.0.3(2021-05-10)
- 修复 ios 下不识别 '-' 日期格式的Bug
- 优化 pc 下弹出层添加边框和阴影
## 2.0.2(2021-05-08)
- 修复 在 admin 中获取弹出层定位错误的bug
## 2.0.1(2021-05-08)
- 修复 type 属性向下兼容,默认值从 date 变更为 datetime
## 2.0.0(2021-04-30)
- 支持日历形式的日期+时间的范围选择
> 注意:此版本不向后兼容,不再支持单独时间选择(type=time)及相关的 hide-second 属性(时间选可使用内置组件 picker)
## 1.0.6(2021-03-18)
- 新增 hide-second 属性,时间支持仅选择时、分
- 修复 选择跟显示的日期不一样的Bug
- 修复 chang事件触发2次的Bug
- 修复 分、秒 end 范围错误的Bug
- 优化 更好的 nvue 适配
<template>
<view class="uni-calendar-item__weeks-box" :class="{
'uni-calendar-item--disable':weeks.disable,
'uni-calendar-item--before-checked-x':weeks.beforeMultiple,
'uni-calendar-item--multiple': weeks.multiple,
'uni-calendar-item--after-checked-x':weeks.afterMultiple,
}" @click="choiceDate(weeks)" @mouseenter="handleMousemove(weeks)">
<view class="uni-calendar-item__weeks-box-item" :class="{
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && (calendar.userChecked || !checkHover),
'uni-calendar-item--checked-range-text': checkHover,
'uni-calendar-item--before-checked':weeks.beforeMultiple,
'uni-calendar-item--multiple': weeks.multiple,
'uni-calendar-item--after-checked':weeks.afterMultiple,
'uni-calendar-item--disable':weeks.disable,
}">
<text v-if="selected && weeks.extraInfo" class="uni-calendar-item__weeks-box-circle"></text>
<text class="uni-calendar-item__weeks-box-text uni-calendar-item__weeks-box-text-disable uni-calendar-item--checked-text">{{weeks.date}}</text>
</view>
<view :class="{'uni-calendar-item--today': weeks.isToday}"></view>
</view>
</template>
<script>
export default {
props: {
weeks: {
type: Object,
default () {
return {}
}
},
calendar: {
type: Object,
default: () => {
return {}
}
},
selected: {
type: Array,
default: () => {
return []
}
},
checkHover: {
type: Boolean,
default: false
}
},
methods: {
choiceDate(weeks) {
this.$emit('change', weeks)
},
handleMousemove(weeks) {
this.$emit('handleMouse', weeks)
}
}
}
</script>
<style lang="scss" >
$uni-primary: #007aff !default;
.uni-calendar-item__weeks-box {
flex: 1;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
align-items: center;
margin: 1px 0;
position: relative;
}
.uni-calendar-item__weeks-box-text {
font-size: 14px;
// font-family: Lato-Bold, Lato;
font-weight: bold;
color: darken($color: $uni-primary, $amount: 40%);
}
.uni-calendar-item__weeks-box-item {
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
.uni-calendar-item__weeks-box-circle {
position: absolute;
top: 5px;
right: 5px;
width: 8px;
height: 8px;
border-radius: 8px;
background-color: #dd524d;
}
.uni-calendar-item__weeks-box .uni-calendar-item--disable {
cursor: default;
}
.uni-calendar-item--disable .uni-calendar-item__weeks-box-text-disable {
color: #D1D1D1;
}
.uni-calendar-item--today {
position: absolute;
top: 10px;
right: 17%;
background-color: #dd524d;
width:6px;
height: 6px;
border-radius: 50%;
}
.uni-calendar-item--extra {
color: #dd524d;
opacity: 0.8;
}
.uni-calendar-item__weeks-box .uni-calendar-item--checked {
background-color: $uni-primary;
border-radius: 50%;
box-sizing: border-box;
border: 3px solid #fff;
}
.uni-calendar-item--checked .uni-calendar-item--checked-text {
color: #fff;
}
.uni-calendar-item--multiple .uni-calendar-item--checked-range-text {
color: #333;
}
.uni-calendar-item--multiple {
background-color: #F6F7FC;
// color: #fff;
}
.uni-calendar-item--multiple .uni-calendar-item--before-checked,
.uni-calendar-item--multiple .uni-calendar-item--after-checked {
background-color: $uni-primary;
border-radius: 50%;
box-sizing: border-box;
border: 3px solid #F6F7FC;
}
.uni-calendar-item--before-checked .uni-calendar-item--checked-text,
.uni-calendar-item--after-checked .uni-calendar-item--checked-text {
color: #fff;
}
.uni-calendar-item--before-checked-x {
border-top-left-radius: 50px;
border-bottom-left-radius: 50px;
box-sizing: border-box;
background-color: #F6F7FC;
}
.uni-calendar-item--after-checked-x {
border-top-right-radius: 50px;
border-bottom-right-radius: 50px;
background-color: #F6F7FC;
}
</style>
{
"uni-datetime-picker.selectDate": "select date",
"uni-datetime-picker.selectTime": "select time",
"uni-datetime-picker.selectDateTime": "select date and time",
"uni-datetime-picker.startDate": "start date",
"uni-datetime-picker.endDate": "end date",
"uni-datetime-picker.startTime": "start time",
"uni-datetime-picker.endTime": "end time",
"uni-datetime-picker.ok": "ok",
"uni-datetime-picker.clear": "clear",
"uni-datetime-picker.cancel": "cancel",
"uni-datetime-picker.year": "-",
"uni-datetime-picker.month": "",
"uni-calender.MON": "MON",
"uni-calender.TUE": "TUE",
"uni-calender.WED": "WED",
"uni-calender.THU": "THU",
"uni-calender.FRI": "FRI",
"uni-calender.SAT": "SAT",
"uni-calender.SUN": "SUN",
"uni-calender.confirm": "confirm"
}
import en from './en.json'
import zhHans from './zh-Hans.json'
import zhHant from './zh-Hant.json'
export default {
en,
'zh-Hans': zhHans,
'zh-Hant': zhHant
}
{
"uni-datetime-picker.selectDate": "选择日期",
"uni-datetime-picker.selectTime": "选择时间",
"uni-datetime-picker.selectDateTime": "选择日期时间",
"uni-datetime-picker.startDate": "开始日期",
"uni-datetime-picker.endDate": "结束日期",
"uni-datetime-picker.startTime": "开始时间",
"uni-datetime-picker.endTime": "结束时间",
"uni-datetime-picker.ok": "确定",
"uni-datetime-picker.clear": "清除",
"uni-datetime-picker.cancel": "取消",
"uni-datetime-picker.year": "年",
"uni-datetime-picker.month": "月",
"uni-calender.SUN": "日",
"uni-calender.MON": "一",
"uni-calender.TUE": "二",
"uni-calender.WED": "三",
"uni-calender.THU": "四",
"uni-calender.FRI": "五",
"uni-calender.SAT": "六",
"uni-calender.confirm": "确认"
}
\ No newline at end of file
{
"uni-datetime-picker.selectDate": "選擇日期",
"uni-datetime-picker.selectTime": "選擇時間",
"uni-datetime-picker.selectDateTime": "選擇日期時間",
"uni-datetime-picker.startDate": "開始日期",
"uni-datetime-picker.endDate": "結束日期",
"uni-datetime-picker.startTime": "開始时间",
"uni-datetime-picker.endTime": "結束时间",
"uni-datetime-picker.ok": "確定",
"uni-datetime-picker.clear": "清除",
"uni-datetime-picker.cancel": "取消",
"uni-datetime-picker.year": "年",
"uni-datetime-picker.month": "月",
"uni-calender.SUN": "日",
"uni-calender.MON": "一",
"uni-calender.TUE": "二",
"uni-calender.WED": "三",
"uni-calender.THU": "四",
"uni-calender.FRI": "五",
"uni-calender.SAT": "六",
"uni-calender.confirm": "確認"
}
\ No newline at end of file
{
"id": "uni-datetime-picker",
"displayName": "uni-datetime-picker 日期选择器",
"version": "2.2.24",
"description": "uni-datetime-picker 日期时间选择器,支持日历,支持范围选择",
"keywords": [
"uni-datetime-picker",
"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",
"uni-icons"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "n"
},
"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"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
> `重要通知:组件升级更新 2.0.0 后,支持日期+时间范围选择,组件 ui 将使用日历选择日期,ui 变化较大,同时支持 PC 和 移动端。此版本不向后兼容,不再支持单独的时间选择(type=time)及相关的 hide-second 属性(时间选可使用内置组件 picker)。若仍需使用旧版本,可在插件市场下载*非uni_modules版本*,旧版本将不再维护`
## DatetimePicker 时间选择器
> **组件名:uni-datetime-picker**
> 代码块: `uDatetimePicker`
该组件的优势是,支持**时间戳**输入和输出(起始时间、终止时间也支持时间戳),可**同时选择**日期和时间。
若只是需要单独选择日期和时间,不需要时间戳输入和输出,可使用原生的 picker 组件。
**_点击 picker 默认值规则:_**
- 若设置初始值 value, 会显示在 picker 显示框中
- 若无初始值 value,则初始值 value 为当前本地时间 Date.now(), 但不会显示在 picker 显示框中
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-datetime-picker)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
\ No newline at end of file
## 1.3.5(2022-01-24)
- 优化 size 属性可以传入不带单位的字符串数值
## 1.3.4(2022-01-24)
- 优化 size 支持其他单位
## 1.3.3(2022-01-17)
- 修复 nvue 有些图标不显示的bug,兼容老版本图标
## 1.3.2(2021-12-01)
- 优化 示例可复制图标名称
## 1.3.1(2021-11-23)
- 优化 兼容旧组件 type 值
## 1.3.0(2021-11-19)
- 新增 更多图标
- 优化 自定义图标使用方式
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-icons](https://uniapp.dcloud.io/component/uniui/uni-icons)
## 1.1.7(2021-11-08)
## 1.2.0(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.5(2021-05-12)
- 新增 组件示例地址
## 1.1.4(2021-02-05)
- 调整为uni_modules目录规范
<template>
<!-- #ifdef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" @click="_onClick">{{unicode}}</text>
<!-- #endif -->
<!-- #ifndef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"></text>
<!-- #endif -->
</template>
<script>
import icons from './icons.js';
const getVal = (val) => {
const reg = /^[0-9]*$/g
return (typeof val === 'number' || reg.test(val) )? val + 'px' : val;
}
// #ifdef APP-NVUE
var domModule = weex.requireModule('dom');
import iconUrl from './uniicons.ttf'
domModule.addRule('fontFace', {
'fontFamily': "uniicons",
'src': "url('"+iconUrl+"')"
});
// #endif
/**
* Icons 图标
* @description 用于展示 icons 图标
* @tutorial https://ext.dcloud.net.cn/plugin?id=28
* @property {Number} size 图标大小
* @property {String} type 图标图案,参考示例
* @property {String} color 图标颜色
* @property {String} customPrefix 自定义图标
* @event {Function} click 点击 Icon 触发事件
*/
export default {
name: 'UniIcons',
emits:['click'],
props: {
type: {
type: String,
default: ''
},
color: {
type: String,
default: '#333333'
},
size: {
type: [Number, String],
default: 16
},
customPrefix:{
type: String,
default: ''
}
},
data() {
return {
icons: icons.glyphs
}
},
computed:{
unicode(){
let code = this.icons.find(v=>v.font_class === this.type)
if(code){
return unescape(`%u${code.unicode}`)
}
return ''
},
iconSize(){
return getVal(this.size)
}
},
methods: {
_onClick() {
this.$emit('click')
}
}
}
</script>
<style lang="scss">
/* #ifndef APP-NVUE */
@import './uniicons.css';
@font-face {
font-family: uniicons;
src: url('./uniicons.ttf') format('truetype');
}
/* #endif */
.uni-icons {
font-family: uniicons;
text-decoration: none;
text-align: center;
}
</style>
.uniui-color:before {
content: "\e6cf";
}
.uniui-wallet:before {
content: "\e6b1";
}
.uniui-settings-filled:before {
content: "\e6ce";
}
.uniui-auth-filled:before {
content: "\e6cc";
}
.uniui-shop-filled:before {
content: "\e6cd";
}
.uniui-staff-filled:before {
content: "\e6cb";
}
.uniui-vip-filled:before {
content: "\e6c6";
}
.uniui-plus-filled:before {
content: "\e6c7";
}
.uniui-folder-add-filled:before {
content: "\e6c8";
}
.uniui-color-filled:before {
content: "\e6c9";
}
.uniui-tune-filled:before {
content: "\e6ca";
}
.uniui-calendar-filled:before {
content: "\e6c0";
}
.uniui-notification-filled:before {
content: "\e6c1";
}
.uniui-wallet-filled:before {
content: "\e6c2";
}
.uniui-medal-filled:before {
content: "\e6c3";
}
.uniui-gift-filled:before {
content: "\e6c4";
}
.uniui-fire-filled:before {
content: "\e6c5";
}
.uniui-refreshempty:before {
content: "\e6bf";
}
.uniui-location-filled:before {
content: "\e6af";
}
.uniui-person-filled:before {
content: "\e69d";
}
.uniui-personadd-filled:before {
content: "\e698";
}
.uniui-back:before {
content: "\e6b9";
}
.uniui-forward:before {
content: "\e6ba";
}
.uniui-arrow-right:before {
content: "\e6bb";
}
.uniui-arrowthinright:before {
content: "\e6bb";
}
.uniui-arrow-left:before {
content: "\e6bc";
}
.uniui-arrowthinleft:before {
content: "\e6bc";
}
.uniui-arrow-up:before {
content: "\e6bd";
}
.uniui-arrowthinup:before {
content: "\e6bd";
}
.uniui-arrow-down:before {
content: "\e6be";
}
.uniui-arrowthindown:before {
content: "\e6be";
}
.uniui-bottom:before {
content: "\e6b8";
}
.uniui-arrowdown:before {
content: "\e6b8";
}
.uniui-right:before {
content: "\e6b5";
}
.uniui-arrowright:before {
content: "\e6b5";
}
.uniui-top:before {
content: "\e6b6";
}
.uniui-arrowup:before {
content: "\e6b6";
}
.uniui-left:before {
content: "\e6b7";
}
.uniui-arrowleft:before {
content: "\e6b7";
}
.uniui-eye:before {
content: "\e651";
}
.uniui-eye-filled:before {
content: "\e66a";
}
.uniui-eye-slash:before {
content: "\e6b3";
}
.uniui-eye-slash-filled:before {
content: "\e6b4";
}
.uniui-info-filled:before {
content: "\e649";
}
.uniui-reload:before {
content: "\e6b2";
}
.uniui-micoff-filled:before {
content: "\e6b0";
}
.uniui-map-pin-ellipse:before {
content: "\e6ac";
}
.uniui-map-pin:before {
content: "\e6ad";
}
.uniui-location:before {
content: "\e6ae";
}
.uniui-starhalf:before {
content: "\e683";
}
.uniui-star:before {
content: "\e688";
}
.uniui-star-filled:before {
content: "\e68f";
}
.uniui-calendar:before {
content: "\e6a0";
}
.uniui-fire:before {
content: "\e6a1";
}
.uniui-medal:before {
content: "\e6a2";
}
.uniui-font:before {
content: "\e6a3";
}
.uniui-gift:before {
content: "\e6a4";
}
.uniui-link:before {
content: "\e6a5";
}
.uniui-notification:before {
content: "\e6a6";
}
.uniui-staff:before {
content: "\e6a7";
}
.uniui-vip:before {
content: "\e6a8";
}
.uniui-folder-add:before {
content: "\e6a9";
}
.uniui-tune:before {
content: "\e6aa";
}
.uniui-auth:before {
content: "\e6ab";
}
.uniui-person:before {
content: "\e699";
}
.uniui-email-filled:before {
content: "\e69a";
}
.uniui-phone-filled:before {
content: "\e69b";
}
.uniui-phone:before {
content: "\e69c";
}
.uniui-email:before {
content: "\e69e";
}
.uniui-personadd:before {
content: "\e69f";
}
.uniui-chatboxes-filled:before {
content: "\e692";
}
.uniui-contact:before {
content: "\e693";
}
.uniui-chatbubble-filled:before {
content: "\e694";
}
.uniui-contact-filled:before {
content: "\e695";
}
.uniui-chatboxes:before {
content: "\e696";
}
.uniui-chatbubble:before {
content: "\e697";
}
.uniui-upload-filled:before {
content: "\e68e";
}
.uniui-upload:before {
content: "\e690";
}
.uniui-weixin:before {
content: "\e691";
}
.uniui-compose:before {
content: "\e67f";
}
.uniui-qq:before {
content: "\e680";
}
.uniui-download-filled:before {
content: "\e681";
}
.uniui-pyq:before {
content: "\e682";
}
.uniui-sound:before {
content: "\e684";
}
.uniui-trash-filled:before {
content: "\e685";
}
.uniui-sound-filled:before {
content: "\e686";
}
.uniui-trash:before {
content: "\e687";
}
.uniui-videocam-filled:before {
content: "\e689";
}
.uniui-spinner-cycle:before {
content: "\e68a";
}
.uniui-weibo:before {
content: "\e68b";
}
.uniui-videocam:before {
content: "\e68c";
}
.uniui-download:before {
content: "\e68d";
}
.uniui-help:before {
content: "\e679";
}
.uniui-navigate-filled:before {
content: "\e67a";
}
.uniui-plusempty:before {
content: "\e67b";
}
.uniui-smallcircle:before {
content: "\e67c";
}
.uniui-minus-filled:before {
content: "\e67d";
}
.uniui-micoff:before {
content: "\e67e";
}
.uniui-closeempty:before {
content: "\e66c";
}
.uniui-clear:before {
content: "\e66d";
}
.uniui-navigate:before {
content: "\e66e";
}
.uniui-minus:before {
content: "\e66f";
}
.uniui-image:before {
content: "\e670";
}
.uniui-mic:before {
content: "\e671";
}
.uniui-paperplane:before {
content: "\e672";
}
.uniui-close:before {
content: "\e673";
}
.uniui-help-filled:before {
content: "\e674";
}
.uniui-paperplane-filled:before {
content: "\e675";
}
.uniui-plus:before {
content: "\e676";
}
.uniui-mic-filled:before {
content: "\e677";
}
.uniui-image-filled:before {
content: "\e678";
}
.uniui-locked-filled:before {
content: "\e668";
}
.uniui-info:before {
content: "\e669";
}
.uniui-locked:before {
content: "\e66b";
}
.uniui-camera-filled:before {
content: "\e658";
}
.uniui-chat-filled:before {
content: "\e659";
}
.uniui-camera:before {
content: "\e65a";
}
.uniui-circle:before {
content: "\e65b";
}
.uniui-checkmarkempty:before {
content: "\e65c";
}
.uniui-chat:before {
content: "\e65d";
}
.uniui-circle-filled:before {
content: "\e65e";
}
.uniui-flag:before {
content: "\e65f";
}
.uniui-flag-filled:before {
content: "\e660";
}
.uniui-gear-filled:before {
content: "\e661";
}
.uniui-home:before {
content: "\e662";
}
.uniui-home-filled:before {
content: "\e663";
}
.uniui-gear:before {
content: "\e664";
}
.uniui-smallcircle-filled:before {
content: "\e665";
}
.uniui-map-filled:before {
content: "\e666";
}
.uniui-map:before {
content: "\e667";
}
.uniui-refresh-filled:before {
content: "\e656";
}
.uniui-refresh:before {
content: "\e657";
}
.uniui-cloud-upload:before {
content: "\e645";
}
.uniui-cloud-download-filled:before {
content: "\e646";
}
.uniui-cloud-download:before {
content: "\e647";
}
.uniui-cloud-upload-filled:before {
content: "\e648";
}
.uniui-redo:before {
content: "\e64a";
}
.uniui-images-filled:before {
content: "\e64b";
}
.uniui-undo-filled:before {
content: "\e64c";
}
.uniui-more:before {
content: "\e64d";
}
.uniui-more-filled:before {
content: "\e64e";
}
.uniui-undo:before {
content: "\e64f";
}
.uniui-images:before {
content: "\e650";
}
.uniui-paperclip:before {
content: "\e652";
}
.uniui-settings:before {
content: "\e653";
}
.uniui-search:before {
content: "\e654";
}
.uniui-redo-filled:before {
content: "\e655";
}
.uniui-list:before {
content: "\e644";
}
.uniui-mail-open-filled:before {
content: "\e63a";
}
.uniui-hand-down-filled:before {
content: "\e63c";
}
.uniui-hand-down:before {
content: "\e63d";
}
.uniui-hand-up-filled:before {
content: "\e63e";
}
.uniui-hand-up:before {
content: "\e63f";
}
.uniui-heart-filled:before {
content: "\e641";
}
.uniui-mail-open:before {
content: "\e643";
}
.uniui-heart:before {
content: "\e639";
}
.uniui-loop:before {
content: "\e633";
}
.uniui-pulldown:before {
content: "\e632";
}
.uniui-scan:before {
content: "\e62a";
}
.uniui-bars:before {
content: "\e627";
}
.uniui-cart-filled:before {
content: "\e629";
}
.uniui-checkbox:before {
content: "\e62b";
}
.uniui-checkbox-filled:before {
content: "\e62c";
}
.uniui-shop:before {
content: "\e62f";
}
.uniui-headphones:before {
content: "\e630";
}
.uniui-cart:before {
content: "\e631";
}
{
"id": "uni-icons",
"displayName": "uni-icons 图标",
"version": "1.3.5",
"description": "图标组件,用于展示移动端常见的图标,可自定义颜色、大小。",
"keywords": [
"uni-ui",
"uniui",
"icon",
"图标"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.2.14"
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"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": ["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"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
\ No newline at end of file
## Icons 图标
> **组件名:uni-icons**
> 代码块: `uIcons`
用于展示 icons 图标 。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-icons)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
## 1.0.3(2022-01-21)
- 优化 组件示例
## 1.0.2(2021-11-22)
- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题
## 1.0.1(2021-11-22)
- 修复 vue3中scss语法兼容问题
## 1.0.0(2021-11-18)
- init
@import './styles/index.scss';
{
"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"
}
}
}
}
}
`uni-sass``uni-ui`提供的一套全局样式 ,通过一些简单的类名和`sass`变量,实现简单的页面布局操作,比如颜色、边距、圆角等。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
\ No newline at end of file
@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';
.uni-border {
border: 1px $uni-border-1 solid;
}
\ No newline at end of file
// 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;
}
@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)
}
}
}
}
@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);
}
}
}
}
\ No newline at end of file
/* #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 */
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论