小程序初始提交

This commit is contained in:
jdc
2025-11-13 10:36:23 +08:00
parent f26b4f9a2f
commit 5db3b180eb
447 changed files with 83351 additions and 0 deletions

View File

@@ -0,0 +1,522 @@
<template>
<cl-page>
<cl-topbar fixed :show-back="false" safe-area-top :height="isMp() ? null : 100">
<view
class="flex flex-row items-center p-3 flex-1 w-full"
:class="{
'pt-0': isMp()
}"
>
<view class="bg-primary-500 rounded-lg p-[12rpx]">
<cl-image
src="/static/logo.png"
:width="32"
:height="32"
:show-loading="false"
></cl-image>
</view>
<cl-text
color="primary"
:pt="{
className: '!text-xl mr-auto ml-2 flex-1'
}"
>
{{ config.name }}
</cl-text>
<view
class="bg-surface-500 h-8 w-8 rounded-full flex flex-row items-center justify-center mr-3"
@tap="setSize"
>
<cl-icon name="font-size" color="white"></cl-icon>
</view>
<view
class="bg-primary-500 h-8 w-8 rounded-full flex flex-row items-center justify-center"
:class="{
'mr-24': isMp()
}"
@tap="setLocale"
>
<cl-icon name="translate" color="white"></cl-icon>
</view>
</view>
</cl-topbar>
<view class="p-3">
<view class="group" v-for="item in data" :key="item.label">
<cl-text :pt="{ className: '!text-sm !text-surface-400 mb-2 ml-2' }"
>{{ item.label }}{{ item.children?.length ?? 0 }}</cl-text
>
<view class="list">
<cl-row :gutter="10">
<template v-for="child in item.children" :key="child.label">
<cl-col :span="6" v-if="child.hidden != true">
<view
class="item dark:!bg-surface-800"
hover-class="opacity-80"
:hover-stay-time="250"
@tap="toPath(child)"
>
<cl-icon :name="child.icon" :size="36"></cl-icon>
<cl-text
:pt="{
className: 'mt-1 !text-xs text-center'
}"
>{{ child.label }}</cl-text
>
</view>
</cl-col>
</template>
</cl-row>
</view>
</view>
</view>
<!-- 自定义底部导航栏 -->
<custom-tabbar></custom-tabbar>
<!-- 主题设置 -->
<locale-set :ref="refs.set('localeSet')"></locale-set>
<!-- 字体大小设置 -->
<size-set :ref="refs.set('sizeSet')"></size-set>
</cl-page>
</template>
<script lang="ts" setup>
import { isApp, isMp, router, useRefs } from "@/cool";
import { t } from "@/locale";
import { computed } from "vue";
import { useUi } from "@/uni_modules/cool-ui";
import { config } from "@/config";
import LocaleSet from "@/components/locale-set.uvue";
import SizeSet from "@/components/size-set.uvue";
import CustomTabbar from "@/components/tabbar.uvue";
const ui = useUi();
const refs = useRefs();
type Item = {
label: string;
icon?: string;
path?: string;
disabled?: boolean;
hidden?: boolean;
children?: Item[];
};
const data = computed<Item[]>(() => {
return [
{
label: t("基础组件"),
children: [
{
label: t("文本"),
icon: "text",
path: "/pages/demo/basic/text"
},
{
label: t("按钮"),
icon: "mouse-line",
path: "/pages/demo/basic/button"
},
{
label: t("图片"),
icon: "image-line",
path: "/pages/demo/basic/image"
},
{
label: t("图标"),
icon: "puzzle-2-line",
path: "/pages/demo/basic/icon"
},
{
label: t("标签"),
icon: "price-tag-3-line",
path: "/pages/demo/basic/tag"
}
]
},
{
label: t("表单组件"),
children: [
{
label: t("表单验证"),
icon: "draft-line",
path: "/pages/demo/form/form"
},
{
label: t("输入框"),
icon: "input-field",
path: "/pages/demo/form/input"
},
{
label: t("文本域"),
icon: "text-block",
path: "/pages/demo/form/textarea"
},
{
label: t("计数器"),
icon: "increase-decrease-line",
path: "/pages/demo/form/input-number"
},
{
label: t("口令输入"),
icon: "input-method-line",
path: "/pages/demo/form/input-otp"
},
{
label: t("键盘"),
icon: "keyboard-box-line",
path: "/pages/demo/form/keyboard"
},
{
label: t("单选框"),
icon: "radio-button-line",
path: "/pages/demo/form/radio"
},
{
label: t("多选框"),
icon: "checkbox-line",
path: "/pages/demo/form/checkbox"
},
{
label: t("开关"),
icon: "toggle-line",
path: "/pages/demo/form/switch"
},
{
label: t("评分"),
icon: "star-line",
path: "/pages/demo/form/rate"
},
{
label: t("滑块"),
icon: "equalizer-2-line",
path: "/pages/demo/form/slider"
},
{
label: t("选择器"),
icon: "dropdown-list",
path: "/pages/demo/form/select"
},
{
label: t("日期选择器"),
icon: "calendar-line",
path: "/pages/demo/form/select-date"
},
{
label: t("时间选择器"),
icon: "time-line",
path: "/pages/demo/form/select-time"
},
{
label: t("级联选择器"),
icon: "stacked-view",
path: "/pages/demo/form/cascader"
},
{
label: t("文件上传"),
icon: "file-upload-line",
path: "/pages/demo/form/upload"
},
{
label: t("日历"),
icon: "calendar-line",
path: "/pages/demo/form/calendar"
}
]
},
{
label: t("布局组件"),
children: [
{
label: t("弹性布局"),
icon: "layout-2-line",
path: "/pages/demo/layout/flex"
},
{
label: t("标签页"),
icon: "function-add-line",
path: "/pages/demo/layout/tabs"
},
{
label: t("折叠面板"),
icon: "collapse-vertical-line",
path: "/pages/demo/layout/collapse"
},
{
label: t("吸顶"),
icon: "align-top",
path: "/pages/demo/layout/sticky"
},
{
label: t("导航栏"),
icon: "layout-top-line",
path: "/pages/demo/layout/topbar"
},
{
label: t("底部视图"),
icon: "layout-bottom-line",
path: "/pages/demo/layout/footer"
},
{
label: t("悬浮视图"),
icon: "picture-in-picture-line",
path: "/pages/demo/layout/float-view"
}
]
},
{
label: t("数据展示"),
children: [
{
label: t("头像"),
icon: "account-circle-line",
path: "/pages/demo/data/avatar"
},
{
label: t("查看更多"),
icon: "menu-add-line",
path: "/pages/demo/data/read-more"
},
{
label: t("列表"),
icon: "list-check",
path: "/pages/demo/data/list"
},
{
label: t("列表视图"),
icon: "list-view",
path: "/pages/demo/data/list-view"
},
{
label: t("列表刷新"),
icon: "refresh-line",
path: "/pages/demo/data/list-view-refresh",
disabled: false
},
{
label: t("瀑布流"),
icon: "layout-column-line",
path: "/pages/demo/data/waterfall"
},
{
label: t("轮播图"),
icon: "carousel-view",
path: "/pages/demo/data/banner"
},
{
label: t("跑马灯"),
icon: "film-line",
path: "/pages/demo/data/marquee"
},
{
label: t("分页"),
icon: "page-separator",
path: "/pages/demo/data/pagination"
},
{
label: t("时间轴"),
icon: "timeline-view",
path: "/pages/demo/data/timeline"
},
{
label: t("拖拽"),
icon: "drag-move-line",
path: "/pages/demo/data/draggable"
},
{
label: t("筛选栏"),
icon: "filter-line",
path: "/pages/demo/data/filter-bar"
},
{
label: t("树形结构"),
icon: "node-tree",
path: "/pages/demo/data/tree"
}
]
},
{
label: t("状态组件"),
children: [
{
label: t("角标"),
icon: "notification-badge-line",
path: "/pages/demo/status/badge"
},
{
label: t("通知栏"),
icon: "error-warning-line",
path: "/pages/demo/status/noticebar"
},
{
label: t("倒计时"),
icon: "timer-line",
path: "/pages/demo/status/countdown"
},
{
label: t("数字滚动"),
icon: "arrow-up-box-line",
path: "/pages/demo/status/rolling-number"
},
{
label: t("进度条"),
icon: "subtract-line",
path: "/pages/demo/status/progress"
},
{
label: t("圆形进度条"),
icon: "circle-line",
path: "/pages/demo/status/progress-circle"
},
{
label: t("骨架图"),
icon: "shadow-line",
path: "/pages/demo/status/skeleton"
},
{
label: t("加载更多"),
icon: "loader-4-line",
path: "/pages/demo/status/loadmore"
}
]
},
{
label: t("反馈组件"),
children: [
{
label: t("操作菜单"),
icon: "menu-line",
path: "/pages/demo/feedback/action-sheet"
},
{
label: t("弹窗"),
icon: "chat-4-line",
path: "/pages/demo/feedback/popup"
},
{
label: t("确认框"),
icon: "chat-check-line",
path: "/pages/demo/feedback/confirm"
},
{
label: t("提示框"),
icon: "message-2-line",
path: "/pages/demo/feedback/toast"
}
]
},
{
label: "其他",
children: [
{
label: "QRCode",
icon: "qr-code-line",
path: "/pages/demo/other/qrcode"
},
{
label: t("签名"),
icon: "sketching",
path: "/pages/demo/other/sign"
},
{
label: t("水印"),
icon: "copyright-line",
path: "/pages/demo/other/watermark"
},
{
label: t("图片裁剪"),
icon: "crop-line",
path: "/pages/demo/other/cropper"
},
{
label: t("Canvas"),
icon: "markup-line",
path: "/pages/demo/other/canvas"
},
{
label: t("富文本"),
icon: "text-snippet",
path: "/pages/demo/other/rict-text",
disabled: true
},
{
label: "DayUts",
icon: "timer-2-line",
path: "/pages/demo/other/day-uts"
},
{
label: "Vibrate",
icon: "volume-vibrate-line",
path: "/pages/demo/other/vibrate"
},
{
label: "SVG",
icon: "bubble-chart-line",
path: "/pages/demo/other/svg"
},
{
label: "SlideVerify",
icon: "contract-right-fill",
path: "/pages/demo/other/slide-verify"
},
{
label: "Animation",
icon: "instance-line",
path: "/pages/demo/other/animation"
},
{
label: "Router",
icon: "compass-discover-line",
path: "/pages/demo/other/router/index"
},
{
label: "Share",
icon: "share-line",
path: "/pages/demo/other/share",
hidden: !isApp()
}
]
}
];
});
function toPath(item: Item) {
if (item.disabled == true) {
return ui.showToast({
message: t("该功能正在开发中")
});
}
router.to(item.path!);
}
function setLocale() {
refs.open("localeSet");
}
function setSize() {
refs.open("sizeSet");
}
</script>
<style lang="scss" scoped>
.group {
@apply mb-10;
.list {
.item {
@apply flex flex-col items-center;
@apply rounded-xl bg-white px-2;
height: 140rpx;
margin-bottom: 10rpx;
padding-top: 36rpx;
}
}
}
</style>

View File

@@ -0,0 +1,324 @@
<template>
<cl-page>
<cl-topbar
fixed
:height="100"
:show-back="false"
safe-area-top
background-color="transparent"
>
<view class="flex flex-row items-center w-full flex-1 px-3">
<view class="top-icon dark:!bg-surface-700" @tap="toSet">
<cl-icon name="settings-line"></cl-icon>
</view>
<view class="top-icon dark:!bg-surface-700" @tap="toTest">
<cl-icon name="notification-4-line"></cl-icon>
</view>
</view>
</cl-topbar>
<view class="p-3">
<view class="flex flex-col justify-center items-center pt-6 pb-3">
<view class="relative overflow-visible" @tap="toEdit">
<cl-avatar
:src="userInfo?.avatarUrl"
:size="150"
:pt="{ className: '!rounded-3xl', icon: { size: 60 } }"
>
</cl-avatar>
<view
class="flex flex-col justify-center items-center absolute bottom-0 right-[-6rpx] bg-black rounded-full p-1"
v-if="!user.isNull()"
>
<cl-icon name="edit-line" color="white" :size="24"></cl-icon>
</view>
</view>
<view class="flex-1 flex flex-col justify-center items-center w-full" @tap="toEdit">
<cl-text :pt="{ className: '!text-xl mt-5 mb-1 font-bold' }">{{
userInfo?.nickName ?? t("未登录")
}}</cl-text>
<cl-text color="info" v-if="!user.isNull()">{{ userInfo?.phone }}</cl-text>
</view>
</view>
<cl-row
:pt="{
className: 'pt-3 pb-6'
}"
>
<cl-col :span="6">
<view class="flex flex-col items-center justify-center">
<cl-rolling-number
:pt="{ className: '!text-xl' }"
:value="171"
></cl-rolling-number>
<cl-text :pt="{ className: 'mt-1 !text-xs' }" color="info">{{
t("总点击")
}}</cl-text>
</view>
</cl-col>
<cl-col :span="6">
<view class="flex flex-col items-center justify-center">
<cl-rolling-number
:pt="{ className: '!text-xl' }"
:value="24"
></cl-rolling-number>
<cl-text :pt="{ className: 'mt-1 !text-xs' }" color="info">{{
t("赞")
}}</cl-text>
</view>
</cl-col>
<cl-col :span="6">
<view class="flex flex-col items-center justify-center">
<cl-rolling-number
:pt="{ className: '!text-xl' }"
:value="89"
></cl-rolling-number>
<cl-text :pt="{ className: 'mt-1 !text-xs' }" color="info">{{
t("收藏")
}}</cl-text>
</view>
</cl-col>
<cl-col :span="6">
<view class="flex flex-col items-center justify-center">
<cl-rolling-number
:pt="{ className: '!text-xl' }"
:value="653"
></cl-rolling-number>
<cl-text :pt="{ className: 'mt-1 !text-xs' }" color="info">{{
t("粉丝")
}}</cl-text>
</view>
</cl-col>
</cl-row>
<cl-row :gutter="20" :pt="{ className: 'mb-3' }">
<cl-col :span="12">
<view class="bg-white dark:!bg-surface-800 p-4 rounded-2xl flex flex-row">
<view class="flex flex-col mr-auto">
<cl-text
ellipsis
:pt="{
className: '!w-[180rpx]'
}"
>{{ t("接单模式") }}</cl-text
>
<cl-text :pt="{ className: '!text-xs mt-1' }" color="info">{{
t("已关闭")
}}</cl-text>
</view>
<cl-switch></cl-switch>
</view>
</cl-col>
<cl-col :span="12">
<view class="bg-white dark:!bg-surface-800 p-4 rounded-2xl flex flex-row">
<view class="flex flex-col mr-auto">
<cl-text
ellipsis
:pt="{
className: '!w-[180rpx]'
}"
>{{ t("消息通知") }}</cl-text
>
<cl-text :pt="{ className: '!text-xs mt-1' }" color="info">{{
t("已关闭")
}}</cl-text>
</view>
<cl-switch></cl-switch>
</view>
</cl-col>
</cl-row>
<view class="bg-white dark:!bg-surface-800 py-5 rounded-2xl mb-3 h-[160rpx]">
<cl-row :pt="{ className: 'overflow-visible' }">
<cl-col :span="6">
<view class="flex flex-col justify-center items-center px-2">
<cl-icon name="money-cny-circle-line" :size="46"></cl-icon>
<cl-text
:pt="{ className: '!text-xs mt-2 text-center' }"
color="info"
>{{ t("待支付") }}</cl-text
>
</view>
</cl-col>
<cl-col :span="6">
<view class="flex flex-col justify-center items-center px-2">
<cl-icon name="box-1-line" :size="46"></cl-icon>
<cl-text
:pt="{ className: '!text-xs mt-2 text-center' }"
color="info"
>{{ t("未发货") }}</cl-text
>
</view>
</cl-col>
<cl-col :span="6">
<view
class="flex flex-col justify-center items-center relative overflow-visible px-2"
>
<cl-icon name="flight-takeoff-line" :size="46"></cl-icon>
<cl-text
:pt="{ className: '!text-xs mt-2 text-center' }"
color="info"
>{{ t("已发货") }}</cl-text
>
<cl-badge
type="primary"
:value="3"
position
:pt="{ className: '!right-6' }"
></cl-badge>
</view>
</cl-col>
<cl-col :span="6">
<view class="flex flex-col justify-center items-center px-2">
<cl-icon name="exchange-cny-line" :size="46"></cl-icon>
<cl-text
:pt="{ className: '!text-xs mt-2 text-center' }"
color="info"
>{{ t("售后 / 退款") }}</cl-text
>
</view>
</cl-col>
</cl-row>
</view>
<cl-list :pt="{ className: 'mb-3' }">
<cl-list-item
:label="t('我的钱包')"
icon="wallet-line"
arrow
hoverable
@tap="toTest"
>
</cl-list-item>
<cl-list-item
:label="t('我的日报')"
icon="file-text-line"
arrow
hoverable
@tap="toDailyReport"
>
</cl-list-item>
<cl-list-item
:label="t('我的周报')"
icon="file-list-line"
arrow
hoverable
@tap="toWeeklyReport"
>
</cl-list-item>
<cl-list-item
:label="t('工作建议')"
icon="chat-voice-ai-line"
arrow
hoverable
@tap="toAdvice"
>
</cl-list-item>
<cl-list-item
:label="t('我的月报')"
icon="calendar-todo-line"
arrow
hoverable
@tap="toMonthlyReport"
>
</cl-list-item>
<cl-list-item
:label="t('数据看板')"
icon="pie-chart-line"
arrow
hoverable
@tap="toTest"
>
</cl-list-item>
<cl-list-item
:label="t('历史记录')"
icon="history-line"
arrow
hoverable
@tap="toTest"
>
</cl-list-item>
<cl-list-item
:label="t('邀请好友')"
icon="share-line"
arrow
hoverable
@tap="toTest"
>
</cl-list-item>
</cl-list>
<cl-list>
<cl-list-item :label="t('设置')" icon="settings-line" arrow hoverable @tap="toSet">
</cl-list-item>
</cl-list>
</view>
<!-- 自定义底部导航栏 -->
<custom-tabbar></custom-tabbar>
</cl-page>
</template>
<script setup lang="ts">
import { router, userInfo, useStore } from "@/cool";
import { t } from "@/locale";
import { useUi } from "@/uni_modules/cool-ui";
import CustomTabbar from "@/components/tabbar.uvue";
const { user } = useStore();
const ui = useUi();
function toTest() {
ui.showToast({
message: t("开发中,敬请期待")
});
}
function toDailyReport() {
router.to("/pages/dailyreport/list");
}
function toWeeklyReport() {
router.to("/pages/weeklyreport/list");
}
function toAdvice() {
router.to('/pages/advice/index');
}
function toMonthlyReport() {
router.to("/pages/monthlyreport/list");
}
function toSet() {
router.to("/pages/set/index");
}
function toEdit() {
router.to("/pages/user/edit");
}
onReady(() => {
user.get();
});
</script>
<style lang="scss" scoped>
.top-icon {
@apply flex items-center justify-center rounded-lg bg-white mr-3 p-2;
}
</style>

View File

@@ -0,0 +1,121 @@
<template>
<cl-page>
<view class="p-3">
<cl-list
v-for="(item, index) in list"
:key="index"
:title="item.label"
:pt="{
className: 'mb-5'
}"
>
<cl-list-item
v-for="child in item.children"
:key="child.label"
:label="child.label"
:arrow="child.path != null"
@tap="toPath(child)"
>
</cl-list-item>
</cl-list>
</view>
<!-- 自定义底部导航栏 -->
<custom-tabbar></custom-tabbar>
</cl-page>
</template>
<script setup lang="ts">
import CustomTabbar from "@/components/tabbar.uvue";
import { router } from "@/cool";
import { t } from "@/locale";
import { useUi } from "@/uni_modules/cool-ui";
import { computed } from "vue";
const ui = useUi();
type Item = {
label: string;
path?: string;
children?: Item[];
};
const list = computed<Item[]>(() => [
{
label: t("社交"),
children: [
{
label: t("帖子详情"),
path: "/pages/template/post/detail"
}
]
},
{
label: t("商城"),
children: [
{
label: t("商品分类"),
path: "/pages/template/shop/goods-category"
},
{
label: t("商品详情"),
path: "/pages/template/shop/goods-detail/index"
},
{
label: t("商品列表、筛选")
},
{
label: t("购物车"),
path: "/pages/template/shop/shopping-cart"
},
{
label: t("订单列表、详情")
},
{
label: t("收货地址"),
path: "/pages/template/shop/address"
}
]
},
{
label: t("聊天"),
children: [
{
label: t("对话列表、历史记录")
}
]
},
{
label: "AI",
children: [
{
label: t("流式回复")
},
{
label: t("语言合成")
},
{
label: t("语音识别")
}
]
},
{
label: t("其他"),
children: [
{
label: t("文件管理")
}
]
}
]);
function toPath(item: Item) {
if (item.path == null) {
return ui.showToast({
message: t("该模板正在开发中")
});
}
router.to(item.path!);
}
</script>