约束类型
This commit is contained in:
D
parent
8a64af39bb
commit
3da37b66f3
@ -32,14 +32,17 @@ pnpm install
|
||||
:: 微信小程序编译运行
|
||||
npm run dev:mp-weixin
|
||||
```
|
||||
|
||||
成功后使用微信小程序打开：dist\dev\mp-weixin
|
||||
|
||||
### 代码压缩
|
||||
|
||||
默认是启动代码压缩的，
|
||||
|
||||
如果需要关闭代码压缩，可以将vite.config.js中的build.minify赋值为false。
|
||||
|
||||
如果需要打开代码压缩，可以将vite.config.js中的build.minify赋值为true。
|
||||
|
||||
# 作者建议
|
||||
|
||||
### 对于选项式
|
||||
@ -67,6 +70,7 @@ import modal from '@/plugins/modal' // 建议使用modal打开弹窗，理由：
|
||||
(主包最低809kb左右)
|
||||
|
||||
### 删除geek组件
|
||||
|
||||
1. 删除pages_geek和components/geek-xd文件夹
|
||||
2. 删除pages.json中subPackages的root值为“pages_geek/pages”的配置
|
||||
3. 删除pages/template.config.js中geek组件
|
||||
@ -82,7 +86,6 @@ import modal from '@/plugins/modal' // 建议使用modal打开弹窗，理由：
|
||||
5. 删除static中的uview，里面都是示例图片。
|
||||
6. 删除plugins中的config.js和common.js，并在plugins/index.js中删除相关配置
|
||||
|
||||
|
||||
### 删除uchart
|
||||
|
||||
（占用主包175kb左右，不建议删除，以防以后会用）
|
||||
@ -107,7 +110,6 @@ app.use(uviewPlus)
|
||||
3. App.vue中删除 @import '@/static/scss/index.scss';
|
||||
4. package.json中删除 "clipboard": "^2.0.11","dayjs": "^1.11.9","uview-plus": "^3.1.36",
|
||||
|
||||
|
||||
# 附录
|
||||
|
||||
[Vue3官网](https://cn.vuejs.org/)；
|
||||
|
||||
@ -103,12 +103,7 @@ export default {
|
||||
hsb: { h: 0, s: 0, b: 0 },
|
||||
site: [{ top: 0, left: 0 }, { left: 0 }, { left: 0 }],
|
||||
index: 0,
|
||||
bgcolor: {
|
||||
r: 255,
|
||||
g: 0,
|
||||
b: 0,
|
||||
a: 1
|
||||
},
|
||||
bgcolor: { r: 255, g: 0, b: 0, a: 1 },
|
||||
hex: '#000000',
|
||||
mode: true,
|
||||
colorList: [
|
||||
@ -119,67 +114,20 @@ export default {
|
||||
{ r: 63, g: 81, b: 181, a: 1 },
|
||||
{ r: 33, g: 150, b: 243, a: 1 },
|
||||
{ r: 3, g: 169, b: 244, a: 1 },
|
||||
{ r: 0, g: 188, b: 212, a: 1 }, {
|
||||
r: 0,
|
||||
g: 150,
|
||||
b: 136,
|
||||
a: 1
|
||||
}, {
|
||||
r: 76,
|
||||
g: 175,
|
||||
b: 80,
|
||||
a: 1
|
||||
}, {
|
||||
r: 139,
|
||||
g: 195,
|
||||
b: 74,
|
||||
a: 1
|
||||
}, {
|
||||
r: 205,
|
||||
g: 220,
|
||||
b: 57,
|
||||
a: 1
|
||||
}, {
|
||||
r: 255,
|
||||
g: 235,
|
||||
b: 59,
|
||||
a: 1
|
||||
}, {
|
||||
r: 255,
|
||||
g: 193,
|
||||
b: 7,
|
||||
a: 1
|
||||
}, {
|
||||
r: 255,
|
||||
g: 152,
|
||||
b: 0,
|
||||
a: 1
|
||||
}, {
|
||||
r: 255,
|
||||
g: 87,
|
||||
b: 34,
|
||||
a: 1
|
||||
}, {
|
||||
r: 121,
|
||||
g: 85,
|
||||
b: 72,
|
||||
a: 1
|
||||
}, {
|
||||
r: 158,
|
||||
g: 158,
|
||||
b: 158,
|
||||
a: 1
|
||||
}, {
|
||||
r: 0,
|
||||
g: 0,
|
||||
b: 0,
|
||||
a: 0.5
|
||||
}, {
|
||||
r: 0,
|
||||
g: 0,
|
||||
b: 0,
|
||||
a: 0
|
||||
},]
|
||||
{ r: 0, g: 188, b: 212, a: 1 },
|
||||
{ r: 0, g: 150, b: 136, a: 1 },
|
||||
{ r: 76, g: 175, b: 80, a: 1 },
|
||||
{ r: 139, g: 195, b: 74, a: 1 },
|
||||
{ r: 205, g: 220, b: 57, a: 1 },
|
||||
{ r: 255, g: 235, b: 59, a: 1 },
|
||||
{ r: 255, g: 193, b: 7, a: 1 },
|
||||
{ r: 255, g: 152, b: 0, a: 1 },
|
||||
{ r: 255, g: 87, b: 34, a: 1 },
|
||||
{ r: 121, g: 85, b: 72, a: 1 },
|
||||
{ r: 158, g: 158, b: 158, a: 1 },
|
||||
{ r: 0, g: 0, b: 0, a: 0.5 },
|
||||
{ r: 0, g: 0, b: 0, a: 0 },
|
||||
]
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
||||
17
src/components/geek-xd/types/index.ts
Normal file
17
src/components/geek-xd/types/index.ts
Normal file
@ -0,0 +1,17 @@
|
||||
export interface Menu {
|
||||
icon: string,
|
||||
label: string
|
||||
}
|
||||
|
||||
export interface Commodity {
|
||||
img: string,
|
||||
title: string,
|
||||
subTitle: string,
|
||||
price: number
|
||||
}
|
||||
|
||||
export interface CommodityOrder extends Commodity {
|
||||
shop: string,
|
||||
status: string,
|
||||
num: number
|
||||
}
|
||||
@ -12,7 +12,7 @@
|
||||
<uni-section class="mb-10" title="菜单" sub-title="menu" type="line"></uni-section>
|
||||
<u-row>
|
||||
<u-col :span="2.1" :offset="0.3" v-for="menu, index in menus" :key="index">
|
||||
<geek-menu :icon="menu.icon" :label="menu.label" :size="60" @click="modal.msg(menu.label)" type="circle" />
|
||||
<geek-menu v-bind=menu :size="60" @click="modal.msg(menu.label)" type="circle" />
|
||||
</u-col>
|
||||
</u-row>
|
||||
<u-row>
|
||||
@ -22,16 +22,15 @@
|
||||
</u-row>
|
||||
|
||||
<uni-section class="mb-10" title="商品列表" sub-title="commodity" type="line"></uni-section>
|
||||
<geek-commodity v-for="item, index in commodityList" :key="index" :price="item.price" :title="item.title"
|
||||
:sub-title="item.subTitle" :img="item.img" type="line" @click="modal.msg(item.title)" />
|
||||
<geek-commodity v-for="item, index in commodityList" :key="index" :price="item.price" :title="item.title"
|
||||
:sub-title="item.subTitle" :img="item.img" type="rect" @click="modal.msg(item.title)" />
|
||||
<geek-commodity v-for="item, index in commodityList" :key="index" v-bind="item" type="line"
|
||||
@click="modal.msg(item.title)" />
|
||||
<geek-commodity v-for="item, index in commodityList" :key="index" v-bind="item" type="rect"
|
||||
@click="modal.msg(item.title)" />
|
||||
|
||||
|
||||
<uni-section class="mb-10" title="订单列表" sub-title="order" type="line"></uni-section>
|
||||
<geek-order v-for="item, index in orderList" :key="index" :img="item.img" :label="item.title" :shop="item.shop"
|
||||
:status="item.status" :price="item.price" @more="modal.msg('更多')" @again="modal.msg('再次购买')" @return="modal.msg('退换')"
|
||||
@sell="modal.msg('卖了换钱')" :num="item.num"></geek-order>
|
||||
<geek-order v-for="item, index in orderList" :key="index" v-bind="item" @more="modal.msg('更多')"
|
||||
@again="modal.msg('再次购买')" @return="modal.msg('退换')" @sell="modal.msg('卖了换钱')"></geek-order>
|
||||
|
||||
<uni-section class="mb-10" title="颜色选择器" sub-title="order" type="line"></uni-section>
|
||||
<geek-color-picker ref="gk"></geek-color-picker>
|
||||
@ -39,22 +38,21 @@
|
||||
|
||||
|
||||
<uni-section class="mb-10" title="二维码" sub-title="order" type="line"></uni-section>
|
||||
<geek-qrcode cid="qrcode2" ref="qrcode2" val="二维码" :loadMake="true"/>
|
||||
|
||||
<geek-qrcode cid="qrcode2" ref="qrcode2" val="二维码" :loadMake="true" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue';
|
||||
import modal from '@/plugins/modal'
|
||||
import { Commodity, CommodityOrder, Menu } from "@/components/geek-xd/types"
|
||||
|
||||
const gk = ref(null)
|
||||
function open(){
|
||||
function open() {
|
||||
//@ts-ignore
|
||||
gk.value.open()
|
||||
}
|
||||
|
||||
|
||||
|
||||
const menus = reactive([
|
||||
const menus:Array<Menu> = reactive([
|
||||
{ icon: "/static/images/icon/rocket.png", label: '抢单' },
|
||||
{ icon: "/static/images/icon/phone.png", label: '回访' },
|
||||
{ icon: "/static/images/icon/message.png", label: '消息' },
|
||||
@ -62,7 +60,7 @@ const menus = reactive([
|
||||
{ icon: "/static/images/icon/knowledge.png", label: '知识库' }
|
||||
]);
|
||||
|
||||
const commodityList = reactive([
|
||||
const commodityList: Array<Commodity> = reactive([
|
||||
{
|
||||
img: '/static/images/banner/banner01.jpg',
|
||||
title: '商品1',
|
||||
@ -83,7 +81,7 @@ const commodityList = reactive([
|
||||
}
|
||||
])
|
||||
|
||||
const orderList = [
|
||||
const orderList: Array<CommodityOrder> = [
|
||||
{
|
||||
shop: 'geek自营旗舰店',
|
||||
status: '完成',
|
||||
@ -92,7 +90,6 @@ const orderList = [
|
||||
subTitle: '商品1简介',
|
||||
price: 100.32,
|
||||
num: 10
|
||||
|
||||
},
|
||||
{
|
||||
shop: 'geek自营旗舰店',
|
||||
|
||||
@ -7,6 +7,10 @@ export const tab = Tab;
|
||||
export const auth = Auth;
|
||||
export const modal = Modal;
|
||||
|
||||
/**
|
||||
* 在组合式API中可以通过 import { tab, auth, modal } form '@/plugins' 来使用tab、auth、modal
|
||||
* 在选项式API中可以通过 this.$tab this.$auth this.$modal 来使用tab、auth、modal
|
||||
*/
|
||||
export default {
|
||||
install(app: App): void {
|
||||
app.config.globalProperties.$tab = tab
|
||||
|
||||
@ -1,4 +1,6 @@
|
||||
const getters = {
|
||||
import { GetterTree } from "vuex"
|
||||
|
||||
const getters:GetterTree<any,any> = {
|
||||
token: state => state.user.token,
|
||||
avatar: state => state.user.avatar,
|
||||
name: state => state.user.name,
|
||||
@ -3,7 +3,7 @@ import getters from './getters'
|
||||
import { createStore } from "vuex";
|
||||
const store = createStore({
|
||||
modules: {
|
||||
user
|
||||
user,
|
||||
},
|
||||
getters
|
||||
});
|
||||
@ -3,10 +3,12 @@ import storage from '@/utils/storage'
|
||||
import constant from '@/utils/constant'
|
||||
import { login, logout, getInfo } from '@/api/login'
|
||||
import { getToken, setToken, removeToken } from '@/utils/auth'
|
||||
import { UserState, UserForm } from '@/types/store'
|
||||
import { Module } from 'vuex'
|
||||
|
||||
const baseUrl = config.baseUrl
|
||||
|
||||
const user = {
|
||||
const user: Module<UserState, UserState> = {
|
||||
state: {
|
||||
token: getToken(),
|
||||
name: storage.get(constant.name),
|
||||
@ -14,24 +16,23 @@ const user = {
|
||||
roles: storage.get(constant.roles),
|
||||
permissions: storage.get(constant.permissions)
|
||||
},
|
||||
|
||||
mutations: {
|
||||
SET_TOKEN: (state, token) => {
|
||||
SET_TOKEN: (state, token: string) => {
|
||||
state.token = token
|
||||
},
|
||||
SET_NAME: (state, name) => {
|
||||
SET_NAME: (state, name: string) => {
|
||||
state.name = name
|
||||
storage.set(constant.name, name)
|
||||
},
|
||||
SET_AVATAR: (state, avatar) => {
|
||||
SET_AVATAR: (state, avatar: string) => {
|
||||
state.avatar = avatar
|
||||
storage.set(constant.avatar, avatar)
|
||||
},
|
||||
SET_ROLES: (state, roles) => {
|
||||
SET_ROLES: (state, roles: Array<string>) => {
|
||||
state.roles = roles
|
||||
storage.set(constant.roles, roles)
|
||||
},
|
||||
SET_PERMISSIONS: (state, permissions) => {
|
||||
SET_PERMISSIONS: (state, permissions: Array<string>) => {
|
||||
state.permissions = permissions
|
||||
storage.set(constant.permissions, permissions)
|
||||
}
|
||||
@ -39,16 +40,16 @@ const user = {
|
||||
|
||||
actions: {
|
||||
// 登录
|
||||
Login({ commit }, userInfo) {
|
||||
Login({ commit }, userInfo: UserForm) {
|
||||
const username = userInfo.username
|
||||
const password = userInfo.password
|
||||
const code = userInfo.code
|
||||
const uuid = userInfo.uuid
|
||||
return new Promise((resolve, reject) => {
|
||||
login(username, password, code, uuid).then(res => {
|
||||
login(username, password, code, uuid).then((res: any) => {
|
||||
setToken(res.token)
|
||||
commit('SET_TOKEN', res.token)
|
||||
resolve()
|
||||
resolve(res)
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
@ -58,7 +59,7 @@ const user = {
|
||||
// 获取用户信息
|
||||
GetInfo({ commit, state }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getInfo().then(res => {
|
||||
getInfo().then((res: any) => {
|
||||
const user = res.user
|
||||
const avatar = (user == null || user.avatar == "" || user.avatar == null) ? "@/static/images/profile.jpg" : baseUrl + user.avatar
|
||||
const username = (user == null || user.userName == "" || user.userName == null) ? "" : user.userName
|
||||
@ -80,13 +81,13 @@ const user = {
|
||||
// 退出系统
|
||||
LogOut({ commit, state }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout(state.token).then(() => {
|
||||
logout().then((res) => {
|
||||
commit('SET_TOKEN', '')
|
||||
commit('SET_ROLES', [])
|
||||
commit('SET_PERMISSIONS', [])
|
||||
removeToken()
|
||||
storage.clean()
|
||||
resolve()
|
||||
resolve(res)
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
@ -1,27 +1,40 @@
|
||||
interface BaseRequestConfig {
|
||||
headers?: {
|
||||
/** 是否在请求头中添加token 默认是 */
|
||||
isToken: boolean
|
||||
},
|
||||
/** 请求头配置 */
|
||||
header?: any,
|
||||
/** 接口路径 */
|
||||
url: string,
|
||||
/** 请求参数 */
|
||||
params?: any,
|
||||
/** 超时事件 */
|
||||
timeout?: number | undefined,
|
||||
}
|
||||
|
||||
export interface RequestConfig extends BaseRequestConfig {
|
||||
/** 请求方式 */
|
||||
method?: "OPTIONS" | "GET" | "HEAD" | "POST" | "PUT" | "DELETE" | "TRACE" | "CONNECT" | undefined
|
||||
/** 重新设置baseUrl */
|
||||
baseUrl?: string,
|
||||
/** 请求体参数 */
|
||||
data?: any
|
||||
}
|
||||
|
||||
export interface RequestUploadConfig extends BaseRequestConfig {
|
||||
/** 文件路径 */
|
||||
filePath: string,
|
||||
/** 文件对应变量名 默认file */
|
||||
name?: string,
|
||||
/** 其他表单参数 */
|
||||
formData: any
|
||||
}
|
||||
|
||||
export interface ResponseData {
|
||||
/** 响应码 */
|
||||
code: number,
|
||||
/** 响应数据 */
|
||||
data: any,
|
||||
/** 响应信息 */
|
||||
msg: string
|
||||
}
|
||||
|
||||
17
src/types/store.ts
Normal file
17
src/types/store.ts
Normal file
@ -0,0 +1,17 @@
|
||||
|
||||
export interface UserState {
|
||||
token: string,
|
||||
name: string,
|
||||
avatar: string,
|
||||
roles: Array<string>
|
||||
permissions: Array<string>
|
||||
}
|
||||
|
||||
export interface UserForm {
|
||||
username: string
|
||||
password: string
|
||||
code: string
|
||||
uuid: string
|
||||
}
|
||||
|
||||
|
||||
@ -14,5 +14,8 @@ export default defineConfig(() => {
|
||||
plugins: [
|
||||
uni()
|
||||
],
|
||||
exclude:[
|
||||
/\/README\.md$/,
|
||||
]
|
||||
}
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user