Accueil Explorer Aide
S'inscrire Connexion
zhangzf
/
AP-APPxianxiaqiandao
1
0
Fork 0
Fichiers Tickets 0 Pull Requests 0 Wiki
Parcourir la source

installyilai

zzf il y a 2 ans
Parent
b41e9f317c
commit
53da684382
16 fichiers modifiés avec 1749 ajouts et 163 suppressions
Vue séparée Afficher les stats Diff
  1. 2 2
      index.html
  2. 1383 0
      package-lock.json
  3. 14 1
      package.json
  4. 31 0
      postcss.config.cjs
  5. 9 25
      src/App.vue
  6. 111 0
      src/assets/css/common.scss
  7. 0 40
      src/components/HelloWorld.vue
  8. 19 3
      src/main.js
  9. 8 0
      src/router/router.js
  10. 31 0
      src/router/routes.js
  11. 0 89
      src/style.css
  12. 13 0
      src/view/Home/Home.vue
  13. 4 0
      src/view/Home/home.css
  14. 23 0
      src/view/Test/Test.vue
  15. 13 0
      src/view/Test/test.css
  16. 88 3
      vite.config.js

+ 2 - 2
index.html
Voir le fichier 

@@ -3,8 +3,8 @@
 
   <head>
 
     <meta charset="UTF-8" />
 
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-    <title>Vite + Vue</title>
 
+    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui" />
 
+    <title>Punch In</title>
 
   </head>
 
   <body>
 
     <div id="app"></div>

Fichier diff supprimé car celui-ci est trop grand
+ 1383 - 0
package-lock.json


+ 14 - 1
package.json
Voir le fichier 

@@ -9,7 +9,20 @@
 
     "preview": "vite preview"
 
   },
 
   "dependencies": {
 
-    "vue": "^3.3.4"
 
+    "amfe-flexible": "^2.2.1",
 
+    "autoprefixer": "^10.4.14",
 
+    "axios": "^1.4.0",
 
+    "consola": "^3.2.3",
 
+    "dsbridge": "^3.1.4",
 
+    "eruda": "^3.0.1",
 
+    "path": "^0.12.7",
 
+    "postcss-pxtorem": "^6.0.0",
 
+    "sass": "^1.64.0",
 
+    "vant": "^4.6.2",
 
+    "vite-plugin-style-import": "^2.0.0",
 
+    "vue": "^3.3.4",
 
+    "vue-router": "^4.2.4",
 
+    "vue-wechat-title": "^2.0.7"
 
   },
 
   "devDependencies": {
 
     "@vitejs/plugin-vue": "^4.2.3",

+ 31 - 0
postcss.config.cjs
Voir le fichier 

@@ -0,0 +1,31 @@
 
+
 
+
 
+// module.exports = {
 
+//     plugins: {
 
+//         autoprefixer: {},
 
+//         // https://github.com/evrone/postcss-px-to-viewport/blob/HEAD/README_CN.md
 
+//         // https://www.shangmayuan.com/a/455cef3107c848f9a6190e82.html
 
+//         'postcss-px-to-viewport': {
 
+//             unitToConvert: 'px', // 需要转换的单位，默认为"px"
 
+//             viewportWidth: 750, // 设计稿的宽度
 
+//             unitPrecision: 4,// 单位转换后保留的精度
 
+//             viewportUnit: 'vw', //(String) 希望使用的视口单位
 
+//             fontViewportUnit: 'vw', //(String) 字体使用的视口单位
 
+//         }
 
+//     }    
+    
+//   }
 
+// postcss.config.js
 
+module.exports = {
 
+    plugins: {
 
+        autoprefixer: {},
 
+        // postcss-pxtorem 插件的版本需要 >= 5.0.0
 
+        'postcss-pxtorem': {
 
+            rootValue({ file }) {
 
+                return 37.5;
 
+                //return file.indexOf('vant') !== -1 ? 37.5 : 75;
 
+            },
 
+            propList: ['*'],
 
+        },
 
+    },
 
+  };

+ 9 - 25
src/App.vue
Voir le fichier 

@@ -1,30 +1,14 @@
 
-<script setup>
 
-import HelloWorld from './components/HelloWorld.vue'
 
+
 
+<script setup >
 
+import { RouterView } from 'vue-router';
 
+
 
+
 
 </script>
 
 
 <template>
 
-  <div>
 
-    <a href="https://vitejs.dev" target="_blank">
 
-      <img src="/vite.svg" class="logo" alt="Vite logo" />
 
-    </a>
 
-    <a href="https://vuejs.org/" target="_blank">
 
-      <img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
 
-    </a>
 
-  </div>
 
-  <HelloWorld msg="Vite + Vue" />
 
+  <RouterView  v-wechat-title="$route.meta.title"   ></RouterView>
 
 </template>
 
 
-<style scoped>
 
-.logo {
 
-  height: 6em;
 
-  padding: 1.5em;
 
-  will-change: filter;
 
-  transition: filter 300ms;
 
-}
 
-.logo:hover {
 
-  filter: drop-shadow(0 0 2em #646cffaa);
 
-}
 
-.logo.vue:hover {
 
-  filter: drop-shadow(0 0 2em #42b883aa);
 
-}
 
-</style>
 
+<style lang="scss" >
 
+@import "./assets/css/common.scss"
 
+</style>

+ 111 - 0
src/assets/css/common.scss
Voir le fichier 

@@ -0,0 +1,111 @@
 
+*{
 
+    margin:0;
 
+    padding:0;
 
+}
 
+button{
 
+    background: none;
 
+    border:none;
 
+}
 
+button:focus,
 
+select:focus,
 
+input:focus{
 
+    outline: none;
 
+}
 
+html,body{
 
+    width:100%;
 
+    height:100%;
 
+}
 
+#app {
 
+    width:100%;
 
+    height:100%;
 
+    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif;
 
+}
 
+.icon{
 
+    width: 1em;
 
+    height: 1em;
 
+    vertical-align: -0.15em;
 
+    fill: currentColor;
 
+    overflow: hidden;
 
+}
 
+/**自定义滚动条样式 */
 
+.scrollbar-style{
 
+    /**work on FireFox https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Scrollbars */
 
+    scrollbar-color: #999999 transparent; /* 第一个值是滑块颜色，第二个值是轨道背景颜色 */
 
+    scrollbar-width: thin;
 
+}
 
+/**work on Chrome, Edge, Safari 
+::-webkit-scrollbar— 整个滚动条.
 
+::-webkit-scrollbar-button — 滚动条上的按钮 (上下箭头).
 
+::-webkit-scrollbar-thumb — 滚动条上的滚动滑块.
 
+::-webkit-scrollbar-track — 滚动条轨道.
 
+::-webkit-scrollbar-track-piece — 滚动条没有滑块的轨道部分.
 
+::-webkit-scrollbar-corner — 当同时有垂直滚动条和水平滚动条时交汇的部分.
 
+::-webkit-resizer — 某些元素的corner部分的部分样式(例:textarea的可拖动按钮).
 
+* https://segmentfault.com/a/1190000020991323
 
+*/
 
+.scrollbar-style::-webkit-scrollbar{
 
+    width: 8px; /* 垂直滚动条宽度 */
 
+    height: 8px; /* 水平滚动条高度 */
 
+}
 
+.scrollbar-style::-webkit-scrollbar-track{
 
+    background-color: transparent;
 
+}
 
+.scrollbar-style::-webkit-scrollbar-thumb{
 
+    background: #999999;
 
+    border-radius: 25px;
 
+}
 
+
 
+.scrollbar-style::-webkit-scrollbar-corner{
 
+    background-color: transparent;
 
+}
 
+
 
+.page{
 
+    box-sizing: border-box;
 
+    width: 100%;
 
+    padding: 30px 20px;
 
+    color:#000000;
 
+}
 
+.page-h1{
 
+    font-size: 36px;
 
+    font-weight: bold;
 
+    padding: 20px 0;
 
+}
 
+.page-h2{
 
+    font-size: 32px;
 
+    font-weight: bold;
 
+    padding: 20px 0;
 
+}
 
+.page-h3{
 
+    font-size: 28px;
 
+    font-weight: bold;
 
+}
 
+.page-p{
 
+    font-size: 24px;
 
+    line-height: 1.5em;
 
+}
 
+.page-p.x-large{
 
+    font-size: 32px;
 
+    line-height: 1.5em;
 
+}
 
+.page-p.large{
 
+    font-size: 30px;
 
+    line-height: 1.5em;
 
+}
 
+.page-p.medium{
 
+    font-size: 28px;
 
+    line-height: 1.5em;
 
+}
 
+.page-p img{
 
+    width: 100%;
 
+    height: auto;
 
+}
 
+
 
+.text-overflow-2{
 
+    overflow:hidden;
 
+    text-overflow:ellipsis;
 
+    display:-webkit-box;
 
+    -webkit-line-clamp:2;
 
+    -webkit-box-orient:vertical;
 
+    font-size: 24px;
 
+    line-height: 1.5em;
 
+}

+ 0 - 40
src/components/HelloWorld.vue
Voir le fichier 

@@ -1,40 +0,0 @@
 
-<script setup>
 
-import { ref } from 'vue'
 
-
 
-defineProps({
 
-  msg: String,
 
-})
 
-
 
-const count = ref(0)
 
-</script>
 
-
 
-<template>
 
-  <h1>{{ msg }}</h1>
 
-
 
-  <div class="card">
 
-    <button type="button" @click="count++">count is {{ count }}</button>
 
-    <p>
 
-      Edit
 
-      <code>components/HelloWorld.vue</code> to test HMR
 
-    </p>
 
-  </div>
 
-
 
-  <p>
 
-    Check out
 
-    <a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
 
-      >create-vue</a
 
-    >, the official Vue + Vite starter
 
-  </p>
 
-  <p>
 
-    Install
 
-    <a href="https://github.com/vuejs/language-tools" target="_blank">Volar</a>
 
-    in your IDE for a better DX
 
-  </p>
 
-  <p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
 
-</template>
 
-
 
-<style scoped>
 
-.read-the-docs {
 
-  color: #888;
 
-}
 
-</style>

+ 19 - 3
src/main.js
Voir le fichier 

@@ -1,5 +1,21 @@
 
-import { createApp } from 'vue'
 
-import './style.css'
 
+import * as Vue from 'vue'
 
+import 'amfe-flexible'
 
+import VueWechatTitle from 'vue-wechat-title';
 
+import {router} from './router/router';
 
+
 
 import App from './App.vue'
 
+import bridge from 'dsbridge';
 
+
 
+const app = Vue.createApp(App);
 
+
 
+var userToken = bridge.call('gettoken');
 
+console.log('入口文件获取userToken ----- ', userToken);
 
+// app.provide('userToken', userToken);
 
+if(userToken) {
 
+    window.sessionStorage.setItem('usertoken', userToken);
 
+}
 
+
 
 
-createApp(App).mount('#app')
 
+app.use(router);
 
+app.use(VueWechatTitle);
 
+app.mount('#app');

+ 8 - 0
src/router/router.js
Voir le fichier 

@@ -0,0 +1,8 @@
 
+import * as VueRouter from 'vue-router';
 
+import { routes } from './routes';
 
+
 
+const router =VueRouter.createRouter({
 
+    history:VueRouter.createWebHashHistory(),
 
+    routes,
 
+});
 
+export {router};

+ 31 - 0
src/router/routes.js
Voir le fichier 

@@ -0,0 +1,31 @@
 
+import * as VueRouter  from 'vue-router';
 
+// 1. 定义路由组件.
 
+// 也可以从其他文件导入
 
+import Home from '@/view/Home/Home.vue';
 
+import Test from '@/view/Test/Test.vue';
 
+// const Home = { template: '<div>Home</div>' }
 
+// const About = { template: '<div>About</div>' }
 
+
 
+// 2. 定义一些路由
 
+// 每个路由都需要映射到一个组件。
 
+// 我们后面再讨论嵌套路由。
 
+const routes = [
 
+    { 
+        name: 'Home', 
+        path: '/', 
+        component: Home,
 
+        meta: {
 
+            title: 'Punch In '
 
+        }
 
+    },
 
+    { 
+        name: 'Test', 
+        path: '/test', 
+        component: Test,
 
+        meta: {
 
+            title: 'Test'
 
+        }
 
+    },
 
+]
 
+
 
+export { routes };

+ 0 - 89
src/style.css
Voir le fichier 

@@ -1,89 +0,0 @@
 
-:root {
 
-  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
 
-  line-height: 1.5;
 
-  font-weight: 400;
 
-
 
-  color-scheme: light dark;
 
-  color: rgba(255, 255, 255, 0.87);
 
-  background-color: #242424;
 
-
 
-  font-synthesis: none;
 
-  text-rendering: optimizeLegibility;
 
-  -webkit-font-smoothing: antialiased;
 
-  -moz-osx-font-smoothing: grayscale;
 
-  -webkit-text-size-adjust: 100%;
 
-}
 
-
 
-a {
 
-  font-weight: 500;
 
-  color: #646cff;
 
-  text-decoration: inherit;
 
-}
 
-a:hover {
 
-  color: #535bf2;
 
-}
 
-
 
-a {
 
-  font-weight: 500;
 
-  color: #646cff;
 
-  text-decoration: inherit;
 
-}
 
-a:hover {
 
-  color: #535bf2;
 
-}
 
-
 
-body {
 
-  margin: 0;
 
-  display: flex;
 
-  place-items: center;
 
-  min-width: 320px;
 
-  min-height: 100vh;
 
-}
 
-
 
-h1 {
 
-  font-size: 3.2em;
 
-  line-height: 1.1;
 
-}
 
-
 
-button {
 
-  border-radius: 8px;
 
-  border: 1px solid transparent;
 
-  padding: 0.6em 1.2em;
 
-  font-size: 1em;
 
-  font-weight: 500;
 
-  font-family: inherit;
 
-  background-color: #1a1a1a;
 
-  cursor: pointer;
 
-  transition: border-color 0.25s;
 
-}
 
-button:hover {
 
-  border-color: #646cff;
 
-}
 
-button:focus,
 
-button:focus-visible {
 
-  outline: 4px auto -webkit-focus-ring-color;
 
-}
 
-
 
-.card {
 
-  padding: 2em;
 
-}
 
-
 
-#app {
 
-  max-width: 1280px;
 
-  margin: 0 auto;
 
-  padding: 2rem;
 
-  text-align: center;
 
-}
 
-
 
-@media (prefers-color-scheme: light) {
 
-  :root {
 
-    color: #213547;
 
-    background-color: #ffffff;
 
-  }
 
-  a:hover {
 
-    color: #747bff;
 
-  }
 
-  button {
 
-    background-color: #f9f9f9;
 
-  }
 
-}

+ 13 - 0
src/view/Home/Home.vue
Voir le fichier 

@@ -0,0 +1,13 @@
 
+<script setup>
 
+
 
+
 
+</script>
 
+
 
+<template>
 
+<h1> home页面</h1>
 
+
 
+</template>
 
+
 
+<style scoped lang="css" >
 
+@import "./home.css";
 
+</style>

+ 4 - 0
src/view/Home/home.css
Voir le fichier 

@@ -0,0 +1,4 @@
 
+h1{
 
+    height: 2rem;
 
+    color: pink ;
 
+}

+ 23 - 0
src/view/Test/Test.vue
Voir le fichier 

@@ -0,0 +1,23 @@
 
+<script setup>
 
+/**
 
+ * 在 setup 中你应该避免使用 this，因为它不会找到组件实例。
 
+ * setup 的调用发生在 data property、computed property 或 methods 被解析之前，
 
+ * 所以它们无法在 setup 中被获取。
 
+ */
 
+import { ref, onMounted, watch, inject } from 'vue';
 
+import { useRouter } from 'vue-router';
 
+const rotating = ref(true);
 
+</script>
 
+
 
+<template>
 
+ 
+<div class="lucky-wheel-root-inner rotating">
 
+    dfgdfgf
 
+</div>
 
+
 
+   
+</template>
 
+
 
+<style scoped >
 
+@import "./test.css";
 
+</style>

+ 13 - 0
src/view/Test/test.css
Voir le fichier 

@@ -0,0 +1,13 @@
 
+.lucky-wheel-root-inner{
 
+    position: relative;
 
+    box-sizing: border-box;
 
+    width: 8.48rem;
 
+    height: 8.48rem;
 
+    margin: .16rem auto 0 auto;
 
+    background-image: url('https://cdn.westkiss.com/media/wysiwyg/wap/202303211430.png');
 
+    background-position: 0 0;
 
+    background-size: 100% 100%;
 
+    box-shadow: 0 .5333rem .5333rem 0px rgba(158,106,112,0.5);
 
+    border-radius: 50%;
 
+    transform: rotate(0deg);
 
+}

+ 88 - 3
vite.config.js
Voir le fichier 

@@ -1,7 +1,92 @@
 
-import { defineConfig } from 'vite'
 
-import vue from '@vitejs/plugin-vue'
 
+import { resolve } from 'path';
 
+import { defineConfig } from 'vite';
 
+import vue from '@vitejs/plugin-vue';
 
+// import styleImport, { VantResolve } from 'vite-plugin-style-import';
 
+function pathResolve(dir) {
 
+  return resolve(__dirname, dir);
 
+}
 
 
 // https://vitejs.dev/config/
 
 export default defineConfig({
 
-  plugins: [vue()],
 
+    base: './',
 
+    build: {
 
+      outDir: 'dist/punchin'
 
+    },
 
+    resolve:{
 
+        alias:[
 
+            {
 
+                find: '@',
 
+                replacement: pathResolve('src'),
 
+            }
 
+        ],
 
+    },
 
+    plugins: [
 
+      vue(),
 
+      // styleImport({
 
+      //   // vant
 
+      //   libs: [
 
+      //     {
 
+      //       libraryName: 'vant',
 
+      //       esModule: true,
 
+      //       // https://github.com/anncwb/vite-plugin-style-import/issues/52
 
+      //       resolveStyle: (name) => `../es/${name}/style/index`,
 
+      //       // resolveStyle: (name) => `../node_modules/vant/es/${name}/style/index`, // 如果报找不到vant可以改用上面的路径
 
+      //     },
 
+      //   ],
 
+      //   // nutui
 
+
 
+
 
+      //   // libs: [
 
+      //   //   {
 
+      //   //     libraryName: '@nutui/nutui',
 
+      //   //     libraryNameChangeCase: 'pascalCase',
 
+      //   //     resolveStyle: (name) => {
 
+      //   //       return `@nutui/nutui/dist/packages/${name}/index.scss`
 
+      //   //     }
 
+      //   //   }
 
+      //   // ]
 
+
 
+
 
+        
+      // }),
 
+    ],
 
+    css: {
 
+      preprocessorOptions: {
 
+        scss: {
 
+          charset: false,
 
+          // 配置 nutui 全局 scss 变量
 
+          // additionalData: `@import "@nutui/nutui/dist/styles/variables.scss";`
 
+        }
 
+      }
 
+    },
 
+    server: {
 
+        proxy: {
 
+          // 字符串简写写法
 
+        //   '/api': 'http://www.myblog.com/api',
 
+          // 选项写法
 
+          '/app-api': {
 
+            target: 'htttps:alipearlapp.snjon.com',
 
+            // "https://ios.alipearlhair.com",//正式站    'http://www.myblog.com',
 
+            changeOrigin: true, // 设置成false报错
 
+            // rewrite: (path) => {
 
+            //     console.log(path,'ooooooooooooo');
 
+            //     path.replace(/^\/api/, '')
 
+            // }
 
+          },
 
+          '/api': {
 
+            target: "http://actapi.snjon.com",//'http://www.myblog.com',
 
+            changeOrigin: true, // 设置成false报错
 
+            // rewrite: (path) => {
 
+            //     console.log(path,'ooooooooooooo');
 
+            //     path.replace(/^\/api/, '')
 
+            // }
 
+          }
 
+          // 正则表达式写法
 
+        //   '^/fallback/.*': {
 
+        //     target: 'http://jsonplaceholder.typicode.com',
 
+        //     changeOrigin: true,
 
+        //     rewrite: (path) => path.replace(/^\/fallback/, '')
 
+        //   }
 
+        }
 
+    }
 
 })