feat: 添加自定义字体和图标资源，优化登录和首页界面

refactor(login): 使用自定义输入框组件替换原生输入框 refactor(index): 重构网格布局代码，使用动态渲染方式 style: 更新全局字体样式，移除默认字体设置 chore: 添加多个字体文件和图标资源 docs: 更新应用名称和版本号
2025-08-20 16:21:13 +08:00
parent ca4d93b902
commit 7a3d4f8c8a
40 changed files with 473 additions and 90 deletions
--- a/components/custom-input/custom-input.vue
+++ b/components/custom-input/custom-input.vue
@@ -0,0 +1,253 @@
+<template>
+  <view class="custom-input" :class="inputClass" :style="[wrapperStyle]">
+    <view class="custom-input__content">
+      <view class="custom-input__content__prefix-icon" v-if="prefixIcon">
+        <u-icon
+          :name="prefixIcon"
+          :width="iconSize"
+          :height="iconSize"
+          :customStyle="prefixIconStyle"
+        ></u-icon>
+      </view>
+      <view class="custom-input__content__field-wrapper" @tap="clickHandler">
+        <input
+          class="custom-input__content__field-wrapper__field"
+          :style="[inputStyle]"
+          :type="type"
+          :focus="focus"
+          :value="value"
+          :disabled="disabled"
+          :maxlength="maxlength"
+          :placeholder="placeholder"
+          :password="password || type === 'password' || false"
+          @input="onInput"
+          @blur="onBlur"
+          @focus="onFocus"
+          @confirm="onConfirm"
+        />
+      </view>
+      <view
+        class="custom-input__content__suffix-icon"
+        v-if="$slots.suffix"
+      >
+        <slot name="suffix"></slot>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'CustomInput',
+  props: {
+    // 输入框的值
+    value: {
+      type: [String, Number],
+      default: ''
+    },
+    // 输入框类型
+    type: {
+      type: String,
+      default: 'text'
+    },
+    // 是否禁用输入框
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+
+    // 最大输入长度
+    maxlength: {
+      type: [String, Number],
+      default: -1
+    },
+    // 占位符
+    placeholder: {
+      type: String,
+      default: ''
+    },
+    // 是否密码类型
+    password: {
+      type: Boolean,
+      default: false
+    },
+    // 前置图标
+    prefixIcon: {
+      type: String,
+      default: ''
+    },
+    // 前置图标样式
+    prefixIconStyle: {
+      type: [String, Object],
+      default: () => ({})
+    },
+
+    // 图标大小
+    iconSize: {
+      type: [String, Number],
+      default: 32
+    },
+    // 输入框字体大小
+    fontSize: {
+      type: [String, Number],
+      default: '14px'
+    },
+    // 输入框字体颜色
+    color: {
+      type: String,
+      default: '#333'
+    },
+    // 是否自动获取焦点
+    focus: {
+      type: Boolean,
+      default: false
+    },
+    // 边框类型
+    border: {
+      type: String,
+      default: 'bottom' // none, bottom, surround
+    },
+    // 自定义样式
+    customStyle: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      // 输入框的值
+      innerValue: this.value
+    };
+  },
+  watch: {
+    value(newVal) {
+      this.innerValue = newVal;
+    }
+  },
+  computed: {
+    // 组件的类名
+    inputClass() {
+      let classes = [];
+      const { border } = this;
+      
+      if (border === 'surround') {
+        classes = classes.concat(['custom-border', 'custom-input--radius']);
+      } else if (border === 'bottom') {
+        classes = classes.concat(['custom-border-bottom', 'custom-input--no-radius']);
+      }
+      
+      return classes.join(' ');
+    },
+    // 组件的样式
+    wrapperStyle() {
+      const style = {};
+      
+      // 无边框时，去除内边距
+      if (this.border === 'none') {
+        style.padding = '0';
+      } else {
+        // 由于uni-app的iOS开发者能力有限，导致需要分开写才有效
+        style.paddingTop = '6px';
+        style.paddingBottom = '6px';
+        style.paddingLeft = '9px';
+        style.paddingRight = '9px';
+      }
+      
+      return Object.assign(style, this.customStyle);
+    },
+    // 输入框的样式
+    inputStyle() {
+      const style = {
+        color: this.color,
+        fontSize: this.fontSize,
+        flex: 1
+      };
+      return style;
+    }
+  },
+  methods: {
+    // 当键盘输入时，触发input事件
+    onInput(e) {
+      const { value = '' } = e.detail || {};
+      this.innerValue = value;
+      this.$emit('input', value);
+      // 为了支持v-model，需要同时触发update:value事件
+      this.$emit('update:value', value);
+      this.$emit('change', value);
+    },
+    // 输入框失去焦点时触发
+    onBlur(event) {
+      this.$emit('blur', event.detail.value);
+    },
+    // 输入框聚焦时触发
+    onFocus(event) {
+      this.$emit('focus');
+    },
+    // 点击完成按钮时触发
+    onConfirm(event) {
+      this.$emit('confirm', this.innerValue);
+    },
+    // 点击事件
+    clickHandler() {
+      this.$emit('click');
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.custom-input {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  flex: 1;
+  
+  &--radius {
+    border-radius: 4px;
+  }
+  
+  &--no-radius {
+    border-radius: 0;
+  }
+  
+  .custom-border {
+    border: 1px solid #dcdfe6;
+  }
+  
+  .custom-border-bottom {
+    border-bottom: 1px solid #dcdfe6;
+  }
+  
+  &__content {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    flex: 1;
+    
+    &__prefix-icon {
+      margin-right: 5px;
+    }
+    
+    &__field-wrapper {
+      flex: 1;
+      
+      &__field {
+        width: 100%;
+        font-size: 14px;
+        color: #333;
+        
+        // 去除input的默认样式
+        outline: none;
+        border: none;
+        background: none;
+      }
+    }
+    
+    &__suffix-icon {
+      margin-left: 5px;
+    }
+  }
+}
+</style>
--- a/manifest.json
+++ b/manifest.json
@@ -1,9 +1,9 @@
 {
-    "name" : "干巷仓库APP",
+    "name" : "上海干巷涂装PDA",
    "appid" : "__UNI__A67E78B",
    "description" : "",
-    "versionName" : "2.3.0",
-    "versionCode" : 230,
+    "versionName" : "2.4.0",
+    "versionCode" : 240,
    "transformPx" : false,
    "sassImplementationName" : "node-sass",
    "app-plus" : {
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,36 +1,15 @@
 <template>
 	<view class="home-container">
-		<u--text text="入库" size="36" bold></u--text>
+		<view v-for="type in 4" :key="type">
+			<u--text :text="getSectionTitle(type)" size="36" bold></u--text>
 			<u-grid :border="false" @click="gridCheck" col="4">
-			<u-grid-item v-if="item.type === 1" v-for="(item,index) in gridItemList" :key="index" :name="item.url">
-				<u-icon color="#2979ff" :customStyle="{paddingTop:20+'rpx'}" :name="item.icon" :size="128"></u-icon>
-				<text class="grid-text">{{item.name}}</text>
-			</u-grid-item>
-		</u-grid>
-		<u-gap height="20"></u-gap>
-		<u--text text="出库" size="36" bold></u--text>
-		<u-grid :border="false" @click="gridCheck" col="4">
-			<u-grid-item v-if="item.type === 2" v-for="(item,index) in gridItemList" :key="index" :name="item.url">
-				<u-icon color="#909399" :customStyle="{paddingTop:20+'rpx'}" :name="item.icon" :size="128"></u-icon>
-				<text class="grid-text">{{item.name}}</text>
-			</u-grid-item>
-		</u-grid>
-		<u-gap height="20"></u-gap>
-		<u--text text="库存管理" size="36" bold></u--text>
-		<u-grid :border="false" @click="gridCheck" col="4">
-			<u-grid-item v-if="item.type === 3" v-for="(item,index) in gridItemList" :key="index" :name="item.url">
-				<u-icon color="#ff9900" :customStyle="{paddingTop:20+'rpx'}" :name="item.icon" :size="128"></u-icon>
-				<text class="grid-text">{{item.name}}</text>
-			</u-grid-item>
-		</u-grid>
-		<u-gap height="20"></u-gap>
-		<u--text text="库内管理" size="36" bold></u--text>
-		<u-grid :border="false" @click="gridCheck" col="4">
-			<u-grid-item v-if="item.type === 4" v-for="(item,index) in gridItemList" :key="index" :name="item.url">
-				<u-icon color="#19be6b" :customStyle="{paddingTop:20+'rpx'}" :name="item.icon" :size="128"></u-icon>
+				<u-grid-item v-for="(item,index) in getItemsByType(type)" :key="index" :name="item.url">
+					<u-icon :customStyle="{paddingTop:20+'rpx'}" :name="'/static/images/index-icons/' + item.icon + '.svg'" :size="128"></u-icon>
 					<text class="grid-text">{{item.name}}</text>
 				</u-grid-item>
 			</u-grid>
+			<u-gap height="20" v-if="type < 4"></u-gap>
+		</view>
 	</view>
 </template>

@@ -157,14 +136,6 @@
 					]
 				};
 		},
-		onLoad: function() {
-			this.GetInfo();
-		},
-		mounted() {
-			// console.log('屏幕宽度', uni.getWindowInfo().screenWidth)
-			// console.log('可用高度', uni.getWindowInfo().windowHeight)
-		},
-
 		methods: {
 			...mapActions([
 				'LogOut',
@@ -178,6 +149,20 @@
 					url
 				});
 			},
+			getSectionTitle(type) {
+				const titles = ['', '入库', '出库', '库存管理', '库内管理'];
+				return titles[type] || '';
+			},
+			getItemsByType(type) {
+				return this.gridItemList.filter(item => item.type === type);
+			}
+		},
+		onLoad: function() {
+			this.GetInfo();
+		},
+		mounted() {
+		// console.log('屏幕宽度', uni.getWindowInfo().screenWidth)
+		// console.log('可用高度', uni.getWindowInfo().windowHeight)
 	}
 };
 </script>
--- a/pages/login/login.vue
+++ b/pages/login/login.vue
@@ -2,28 +2,28 @@
 	<view class="common-container">
 		<!-- 登录图片 -->
 		<view class="login-banner-box">
-			<u--image :showLoading="true" src="/static/images/ui/login.png" width="360px" height="240px"></u--image>
+			<u--image :showLoading="true" src="/static/images/login-icons/login.png" width="360px" height="240px"></u--image>
 		</view>
 		<!-- 登录框 -->
 		<view class="login-form-box">
 			<!-- 登录表单 -->
 			<u--form labelPosition="left" :model="loginForm" ref="uForm">
 				<u-form-item prop="username" borderBottom>
-					<u--input v-model="loginForm.username" border="none" placeholder="账号" prefixIcon="account"
-						prefixIconStyle="font-size: 22px;color: #909399"></u--input>
+					<custom-input v-model="loginForm.username" border="none" placeholder="账号" prefixIcon="/static/images/login-icons/account.svg"
+						prefixIconStyle="color: #909399" iconSize="32"></custom-input>
 				</u-form-item>
 				<u-form-item prop="password" borderBottom>
-					<u--input v-model="loginForm.password" border="none" placeholder="密码" prefixIcon="lock"
-						prefixIconStyle="font-size: 22px;color: #909399"></u--input>
+					<custom-input v-model="loginForm.password" border="none" placeholder="密码" prefixIcon="/static/images/login-icons/lock.svg"
+						prefixIconStyle="color: #909399" iconSize="32"></custom-input>
 				</u-form-item>
 				<u-form-item prop="BaseUrl" borderBottom>
-					<u-input v-model="BaseUrl" border="none" placeholder="连接地址,例:127.0.0.1:8888" prefixIcon="ie"
-						prefixIconStyle="font-size: 22px;color: #909399">
+					<custom-input v-model="BaseUrl" border="none" placeholder="连接地址,例:127.0.0.1:8888" prefixIcon="/static/images/login-icons/ie.svg"
+						prefixIconStyle="color: #909399" iconSize="32">
 						<template slot="suffix">
 							<u-button type="primary" size="mini" text="修改地址" @click="handlerBaseUrlConfirm"
 								shape="circle"></u-button>
 						</template>
-					</u-input>
+					</custom-input>
 				</u-form-item>
 				<u-form-item prop="button" style="margin-top: 60px">
 					<u-button @click="handleLogin" type="primary" :color="buttonColor" text="登录"
@@ -39,40 +39,27 @@
 </template>

 <script>
-	import {
-		getCodeImg
-	} from '@/api/login';
-	import {
-		getToken,
-		setToken,
-		removeToken
-	} from '@/utils/auth';
-	import {
-		getBaseUrl,
-		setBaseUrl,
-		removeBaseUrl
-	} from '@/utils/baseUrl';
-	import {
-		getLoginInfo,
-		setLoginInfo,
-		removeLoginInfo
-	} from '@/utils/loginInfo';
+	import { getCodeImg } from '@/api/login';
+	import { setToken } from '@/utils/auth';
+	import { getBaseUrl, setBaseUrl } from '@/utils/baseUrl';
+	import { getLoginInfo, setLoginInfo } from '@/utils/loginInfo';
 	import config from '@/config';
 	export default {
 		onLoad() {
-			const systemInfo = uni.getSystemInfoSync();
-			this.version = systemInfo.appVersion;
+			this.version = uni.$u.sys().appWgtVersion;
 		},
 		data() {
 			return {
+				// 版本号
 				version: '',
+				// 验证码相关
 				codeUrl: '',
 				captchaEnabled: false,
-				// 用户注册开关
-				register: false,
-				globalConfig: getApp().globalData.config,
+				// 基础URL
 				BaseUrl: '127.0.0.1:8888',
+				// 按钮颜色
 				buttonColor: 'linear-gradient(to right, #3296F9, #235FF5)',
+				// 登录表单
 				loginForm: {
 					username: '',
 					password: '',
@@ -87,14 +74,22 @@
 		},
 		methods: {
 			init() {
-				// 初始化链接地址设计
+				// 初始化基础URL
+				this.initBaseUrl();
+				// 初始化用户登录信息
+				this.initLoginInfo();
+			},
+			// 初始化基础URL
+			initBaseUrl() {
 				let baseUrl = getBaseUrl();
 				if (!baseUrl) {
 					baseUrl = '192.168.60.251:8888';
 					setBaseUrl(baseUrl);
 				}
 				this.BaseUrl = baseUrl;
-				// 初始化用户登录存储
+			},
+			// 初始化用户登录信息
+			initLoginInfo() {
 				try {
 					let loginInfoStr = getLoginInfo();
 					let loginInfo = JSON.parse(loginInfoStr);
@@ -106,7 +101,6 @@
 					// console.log(e);
 					//TODO handle the exception
 				}
-
 			},
 			// 获取图形验证码
 			getCode() {
--- a/static/font/global-font.css
+++ b/static/font/global-font.css
@@ -0,0 +1,18 @@
+@font-face {
+  font-family: '东方大楷';
+  src: url('@/static/font/东方大楷/AlimamaDongFangDaKai-Regular.ttf') format('truetype'),
+       url('@/static/font/东方大楷/AlimamaDongFangDaKai-Regular.woff') format('woff'),
+       url('@/static/font/东方大楷/AlimamaDongFangDaKai-Regular.woff2') format('woff2');
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* 设置全局默认字体 */
+body, page {
+  font-family: '东方大楷', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+
+/* 为所有元素设置默认字体 */
+* {
+  font-family: '东方大楷', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
--- a/static/font/东方大楷/AlimamaDongFangDaKai-Regular.otf
+++ b/static/font/东方大楷/AlimamaDongFangDaKai-Regular.otf
--- a/static/font/东方大楷/AlimamaDongFangDaKai-Regular.ttf
+++ b/static/font/东方大楷/AlimamaDongFangDaKai-Regular.ttf
--- a/static/font/东方大楷/AlimamaDongFangDaKai-Regular.woff
+++ b/static/font/东方大楷/AlimamaDongFangDaKai-Regular.woff
--- a/static/font/东方大楷/AlimamaDongFangDaKai-Regular.woff2
+++ b/static/font/东方大楷/AlimamaDongFangDaKai-Regular.woff2
--- a/static/font/东方大楷/INSTRUCTION.txt
+++ b/static/font/东方大楷/INSTRUCTION.txt
@@ -0,0 +1,4 @@
+请按照下面流程安装文件夹里的字体包。
+
+1. 打开字体文件夹，根据不同系统需要选择OTF或TTF版本
+2. 字体所包含只有一个字重（双击安装）。
--- a/static/font/东方大楷/LICENSE.txt
+++ b/static/font/东方大楷/LICENSE.txt
@@ -0,0 +1,11 @@
+1. 阿里妈妈东方大楷体字体及包含该字体的字库软件，合称“阿里妈妈东方大楷体”。
+
+2. 阿里妈妈东方大楷体的知识产权和相关权益归属于淘宝（中国）软件有限公司（以下简称“阿里妈妈”），受《中华人民共和国著作权法》及其他适用法律法规、国际公约、条约的保护。
+
+3. 阿里妈妈授权个人、企业等用户在遵守本声明相关条款的前提下，可以下载、安装和使用上述阿里妈妈字体，该授权是免费的普通许可，用户可基于合法目的用于商业用途或非商业用途，但不得以任何违反本声明第4条及法律法规、政策、规章或公序良俗的方式使用。
+
+4. 除本法律声明中明确授权之外，阿里妈妈未授予用户关于阿里妈妈东方大楷体的其他权利。未经阿里妈妈授权，任何人不得：1）对阿里妈妈东方大楷体进行仿制、转换、翻译、反编译、反向工程、拆分、破解或以其他方式试图从该字库软件获取源代码；2）删除、覆盖或修改阿里妈妈东方大楷体法律声明的全部或部分内容；3）将阿里妈妈东方大楷体进行单独定价出售、出租、出借、转让、转授权、或采取其他未经阿里妈妈授权的行为；4) 发布任何使外界误认其与阿里妈妈或其关联公司存在合作、赞助或背书等商业关联的不实信息。
+
+5. 阿里妈妈授予用户的上述授权不附带任何明示或暗示的保证，不对任何人因从非阿里妈妈官方渠道或指定渠道下载、安装或使用阿里妈妈东方大楷体而引发的任何直接或间接损失承担责任。
+
+6. 本声明的解释、履行与争议解决适用中华人民共和国的法律。用户与阿里妈妈就阿里妈妈东方大楷体的使用若发生争议，双方应友好协商，若协商不成，任一方有权向浙江省杭州市有管辖权的人民法院提起诉讼。
--- a/static/font/刀隶体/AlimamaDaoLiTi.ttf
+++ b/static/font/刀隶体/AlimamaDaoLiTi.ttf
--- a/static/font/刀隶体/AlimamaDaoLiTi.woff
+++ b/static/font/刀隶体/AlimamaDaoLiTi.woff
--- a/static/font/刀隶体/AlimamaDaoLiTi.woff2
+++ b/static/font/刀隶体/AlimamaDaoLiTi.woff2
--- a/static/font/刀隶体/INSTRUCTION.txt
+++ b/static/font/刀隶体/INSTRUCTION.txt
@@ -0,0 +1,6 @@
+使用反馈、商业合作等问题，请email：
+alimama-font@list.alibaba-inc.com
+——
+重要！安装前请先阅读此文档
+请先按照下面流程安装文件夹里的字体包。
+1.  打开字体文件夹，根据不同系统需要选择 OTF 或 TTF 版本 
--- a/static/font/刀隶体/LICENSE.txt
+++ b/static/font/刀隶体/LICENSE.txt
@@ -0,0 +1,6 @@
+1.  阿里妈妈刀隶体字体及包含该字体的字库软件，合称“阿里妈妈刀隶体”。 
+2.  阿里妈妈刀隶体的知识产权和相关权益归属于淘宝（中国）软件有限公司（以下简称“阿里妈妈”），受《中华人民共和国著作权法》及其他适用法律法规、国际公约、条约的保护。 
+3.  阿里妈妈授权个人、企业等用户在遵守本声明相关条款的前提下，可以下载、安装和使用上述阿里妈妈字体，该授权是免费的普通许可，用户可基于合法目的用于商业用途或非商业用途，以及嵌入式使用，但不得以任何违反本声明第4条及法律法规、政策、规章或公序良俗的方式使用。 
+4.  除本法律声明中明确授权之外，阿里妈妈未授予用户关于阿里妈妈刀隶体的其他权利。未经阿里妈妈授权，任何人不得：1）对阿里妈妈刀隶体进行仿制、转换、翻译、反编译、反向工程、拆分、破解或以其他方式试图从该字库软件获取源代码；2）对阿里妈妈刀隶体进行新增、拆分、修改或以其他方式进行二次创作；3）对阿里妈妈刀隶体进行有偿方式转让、授权或许可给第三方/商家/用户使用；4) 标注错误或不标注版权所有人阿里妈妈，无法标注版权所有人的情况除外；5）发布任何使外界误认其与阿里妈妈或其关联公司存在合作、赞助或背书等商业关联的不实信息。 
+5.  阿里妈妈授予用户的上述授权不附带任何明示或暗示的保证，不对任何人因从非阿里妈妈官方渠道或指定渠道下载、安装或使用阿里妈妈刀隶体而引发的任何直接或间接损失承担责任。 
+6.  本声明的解释、履行与争议解决适用中华人民共和国的法律。用户与阿里妈妈就阿里妈妈刀隶体的使用若发生争议，双方应友好协商，若协商不成，任一方有权向浙江省杭州市有管辖权的人民法院提起诉讼。 
--- a/static/font/数黑体/AlimamaShuHeiTi-Bold.otf
+++ b/static/font/数黑体/AlimamaShuHeiTi-Bold.otf
--- a/static/font/数黑体/AlimamaShuHeiTi-Bold.ttf
+++ b/static/font/数黑体/AlimamaShuHeiTi-Bold.ttf
--- a/static/font/数黑体/AlimamaShuHeiTi-Bold.woff
+++ b/static/font/数黑体/AlimamaShuHeiTi-Bold.woff
--- a/static/font/数黑体/AlimamaShuHeiTi-Bold.woff2
+++ b/static/font/数黑体/AlimamaShuHeiTi-Bold.woff2
--- a/static/font/数黑体/INSTRUCTION.txt
+++ b/static/font/数黑体/INSTRUCTION.txt
@@ -0,0 +1,19 @@
+A. 在哪里可以下载阿里妈妈数黑体？
+渠道一：https://www.iconfont.cn/fonts/detail?cnid=a9fXc2HD9n7s
+渠道二：fonts.alibabagroup.com
+
+
+B. 阿里阿里妈妈数黑体简介
+基本信息：阿里妈妈数黑体为中文简体字库，收纳的中文字符包括但不限于GB2312，共计6767个汉字；英文大小写共52个；常用标点符号共206个，总计7025个字符。 
+
+设计说明：阿里妈妈数黑体字型饱满、体态中正，布白极具现代韵律，落笔厚实而简练；字里行间流露出先锋、前卫和时尚的视觉感受。适用于电商、广告、品牌形象、推广物料等场景。
+
+C. 使用反馈、商业合作等问题，请email：
+alimama-font@list.alibaba-inc.com
+——
+重要！安装前请先阅读此文档
+请先按照下面流程安装文件夹里的字体包。
+
+1. 打开字体文件夹，根据不同系统需要选择OTF或TTF版本
+
+2. 字体所包含只有一个字重（双击安装）。
--- a/static/font/数黑体/LICENSE.txt
+++ b/static/font/数黑体/LICENSE.txt
@@ -0,0 +1,15 @@
+阿里妈妈数黑体法律声明
+
+1. 阿里妈妈数黑体字体及包含该字体的字库软件，合称“阿里妈妈数黑体”。
+
+2. 阿里妈妈数黑体的知识产权和相关权益归属于淘宝（中国）软件有限公司（以下简称“阿里妈妈”），受《中华人民共和国著作权法》及其他适用法律法规、国际公约、条约的保护。
+
+3. 阿里妈妈授权个人、企业等用户在遵守本声明相关条款的前提下，可以下载、安装和使用上述阿里妈妈字体，该授权是免费的普通许可，用户可基于合法目的用于商业用途或非商业用途，但不得以任何违反本声明第4条及法律法规、政策、规章或公序良俗的方式使用。
+
+4. 除本法律声明中明确授权之外，阿里妈妈未授予用户关于阿里妈妈数黑体的其他权利。未经阿里妈妈授权，任何人不得：1）对阿里妈妈数黑体进行仿制、转换、翻译、反编译、反向工程、拆分、破解或以其他方式试图从该字库软件获取源代码；2）删除、覆盖或修改阿里妈妈数黑体法律声明的全部或部分内容；3）将阿里妈妈数黑体进行单独定价出售、出租、出借、转让、转授权、或采取其他未经阿里妈妈授权的行为；4) 发布任何使外界误认其与阿里妈妈或其关联公司存在合作、赞助或背书等商业关联的不实信息。
+
+5. 阿里妈妈授予用户的上述授权不附带任何明示或暗示的保证，不对任何人因从非阿里妈妈官方渠道或指定渠道下载、安装或使用阿里妈妈数黑体而引发的任何直接或间接损失承担责任。
+
+6. 本声明的解释、履行与争议解决适用中华人民共和国的法律。用户与阿里妈妈就阿里妈妈数黑体的使用若发生争议，双方应友好协商，若协商不成，任一方有权向浙江省杭州市有管辖权的人民法院提起诉讼。
+
+反馈与咨询联系方：alimama-font@list.alibaba-inc.com
--- a/static/images/index-icons/arrow-leftward.svg
+++ b/static/images/index-icons/arrow-leftward.svg
@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#909399" />
+  <path d="M190 128 L60 128 M110 80 L60 128 110 176" stroke="white" stroke-width="20" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+</svg>
--- a/static/images/index-icons/arrow-rightward.svg
+++ b/static/images/index-icons/arrow-rightward.svg
@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#909399" />
+  <path d="M60 128 L190 128 M140 80 L190 128 140 176" stroke="white" stroke-width="20" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+</svg>
--- a/static/images/index-icons/arrow-upward.svg
+++ b/static/images/index-icons/arrow-upward.svg
@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#909399" />
+  <path d="M128 60 L128 190 M80 110 L128 60 176 110" stroke="white" stroke-width="20" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+</svg>
--- a/static/images/index-icons/download.svg
+++ b/static/images/index-icons/download.svg
@@ -0,0 +1,5 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#2979ff" />
+  <path d="M128 40 L128 170 M80 120 L128 170 176 120" stroke="white" stroke-width="20" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+  <rect x="60" y="190" width="136" height="30" rx="8" ry="8" fill="white" />
+</svg>
--- a/static/images/index-icons/edit-pen.svg
+++ b/static/images/index-icons/edit-pen.svg
@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#ff9900" />
+  <path d="M180 80 L140 120 M100 160 L60 200 L40 180 L80 140 L100 160 Z M140 120 L100 160" stroke="white" stroke-width="15" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+</svg>
--- a/static/images/index-icons/grid-fill.svg
+++ b/static/images/index-icons/grid-fill.svg
@@ -0,0 +1,7 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#19be6b" />
+  <rect x="50" y="50" width="60" height="60" rx="10" ry="10" fill="white" />
+  <rect x="146" y="50" width="60" height="60" rx="10" ry="10" fill="white" />
+  <rect x="50" y="146" width="60" height="60" rx="10" ry="10" fill="white" />
+  <rect x="146" y="146" width="60" height="60" rx="10" ry="10" fill="white" />
+</svg>
--- a/static/images/index-icons/grid.svg
+++ b/static/images/index-icons/grid.svg
@@ -0,0 +1,7 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#19be6b" />
+  <rect x="50" y="50" width="60" height="60" rx="10" ry="10" fill="none" stroke="white" stroke-width="10" />
+  <rect x="146" y="50" width="60" height="60" rx="10" ry="10" fill="none" stroke="white" stroke-width="10" />
+  <rect x="50" y="146" width="60" height="60" rx="10" ry="10" fill="none" stroke="white" stroke-width="10" />
+  <rect x="146" y="146" width="60" height="60" rx="10" ry="10" fill="none" stroke="white" stroke-width="10" />
+</svg>
--- a/static/images/index-icons/list-dot.svg
+++ b/static/images/index-icons/list-dot.svg
@@ -0,0 +1,9 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#ff9900" />
+  <circle cx="100" cy="80" r="15" fill="white" />
+  <circle cx="100" cy="128" r="15" fill="white" />
+  <circle cx="100" cy="176" r="15" fill="white" />
+  <rect x="130" y="70" width="80" height="20" rx="5" ry="5" fill="white" />
+  <rect x="130" y="118" width="80" height="20" rx="5" ry="5" fill="white" />
+  <rect x="130" y="166" width="80" height="20" rx="5" ry="5" fill="white" />
+</svg>
--- a/static/images/index-icons/rewind-right-fill.svg
+++ b/static/images/index-icons/rewind-right-fill.svg
@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#19be6b" />
+  <path d="M100 80 L100 176 L60 128 Z M156 80 L156 176 L196 128 Z" fill="white" />
+</svg>
--- a/static/images/index-icons/scan.svg
+++ b/static/images/index-icons/scan.svg
@@ -0,0 +1,6 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#ff9900" />
+  <rect x="40" y="60" width="176" height="136" rx="10" ry="10" fill="none" stroke="white" stroke-width="15" />
+  <path d="M40 100 L60 100 M40 140 L60 140 M216 100 L196 100 M216 140 L196 140 M100 60 L100 40 M156 60 L156 40 M100 216 L100 196 M156 216 L156 196" stroke="white" stroke-width="15" stroke-linecap="round" />
+  <rect x="90" y="110" width="76" height="36" rx="5" ry="5" fill="white" />
+</svg>
--- a/static/images/index-icons/search.svg
+++ b/static/images/index-icons/search.svg
@@ -0,0 +1,5 @@
+<svg width="128" height="128" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <rect x="10" y="10" width="236" height="236" rx="20" ry="20" fill="#ff9900" />
+  <circle cx="110" cy="110" r="50" stroke="white" stroke-width="15" fill="none" />
+  <path d="M150 150 L190 190" stroke="white" stroke-width="15" stroke-linecap="round" />
+</svg>
--- a/static/images/login-icons/account.svg
+++ b/static/images/login-icons/account.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="#909399" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
+  <circle cx="12" cy="7" r="4"></circle>
+</svg>
--- a/static/images/login-icons/ie.svg
+++ b/static/images/login-icons/ie.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="#909399" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path>
+</svg>
--- a/static/images/login-icons/lock.svg
+++ b/static/images/login-icons/lock.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="#909399" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
+  <path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
+</svg>
--- a/static/images/login-icons/login.png
+++ b/static/images/login-icons/login.png
--- a/static/scss/colorui.css
+++ b/static/scss/colorui.css
@@ -14,7 +14,7 @@ body {
 	background-color: #f1f1f1;
 	font-size: 28upx;
 	color: #333333;
-	font-family: Helvetica Neue, Helvetica, sans-serif;
+	/* font-family: Helvetica Neue, Helvetica, sans-serif; */
 }

 view,
--- a/static/scss/index.scss
+++ b/static/scss/index.scss
@@ -2,5 +2,7 @@
@import "./global.scss";
 // color-ui
@import "@/static/scss/colorui.css";
+// global font
+@import "@/static/font/global-font.css";
 // iconfont
-@import "@/static/font/iconfont.css";
+//@import "@/static/font/iconfont.css";