fhKeeper/formulahousekeeper/timesheet_h5/.env.development

@@ -0,0 +1,2 @@
+NODE_ENV="development"
+VUE_APP_URL="http://192.168.5.184:10010"

fhKeeper/formulahousekeeper/timesheet_h5/.env.production

@@ -0,0 +1,3 @@
+# 配置生产地址,就是你将来发布上线的地址
+NODE_ENV="production"
+VUE_APP_URL="http://192.168.5.184:10010"

fhKeeper/formulahousekeeper/timesheet_h5/.gitignore

@@ -0,0 +1,22 @@
+.DS_Store
+node_modules
+/dist
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.svn
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

fhKeeper/formulahousekeeper/timesheet_h5/README.bak.md

@@ -0,0 +1,49 @@
+# 知识体系
+
+#### 封装 axios
+
+1. 使用拦截器统一处理请求和响应数据
+2. 挂载到原型上
+
+#### 上拉加载更多
+
+1. vant 的组件
+2. 设置初始高度，不然 bug 很严重
+
+#### 懒加载
+
+1. 懒加载是什么
+2. 如何实现
+
+#### 环境配置
+
+1. 根目录新建 .env.development （测试环境） 文件
+
+   ```
+   VUE_APP_URL="http://132.232.87.95:3000/api"
+   ```
+
+   然后新建。env.production（生产环境）文件
+
+   ```
+   VUE_APP_URL="http://132.232.94.151:3000/api"
+   ```
+
+2. 配置 package.json
+
+   ```
+    "scripts": {
+       "serve": "vue-cli-service serve --model",
+       "build": "vue-cli-service build --model",
+       "lint": "vue-cli-service lint"
+     },
+   ```
+
+3. 项目中通过 process.env.VUE_APP_URL  访问 VUE_APP_URL 的值，不同的环境取到的值不一样
+
+#### 打包部署
+
+#### 移动端适配
+
+1. amfe-flexib 设置 root 元素字体大小
+2. pxtorem  px 转 rem

fhKeeper/formulahousekeeper/timesheet_h5/README.md

@@ -0,0 +1,140 @@
+# vue 移动端模板
+
+#### 启动项目
+1. npm i 安装依赖
+1. npm run serve 启动项目
+1. cd server  (接口目录)
+1. npm i 
+1. npm run dev
+
+
+>#### 核心知识体系简介
+1. vue-cli3 脚手架
+    * 创建项目
+    * 开发环境和生产环境配置
+    * 配置跨域
+    
+2. vue-router 路由
+    * 路由配置
+    * 子路由配置
+    * 路由守卫，设置页面标题和根据登录状态判断是否允许进入特定页面
+    * 对router-link使用active-class,高亮当前路由
+    
+3. vuex 跨组件通信
+    * vuex 配置
+    * vuex 持久化
+    * vuex 使用
+    
+4. rem 移动端适配
+    * 通过 amfe-flexibe 设置 root 元素的字体大小
+    * 通过 pxtorem 把 px 转成 rem, 无需手动书写 rem
+    
+5. axios 配置
+    * 使用拦截器配置 baseURL 和给请求头加上 token
+    * 使用拦截器对返回的数据进行处理
+    * 挂载到 vue 原型上，方便使用
+    
+6. promise 使用
+    
+    * 在项目中使用 async await 把异步变成同步，编写和阅读更舒服
+    
+7. 有赞 vant-ui 库
+    * 导航栏
+    * 单元格
+    * loading
+    * ......
+    
+8. 使用keep-alive组件缓存某些组件(新增)
+
+9. 添加小型服务器接口,用来编写本项目所需接口
+
+    
+
+>####  vue-cli3 脚手架
+1. 具体操作,请移步[vue-cli3文档官网]( [https://cli.vuejs.org/zh/guide/installation.html](https://links.jianshu.com/go?to=https%3A%2F%2Fcli.vuejs.org%2Fzh%2Fguide%2Finstallation.html)
+)
+2. **开发环境和生产环境配置**
+  * 根目录新建两文件 .env.development => 开发环境配置  .env.production => 生产环境配置
+![image.png](https://upload-images.jianshu.io/upload_images/7177443-4f2c42f1c1bc4439.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+文件内容
+
+```
+// .env.development
+VUE_APP_URL="https://www.easy-mock.com/mock/5cd62747d3a84206275d58d1/huruqing/api"
+```
+
+```
+// .env.production
+VUE_APP_URL="https://www.easy-mock.com/mock/5cd62747d3a84206275d58d1/huruqing/api"
+```
+
+3. **package.json 配置**
+vue-cli3默认已经给你配置好了model, 开发环境对应development, 生产环境对应production,如果你不知道model,请移步[webpack文档官网]([https://www.webpackjs.com/](https://www.webpackjs.com/)
+)
+![image.png](https://upload-images.jianshu.io/upload_images/7177443-5e9e447da363cfca.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+4. 在你的项目中，通过  process.env.VUE_APP_URL 可以访问到你在环境配置文件中设置的变量
+![](https://upload-images.jianshu.io/upload_images/7177443-d585aa842e655950.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+![开发环境中的变量](https://upload-images.jianshu.io/upload_images/7177443-02325513adfb846f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+
+>####  vue-router 路由
+这里主要讲一下路由守卫的配置，先上图
+![路由配置](https://upload-images.jianshu.io/upload_images/7177443-5f45913a5d70bf4d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+下面是路由守卫配置
+![路由守卫](https://upload-images.jianshu.io/upload_images/7177443-a935a3506fd9f567.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+
+>####  vuex 跨组件通信
+1. 项目中有以下几个地方用到了 vuex
+    * 设置登录状态
+    * 设置用户名
+    * 保存 token
+2. 以登录为里，做个简单说明
+![](https://upload-images.jianshu.io/upload_images/7177443-825e2e816a49413b.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+登录成功时，修改登陆状态为 true
+![image.png](https://upload-images.jianshu.io/upload_images/7177443-906c4cc3e5713830.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+退出登录时，修改登录状态为 false
+![](https://upload-images.jianshu.io/upload_images/7177443-1da2a2e9208c1872.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+4. 获取 store 中 state 设置的变量通过 mapGetters, 看图
+![](https://upload-images.jianshu.io/upload_images/7177443-61be719b7d9c8a43.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+![在模板中使用](https://upload-images.jianshu.io/upload_images/7177443-8b2c372f88a0f59e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+
+3. vuex 持久化
+    * 使用 vuex-persistedstate 插件对 vuex 的状态持久化
+    * 等你的页面刷新时，状态依然存在
+    * 本质上是这个插件帮你把状态都存到了 localStorage
+配置方法，以下是最简单的配置
+![](https://upload-images.jianshu.io/upload_images/7177443-0aa53dbad9057879.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+使用了 vuex-persistedstate 插件后，store 里的状态都存到了 localStorage
+![image.png](https://upload-images.jianshu.io/upload_images/7177443-9cf6e3db49baf726.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+
+>#### rem 移动端适配
+适配原理我就不多说了,不清楚请看我的另外一篇文章[用rem编写移动端自适应网页](https://www.jianshu.com/p/91ac1690be89)(https://www.jianshu.com/p/91ac1690be89),这里说一下在vue-cli3中是如何配置的
+1. 安装 amfe-flexible 插件 ```npm i amfe-flexible --save-dev```
+2. 在 main.js 中导入
+![ipone6](https://upload-images.jianshu.io/upload_images/7177443-05c1792eb5cfab79.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+3. 此时你的应用的 html 会自动根据手机的尺寸设置了 font-size, 如图
+![](https://upload-images.jianshu.io/upload_images/7177443-5ea467230b5426e0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+![](https://upload-images.jianshu.io/upload_images/7177443-ee3e3fda5ec57b39.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+4. 配置 pxtorem 插件，能帮你自动把 rem 转成 px, 具体配置如下，在项目根目录下的 vue.config.js（没有则新建）
+里进行配置，如图
+![](https://upload-images.jianshu.io/upload_images/7177443-2b6e79201971d86d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+
+>####  axios 配置
+1. axios 拦截器
+能帮我们对数据进行一些统一的处理，比如后台给我们的数据里都是把数据包在 data 对象里面，而使用 axios, 则又会再用 data 把返回的数据再包一层，如果不统一处理以下，用起来很不爽。
+2. 设置请求头，后台识别用户经常使用 token, 我们登陆的时候能拿到后台返回的 token, 然后存入 store 里，当我们发送请求时，我们可以给请求头统一加上 token, 如图
+![](https://upload-images.jianshu.io/upload_images/7177443-2a42eb0010cde4a1.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+3. 把 axios 的实例挂载到 vue 的实例上
+![](https://upload-images.jianshu.io/upload_images/7177443-5163a952efbac676.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+发请求的时候，只需要使用 this.$axios.get 或者 this.$axios.post 就行了，是不是很方便
+![](https://upload-images.jianshu.io/upload_images/7177443-5a0bd9bbec047aa7.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+
+>#### Promise 的使用
+promise 是个好东西，可以把异步变同步，在项目中使用 async await 编写代码，那叫一个爽，具体用法如下：
+![](https://upload-images.jianshu.io/upload_images/7177443-9f357fbd0a04215a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
+
+>#### 有赞 vant-ui 库
+有赞是搞电商开发的,在公众号和小程序模板界算是做得比较不错的,vant-ui是他们开源出来的一个ui库,同时他们还有小程序的ui库,感兴趣的小伙伴可以去[看看](https://youzan.github.io/vant/)(https://youzan.github.io/vant/)
+
+>
+
+

fhKeeper/formulahousekeeper/timesheet_h5/babel.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+    plugins: [
+        [
+            "import",
+            {
+                libraryName: "vant",
+                libraryDirectory: "es",
+                // 指定样式路径
+                style: name => `${name}/style/less`
+            },
+            "vant"
+        ],
+        ["@babel/plugin-syntax-dynamic-import"]
+    ]
+};

fhKeeper/formulahousekeeper/timesheet_h5/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "maizuo-h6",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve --model",
+    "dev": "vue-cli-service serve --model",
+    "prod": "vue-cli-service serve --model production",
+    "build": "vue-cli-service build --model",
+    "push": "git add . && git commit -m'xxx' && git push",
+    "lint": "vue-cli-service lint"
+  },
+  "dependencies": {
+    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
+    "babel-plugin-import": "^1.12.2",
+    "core-js": "^2.6.5",
+    "css-loader": "^3.2.0",
+    "echarts": "^4.2.1",
+    "style-loader": "^1.0.0",
+    "vant": "^2.5.2",
+    "vue": "^2.6.10",
+    "vuex-persistedstate": "^2.5.4"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "^3.7.0",
+    "@vue/cli-plugin-eslint": "^3.7.0",
+    "@vue/cli-service": "^3.7.0",
+    "amfe-flexible": "^2.2.1",
+    "autoprefixer": "^9.5.1",
+    "axios": "^0.18.0",
+    "babel-eslint": "^10.0.1",
+    "eslint": "^5.16.0",
+    "eslint-plugin-vue": "^5.0.0",
+    "less": "^3.9.0",
+    "less-loader": "^5.0.0",
+    "postcss-loader": "^3.0.0",
+    "postcss-pxtorem": "^4.0.1",
+    "vant": "^2.2.9",
+    "vue-router": "^3.0.6",
+    "vue-template-compiler": "^2.5.21",
+    "vuex": "^3.1.0"
+  },
+  "eslintConfig": {
+    "root": true,
+    "env": {
+      "node": true
+    },
+    "extends": [],
+    "rules": {},
+    "parserOptions": {
+      "parser": "babel-eslint"
+    }
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions"
+  ]
+}

fhKeeper/formulahousekeeper/timesheet_h5/public/index.html

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <!-- <meta name="viewport" content="width=device-width,initial-scale=1.0"> -->
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title>工时管家</title>
+    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1456778_1mgn5degp7t.css">
+    <script src="https://cdn.bootcss.com/axios/0.19.0-beta.1/axios.min.js"></script>
+</head>
+
+<body>
+    <noscript>
+        <strong>非常抱歉，网页丢了</strong>
+    </noscript>
+    <div id="app"></div>
+</body>
+
+</html>

fhKeeper/formulahousekeeper/timesheet_h5/src/App.vue

@@ -0,0 +1,18 @@
+<template>
+    <div>
+        <keep-alive>
+            <router-view v-if="$route.meta.keepAlive"></router-view>
+        </keep-alive>
+        <router-view v-if="!$route.meta.keepAlive"></router-view>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "app",
+    created() { }
+};
+</script>
+
+
+

fhKeeper/formulahousekeeper/timesheet_h5/src/assets/style/common.less

@@ -0,0 +1,363 @@
+body {
+  background: #f4f4f4;
+  font-size: 16px !important;
+}
+
+.bd {
+  border: 1px solid;
+}
+
+.bdb {
+  border-bottom: 1px solid #ebebeb;
+}
+
+.ovh {
+  overflow: hidden;
+}
+
+.h100pc {
+  height: 100%;
+}
+
+.w100pc {
+  width: 100%;
+}
+
+.dsn {
+  display: none;
+}
+
+.fixed {
+  position: fixed;
+}
+
+.rel {
+  position: relative;
+}
+
+.abs {
+  position: absolute;
+}
+
+.tac {
+  text-align: center;
+}
+
+.lh15 {
+  line-height: 1.5;
+}
+
+/* 颜色 */
+.f999 {
+  color: #999;
+}
+
+.fff {
+  color: #ffffff;
+}
+
+.orange {
+  color: #ff5f16;
+}
+
+/* 背景颜色 */
+.bg-green {
+  background: green;
+}
+
+.bg-gray {
+  background: gray;
+}
+
+.bg-fff {
+  background: #ffffff;
+}
+
+/* 弹性盒子公共样式 */
+/* 排列方向-横向排列 */
+.flex {
+  display: flex;
+}
+
+/* 纵向排列 */
+.flex2 {
+  display: flex;
+  flex-direction: column;
+}
+
+/* 水平居中,垂直居中 */
+.fcc {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+/* 两端对齐 */
+.jc-sb {
+  justify-content: space-between;
+}
+
+/* 分散对齐 */
+.jc-sa {
+  justify-content: space-around;
+}
+
+/* 垂直居中 */
+.aic {
+  align-items: center;
+}
+
+/* 分配剩余空间 */
+.fg1 {
+  flex-grow: 1;
+}
+
+.fg2 {
+  flex-grow: 2;
+}
+
+
+/* 字体设置 */
+.f0 {
+  font-size: 0px
+}
+
+.f8 {
+  font-size: 8px
+}
+
+.f10 {
+  font-size: 10px
+}
+
+.f12 {
+  font-size: 12px
+}
+
+.f14 {
+  font-size: 14px
+}
+
+.f16 {
+  font-size: 16px
+}
+
+.f18 {
+  font-size: 18px
+}
+
+.f20 {
+  font-size: 20px
+}
+
+.f22 {
+  font-size: 22px
+}
+
+.f24 {
+  font-size: 24px
+}
+
+.f26 {
+  font-size: 26px
+}
+
+/* margin-top设置 */
+.mt-5 {
+  margin-top: 5px;
+}
+
+.mt-10 {
+  margin-top: 10px;
+}
+
+.mt-15 {
+  margin-top: 15px;
+}
+
+.mt-20 {
+  margin-top: 20px;
+}
+
+.mt-25 {
+  margin-top: 25px;
+}
+
+.mt-30 {
+  margin-top: 30px;
+}
+
+/* margin-bottom设置 */
+.mb-5 {
+  margin-bottom: 5px;
+}
+
+.mb-10 {
+  margin-bottom: 10px;
+}
+
+.mb-15 {
+  margin-bottom: 15px;
+}
+
+.mb-20 {
+  margin-bottom: 20px;
+}
+
+.mb-25 {
+  margin-bottom: 25px;
+}
+
+.mb-30 {
+  margin-bottom: 30px;
+}
+
+/* margin-left设置 */
+.ml-5 {
+  margin-left: 5px;
+}
+
+.ml-10 {
+  margin-left: 10px;
+}
+
+.ml-15 {
+  margin-left: 15px;
+}
+
+.ml-20 {
+  margin-left: 20px;
+}
+
+.ml-25 {
+  margin-left: 25px;
+}
+
+.ml-30 {
+  margin-left: 30px;
+}
+
+/* margin-right设置 */
+.mr-5 {
+  margin-right: 5px;
+}
+
+.mr-10 {
+  margin-right: 10px;
+}
+
+.mr-15 {
+  margin-right: 15px;
+}
+
+.mr-20 {
+  margin-right: 20px;
+}
+
+.mr-25 {
+  margin-right: 25px;
+}
+
+.mr-30 {
+  margin-right: 30px;
+}
+
+/* padding-top设置 */
+.pt-5 {
+  padding-top: 5px;
+}
+
+.pt-10 {
+  padding-top: 10px;
+}
+
+.pt-15 {
+  padding-top: 15px;
+}
+
+.pt-20 {
+  padding-top: 20px;
+}
+
+.pt-25 {
+  padding-top: 25px;
+}
+
+.pt-30 {
+  padding-top: 30px;
+}
+
+/* padding-bottom设置 */
+.pb-5 {
+  padding-bottom: 5px;
+}
+
+.pb-10 {
+  padding-bottom: 10px;
+}
+
+.pb-15 {
+  padding-bottom: 15px;
+}
+
+.pb-20 {
+  padding-bottom: 20px;
+}
+
+.pb-25 {
+  padding-bottom: 25px;
+}
+
+.pb-30 {
+  padding-bottom: 30px;
+}
+
+/* padding-left设置 */
+.pl-5 {
+  padding-left: 5px;
+}
+
+.pl-10 {
+  padding-left: 10px;
+}
+
+.pl-15 {
+  padding-left: 15px;
+}
+
+.pl-20 {
+  padding-left: 20px;
+}
+
+.pl-25 {
+  padding-left: 25px;
+}
+
+.pl-30 {
+  padding-left: 30px;
+}
+
+/* padding-right设置 */
+.pr-5 {
+  padding-right: 5px;
+}
+
+.pr-10 {
+  padding-right: 10px;
+}
+
+.pr-15 {
+  padding-right: 15px;
+}
+
+.pr-20 {
+  padding-right: 20px;
+}
+
+.pr-25 {
+  padding-right: 25px;
+}
+
+.pr-30 {
+  padding-right: 30px;
+}

fhKeeper/formulahousekeeper/timesheet_h5/src/assets/style/font/demo.css

@@ -0,0 +1,539 @@
+/* Logo 字体 */
+@font-face {
+  font-family: "iconfont logo";
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
+}
+
+.logo {
+  font-family: "iconfont logo";
+  font-size: 160px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+/* tabs */
+.nav-tabs {
+  position: relative;
+}
+
+.nav-tabs .nav-more {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  height: 42px;
+  line-height: 42px;
+  color: #666;
+}
+
+#tabs {
+  border-bottom: 1px solid #eee;
+}
+
+#tabs li {
+  cursor: pointer;
+  width: 100px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  font-size: 16px;
+  border-bottom: 2px solid transparent;
+  position: relative;
+  z-index: 1;
+  margin-bottom: -1px;
+  color: #666;
+}
+
+
+#tabs .active {
+  border-bottom-color: #f00;
+  color: #222;
+}
+
+.tab-container .content {
+  display: none;
+}
+
+/* 页面布局 */
+.main {
+  padding: 30px 100px;
+  width: 960px;
+  margin: 0 auto;
+}
+
+.main .logo {
+  color: #333;
+  text-align: left;
+  margin-bottom: 30px;
+  line-height: 1;
+  height: 110px;
+  margin-top: -50px;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.main .logo a {
+  font-size: 160px;
+  color: #333;
+}
+
+.helps {
+  margin-top: 40px;
+}
+
+.helps pre {
+  padding: 20px;
+  margin: 10px 0;
+  border: solid 1px #e7e1cd;
+  background-color: #fffdef;
+  overflow: auto;
+}
+
+.icon_lists {
+  width: 100% !important;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.icon_lists li {
+  width: 100px;
+  margin-bottom: 10px;
+  margin-right: 20px;
+  text-align: center;
+  list-style: none !important;
+  cursor: default;
+}
+
+.icon_lists li .code-name {
+  line-height: 1.2;
+}
+
+.icon_lists .icon {
+  display: block;
+  height: 100px;
+  line-height: 100px;
+  font-size: 42px;
+  margin: 10px auto;
+  color: #333;
+  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
+  -moz-transition: font-size 0.25s linear, width 0.25s linear;
+  transition: font-size 0.25s linear, width 0.25s linear;
+}
+
+.icon_lists .icon:hover {
+  font-size: 100px;
+}
+
+.icon_lists .svg-icon {
+  /* 通过设置 font-size 来改变图标大小 */
+  width: 1em;
+  /* 图标和文字相邻时，垂直对齐 */
+  vertical-align: -0.15em;
+  /* 通过设置 color 来改变 SVG 的颜色/fill */
+  fill: currentColor;
+  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
+      normalize.css 中也包含这行 */
+  overflow: hidden;
+}
+
+.icon_lists li .name,
+.icon_lists li .code-name {
+  color: #666;
+}
+
+/* markdown 样式 */
+.markdown {
+  color: #666;
+  font-size: 14px;
+  line-height: 1.8;
+}
+
+.highlight {
+  line-height: 1.5;
+}
+
+.markdown img {
+  vertical-align: middle;
+  max-width: 100%;
+}
+
+.markdown h1 {
+  color: #404040;
+  font-weight: 500;
+  line-height: 40px;
+  margin-bottom: 24px;
+}
+
+.markdown h2,
+.markdown h3,
+.markdown h4,
+.markdown h5,
+.markdown h6 {
+  color: #404040;
+  margin: 1.6em 0 0.6em 0;
+  font-weight: 500;
+  clear: both;
+}
+
+.markdown h1 {
+  font-size: 28px;
+}
+
+.markdown h2 {
+  font-size: 22px;
+}
+
+.markdown h3 {
+  font-size: 16px;
+}
+
+.markdown h4 {
+  font-size: 14px;
+}
+
+.markdown h5 {
+  font-size: 12px;
+}
+
+.markdown h6 {
+  font-size: 12px;
+}
+
+.markdown hr {
+  height: 1px;
+  border: 0;
+  background: #e9e9e9;
+  margin: 16px 0;
+  clear: both;
+}
+
+.markdown p {
+  margin: 1em 0;
+}
+
+.markdown>p,
+.markdown>blockquote,
+.markdown>.highlight,
+.markdown>ol,
+.markdown>ul {
+  width: 80%;
+}
+
+.markdown ul>li {
+  list-style: circle;
+}
+
+.markdown>ul li,
+.markdown blockquote ul>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown>ul li p,
+.markdown>ol li p {
+  margin: 0.6em 0;
+}
+
+.markdown ol>li {
+  list-style: decimal;
+}
+
+.markdown>ol li,
+.markdown blockquote ol>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown code {
+  margin: 0 3px;
+  padding: 0 5px;
+  background: #eee;
+  border-radius: 3px;
+}
+
+.markdown strong,
+.markdown b {
+  font-weight: 600;
+}
+
+.markdown>table {
+  border-collapse: collapse;
+  border-spacing: 0px;
+  empty-cells: show;
+  border: 1px solid #e9e9e9;
+  width: 95%;
+  margin-bottom: 24px;
+}
+
+.markdown>table th {
+  white-space: nowrap;
+  color: #333;
+  font-weight: 600;
+}
+
+.markdown>table th,
+.markdown>table td {
+  border: 1px solid #e9e9e9;
+  padding: 8px 16px;
+  text-align: left;
+}
+
+.markdown>table th {
+  background: #F7F7F7;
+}
+
+.markdown blockquote {
+  font-size: 90%;
+  color: #999;
+  border-left: 4px solid #e9e9e9;
+  padding-left: 0.8em;
+  margin: 1em 0;
+}
+
+.markdown blockquote p {
+  margin: 0;
+}
+
+.markdown .anchor {
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  margin-left: 8px;
+}
+
+.markdown .waiting {
+  color: #ccc;
+}
+
+.markdown h1:hover .anchor,
+.markdown h2:hover .anchor,
+.markdown h3:hover .anchor,
+.markdown h4:hover .anchor,
+.markdown h5:hover .anchor,
+.markdown h6:hover .anchor {
+  opacity: 1;
+  display: inline-block;
+}
+
+.markdown>br,
+.markdown>p>br {
+  clear: both;
+}
+
+
+.hljs {
+  display: block;
+  background: white;
+  padding: 0.5em;
+  color: #333333;
+  overflow-x: auto;
+}
+
+.hljs-comment,
+.hljs-meta {
+  color: #969896;
+}
+
+.hljs-string,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-strong,
+.hljs-emphasis,
+.hljs-quote {
+  color: #df5000;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-type {
+  color: #a71d5d;
+}
+
+.hljs-literal,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-attribute {
+  color: #0086b3;
+}
+
+.hljs-section,
+.hljs-name {
+  color: #63a35c;
+}
+
+.hljs-tag {
+  color: #333333;
+}
+
+.hljs-title,
+.hljs-attr,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-selector-attr,
+.hljs-selector-pseudo {
+  color: #795da3;
+}
+
+.hljs-addition {
+  color: #55a532;
+  background-color: #eaffea;
+}
+
+.hljs-deletion {
+  color: #bd2c00;
+  background-color: #ffecec;
+}
+
+.hljs-link {
+  text-decoration: underline;
+}
+
+/* 代码高亮 */
+/* PrismJS 1.15.0
+https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
+/**
+ * prism.js default theme for JavaScript, CSS and HTML
+ * Based on dabblet (http://dabblet.com)
+ * @author Lea Verou
+ */
+code[class*="language-"],
+pre[class*="language-"] {
+  color: black;
+  background: none;
+  text-shadow: 0 1px white;
+  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+  word-wrap: normal;
+  line-height: 1.5;
+
+  -moz-tab-size: 4;
+  -o-tab-size: 4;
+  tab-size: 4;
+
+  -webkit-hyphens: none;
+  -moz-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+}
+
+pre[class*="language-"]::-moz-selection,
+pre[class*="language-"] ::-moz-selection,
+code[class*="language-"]::-moz-selection,
+code[class*="language-"] ::-moz-selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+pre[class*="language-"]::selection,
+pre[class*="language-"] ::selection,
+code[class*="language-"]::selection,
+code[class*="language-"] ::selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+@media print {
+
+  code[class*="language-"],
+  pre[class*="language-"] {
+    text-shadow: none;
+  }
+}
+
+/* Code blocks */
+pre[class*="language-"] {
+  padding: 1em;
+  margin: .5em 0;
+  overflow: auto;
+}
+
+:not(pre)>code[class*="language-"],
+pre[class*="language-"] {
+  background: #f5f2f0;
+}
+
+/* Inline code */
+:not(pre)>code[class*="language-"] {
+  padding: .1em;
+  border-radius: .3em;
+  white-space: normal;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: slategray;
+}
+
+.token.punctuation {
+  color: #999;
+}
+
+.namespace {
+  opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: #905;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: #690;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: #9a6e3a;
+  background: hsla(0, 0%, 100%, .5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: #07a;
+}
+
+.token.function,
+.token.class-name {
+  color: #DD4A68;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+  color: #e90;
+}
+
+.token.important,
+.token.bold {
+  font-weight: bold;
+}
+
+.token.italic {
+  font-style: italic;
+}
+
+.token.entity {
+  cursor: help;
+}

fhKeeper/formulahousekeeper/timesheet_h5/src/assets/style/font/demo_index.html

@@ -0,0 +1,676 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8"/>
+  <title>IconFont Demo</title>
+  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
+  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
+  <link rel="stylesheet" href="demo.css">
+  <link rel="stylesheet" href="iconfont.css">
+  <script src="iconfont.js"></script>
+  <!-- jQuery -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
+  <!-- 代码高亮 -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
+</head>
+<body>
+  <div class="main">
+    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
+    <div class="nav-tabs">
+      <ul id="tabs" class="dib-box">
+        <li class="dib active"><span>Unicode</span></li>
+        <li class="dib"><span>Font class</span></li>
+        <li class="dib"><span>Symbol</span></li>
+      </ul>
+      
+      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1456778" target="_blank" class="nav-more">查看项目</a>
+      
+    </div>
+    <div class="tab-container">
+      <div class="content unicode" style="display: block;">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe601;</span>
+                <div class="name">待收货</div>
+                <div class="code-name">&amp;#xe601;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe678;</span>
+                <div class="name">搜索</div>
+                <div class="code-name">&amp;#xe678;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe677;</span>
+                <div class="name">首页</div>
+                <div class="code-name">&amp;#xe677;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe65c;</span>
+                <div class="name">设置</div>
+                <div class="code-name">&amp;#xe65c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60d;</span>
+                <div class="name">购物车—线</div>
+                <div class="code-name">&amp;#xe60d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60c;</span>
+                <div class="name">待发货</div>
+                <div class="code-name">&amp;#xe60c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe6b4;</span>
+                <div class="name">反馈</div>
+                <div class="code-name">&amp;#xe6b4;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe694;</span>
+                <div class="name">礼物</div>
+                <div class="code-name">&amp;#xe694;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe618;</span>
+                <div class="name">客服</div>
+                <div class="code-name">&amp;#xe618;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe614;</span>
+                <div class="name">钱包</div>
+                <div class="code-name">&amp;#xe614;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe733;</span>
+                <div class="name">下箭头</div>
+                <div class="code-name">&amp;#xe733;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe8a0;</span>
+                <div class="name"> 我的</div>
+                <div class="code-name">&amp;#xe8a0;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe670;</span>
+                <div class="name">打勾</div>
+                <div class="code-name">&amp;#xe670;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe641;</span>
+                <div class="name">home</div>
+                <div class="code-name">&amp;#xe641;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe606;</span>
+                <div class="name">购物车</div>
+                <div class="code-name">&amp;#xe606;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe72f;</span>
+                <div class="name">红包</div>
+                <div class="code-name">&amp;#xe72f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe604;</span>
+                <div class="name">缓存</div>
+                <div class="code-name">&amp;#xe604;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe619;</span>
+                <div class="name">定位</div>
+                <div class="code-name">&amp;#xe619;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe600;</span>
+                <div class="name">右箭头</div>
+                <div class="code-name">&amp;#xe600;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe624;</span>
+                <div class="name">退货</div>
+                <div class="code-name">&amp;#xe624;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe602;</span>
+                <div class="name">标准待分享2</div>
+                <div class="code-name">&amp;#xe602;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe8a1;</span>
+                <div class="name">下箭头</div>
+                <div class="code-name">&amp;#xe8a1;</div>
+              </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="unicode-">Unicode 引用</h2>
+          <hr>
+
+          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
+          <ul>
+            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
+            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
+            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
+          </ul>
+          <blockquote>
+            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
+          </blockquote>
+          <p>Unicode 使用步骤如下：</p>
+          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
+<pre><code class="language-css"
+>@font-face {
+  font-family: 'iconfont';
+  src: url('iconfont.eot');
+  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
+      url('iconfont.woff2') format('woff2'),
+      url('iconfont.woff') format('woff'),
+      url('iconfont.ttf') format('truetype'),
+      url('iconfont.svg#iconfont') format('svg');
+}
+</code></pre>
+          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
+<pre><code class="language-css"
+>.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
+<pre>
+<code class="language-html"
+>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
+</code></pre>
+          <blockquote>
+            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+          </blockquote>
+          </div>
+      </div>
+      <div class="content font-class">
+        <ul class="icon_lists dib-box">
+          
+          <li class="dib">
+            <span class="icon iconfont icon-daishouhuo"></span>
+            <div class="name">
+              待收货
+            </div>
+            <div class="code-name">.icon-daishouhuo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-sousuo"></span>
+            <div class="name">
+              搜索
+            </div>
+            <div class="code-name">.icon-sousuo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-shouye"></span>
+            <div class="name">
+              首页
+            </div>
+            <div class="code-name">.icon-shouye
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-shezhi"></span>
+            <div class="name">
+              设置
+            </div>
+            <div class="code-name">.icon-shezhi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-gouwuchexian"></span>
+            <div class="name">
+              购物车—线
+            </div>
+            <div class="code-name">.icon-gouwuchexian
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-1111113"></span>
+            <div class="name">
+              待发货
+            </div>
+            <div class="code-name">.icon-1111113
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconfontfankui"></span>
+            <div class="name">
+              反馈
+            </div>
+            <div class="code-name">.icon-iconfontfankui
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-liwu"></span>
+            <div class="name">
+              礼物
+            </div>
+            <div class="code-name">.icon-liwu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-kefu"></span>
+            <div class="name">
+              客服
+            </div>
+            <div class="code-name">.icon-kefu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-qianbao"></span>
+            <div class="name">
+              钱包
+            </div>
+            <div class="code-name">.icon-qianbao
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-xiajiantou"></span>
+            <div class="name">
+              下箭头
+            </div>
+            <div class="code-name">.icon-xiajiantou
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-wode"></span>
+            <div class="name">
+               我的
+            </div>
+            <div class="code-name">.icon-wode
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-dagou"></span>
+            <div class="name">
+              打勾
+            </div>
+            <div class="code-name">.icon-dagou
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-home"></span>
+            <div class="name">
+              home
+            </div>
+            <div class="code-name">.icon-home
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-tubiaolunkuo-"></span>
+            <div class="name">
+              购物车
+            </div>
+            <div class="code-name">.icon-tubiaolunkuo-
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-hongbao"></span>
+            <div class="name">
+              红包
+            </div>
+            <div class="code-name">.icon-hongbao
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-huancun"></span>
+            <div class="name">
+              缓存
+            </div>
+            <div class="code-name">.icon-huancun
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-yuejuan_Location"></span>
+            <div class="name">
+              定位
+            </div>
+            <div class="code-name">.icon-yuejuan_Location
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconfontyoujiantou-copy-copy-copy-copy"></span>
+            <div class="name">
+              右箭头
+            </div>
+            <div class="code-name">.icon-iconfontyoujiantou-copy-copy-copy-copy
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-tuihuo"></span>
+            <div class="name">
+              退货
+            </div>
+            <div class="code-name">.icon-tuihuo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-biaozhundaifenxiang"></span>
+            <div class="name">
+              标准待分享2
+            </div>
+            <div class="code-name">.icon-biaozhundaifenxiang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-xiajiantou-copy"></span>
+            <div class="name">
+              下箭头
+            </div>
+            <div class="code-name">.icon-xiajiantou-copy
+            </div>
+          </li>
+          
+        </ul>
+        <div class="article markdown">
+        <h2 id="font-class-">font-class 引用</h2>
+        <hr>
+
+        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
+        <p>与 Unicode 使用方式相比，具有如下特点：</p>
+        <ul>
+          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
+          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
+          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
+          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
+        </ul>
+        <p>使用步骤如下：</p>
+        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
+<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
+</code></pre>
+        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
+</code></pre>
+        <blockquote>
+          <p>"
+            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+        </blockquote>
+      </div>
+      </div>
+      <div class="content symbol">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-daishouhuo"></use>
+                </svg>
+                <div class="name">待收货</div>
+                <div class="code-name">#icon-daishouhuo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-sousuo"></use>
+                </svg>
+                <div class="name">搜索</div>
+                <div class="code-name">#icon-sousuo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-shouye"></use>
+                </svg>
+                <div class="name">首页</div>
+                <div class="code-name">#icon-shouye</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-shezhi"></use>
+                </svg>
+                <div class="name">设置</div>
+                <div class="code-name">#icon-shezhi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-gouwuchexian"></use>
+                </svg>
+                <div class="name">购物车—线</div>
+                <div class="code-name">#icon-gouwuchexian</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-1111113"></use>
+                </svg>
+                <div class="name">待发货</div>
+                <div class="code-name">#icon-1111113</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconfontfankui"></use>
+                </svg>
+                <div class="name">反馈</div>
+                <div class="code-name">#icon-iconfontfankui</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-liwu"></use>
+                </svg>
+                <div class="name">礼物</div>
+                <div class="code-name">#icon-liwu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-kefu"></use>
+                </svg>
+                <div class="name">客服</div>
+                <div class="code-name">#icon-kefu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-qianbao"></use>
+                </svg>
+                <div class="name">钱包</div>
+                <div class="code-name">#icon-qianbao</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-xiajiantou"></use>
+                </svg>
+                <div class="name">下箭头</div>
+                <div class="code-name">#icon-xiajiantou</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-wode"></use>
+                </svg>
+                <div class="name"> 我的</div>
+                <div class="code-name">#icon-wode</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-dagou"></use>
+                </svg>
+                <div class="name">打勾</div>
+                <div class="code-name">#icon-dagou</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-home"></use>
+                </svg>
+                <div class="name">home</div>
+                <div class="code-name">#icon-home</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-tubiaolunkuo-"></use>
+                </svg>
+                <div class="name">购物车</div>
+                <div class="code-name">#icon-tubiaolunkuo-</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-hongbao"></use>
+                </svg>
+                <div class="name">红包</div>
+                <div class="code-name">#icon-hongbao</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-huancun"></use>
+                </svg>
+                <div class="name">缓存</div>
+                <div class="code-name">#icon-huancun</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-yuejuan_Location"></use>
+                </svg>
+                <div class="name">定位</div>
+                <div class="code-name">#icon-yuejuan_Location</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconfontyoujiantou-copy-copy-copy-copy"></use>
+                </svg>
+                <div class="name">右箭头</div>
+                <div class="code-name">#icon-iconfontyoujiantou-copy-copy-copy-copy</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-tuihuo"></use>
+                </svg>
+                <div class="name">退货</div>
+                <div class="code-name">#icon-tuihuo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-biaozhundaifenxiang"></use>
+                </svg>
+                <div class="name">标准待分享2</div>
+                <div class="code-name">#icon-biaozhundaifenxiang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-xiajiantou-copy"></use>
+                </svg>
+                <div class="name">下箭头</div>
+                <div class="code-name">#icon-xiajiantou-copy</div>
+            </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="symbol-">Symbol 引用</h2>
+          <hr>
+
+          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
+            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
+          <ul>
+            <li>支持多色图标了，不再受单色限制。</li>
+            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
+            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
+            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
+          </ul>
+          <p>使用步骤如下：</p>
+          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
+<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
+</code></pre>
+          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
+<pre><code class="language-html">&lt;style&gt;
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+&lt;/style&gt;
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
+  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
+&lt;/svg&gt;
+</code></pre>
+          </div>
+      </div>
+
+    </div>
+  </div>
+  <script>
+  $(document).ready(function () {
+      $('.tab-container .content:first').show()
+
+      $('#tabs li').click(function (e) {
+        var tabContent = $('.tab-container .content')
+        var index = $(this).index()
+
+        if ($(this).hasClass('active')) {
+          return
+        } else {
+          $('#tabs li').removeClass('active')
+          $(this).addClass('active')
+
+          tabContent.hide().eq(index).fadeIn()
+        }
+      })
+    })
+  </script>
+</body>
+</html>

fhKeeper/formulahousekeeper/timesheet_h5/src/assets/style/font/iconfont.json

@@ -0,0 +1,163 @@
+{
+  "id": "1456778",
+  "name": "苏打优选",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "91804",
+      "name": "待收货",
+      "font_class": "daishouhuo",
+      "unicode": "e601",
+      "unicode_decimal": 58881
+    },
+    {
+      "icon_id": "908503",
+      "name": "搜索",
+      "font_class": "sousuo",
+      "unicode": "e678",
+      "unicode_decimal": 59000
+    },
+    {
+      "icon_id": "915611",
+      "name": "首页",
+      "font_class": "shouye",
+      "unicode": "e677",
+      "unicode_decimal": 58999
+    },
+    {
+      "icon_id": "1085722",
+      "name": "设置",
+      "font_class": "shezhi",
+      "unicode": "e65c",
+      "unicode_decimal": 58972
+    },
+    {
+      "icon_id": "1110582",
+      "name": "购物车—线",
+      "font_class": "gouwuchexian",
+      "unicode": "e60d",
+      "unicode_decimal": 58893
+    },
+    {
+      "icon_id": "1162363",
+      "name": "待发货",
+      "font_class": "1111113",
+      "unicode": "e60c",
+      "unicode_decimal": 58892
+    },
+    {
+      "icon_id": "1215021",
+      "name": "反馈",
+      "font_class": "iconfontfankui",
+      "unicode": "e6b4",
+      "unicode_decimal": 59060
+    },
+    {
+      "icon_id": "1382060",
+      "name": "礼物",
+      "font_class": "liwu",
+      "unicode": "e694",
+      "unicode_decimal": 59028
+    },
+    {
+      "icon_id": "1577002",
+      "name": "客服",
+      "font_class": "kefu",
+      "unicode": "e618",
+      "unicode_decimal": 58904
+    },
+    {
+      "icon_id": "1610138",
+      "name": "钱包",
+      "font_class": "qianbao",
+      "unicode": "e614",
+      "unicode_decimal": 58900
+    },
+    {
+      "icon_id": "1833855",
+      "name": "下箭头",
+      "font_class": "xiajiantou",
+      "unicode": "e733",
+      "unicode_decimal": 59187
+    },
+    {
+      "icon_id": "2076312",
+      "name": " 我的",
+      "font_class": "wode",
+      "unicode": "e8a0",
+      "unicode_decimal": 59552
+    },
+    {
+      "icon_id": "2392549",
+      "name": "打勾",
+      "font_class": "dagou",
+      "unicode": "e670",
+      "unicode_decimal": 58992
+    },
+    {
+      "icon_id": "2488741",
+      "name": "home",
+      "font_class": "home",
+      "unicode": "e641",
+      "unicode_decimal": 58945
+    },
+    {
+      "icon_id": "3670096",
+      "name": "购物车",
+      "font_class": "tubiaolunkuo-",
+      "unicode": "e606",
+      "unicode_decimal": 58886
+    },
+    {
+      "icon_id": "5294023",
+      "name": "红包",
+      "font_class": "hongbao",
+      "unicode": "e72f",
+      "unicode_decimal": 59183
+    },
+    {
+      "icon_id": "5452460",
+      "name": "缓存",
+      "font_class": "huancun",
+      "unicode": "e604",
+      "unicode_decimal": 58884
+    },
+    {
+      "icon_id": "5460006",
+      "name": "定位",
+      "font_class": "yuejuan_Location",
+      "unicode": "e619",
+      "unicode_decimal": 58905
+    },
+    {
+      "icon_id": "5849780",
+      "name": "右箭头",
+      "font_class": "iconfontyoujiantou-copy-copy-copy-copy",
+      "unicode": "e600",
+      "unicode_decimal": 58880
+    },
+    {
+      "icon_id": "7400719",
+      "name": "退货",
+      "font_class": "tuihuo",
+      "unicode": "e624",
+      "unicode_decimal": 58916
+    },
+    {
+      "icon_id": "9031364",
+      "name": "标准待分享2",
+      "font_class": "biaozhundaifenxiang",
+      "unicode": "e602",
+      "unicode_decimal": 58882
+    },
+    {
+      "icon_id": "9173301",
+      "name": "下箭头",
+      "font_class": "xiajiantou-copy",
+      "unicode": "e8a1",
+      "unicode_decimal": 59553
+    }
+  ]
+}

fhKeeper/formulahousekeeper/timesheet_h5/src/assets/style/index.less

@@ -0,0 +1,4 @@
+// @import './reset.less';
+@import './rerset.less';
+@import './common.less';
+@import './font/iconfont.css';

fhKeeper/formulahousekeeper/timesheet_h5/src/assets/style/rerset.less

@@ -0,0 +1,347 @@
+html,
+body,
+div,
+span,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+abbr,
+address,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+samp,
+small,
+strong,
+sub,
+sup,
+var,
+b,
+i,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    outline: 0;
+    font-size: 100%;
+    vertical-align: baseline;
+    background: transparent;
+    box-sizing: border-box;
+}
+
+body {
+    line-height: 1
+}
+
+:focus {
+    outline: 1
+}
+
+article,
+aside,
+canvas,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section,
+summary {
+    display: block
+}
+
+ul {
+    list-style: none
+}
+
+blockquote,
+q {
+    quotes: none
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+    content: '';
+    content: none
+}
+
+a {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    vertical-align: baseline;
+    background: transparent;
+    text-decoration: none;
+    color: black
+}
+
+ins {
+    background-color: #ff9;
+    color: #000;
+    text-decoration: none
+}
+
+mark {
+    background-color: #ff9;
+    color: #000;
+    font-style: italic;
+    font-weight: bold
+}
+
+del {
+    text-decoration: line-through
+}
+
+abbr[title],
+dfn[title] {
+    border-bottom: 1px dotted #000;
+    cursor: help
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0
+}
+
+hr {
+    display: block;
+    height: 1px;
+    border: 0;
+    border-top: 1px solid #cccccc;
+    margin: 1em 0;
+    padding: 0
+}
+
+input,
+select {
+    vertical-align: middle
+}
+
+html,
+body,
+div,
+span,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+abbr,
+address,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+samp,
+small,
+strong,
+sub,
+sup,
+var,
+b,
+i,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    outline: 0;
+    font-size: 100%;
+    vertical-align: baseline;
+    background: transparent
+}
+
+a {
+    text-decoration: none;
+    color: black
+}
+
+body {
+    line-height: 1
+}
+
+:focus {
+    outline: 1
+}
+
+article,
+aside,
+canvas,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section,
+summary {
+    display: block
+}
+
+ul {
+    list-style: none
+}
+
+blockquote,
+q {
+    quotes: none
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+    content: '';
+    content: none
+}
+
+a {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    vertical-align: baseline;
+    background: transparent
+}
+
+ins {
+    background-color: #ff9;
+    color: #000;
+    text-decoration: none
+}
+
+mark {
+    background-color: #ff9;
+    color: #000;
+    font-style: italic;
+    font-weight: bold
+}
+
+del {
+    text-decoration: line-through
+}
+
+abbr[title],
+dfn[title] {
+    border-bottom: 1px dotted #000;
+    cursor: help
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0
+}
+
+hr {
+    display: block;
+    height: 1px;
+    border: 0;
+    border-top: 1px solid #cccccc;
+    margin: 1em 0;
+    padding: 0
+}
+
+input,
+select {
+    vertical-align: middle
+}

fhKeeper/formulahousekeeper/timesheet_h5/src/assets/style/theme.less

@@ -0,0 +1,719 @@
+// Basic Colors
+@black: #000;
+@white: #fff;
+@red: rgb(192, 49, 49);
+@blue: #1989fa;
+@orange: #ff976a;
+@orange-dark: #ed6a0c;
+@orange-light: #fffbe8;
+@green: #07c160;
+@gray: #c8c9cc;
+@gray-light: #e5e5e5;
+@gray-darker: #7d7e80;
+@gray-dark: #969799;
+
+// Gradient Colors
+@gradient-red: linear-gradient(to right, #ff6034, #ee0a24);
+@gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);
+
+// Component Colors
+@text-color: #323233;
+@active-color: #f2f3f5;
+@active-opacity: .7;
+@disabled-opacity: .5;
+@background-color: #f8f8f8;
+@background-color-light: #fafafa;
+
+// Padding
+@padding-base: 4px;
+@padding-xs: @padding-base * 2;
+@padding-sm: @padding-base * 3;
+@padding-md: @padding-base * 4;
+@padding-lg: @padding-base * 6;
+@padding-xl: @padding-base * 8;
+
+// Font
+@font-size-xs: 10px;
+@font-size-sm: 12px;
+@font-size-md: 14px;
+@font-size-lg: 16px;
+@font-weight-bold: 500;
+
+// Animation
+@animation-duration-base: .3s;
+@animation-duration-fast: .2s;
+
+// Border
+@border-color: #ebedf0;
+@border-width-base: 1px;
+@border-radius-sm: 2px;
+@border-radius-md: 4px;
+@border-radius-max: 999px;
+
+// ActionSheet
+@action-sheet-max-height: 90%;
+@action-sheet-header-height: 44px;
+@action-sheet-header-font-size: @font-size-lg;
+@action-sheet-description-color: @gray-darker;
+@action-sheet-description-font-size: @font-size-md;
+@action-sheet-description-line-height: 20px;
+@action-sheet-item-height: 50px;
+@action-sheet-item-background: @white;
+@action-sheet-item-font-size: @font-size-lg;
+@action-sheet-item-text-color: @text-color;
+@action-sheet-item-disabled-text-color: @gray;
+@action-sheet-subname-color: @gray-darker;
+@action-sheet-subname-font-size: @font-size-sm;
+@action-sheet-close-icon-size: 18px;
+@action-sheet-close-icon-color: @gray-dark;
+@action-sheet-close-icon-padding: 0 @padding-sm;
+@action-sheet-cancel-padding-top: @padding-xs;
+@action-sheet-cancel-padding-color: @background-color;
+
+// AddressEdit
+@address-edit-buttons-padding: @padding-xl @padding-md;
+@address-edit-button-margin-bottom: @padding-sm;
+@address-edit-detail-finish-color: @blue;
+@address-edit-detail-finish-font-size: @font-size-sm;
+
+// AddressList
+@address-list-disabled-text-color: @gray-dark;
+@address-list-disabled-text-font-size: @font-size-sm;
+@address-list-disabled-text-line-height: 30px;
+@address-list-add-button-z-index: 999;
+@address-list-item-padding: @padding-md;
+@address-list-item-text-color: @gray-darker;
+@address-list-item-disabled-text-color: @gray-dark;
+@address-list-item-font-size: @font-size-sm;
+@address-list-item-line-height: 16px;
+@address-list-item-radio-icon-color: @red;
+@address-list-edit-icon-size: 16px;
+
+// Button
+@button-mini-height: 22px;
+@button-mini-min-width: 50px;
+@button-mini-font-size: @font-size-xs;
+@button-mini-line-height: 20px;
+@button-small-height: 30px;
+@button-small-font-size: @font-size-sm;
+@button-small-min-width: 60px;
+@button-small-line-height: 28px;
+@button-normal-font-size: @font-size-md;
+@button-large-height: 50px;
+@button-large-line-height: 48px;
+@button-default-height: 44px;
+@button-default-line-height: 42px;
+@button-default-font-size: @font-size-lg;
+@button-default-color: @text-color;
+@button-default-background-color: @white;
+@button-default-border-color: @border-color;
+@button-primary-color: @white;
+@button-primary-background-color: @green;
+@button-primary-border-color: @green;
+@button-info-color: @white;
+@button-info-background-color: @blue;
+@button-info-border-color: @blue;
+@button-danger-color: @white;
+@button-danger-background-color: @red;
+@button-danger-border-color: @red;
+@button-warning-color: @white;
+@button-warning-background-color: @orange;
+@button-warning-border-color: @orange;
+@button-border-width: @border-width-base;
+@button-border-radius: @border-radius-sm;
+@button-round-border-radius: @border-radius-max;
+@button-plain-background-color: @white;
+@button-disabled-opacity: @disabled-opacity;
+
+// Card
+@card-padding: @padding-xs @padding-md;
+@card-font-size: @font-size-sm;
+@card-text-color: @text-color;
+@card-background-color: @background-color-light;
+@card-thumb-size: 90px;
+@card-title-line-height: 16px;
+@card-desc-color: @gray-darker;
+@card-desc-line-height: 20px;
+@card-price-color: @red;
+@card-origin-price-color: @gray-darker;
+@card-origin-price-font-size: @font-size-xs;
+
+// Cell
+@cell-font-size: @font-size-md;
+@cell-line-height: 24px;
+@cell-vertical-padding: 10px;
+@cell-horizontal-padding: @padding-md;
+@cell-text-color: @text-color;
+@cell-background-color: @white;
+@cell-border-color: @border-color;
+@cell-active-color: @active-color;
+@cell-required-color: @red;
+@cell-label-color: @gray-dark;
+@cell-label-font-size: @font-size-sm;
+@cell-label-line-height: 18px;
+@cell-label-margin-top: 3px;
+@cell-value-color: @gray-dark;
+@cell-icon-size: 16px;
+@cell-right-icon-color: @gray-dark;
+@cell-large-vertical-padding: @padding-sm;
+@cell-large-title-font-size: @font-size-lg;
+@cell-large-label-font-size: @font-size-md;
+
+// CellGroup
+@cell-group-background-color: @white;
+@cell-group-title-color: @gray-dark;
+@cell-group-title-padding: @padding-md @padding-md @padding-xs;
+@cell-group-title-font-size: @font-size-md;
+@cell-group-title-line-height: 16px;
+
+// Checkbox
+@checkbox-size: 20px;
+@checkbox-border-color: @gray-light;
+@checkbox-transition-duration: @animation-duration-fast;
+@checkbox-label-margin: @padding-xs;
+@checkbox-label-color: @text-color;
+@checkbox-checked-icon-color: @blue;
+@checkbox-disabled-icon-color: @gray;
+@checkbox-disabled-label-color: @gray;
+@checkbox-disabled-background-color: @border-color;
+
+// Circle
+@circle-text-color: @text-color;
+@circle-text-font-weight: @font-weight-bold;
+@circle-text-font-size: @font-size-md;
+@circle-text-line-height: 18px;
+
+// Collapse
+@collapse-item-transition-duration: @animation-duration-base;
+@collapse-item-content-padding: @padding-md;
+@collapse-item-content-font-size: 13px;
+@collapse-item-content-line-height: 1.5;
+@collapse-item-content-text-color: @gray-dark;
+@collapse-item-content-background-color: @white;
+@collapse-item-title-disabled-color: @gray;
+
+// ContactCard
+@contact-card-padding: @padding-md;
+@contact-card-add-icon-size: 40px;
+@contact-card-add-icon-color: @blue;
+@contact-card-value-line-height: 20px;
+
+// ContactEdit
+@contact-edit-buttons-padding: @padding-xl @padding-md;
+@contact-edit-button-margin-bottom: @padding-sm;
+@contact-edit-field-label-width: 65px;
+
+// ContactList
+@contact-list-edit-icon-size: 16px;
+@contact-list-add-button-z-index: 999;
+@contact-list-item-padding: @padding-md;
+
+// CountDown
+@count-down-text-color: @text-color;
+@count-down-font-size: @font-size-md;
+@count-down-line-height: 20px;
+
+// Coupon
+@coupon-margin: 0 @padding-md @padding-md;
+@coupon-content-height: 100px;
+@coupon-content-padding: @padding-lg 0 0 @padding-md;
+@coupon-background-color: @white;
+@coupon-active-background-color: @active-color;
+@coupon-border-radius: @border-radius-md;
+@coupon-box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
+@coupon-head-width: 85px;
+@coupon-amount-color: @red;
+@coupon-amount-font-size: 24px;
+@coupon-currency-font-size: 50%;
+@coupon-name-font-size: @font-size-lg;
+@coupon-disabled-text-color: @gray-dark;
+@coupon-description-padding: @padding-xs @padding-md;
+@coupon-description-background-color: @background-color-light;
+@coupon-description-border-color: @border-color;
+
+// CouponCell
+@coupon-cell-selected-text-color: @text-color;
+
+// CouponList
+@coupon-list-background-color: @background-color;
+@coupon-list-field-padding: @padding-xs @padding-md;
+@coupon-list-exchange-button-height: 32px;
+@coupon-list-empty-image-size: 200px;
+@coupon-list-empty-tip-color: @gray-dark;
+@coupon-list-empty-tip-font-size: @font-size-md;
+@coupon-list-empty-tip-line-height: 20px;
+
+// Dialog
+@dialog-width: 320px;
+@dialog-small-screen-width: 90%;
+@dialog-font-size: @font-size-lg;
+@dialog-transition: @animation-duration-base;
+@dialog-border-radius: 16px;
+@dialog-background-color: @white;
+@dialog-header-font-weight: @font-weight-bold;
+@dialog-header-line-height: 24px;
+@dialog-header-padding-top: @padding-lg;
+@dialog-header-isolated-padding: @padding-lg 0;
+@dialog-message-padding: @padding-lg;
+@dialog-message-font-size: @font-size-md;
+@dialog-message-line-height: 20px;
+@dialog-message-max-height: 60vh;
+@dialog-has-title-message-text-color: @gray-darker;
+@dialog-has-title-message-padding-top: @padding-sm;
+@dialog-confirm-button-text-color: @blue;
+
+// Divider
+@divider-margin: @padding-md 0;
+@divider-text-color: @gray-dark;
+@divider-font-size: @font-size-md;
+@divider-line-height: 24px;
+@divider-border-color: @border-color;
+@divider-content-padding: @padding-md;
+@divider-content-left-width: 10%;
+@divider-content-right-width: 10%;
+
+// DropdownMenu
+@dropdown-menu-height: 50px;
+@dropdown-menu-background-color: @white;
+@dropdown-menu-title-font-size: 15px;
+@dropdown-menu-title-text-color: @text-color;
+@dropdown-menu-title-active-text-color: @blue;
+@dropdown-menu-title-disabled-text-color: @gray-dark;
+@dropdown-menu-title-padding: 0 @padding-xs;
+@dropdown-menu-title-line-height: 18px;
+@dropdown-menu-option-active-color: @blue;
+@dropdown-menu-content-max-height: 80%;
+
+// Field
+@field-label-width: 90px;
+@field-input-text-color: @text-color;
+@field-input-error-text-color: @red;
+@field-input-disabled-text-color: @gray-dark;
+@field-placeholder-text-color: @gray-dark;
+@field-icon-size: 16px;
+@field-clear-icon-size: 16px;
+@field-clear-icon-color: @gray;
+@field-right-icon-color: @gray-dark;
+@field-error-message-color: @red;
+@field-error-message-text-color: 12px;
+@field-text-area-min-height: 60px;
+@field-word-limit-color: @gray-darker;
+@field-word-limit-font-size: @font-size-sm;
+@field-word-limit-line-height: 16px;
+
+// GridItem
+@grid-item-content-padding: @padding-md @padding-xs;
+@grid-item-content-background-color: @white;
+@grid-item-content-active-color: @active-color;
+@grid-item-icon-size: 28px;
+@grid-item-text-color: @gray-darker;
+@grid-item-text-font-size: @font-size-sm;
+
+// GoodsAction
+@goods-action-background-color: @white;
+@goods-action-icon-width: 48px;
+@goods-action-icon-height: 50px;
+@goods-action-icon-color: @text-color;
+@goods-action-icon-size: 18px;
+@goods-action-icon-font-size: @font-size-xs;
+@goods-action-icon-active-color: @active-color;
+@goods-action-icon-text-color: @gray-darker;
+@goods-action-button-height: 40px;
+@goods-action-button-warning-color: @gradient-orange;
+@goods-action-button-danger-color: @gradient-red;
+
+// IndexAnchor
+@index-anchor-padding: 0 @padding-md;
+@index-anchor-text-color: @text-color;
+@index-anchor-font-weight: @font-weight-bold;
+@index-anchor-font-size: @font-size-md;
+@index-anchor-line-height: 32px;
+@index-anchor-background-color: transparent;
+@index-anchor-sticky-background-color: @white;
+
+// IndexBar
+@index-bar-index-font-size: @font-size-xs;
+@index-bar-index-line-height: 14px;
+
+// Info
+@info-size: 16px;
+@info-color: @white;
+@info-padding: 0 3px;
+@info-font-size: @font-size-sm;
+@info-font-weight: @font-weight-bold;
+@info-border-width: @border-width-base;
+@info-background-color: @red;
+@info-dot-color: @red;
+@info-dot-size: 8px;
+@info-font-family: PingFang SC, Helvetica Neue, Arial, sans-serif;
+
+// Image
+@image-placeholder-text-color: @gray-dark;
+@image-placeholder-font-size: @font-size-md;
+@image-placeholder-background-color: @background-color;
+
+// ImagePreview
+@image-preview-index-text-color: @white;
+@image-preview-index-font-size: @font-size-md;
+@image-preview-overlay-background-color: rgba(0, 0, 0, .9);
+
+// List
+@list-icon-margin-right: 5px;
+@list-text-color: @gray-dark;
+@list-text-font-size: @font-size-md;
+@list-text-line-height: 50px;
+
+// Loading
+@loading-text-color: @gray-dark;
+@loading-text-font-size: @font-size-md;
+@loading-spinner-color: @gray;
+@loading-spinner-size: 30px;
+@loading-spinner-animation-duration: .8s;
+
+// NavBar
+@nav-bar-height: 46px;
+@nav-bar-background-color: @white;
+@nav-bar-arrow-size: 16px;
+// @nav-bar-icon-color: @blue;
+// @nav-bar-text-color: @blue;
+@nav-bar-icon-color: @red;
+@nav-bar-text-color: @red;
+@nav-bar-title-font-size: @font-size-lg;
+@nav-bar-title-text-color: @text-color;
+
+// NoticeBar
+@notice-bar-height: 40px;
+@notice-bar-padding: 0 @padding-md;
+@notice-bar-wrapable-padding: @padding-xs @padding-md;
+@notice-bar-text-color: @orange-dark;
+@notice-bar-font-size: @font-size-md;
+@notice-bar-line-height: 24px;
+@notice-bar-background-color: @orange-light;
+@notice-bar-icon-size: 16px;
+@notice-bar-icon-min-width: 22px;
+
+// Notify
+@notify-padding: @padding-xs @padding-md;
+@notify-font-size: @font-size-md;
+@notify-line-height: 20px;
+@notify-primary-background-color: @blue;
+@notify-success-background-color: @green;
+@notify-danger-background-color: @red;
+@notify-warning-background-color: @orange;
+
+// NumberKeyboard
+@number-keyboard-background-color: @white;
+@number-keyboard-key-height: 54px;
+@number-keyboard-key-background: #ebedf0;
+@number-keyboard-key-font-size: 24px;
+@number-keyboard-key-active-color: @active-color;
+@number-keyboard-delete-font-size: @font-size-lg;
+@number-keyboard-title-color: @gray-darker;
+@number-keyboard-title-height: 30px;
+@number-keyboard-title-font-size: @font-size-md;
+@number-keyboard-close-padding: 0 @padding-md;
+@number-keyboard-close-color: @blue;
+@number-keyboard-close-font-size: @font-size-md;
+@number-keyboard-button-text-color: @white;
+@number-keyboard-button-background-color: @blue;
+@number-keyboard-cursor-color: @text-color;
+@number-keyboard-cursor-width: 1px;
+@number-keyboard-cursor-height: 40%;
+@number-keyboard-cursor-animation-duration: 1s;
+
+// Overlay
+@overlay-background-color: rgba(0, 0, 0, 0.7);
+
+// Pagination
+@pagination-height: 40px;
+@pagination-font-size: @font-size-md;
+@pagination-item-width: 36px;
+@pagination-item-default-color: @blue;
+@pagination-item-disabled-color: @gray-darker;
+@pagination-item-disabled-background-color: @background-color;
+@pagination-background-color: @white;
+@pagination-desc-color: @gray-darker;
+@pagination-disabled-opacity: @disabled-opacity;
+
+// Panel
+@panel-background-color: @white;
+@panel-header-value-color: @red;
+@panel-footer-padding: @padding-xs @padding-md;
+
+// PasswordInput
+@password-input-height: 50px;
+@password-input-margin: 0 @padding-md;
+@password-input-font-size: 20px;
+@password-input-border-radius: 6px;
+@password-input-background-color: @white;
+@password-input-info-color: @gray-dark;
+@password-input-info-font-size: @font-size-md;
+@password-input-error-info-color: @red;
+@password-input-dot-size: 10px;
+@password-input-dot-color: @black;
+
+// Picker
+@picker-background-color: @white;
+@picker-toolbar-height: 44px;
+@picker-title-font-size: @font-size-lg;
+@picker-action-padding: 0 @padding-md;
+@picker-action-font-size: @font-size-md;
+@picker-action-text-color: @blue;
+@picker-action-active-color: @active-color;
+@picker-option-font-size: @font-size-lg;
+@picker-option-text-color: @black;
+@picker-option-disabled-opacity: .3;
+@picker-loading-icon-color: @blue;
+@picker-loading-mask-color: rgba(255, 255, 255, .9);
+
+// Popup
+@popup-background-color: @white;
+@popup-transition: transform @animation-duration-base ease-out;
+@popup-round-border-radius: 20px;
+@popup-close-icon-size: 18px;
+@popup-close-icon-color: @gray-dark;
+@popup-close-icon-margin: 16px;
+@popup-close-icon-z-index: 1;
+
+// Progress
+@progress-height: 4px;
+@progress-color: @blue;
+@progress-background-color: @gray-light;
+@progress-pivot-padding: 0 5px;
+@progress-pivot-text-color: @white;
+@progress-pivot-font-size: @font-size-xs;
+@progress-pivot-line-height: 1.6;
+@progress-pivot-background-color: @blue;
+
+// PullRefresh
+@pull-refresh-head-height: 50px;
+@pull-refresh-head-font-size: @font-size-md;
+@pull-refresh-head-text-color: @gray-dark;
+
+// Radio
+@radio-size: 20px;
+@radio-border-color: @gray-light;
+@radio-transition-duration: @animation-duration-fast;
+@radio-label-margin: @padding-xs;
+@radio-label-color: @text-color;
+@radio-checked-icon-color: @blue;
+@radio-disabled-icon-color: @gray;
+@radio-disabled-label-color: @gray;
+@radio-disabled-background-color: @border-color;
+
+// Rate
+@rate-icon-size: 20px;
+@rate-icon-gutter: 4px;
+
+// Search
+@search-padding: 10px @padding-sm;
+@search-background-color: #f7f8fA;
+@search-input-height: 34px;
+@search-label-padding: 0 5px;
+@search-label-color: @text-color;
+@search-label-font-size: @font-size-md;
+@search-left-icon-color: @gray-dark;
+@search-action-padding: 0 @padding-xs;
+@search-action-text-color: @text-color;
+@search-action-font-size: @font-size-md;
+
+// Sidebar
+@sidebar-width: 85px;
+
+// SidebarItem
+@sidebar-font-size: @font-size-md;
+@sidebar-line-height: 20px;
+@sidebar-text-color: @text-color;
+@sidebar-disabled-text-color: @gray;
+@sidebar-padding: 20px @padding-sm 20px @padding-xs;
+@sidebar-active-color: @active-color;
+@sidebar-background-color: @background-color-light;
+@sidebar-selected-font-weight: @font-weight-bold;
+@sidebar-selected-text-color: @text-color;
+@sidebar-selected-border-color: @red;
+@sidebar-selected-background-color: @white;
+
+// Skeleton
+@skeleton-row-height: 16px;
+@skeleton-row-background-color: @active-color;
+@skeleton-row-margin-top: @padding-sm;
+@skeleton-avatar-background-color: @active-color;
+@skeleton-animation-duration: 1.2s;
+
+// Slider
+@slider-active-background-color: @blue;
+@slider-inactive-background-color: @gray-light;
+@slider-disabled-opacity: @disabled-opacity;
+@slider-button-width: 24px;
+@slider-button-height: 24px;
+@slider-button-border-radius: 50%;
+@slider-button-background-color: @white;
+@slider-button-box-shadow: 0 1px 2px rgba(0, 0, 0, .5);
+
+// Step
+@step-text-color: @gray-dark;
+@step-process-text-color: @text-color;
+@step-font-size: @font-size-md;
+@step-line-color: @border-color;
+@step-finish-line-color: @green;
+@step-finish-text-color: @text-color;
+@step-icon-size: 12px;
+@step-circle-size: 5px;
+@step-circle-color: @gray-dark;
+@step-horizontal-title-font-size: @font-size-sm;
+
+// Steps
+@steps-background-color: @white;
+
+// Sticky
+@sticky-z-index: 99;
+
+// Stepper
+@stepper-active-color: #e8e8e8;
+@stepper-background-color: @active-color;
+@stepper-button-icon-color: @text-color;
+@stepper-button-disabled-color: #f7f8fa;
+@stepper-button-disabled-icon-color: @gray;
+@stepper-input-width: 32px;
+@stepper-input-height: 28px;
+@stepper-input-font-size: @font-size-md;
+@stepper-input-text-color: @text-color;
+@stepper-input-disabled-text-color: @gray;
+@stepper-input-disabled-background-color: @active-color;
+@stepper-border-radius: @border-radius-md;
+
+// SubmitBar
+@submit-bar-height: 50px;
+@submit-bar-z-index: 100;
+@submit-bar-background-color: @white;
+@submit-bar-button-width: 110px;
+@submit-bar-price-color: @red;
+@submit-bar-price-font-size: 18px;
+@submit-bar-currency-font-size: @font-size-md;
+@submit-bar-text-color: @text-color;
+@submit-bar-text-font-size: @font-size-md;
+@submit-bar-tip-padding: @padding-xs @padding-sm;
+@submit-bar-tip-font-size: @font-size-sm;
+@submit-bar-tip-line-height: 1.5;
+@submit-bar-tip-color: #f56723;
+@submit-bar-tip-background-color: #fff7cc;
+@submit-bar-tip-icon-size: 12px;
+
+// Swipe
+@swipe-indicator-size: 6px;
+@swipe-indicator-margin: @padding-sm;
+@swipe-indicator-active-opacity: 1;
+@swipe-indicator-inactive-opacity: .3;
+@swipe-indicator-active-background-color: @blue;
+@swipe-indicator-inactive-background-color: @border-color;
+
+// Switch
+@switch-width: 2em;
+@switch-height: 1em;
+@switch-node-size: 1em;
+@switch-node-z-index: 1;
+@switch-node-background-color: @white;
+@switch-node-box-shadow: 0 3px 1px 0 rgba(0, 0, 0, .05), 0 2px 2px 0 rgba(0, 0, 0, .1), 0 3px 3px 0 rgba(0, 0, 0, .05);
+@switch-background-color: @white;
+@switch-on-background-color: @blue;
+@switch-transition-duration: @animation-duration-base;
+@switch-disabled-opacity: @disabled-opacity;
+@switch-border: @border-width-base solid rgba(0, 0, 0, .1);
+
+// SwitchCell
+@switch-cell-padding-top: @cell-vertical-padding - 1px;
+@switch-cell-padding-bottom: @cell-vertical-padding - 1px;
+@switch-cell-large-padding-top: @cell-large-vertical-padding - 1px;
+@switch-cell-large-padding-bottom: @cell-large-vertical-padding - 1px;
+
+// Tabbar
+@tabbar-height: 50px;
+@tabbar-background-color: @white;
+
+// TabbarItem
+@tabbar-item-font-size: @font-size-sm;
+@tabbar-item-text-color: @gray-darker;
+@tabbar-item-active-color: @blue;
+@tabbar-item-line-height: 1;
+@tabbar-item-icon-size: 18px;
+@tabbar-item-margin-bottom: 5px;
+
+// Tab
+@tab-text-color: @gray-darker;
+@tab-active-text-color: @text-color;
+@tab-disabled-text-color: @gray;
+@tab-font-size: @font-size-md;
+
+// Tabs
+@tabs-default-color: @red;
+@tabs-line-height: 44px;
+@tabs-card-height: 30px;
+@tabs-nav-background-color: @white;
+@tabs-bottom-bar-height: 3px;
+@tabs-bottom-bar-color: @tabs-default-color;
+
+// Tag
+@tag-padding: .2em .5em;
+@tag-font-size: @font-size-xs;
+@tag-medium-font-size: @font-size-sm;
+@tag-large-font-size: @font-size-md;
+@tag-text-color: @white;
+@tag-border-radius: .2em;
+@tag-round-border-radius: @border-radius-max;
+@tag-dander-color: @red;
+@tag-primary-color: @blue;
+@tag-success-color: @green;
+@tag-warning-color: @orange;
+@tag-default-color: @gray-dark;
+@tag-plain-background-color: @white;
+
+// Toast
+@toast-max-width: 70%;
+@toast-font-size: @font-size-md;
+@toast-text-color: @white;
+@toast-loading-icon-color: @white;
+@toast-line-height: 20px;
+@toast-border-radius: @border-radius-md;
+@toast-background-color: rgba(@text-color, .88);
+@toast-icon-size: 40px;
+@toast-text-min-width: 96px;
+@toast-text-padding: @padding-xs @padding-sm;
+@toast-default-padding: @padding-md;
+@toast-default-width: 90px;
+@toast-default-min-height: 90px;
+@toast-position-top-distance: 50px;
+@toast-position-bottom-distance: 50px;
+
+// TreeSelect
+@tree-select-font-size: @font-size-md;
+@tree-select-nav-background-color: @background-color-light;
+@tree-select-content-background-color: @white;
+@tree-select-nav-item-padding: @padding-sm @padding-xs @padding-sm @padding-sm;
+@tree-select-item-height: 44px;
+@tree-select-item-active-color: @red;
+@tree-select-item-disabled-color: @gray;
+
+// Uploader
+@uploader-size: 80px;
+@uploader-icon-size: 24px;
+@uploader-icon-color: @gray-dark;
+@uploader-text-color: @gray-dark;
+@uploader-text-font-size: @font-size-sm;
+@uploader-upload-border-color: @gray-light;
+@uploader-upload-border-radius: 4px;
+@uploader-upload-background-color: @white;
+@uploader-delete-color: @gray-dark;
+@uploader-delete-icon-size: 18px;
+@uploader-delete-background-color: @white;
+@uploader-file-background-color: @background-color;
+@uploader-file-icon-size: 20px;
+@uploader-file-icon-color: @gray-darker;
+@uploader-file-name-padding: 0 @padding-base;
+@uploader-file-name-margin-top: @padding-xs;
+@uploader-file-name-font-size: @font-size-sm;
+@uploader-file-name-text-color: @gray-darker;
+
+// Sku
+@sku-item-background-color: #f7f8fa;
+@sku-icon-gray-color: #dcdde0;
+@sku-upload-mask-color: rgba(50, 50, 51, .8);

fhKeeper/formulahousekeeper/timesheet_h5/src/components/Footer.vue

@@ -0,0 +1,37 @@
+<template>
+    <ul class="footer flex jc-sa w100pc fixed bott0 bg-fff aic footer">
+        <li class="item">
+            <router-link to="/index" class="flex2 aic f20 yellow" active-class="active">
+                <i class="icon-home iconfont f18 text"></i>
+                <p class="mt-5 f12 text">首页</p>
+            </router-link>
+        </li>
+        <li class="item">
+            <router-link to="/my" class="flex2 aic f20 text" active-class="active">
+                <van-icon class="text" name="user-o"></van-icon>
+                <p class="mt-5 text f12">我的</p>
+            </router-link>
+        </li>
+  </ul>
+</template>
+
+<script>
+    export default {};
+</script>
+
+<style scoped lang="less">
+    .footer {
+        border-top: 1px solid #ebebeb;
+        height: 50px;
+        position: fixed;
+        bottom: 0;
+        width: 100%;
+        bottom: 0;
+        .text {
+            color: #797d82;
+        }
+        .active .text {
+            color: #20a0ff;
+        }
+    }
+</style>

fhKeeper/formulahousekeeper/timesheet_h5/src/components/NotFound.vue

@@ -0,0 +1,23 @@
+<template>
+  <div class="not-found">
+    <van-nav-bar title left-text="返回" left-arrow @click-left="$router.go(-1)"></van-nav-bar>
+    <img src="../assets/img/not.jpeg" alt />
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style lang="less">
+.not-found {
+  .van-nav-bar {
+    background: #ececec;
+  }
+  img {
+    width: 100%;
+  }
+  min-height: 100vh;
+  background: #ececec;
+}
+</style>

fhKeeper/formulahousekeeper/timesheet_h5/src/components/Vant.js

@@ -0,0 +1,38 @@
+import Vue from "vue";
+import {
+  Icon,
+  Tab,
+  Tabs,
+  List,
+  Cell,
+  Button,
+  Popup,
+  Field,
+  Dialog,
+  Toast,
+  Swipe,
+  SwipeItem,
+  Area,
+  NavBar,
+  CellGroup,
+  Image,
+  Sticky
+} from "vant";
+
+Vue.use(Icon);
+Vue.use(Tab);
+Vue.use(Tabs);
+Vue.use(List);
+Vue.use(Cell);
+Vue.use(Button);
+Vue.use(Popup);
+Vue.use(Field);
+Vue.use(Dialog);
+Vue.use(Toast);
+Vue.use(Swipe);
+Vue.use(SwipeItem);
+Vue.use(Area);
+Vue.use(NavBar);
+Vue.use(CellGroup);
+Vue.use(Image);
+Vue.use(Sticky);

fhKeeper/formulahousekeeper/timesheet_h5/src/components/demo.vue

@@ -0,0 +1,41 @@
+
+<template>
+  <div>
+    <div></div>
+    <Footer page="demo"></Footer>
+  </div>
+</template>
+
+<script>
+import Footer from "@/components/Footer";
+export default {
+  components: {
+    Footer
+  },
+  i18n: {
+    "zh-CN": {
+      type: "加载类型",
+      color: "自定义颜色",
+      text: "加载文案"
+    },
+    "en-US": {
+      type: "Type",
+      color: "Color",
+      text: "Text"
+    }
+  }
+};
+</script>
+
+<style lang="less" scoped>
+div {
+  height: 100px;
+  width: 100px;
+  background: green;
+}
+.van-loading {
+  display: inline-block;
+  margin: 5px 0 5px 20px;
+  background: gray;
+}
+</style>

fhKeeper/formulahousekeeper/timesheet_h5/src/main.js

@@ -0,0 +1,34 @@
+import Vue from "vue";
+// import "vant/lib/index.css";
+import App from "./App.vue";
+import router from "./router/index";
+// import "@/assets/style/font/iconfont.css";
+
+import "@/assets/style/index.less";
+import $axios from "@/utils/request";
+import mixin from "./mixin/index";
+import store from "./store/index";
+
+import "@/components/Vant";
+
+import { Form , Toast , Grid, GridItem , DatetimePicker , Picker , Dialog , NumberKeyboard , Sticky , Skeleton , Panel , Divider } from 'vant';
+Vue.use(Form).use(Toast).use(Grid).use(GridItem).use(DatetimePicker)
+.use(Picker).use(Dialog).use(NumberKeyboard).use(Sticky).use(Skeleton)
+.use(Panel).use(Divider);
+
+// rem
+import "amfe-flexible";
+
+// 把变量挂载到vue的原型上
+axios.defaults.baseURL="http://localhost:10010"
+Vue.prototype.$axios = $axios;
+
+Vue.mixin(mixin);
+
+Vue.config.productionTip = false;
+
+new Vue({
+    store,
+    router,
+    render: h => h(App)
+}).$mount("#app");

fhKeeper/formulahousekeeper/timesheet_h5/src/mixin/index.js

@@ -0,0 +1,12 @@
+export default {
+    data() {
+        return {};
+    },
+    fomatDate(time) {
+        let date = new Date(time);
+        let Y = date.getFullYear();
+        let M = date.getMonth() + 1;
+        let D = date.getDate();
+        return `${Y}年-${M}月-${D}日`;
+    },
+};

fhKeeper/formulahousekeeper/timesheet_h5/src/router/index.js

@@ -0,0 +1,98 @@
+import Vue from "vue";
+import Router from "vue-router";
+import store from "../store/index";
+
+Vue.use(Router);
+
+const router = new Router({
+  routes: [
+    {
+        path: "/",
+        redirect: "/login"
+    },
+    {
+        path: "/login",
+        component: () => import("@/views/login/index"),
+        meta: {
+            title: "登陆"
+        }
+    },
+    {
+        path: "/register",
+        component: () => import("@/views/register/index"),
+        meta: {
+            title: "注册"
+        }
+    },
+    {
+        path: "/index",
+        component: () => import("@/views/index/index"),
+        meta: {
+            title: "工时管家",
+            keepAlive: true
+        }
+    },
+    {
+        path: "/view",
+        meta: {
+            title: "查看日报"
+        },
+        component: () => import("@/views/view/index")
+    },
+    {
+        path: "/edit",
+        meta: {
+            title: "填写日报"
+        },
+        component: () => import("@/views/edit/index")
+    },
+    {
+        path: "/review",
+        meta: {
+            title: "审核日报"
+        },
+        component: () => import("@/views/review/index")
+    },
+    {
+        path: "/my",
+        component: () => import("@/views/my/index"),
+        redirect: "/my/center",
+        children: [
+            {
+                path: "center",
+                meta: {
+                    title: "个人中心"
+                },
+                component: () => import("@/views/my/children/center")
+            },
+            {
+                path: "set",
+                meta: {
+                    title: "修改密码"
+                },
+                component: () => import("@/views/my/children/set")
+            }
+        ]
+    },
+    {
+        path: "*",
+        component: () => import("@/components/NotFound")
+    }
+  ]
+});
+
+router.beforeEach((to, from, next) => {
+    let { title, needLogin } = to.meta;
+    let { isLogin } = store.state;
+    document.title = title;
+
+    if (needLogin && !isLogin) {
+        next({
+            path: "/login"
+        });
+    } else {
+        next();
+    }
+});
+
+export default router;

fhKeeper/formulahousekeeper/timesheet_h5/src/store/index.js

@@ -0,0 +1,27 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import createPersistedState from 'vuex-persistedstate'
+Vue.use(Vuex);
+
+const config = {
+    plugins: [createPersistedState()],
+    state: {
+        isLogin: false,
+        userInfo: {},
+    },
+    getters: {
+        isLogin: state => state.isLogin,
+        userInfo: state => state.userInfo
+    },
+    mutations: {
+        updateLogin(state, payload) {
+            state.isLogin = payload;
+        },
+        updateUserInfo(state, payload) {
+            state.userInfo = payload;
+        },
+    },
+    actions: {}
+}
+const store = new Vuex.Store(config);
+export default store;

fhKeeper/formulahousekeeper/timesheet_h5/src/utils/index.js

@@ -0,0 +1,14 @@
+import {
+    Toast
+} from 'vant';
+
+export const loading = (flag) => {
+    if (flag) {
+        Toast.loading({
+            mask: true,
+            message: '加载中...'
+        });
+    } else {
+        Toast.clear();
+    }
+}

fhKeeper/formulahousekeeper/timesheet_h5/src/utils/request.js

@@ -0,0 +1,59 @@
+// import axios from "axios";
+import store from "../store";
+import router from "../router";
+import qs from "qs"
+
+// 创建axios实例
+const service = axios.create({
+    baseURL: "/api",//process.env.VUE_APP_URL, // api 的 VUE_APP_URL
+    timeout: 50000 // 请求超时时间(因为需要调试后台,所以设置得比较大)
+});
+
+// request拦截器,在请求之前做一些处理
+service.interceptors.request.use(
+    config => {
+        if(config.url != "/report/editReport") {
+            config.data = qs.stringify(config.data);
+            config.headers["Content-Type"] = "application/x-www-form-urlencoded; charset=UTF-8";
+        } else {
+            config.dataType = "json";
+            // config.headers["dataType"] = "json";
+            config.processData= false;
+            config.contentType= false;
+        }
+        
+        if (sessionStorage.userInfo) {
+            config.headers["Token"] = JSON.parse(sessionStorage.userInfo).id;
+        }
+        return config;
+    },
+    error => {
+        Promise.reject(error);
+    }
+);
+
+// response 拦截器,数据返回后进行一些处理
+service.interceptors.response.use(
+    response => {
+        if(response.status == 200) {
+            const res = response.data;
+            return res;
+        } else {
+            Promise.reject("网络异常");
+        }
+        
+        // if (res.code == "666") {
+        //     return res;
+        // } else if (res.code == "603") {
+        //     // code为603代表token已经失效,
+        //     // 提示用户,然后跳转到登陆页面
+        //     router.push("/login");
+        // } else {
+        //     Promise.reject(res);
+        // }
+    },
+    error => {
+        Promise.reject("网络异常");
+    }
+);
+export default service;

fhKeeper/formulahousekeeper/timesheet_h5/src/views/edit/index.vue

@@ -0,0 +1,306 @@
+<template>
+    <div>
+        <van-nav-bar title="填写日报" left-text="返回" @click-left="back" fixed left-arrow/>
+
+        <van-form class="login_form" @submit="register">
+            <van-field readonly clickable name="datetimePicker" :value="form.createDate" label="时间选择" placeholder="点击选择时间" 
+            @click="showPicker = true" :rules="rules.createDate" />
+            <van-popup v-model="showPicker" position="bottom">
+                <van-datetime-picker v-model="currentDate" type="date" :min-date="minDate" :max-date="maxDate" @confirm="changeTime" @cancel="showPicker = false"/>
+            </van-popup>
+
+            <van-cell title="待分配时长" :value="report.time + 'h'" size="large"></van-cell>
+
+            <div class="form_domains" v-for="(item,index) in form.domains">
+                <van-button v-if="index == 0" @click="addNewPro" class="form_addNew" icon="plus" type="info" size="mini">新增项目</van-button>
+                <van-icon v-else class="form_del" name="delete" @click="delPro(index)" />
+
+                <van-cell-group :title="'项目' + (index+1)">
+                    <van-field readonly clickable name="projectId" :value="item.projectName" label="投入项目" placeholder="请选择投入项目" @click="clickPicker(index)"
+                    :rules="[{ required: true, message: '请选择投入项目' }]"/>
+                    <van-popup v-model="showPickerProject" position="bottom">
+                        <van-picker show-toolbar :columns="project" value-key="projectName" @confirm="choseProject" @cancel="showPickerProject = false" />
+                    </van-popup>
+
+                    <van-field readonly clickable class="form_input" :value="item.workingTime" name="workingTime" label="工作时长" placeholder="请输入工作时长" 
+                    :rules="[{ required: true, message: '请输入工作时长' }]" @touchstart.native.stop="showNumberKey = true"/>
+                    <van-number-keyboard v-model="item.workingTime" :show="showNumberKey" close-button-text="完成" extra-key="." :maxlength="4" @blur="showNumberKey = false" />
+
+                    <van-field class="form_input" v-model="item.content" name="content" type="textarea" label="工作事项" placeholder="请输入工作事项" 
+                    rows="3" autosize :rules="[{ required: true, message: '请输入工作时长' }]" />
+                </van-cell-group>
+            </div>
+            <div class="form_btn" style="margin: 16px;">
+                <van-button v-if="canClick" round block type="info" native-type="submit"> 提交 </van-button>
+                <van-button v-else round block type="info" disabled native-type="submit"> 提交 </van-button>
+                <div class="form_tip" v-if="!canClick">
+                    当前日报审核中，无法修改
+                </div>
+            </div>
+        </van-form>
+        </van-list>
+    </div>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                minDate: new Date(2010, 0, 1),
+                maxDate: new Date(new Date().getFullYear(),new Date().getMonth(),new Date().getDate()),
+                currentDate: new Date(),
+
+                showPicker: false,
+                showPickerProject: false,
+                clickIndex: 0,
+                showNumberKey: false,
+                canClick: true,
+
+                form: {
+                    createDate: this.format(new Date(new Date()),"yyyy-MM-dd"),
+                    domains: [{
+                        id: null,
+                        projectId: "",
+                        projectName: "",
+                        workingTime: "",
+                        content: "",
+                        state: 2,
+                    }],
+                },
+                rules: {
+                    createDate: [{ required: true, message: '请选择填报日期' }],
+                },
+                project: [],
+                report: "",
+
+                loading: false,
+                finished: false
+            };
+        },
+
+        created() {
+        },
+
+        methods: {
+            // 返回
+            back() {
+                history.back();
+            },
+
+            // 时间转换
+            format(date, pattern) {
+                pattern = pattern || "yyyy-MM-dd";
+                var _this = this;
+                return pattern.replace(/([yMdhsm])(\1*)/g, function ($0) {
+                    switch ($0.charAt(0)) {
+                        case 'y': return _this.padding(date.getFullYear(), $0.length);
+                        case 'M': return _this.padding(date.getMonth() + 1, $0.length);
+                        case 'd': return _this.padding(date.getDate(), $0.length);
+                        case 'w': return date.getDay() + 1;
+                        case 'h': return _this.padding(date.getHours(), $0.length);
+                        case 'm': return _this.padding(date.getMinutes(), $0.length);
+                        case 's': return _this.padding(date.getSeconds(), $0.length);
+                    }
+                });
+            },
+
+            padding(s, len) {
+                var len = len - (s + '').length;
+                for (var i = 0; i < len; i++) { s = '0' + s; }
+                return s;
+            },
+
+            // 获取项目
+            getProject() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/project/getProjectList", {})
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.project = res.data;
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('获取失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+
+            // 获取日报
+            getReport() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/report/getReport", {date: this.form.createDate})
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.report = res.data;
+                        var list = res.data.report;
+                        if(list.length != 0) {
+                            this.canClick = (list[0].state==2?true:false);
+                            let array = [];
+                            for(var i in list) {
+                                var projectName = "";
+                                for(var j in this.project) {
+                                    if(this.project[j].id == list[i].projectId) {
+                                        projectName = this.project[j].projectName;
+                                    }
+                                }
+                                array.push({
+                                    id: list[i].id,
+                                    projectId: list[i].projectId,
+                                    projectName: projectName,
+                                    workingTime: String(list[i].workingTime),
+                                    content: list[i].content,
+                                    state: list[i].state,
+                                })
+                            }
+                            this.form.domains = array;
+                        } else {
+                            this.form.domains = [{
+                                id: null,
+                                projectId: "",
+                                projectName: "",
+                                workingTime: "",
+                                content: "",
+                                state: 2,
+                            }]
+                        }
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('获取失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+
+            // 改变时间
+            changeTime(time) {
+                this.form.createDate = this.format(new Date(time),"yyyy-MM-dd");
+                this.currentDate = time;
+                this.showPicker = false;
+                this.getReport();
+            },
+
+            // 选择项目
+            clickPicker(i) {
+                this.clickIndex = i;
+                this.showPickerProject = true;
+            },
+
+            choseProject(value, index) {
+                this.form.domains[this.clickIndex].projectId = value.id;
+                this.form.domains[this.clickIndex].projectName = value.projectName;
+                this.showPickerProject = false;
+            },
+
+            // 添加项目 
+            addNewPro() {
+                this.form.domains.push({
+                    id: null,
+                    projectId: "",
+                    projectName: "",
+                    workingTime: "",
+                    content: "",
+                    state: 2,
+                })
+            },
+
+            // 移除项目
+            delPro(i) {
+                this.$dialog.confirm({
+                    title: '',
+                    message: '是否移除当前项目'
+                }).then(() => {
+                    this.form.domains.splice(i,1);
+                }).catch(() => {
+                });
+            },
+
+            // 提交日报
+            register() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                let formData = new FormData();
+                for(var i in this.form.domains) {
+                    if (this.form.domains[i].id != null) {
+                        formData.append("id", this.form.domains[i].id);
+                    } else {
+                        formData.append("id", -1);
+                    }
+                    formData.append("projectId", parseFloat(this.form.domains[i].projectId));
+                    formData.append("workingTime", parseFloat(this.form.domains[i].workingTime));
+                    formData.append("content", this.form.domains[i].content);
+                    formData.append("createDate", this.form.createDate);
+                }
+                this.$axios.post("/report/editReport", formData)
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.$toast.success('填报成功');
+                        this.$router.push("/index");
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('填报失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+        },
+        
+        mounted() {
+            this.getProject();
+            this.getReport();
+        }
+    };
+</script>
+
+<style lang="less" scope>
+    .login_form {
+        margin-top: 46px;
+    }
+
+    .form_domains {
+        position: relative;
+        .form_addNew {
+            position: absolute;
+            right: 15px;
+            top: 10px;
+        }
+
+        .form_del {
+            color: #ff0000;
+            font-size: 22px;
+            position: absolute;
+            right: 15px;
+            top: 10px;
+        }
+    }
+
+    .form_tip {
+        text-align: center;
+        margin-top: 20px;
+        color: #afafaf;
+        font-size: 14px;
+    }
+
+    .card__footer {
+        padding-top: 10px;
+    }
+    .card__tags {
+        .van-tag {
+            margin-right: 5px;
+        }
+    }
+</style>
+<style lang="less">
+    .van-nav-bar .van-icon , .van-nav-bar__text {
+        color: #20a0ff;
+    }
+</style>
+
+

fhKeeper/formulahousekeeper/timesheet_h5/src/views/index/index.vue

@@ -0,0 +1,83 @@
+<template>
+    <div>
+        <van-swipe class="my-swipe" :autoplay="3000" :height="200" indicator-color="white">
+            <van-swipe-item v-for="(item, index) in images" :key="index" class="swipe-img">
+                <img :src="item"/>
+            </van-swipe-item>
+        </van-swipe>
+        <van-grid :column-num="3">
+            <van-grid-item v-for="(item,index) in routers" v-show="index==2?user.role==2?false:true:true" :key="index" :icon="item.icon" :text="item.name" :to="item.url"/>
+            </van-grid-item>
+        </van-grid>
+
+        <Footer page="index"></Footer>
+    </div>
+</template>
+
+<script>
+    import Footer from "@/components/Footer";
+
+    export default {
+        data() {
+            return {
+                user: JSON.parse(sessionStorage.userInfo),
+                images: [
+                    require('../../assets/img/index/banner_1.png'),
+                    require('../../assets/img/index/banner_2.png'),
+                    require('../../assets/img/index/banner_3.png'),
+                ],
+                routers: [
+                    {
+                        name: '查看日报',
+                        url: '/view',
+                        icon: 'description'
+                    },
+                    {
+                        name: '填写日报',
+                        url: '/edit',
+                        icon: 'edit'
+                    },
+                    {
+                        name: '审核日报',
+                        url: '/review',
+                        icon: 'todo-list-o'
+                    },
+                    {
+                        name: '暂无更多',
+                        url: '',
+                        icon: 'more-o'
+                    }
+                ],
+            };
+        },
+        created() {
+            let index = this.active + 1;
+            this.list = this[`list${index}`]; // this.list1
+        },
+        components: {
+            Footer
+        },
+        methods: {
+            getGoods() {
+                let url = "/goods"; // /api/goods
+                this.$axios
+                    .get(url)
+                    .then(res => {
+                    console.log("res", res);
+                    })
+                    .catch(err => {
+                    console.log("err", err);
+                    });
+            }
+        }
+    };
+</script>
+
+<style lang="less" scoped>
+    .swipe-img {
+        img {
+            width: 100%;
+            height: 100%;
+        }
+    }
+</style>

fhKeeper/formulahousekeeper/timesheet_h5/src/views/login/index.vue

@@ -0,0 +1,117 @@
+<template>
+    <header class="login">
+        <van-image class="login_logo" width="100" height="100" :src="require('../../assets/img/login_logo.png')"/>
+        <div class="login_title">工时管家</div>
+        <div class="login_subtitle">欢迎使用移动端工时管家</div>
+
+        <van-form class="login_form" @submit="login">
+            <van-field class="form_input" v-model="form.username" name="username" label="账号" placeholder="请输入账号" :rules="rules.username" />
+            <van-field class="form_input" v-model="form.password" type="password" name="password" label="密码" placeholder="请输入密码" :rules="rules.password" />
+            <div class="form_btn" style="margin: 16px;">
+                <van-button round block type="info" native-type="submit"> 登录 </van-button>
+            </div>
+            <div class="form_jump" v-on:click="jumpTo">企业注册</div>
+        </van-form>
+    </header>
+</template>
+
+<script>
+    import { constants } from "crypto";
+    export default {
+        data() {
+            return {
+                defaultHeight: '0',  //默认屏幕高度
+                nowHeight:  '0',  //实时屏幕高度
+                form: {
+                    username: "",
+                    password: "",
+                },
+                rules: {
+                    username: [{ required: true, message: '请输入账号' }],
+                    password: [{ required: true, message: '请输入密码' }]
+                }
+            };
+        },
+        methods: {
+            login() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/user/loginAdmin", this.form)
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.$toast.success('登录成功');
+                        let user = res.data;
+                        this.$store.commit("updateLogin", true);
+                        sessionStorage.userInfo = JSON.stringify(user);
+                        this.$router.push("/index");
+                    } else {
+                        toast.clear();
+                        this.$toast.success('登录失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+            
+            jumpTo() {
+                this.$router.push("/register");
+            }
+        },
+    };
+</script>
+
+<style lang="less" scoped>
+    .logo {
+        font-size: 100px !important;
+        margin-bottom: 150px;
+    }
+
+    /* 本页公共样式 */
+    .login {
+        height: 100vh;
+        background-color: #fff;
+    }
+
+    header {
+        text-align: center;
+    }
+
+    // 手机号码
+    .login_logo {
+        margin: 55px 0 30px;
+    }
+
+    .login_title {
+        font-size: 24px;
+        color: #20a0ff;
+        margin: 0 0 10px 0;
+    }
+
+    .login_subtitle {
+        font-size: 14px;
+        color: #afafaf;
+        margin: 0 0 40px 0;
+    }
+
+    .login_form {
+        .form_input {
+            margin: 0 0 30px 0;
+        }
+
+        .form_btn {
+            width: 80%;
+            margin: 0 auto !important;
+            button {
+                background-color: #20a0ff;
+            }
+        }
+
+        .form_jump {
+            margin: 20px 0 0 0;
+            color: #20a0ff;
+            font-size: 14px;
+        }
+    }
+</style>
+

fhKeeper/formulahousekeeper/timesheet_h5/src/views/my/children/center.vue

@@ -0,0 +1,143 @@
+<template>
+    <div class="center">
+        <!-- 头部 -->
+        <header>
+            <div class="beijin"></div>
+            <div class="flex aic users pixed" style="width:50%;">
+                <img :src="require('../../../assets/img/personal/userHead.png')" class="imege" />
+                <span class="f16 fff ml-20">{{userInfo.name}} </span>
+            </div>
+        </header>
+
+        <!-- 主体 -->
+        <main class="mt-10">
+            <div class="bg-fff">
+                <van-cell title="账号" :title-style="'flex: 0.5;'" :value="userInfo.phone"></van-cell>
+                <van-cell title="公司" :title-style="'flex: 0.5;'" :value="userInfo.companyName"></van-cell>
+                <van-cell title="修改密码" isLink to="/my/set"></van-cell>
+            </div>
+            <van-button class="logout" @click="logout" block round type="danger" >退出登录</van-button>
+        </main>
+
+        <Footer page="my" />
+    </div>
+</template>
+
+<script>
+    import Footer from "@/components/Footer";
+    import { mapGetters } from "vuex";
+    export default {
+        components: {
+            Footer
+        },
+
+        computed: {
+            ...mapGetters(["userId", "isLogin"])
+        },
+
+        data() {
+            return {
+                userInfo: JSON.parse(sessionStorage.userInfo),
+            }
+        },
+
+        methods: {
+            logout() {
+                this.$store.commit("updateLogin", false);
+                sessionStorage.removeItem("userInfo");
+                this.$router.push("/login");
+            }
+        },
+        create() {
+        },
+        mounted() {
+        }
+    };
+</script>
+
+<style lang="less" scoped>
+    /* 本页公共样式 */
+    .gray {
+        color: #797d82;
+    }
+
+    .bott0 {
+        bottom: 0;
+    }
+
+    .orange {
+        color: #ff5f16
+    }
+
+    .yellow {
+        color: #ffb232
+    }
+
+    .bd-gray {
+        border-bottom: 1px solid #f5f5f5;
+    }
+
+    // 头部图片
+    .beijin {
+        background: url(../../../assets/img/personal/head_back.jpg) repeat-y center center;
+        height: 200px;
+        background-size: cover;
+        margin-top: -44px;
+    }
+
+    // 用户名和头像
+    .users {
+        top: 55px;
+        left: 22px;
+        position: absolute;
+
+        // 头像
+        .imege {
+            height: 65px;
+            border-radius: 50%;
+        }
+
+        .fff {
+            font-size: 22px;
+        }
+    }
+
+    // 导航
+    .nav {
+        height: 75px;
+
+        .iconfont {
+            font-weight: bold;
+        }
+
+        .cit {
+            height: 26px;
+        }
+    }
+
+    .logout {
+        width: 80%;
+        margin: 50px auto 0;
+    }
+
+    // 主体
+    main {
+        .list {
+            height: 50px;
+
+            .image {
+                height: 20px;
+            }
+        }
+
+        .foun {
+            font-size: 12px;
+        }
+
+    }
+
+    /* 底部 */
+    .footer {
+        height: 50px;
+    }
+</style>

fhKeeper/formulahousekeeper/timesheet_h5/src/views/my/children/set.vue

@@ -0,0 +1,105 @@
+<template>
+    <div class="page">
+        <van-nav-bar title="修改密码" left-text="返回" left-arrow @click-left="back"></van-nav-bar>
+
+        <van-form class="edit_form" @submit="setPassWord">
+            <van-field class="form_input" v-model="form.originPassword" name="originPassword" type="password" label="旧密码" placeholder="请输入旧密码" :rules="rules.originPassword" />
+            <van-field class="form_input" v-model="form.newPassword" name="newPassword" type="password" label="新密码" placeholder="请输入新密码" :rules="rules.newPassword" />
+            <div class="form_btn" style="margin: 16px;">
+                <van-button round block type="info" native-type="submit"> 提交 </van-button>
+            </div>
+        </van-form>
+    </div>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                form: {
+                    originPassword: '',
+                    newPassword: '',
+                },
+                rules: {
+                    originPassword: [{ required: true, message: '请输入旧密码' }],
+                    newPassword: [{ required: true, message: '请输入新密码' }],
+                }
+            };
+        },
+        methods: {
+            back() {
+                history.back();
+            },
+
+            setPassWord() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/user/editPassword", this.form)
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.$toast.success('修改成功,请重新登录');
+                        this.$store.commit("updateLogin", false);
+                        sessionStorage.removeItem("userInfo");
+                        this.$router.push("/login");
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('修改失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            }
+        }
+    };
+</script>
+
+<style lang="less" scoped>
+    .logout {
+        bottom: 0;
+        height: 50px;
+        color: #ff5f16;
+    }
+
+    /* 本页公共样式 */
+    .gray {
+        color: #797d82;
+    }
+
+    .bott0 {
+        bottom: 0;
+    }
+
+    .orange {
+        color: #ff5f16
+    }
+
+    .f15 {
+        font-size: 15px;
+    }
+
+    .bd-gray {
+        border-bottom: 1px solid #f5f5f5;
+    }
+
+    // 设置
+    header {
+        .city {
+            height: 44px;
+            line-height: 44px;
+        }
+    }
+
+    // 账号ID
+    .id {
+        height: 49px;
+        line-height: 49px;
+
+    }
+</style>
+<style lang="less">
+    .van-nav-bar .van-icon , .van-nav-bar__text {
+        color: #20a0ff;
+    }
+</style>
+

fhKeeper/formulahousekeeper/timesheet_h5/src/views/my/index.vue

@@ -0,0 +1,3 @@
+<template>
+    <router-view></router-view>
+</template>

fhKeeper/formulahousekeeper/timesheet_h5/src/views/register/index.vue

@@ -0,0 +1,112 @@
+<template>
+    <header class="login">
+        <van-nav-bar title="企业注册" left-text="返回" left-arrow @click-left="back"></van-nav-bar>
+
+        <van-form class="login_form" @submit="register">
+            <van-field class="form_input" v-model="form.companyName" name="companyName" label="公司名称" placeholder="请输入公司名称" :rules="rules.companyName" />
+            <van-field class="form_input" v-model="form.name" name="name" label="姓名" placeholder="请输入姓名" :rules="rules.name" />
+            <van-field class="form_input" v-model="form.phone" name="phone" label="手机号" placeholder="请输入手机号" :rules="rules.phone" />
+            <div class="form_tip">手机号为负责人登录账号，默认密码：<span>000000</span></div>
+            <div class="form_btn" style="margin: 16px;">
+                <van-button round block type="info" native-type="submit"> 注册 </van-button>
+            </div>
+        </van-form>
+    </header>
+</template>
+
+<script>
+    import { constants } from "crypto";
+    export default {
+        data() {
+            return {
+                form: {
+                    companyName: '',
+                    name: '',
+                    phone: ''
+                },
+                rules: {
+                    companyName: [{ required: true, message: '请输入公司名称' }],
+                    name: [{ required: true, message: '请输入姓名' }],
+                    phone: [
+                        { required: true, message: '请输入手机号' },
+                        { validator: this.phoneValidator, message: '手机号格式错误' },
+                    ]
+                }
+            };
+        },
+        methods: {
+            phoneValidator(val) {
+                return /1\d{10}/.test(val);
+            },
+
+            register() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/user/insertCompany", this.form)
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.$toast.success('注册成功');
+                        this.$router.push("/login");
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('注册失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+            
+            back() {
+                this.$router.push("/login");
+            }
+        },
+    };
+</script>
+
+<style lang="less" scoped>
+    .logo {
+        font-size: 100px !important;
+        margin-bottom: 150px;
+    }
+
+    /* 本页公共样式 */
+    .login {
+        height: 100vh;
+        background-color: #fff;
+    }
+
+    header {
+        text-align: center;
+    }
+
+    .login_form {
+        padding-top: 20px;
+        .form_input {
+            margin: 0 0 30px 0;
+        }
+
+        .form_btn {
+            width: 80%;
+            margin: 0 auto !important;
+            button {
+                background-color: #20a0ff;
+            }
+        }
+
+        .form_tip {
+            margin: 0 0 30px 0;
+            font-size: 14px;
+            color: #afafaf;
+            span {
+                color: #ff0000;
+            }
+        }
+    }
+</style>
+<style lang="less">
+    .van-nav-bar .van-icon , .van-nav-bar__text {
+        color: #20a0ff;
+    }
+</style>
+

fhKeeper/formulahousekeeper/timesheet_h5/src/views/review/index.vue

@@ -0,0 +1,186 @@
+<template>
+    <div>
+        <van-nav-bar title="审核日报" left-text="返回" @click-left="back" fixed left-arrow/>
+        
+        <div class="login_form">
+            <van-sticky :offset-top="46">
+            <van-field readonly clickable name="datetimePicker" :value="nowTime" label="时间选择" placeholder="点击选择时间" @click="showPicker = true"/>
+            </van-sticky>
+            <van-popup v-model="showPicker" position="bottom">
+                <van-datetime-picker v-model="currentDate" type="date" :min-date="minDate" :max-date="maxDate" @confirm="changeTime" @cancel="showPicker = false"/>
+            </van-popup>
+            <van-skeleton v-if="report.length!=0" v-for="(item,index) in report" title avatar :row="3" :loading="false">
+                <van-panel class="one_report" :title="item.name" :status="item.state==0?'待审核':item.state==1?'已通过':'已驳回'">
+                    <div class="form_text">
+                        <span style="margin-right:20px;">
+                            <i v-if="parseFloat(item.reportTime)>parseFloat(item.calculateTime)+0.5" style="color:red;margin-right:8px;" class="fa fa-exclamation-triangle"></i>
+                            总填报：
+                            <span :style="parseFloat(item.reportTime)>parseFloat(item.calculateTime)+0.5?'color:red':''">{{item.reportTime}}h</span>
+                        </span>
+                        <span>系统智能统计：{{item.calculateTime}}h</span>
+                    </div>
+                    <div v-for="(item1,index1) in item.data" class="one_report_data">
+                        <div class="project_title">项目：{{item1.project}}</div>
+                        <div class="project_time">时长：{{item1.time}}h</div>
+                        <div class="project_content">事项：<span v-html="item1.content"></span></div>
+                        <van-divider />
+                    </div>
+                    <div class="form_btn" slot="footer">
+                        <van-button v-if="user.role != 0 && item.state == 0" size="small" type="info" @click="approve(item.id)">通过</van-button>
+                        <van-button v-if="user.role != 0 && item.state == 0" size="small" type="danger" @click="deny(item.id,1)">驳回</van-button>
+                        <van-button v-if="user.role != 0 && item.state == 1" size="small" type="danger" @click="deny(item.id,2)">撤销</van-button>
+                    </div>
+                </van-panel>
+            </van-skeleton>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                user: JSON.parse(sessionStorage.userInfo),
+                minDate: new Date(2010, 0, 1),
+                maxDate: new Date(new Date().getFullYear(),new Date().getMonth(),new Date().getDate()),
+                currentDate: new Date(),
+                nowTime: this.format(new Date(new Date()),"yyyy-MM-dd"),
+                showPicker: false,
+                report: [],
+            };
+        },
+        created() {
+        },
+        methods: {
+            // 返回
+            back() {
+                history.back();
+            },
+
+             // 时间转换
+            format(date, pattern) {
+                pattern = pattern || "yyyy-MM-dd";
+                var _this = this;
+                return pattern.replace(/([yMdhsm])(\1*)/g, function ($0) {
+                    switch ($0.charAt(0)) {
+                        case 'y': return _this.padding(date.getFullYear(), $0.length);
+                        case 'M': return _this.padding(date.getMonth() + 1, $0.length);
+                        case 'd': return _this.padding(date.getDate(), $0.length);
+                        case 'w': return date.getDay() + 1;
+                        case 'h': return _this.padding(date.getHours(), $0.length);
+                        case 'm': return _this.padding(date.getMinutes(), $0.length);
+                        case 's': return _this.padding(date.getSeconds(), $0.length);
+                    }
+                });
+            },
+
+            padding(s, len) {
+                var len = len - (s + '').length;
+                for (var i = 0; i < len; i++) { s = '0' + s; }
+                return s;
+            },
+
+            // 改变时间
+            changeTime(time) {
+                this.nowTime = this.format(new Date(time),"yyyy-MM-dd");
+                this.currentDate = time;
+                this.showPicker = false;
+                this.getReport();
+            },
+
+            // 获取日报
+            getReport() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/report/getReportList", {date: this.nowTime})
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.report = res.data;
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('获取失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+
+            approve(id) {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/report/approve", {id: id , date: this.nowTime})
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.$toast.success('审核成功');
+                        this.getReport();
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('审核失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+
+            deny(id,i) {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/report/deny", {id: id , date: this.nowTime})
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.$toast.success(i==0?'驳回成功':'撤销成功');
+                        this.getReport();
+                    } else {
+                        toast.clear();
+                        this.$toast.fail(i==0?'驳回失败':'撤销失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            }
+        },
+
+        mounted() {
+            this.getReport();
+        }
+    };
+</script>
+
+<style lang="less" scoped>
+    .login_form {
+        margin-top: 46px;
+    }
+
+    .one_report {
+        margin-bottom: 15px;
+    }
+
+    .form_text {
+        margin: 15px 0 30px;
+        padding: 0 12px;
+    }
+    
+    .form_btn {
+        text-align: right;
+    }
+
+    .form_btn button {
+        margin-left: 10px;
+    }
+
+    .one_report_data {
+        margin-bottom: 20px;
+        padding: 0 22px;
+        div {
+            line-height: 30px;
+        }
+    }
+</style>
+<style lang="less">
+    .van-nav-bar .van-icon , .van-nav-bar__text {
+        color: #20a0ff;
+    }
+</style>

fhKeeper/formulahousekeeper/timesheet_h5/src/views/view/index.vue

@@ -0,0 +1,145 @@
+<template>
+    <div>
+        <van-nav-bar title="查看日报" left-text="返回" @click-left="back" fixed left-arrow/>
+        
+        <div class="login_form">
+            <van-sticky :offset-top="46">
+            <van-field readonly clickable name="datetimePicker" :value="nowTime" label="时间选择" placeholder="点击选择时间" @click="showPicker = true"/>
+            </van-sticky>
+            <van-popup v-model="showPicker" position="bottom">
+                <van-datetime-picker v-model="currentDate" type="date" :min-date="minDate" :max-date="maxDate" @confirm="changeTime" @cancel="showPicker = false"/>
+            </van-popup>
+            <van-skeleton v-if="report.length!=0" v-for="(item,index) in report" title avatar :row="3" :loading="false">
+                <van-panel class="one_report" :title="item.name" :status="item.state==0?'待审核':item.state==1?'已通过':'已驳回'">
+                    <div class="form_text">
+                        <span style="margin-right:20px;">
+                            <i v-if="parseFloat(item.reportTime)>parseFloat(item.calculateTime)+0.5" style="color:red;margin-right:8px;" class="fa fa-exclamation-triangle"></i>
+                            总填报：
+                            <span :style="parseFloat(item.reportTime)>parseFloat(item.calculateTime)+0.5?'color:red':''">{{item.reportTime}}h</span>
+                        </span>
+                        <span>系统智能统计：{{item.calculateTime}}h</span>
+                    </div>
+                    <div v-for="(item1,index1) in item.data" class="one_report_data">
+                        <div class="project_title">项目：{{item1.project}}</div>
+                        <div class="project_time">时长：{{item1.time}}h</div>
+                        <div class="project_content">事项：<span v-html="item1.content"></span></div>
+                        <van-divider />
+                    </div>
+                </van-panel>
+            </van-skeleton>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                user: JSON.parse(sessionStorage.userInfo),
+                minDate: new Date(2010, 0, 1),
+                maxDate: new Date(new Date().getFullYear(),new Date().getMonth(),new Date().getDate()),
+                currentDate: new Date(),
+                nowTime: this.format(new Date(new Date()),"yyyy-MM-dd"),
+                showPicker: false,
+                report: [],
+            };
+        },
+        created() {
+        },
+        methods: {
+            // 返回
+            back() {
+                history.back();
+            },
+
+             // 时间转换
+            format(date, pattern) {
+                pattern = pattern || "yyyy-MM-dd";
+                var _this = this;
+                return pattern.replace(/([yMdhsm])(\1*)/g, function ($0) {
+                    switch ($0.charAt(0)) {
+                        case 'y': return _this.padding(date.getFullYear(), $0.length);
+                        case 'M': return _this.padding(date.getMonth() + 1, $0.length);
+                        case 'd': return _this.padding(date.getDate(), $0.length);
+                        case 'w': return date.getDay() + 1;
+                        case 'h': return _this.padding(date.getHours(), $0.length);
+                        case 'm': return _this.padding(date.getMinutes(), $0.length);
+                        case 's': return _this.padding(date.getSeconds(), $0.length);
+                    }
+                });
+            },
+
+            padding(s, len) {
+                var len = len - (s + '').length;
+                for (var i = 0; i < len; i++) { s = '0' + s; }
+                return s;
+            },
+
+            // 改变时间
+            changeTime(time) {
+                this.nowTime = this.format(new Date(time),"yyyy-MM-dd");
+                this.currentDate = time;
+                this.showPicker = false;
+                this.getReport();
+            },
+
+            // 获取日报
+            getReport() {
+                const toast = this.$toast.loading({
+                    forbidClick: true,
+                    duration: 0
+                });
+                this.$axios.post("/report/getReportList", {date: this.nowTime})
+                .then(res => {
+                    if(res.code == "ok") {
+                        toast.clear();
+                        this.report = res.data;
+                    } else {
+                        toast.clear();
+                        this.$toast.fail('获取失败');
+                    }
+                }).catch(err=> {toast.clear();});
+            },
+        },
+
+        mounted() {
+            this.getReport();
+        }
+    };
+</script>
+
+<style lang="less" scoped>
+    .login_form {
+        margin-top: 46px;
+    }
+
+    .one_report {
+        margin-bottom: 15px;
+    }
+
+    .form_text {
+        margin: 15px 0 30px;
+        padding: 0 12px;
+    }
+    
+    .form_btn {
+        text-align: right;
+    }
+
+    .form_btn button {
+        margin-left: 10px;
+    }
+
+    .one_report_data {
+        margin-bottom: 20px;
+        padding: 0 22px;
+        div {
+            line-height: 30px;
+        }
+    }
+</style>
+<style lang="less">
+    .van-nav-bar .van-icon , .van-nav-bar__text {
+        color: #20a0ff;
+    }
+</style>