finish basic page

packages/ui/package.json

@@ -25,6 +25,7 @@
     "@electron-toolkit/utils": "^3.0.0",
     "electron-updater": "^6.1.7",
     "element-plus": "^2.5.5",
+    "normalize.css": "^8.0.1",
     "vue-router": "^4.2.5"
   },
   "devDependencies": {
@@ -42,6 +43,7 @@
     "eslint": "^8.56.0",
     "eslint-plugin-vue": "^9.20.1",
     "prettier": "^3.2.4",
+    "sass": "^1.70.0",
     "typescript": "^5.3.3",
     "unplugin-auto-import": "^0.17.5",
     "unplugin-vue-components": "^0.26.0",

packages/ui/src/renderer/components.d.ts

@@ -8,6 +8,9 @@ export {}
 declare module 'vue' {
   export interface GlobalComponents {
     ElButton: typeof import('element-plus/es')['ElButton']
+    ElForm: typeof import('element-plus/es')['ElForm']
+    ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElInput: typeof import('element-plus/es')['ElInput']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
   }

packages/ui/src/renderer/src/main.ts

@@ -1,5 +1,6 @@
 import { createApp } from 'vue'
 import App from './App.vue'
 import router from './router'
+import 'normalize.css'
 
 createApp(App).use(router).mount('#app')

packages/ui/src/renderer/src/page/Configuration/GeekAutoStartChatWithBoss.vue

@@ -1,8 +1,53 @@
-<script setup lang="ts">
-</script>
-
 <template>
-  <div>
+  <div class="form-wrap">
-    <el-button>Hello</el-button>
+    <el-form :model="formContent" label-position="top">
+      <el-form-item
+        label="BossZhipin cookies (copy with EditThisCookie Extension from a window which has been logined)"
+        prop="bossZhipinCookies"
+      >
+        <el-input
+          v-model="formContent.bossZhipinCookies"
+          :autosize="{ minRows: 4 }"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-form-item label="Dingtalk robot access token" prop="dingtalkRobotAccessToken">
+        <el-input v-model="formContent.dingtalkRobotAccessToken" />
+      </el-form-item>
+      <el-form-item label="Your Expect Companies (separate with comma)" prop="expectCompanies">
+        <el-input
+          v-model="formContent.expectCompanies"
+          :autosize="{ minRows: 4 }"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-form-item class="last-form-item">
+        <el-button type="primary"> I'm ready, geekgeekgo! </el-button>
+      </el-form-item>
+    </el-form>
   </div>
 </template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const formContent = ref({
+  bossZhipinCookies: '',
+  dingtalkRobotAccessToken: '',
+  expectCompanies: ''
+})
+</script>
+
+<style scoped lang="scss">
+.form-wrap {
+  padding-top: 100px;
+  margin: 0 auto;
+  max-width: 640px;
+  .last-form-item {
+    :deep(.el-form-item__content) {
+      margin-top: 40px;
+      justify-content: flex-end;
+    }
+  }
+}
+</style>

pnpm-lock.yaml

@@ -58,6 +58,9 @@ importers:
       element-plus:
         specifier: ^2.5.5
         version: 2.5.5(vue@3.4.15)
+      normalize.css:
+        specifier: ^8.0.1
+        version: 8.0.1
       vue-router:
         specifier: ^4.2.5
         version: 4.2.5(vue@3.4.15)
@@ -104,6 +107,9 @@ importers:
       prettier:
         specifier: ^3.2.4
         version: 3.2.4
+      sass:
+        specifier: ^1.70.0
+        version: 1.70.0
       typescript:
         specifier: ^5.3.3
         version: 5.3.3
@@ -115,7 +121,7 @@ importers:
         version: 0.26.0(vue@3.4.15)
       vite:
         specifier: ^5.0.12
-        version: 5.1.1(@types/node@18.19.9)
+        version: 5.1.1(@types/node@18.19.9)(sass@1.70.0)
       vue:
         specifier: ^3.4.15
         version: 3.4.15(typescript@5.3.3)
@@ -1260,7 +1266,7 @@ packages:
       vite: ^5.0.0
       vue: ^3.2.25
     dependencies:
-      vite: 5.1.1(@types/node@18.19.9)
+      vite: 5.1.1(@types/node@18.19.9)(sass@1.70.0)
       vue: 3.4.15(typescript@5.3.3)
     dev: true
 
@@ -2203,7 +2209,7 @@ packages:
       esbuild: 0.19.12
       magic-string: 0.30.7
       picocolors: 1.0.0
-      vite: 5.1.1(@types/node@18.19.9)
+      vite: 5.1.1(@types/node@18.19.9)(sass@1.70.0)
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -2951,6 +2957,10 @@ packages:
     engines: {node: '>= 4'}
     dev: true
 
+  /immutable@4.3.5:
+    resolution: {integrity: sha512-8eabxkth9gZatlwl5TBuJnCsoTADlL6ftEr7A4qgdaTsPyreilDSnUk57SO+jfKcNtxPa22U5KK6DSeAYhpBJw==}
+    dev: true
+
   /import-fresh@3.3.0:
     resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
     engines: {node: '>=6'}
@@ -3461,6 +3471,10 @@ packages:
     resolution: {integrity: sha512-Wj7+EJQ8mSuXr2iWfnujrimU35R2W4FAErEyTmJoJ7ucwTn2hOUSsRehMb5RSYkxXGTM7Y9QpvPmp++w5ftoJw==}
     dev: false
 
+  /normalize.css@8.0.1:
+    resolution: {integrity: sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==}
+    dev: false
+
   /nth-check@2.1.1:
     resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
     dependencies:
@@ -3953,6 +3967,16 @@ packages:
       truncate-utf8-bytes: 1.0.2
     dev: true
 
+  /sass@1.70.0:
+    resolution: {integrity: sha512-uUxNQ3zAHeAx5nRFskBnrWzDUJrrvpCPD5FNAoRvTi0WwremlheES3tg+56PaVtCs5QDRX5CBLxxKMDJMEa1WQ==}
+    engines: {node: '>=14.0.0'}
+    hasBin: true
+    dependencies:
+      chokidar: 3.6.0
+      immutable: 4.3.5
+      source-map-js: 1.0.2
+    dev: true
+
   /sax@1.3.0:
     resolution: {integrity: sha512-0s+oAmw9zLl1V1cS9BtZN7JAd0cW5e0QH4W3LWEK6a4LaLEA2OTpGYWDY+6XasBLtz6wkm3u1xRw95mRuJ59WA==}
 
@@ -4424,7 +4448,7 @@ packages:
     dev: true
     optional: true
 
-  /vite@5.1.1(@types/node@18.19.9):
+  /vite@5.1.1(@types/node@18.19.9)(sass@1.70.0):
     resolution: {integrity: sha512-wclpAgY3F1tR7t9LL5CcHC41YPkQIpKUGeIuT8MdNwNZr6OqOTLs7JX5vIHAtzqLWXts0T+GDrh9pN2arneKqg==}
     engines: {node: ^18.0.0 || >=20.0.0}
     hasBin: true
@@ -4456,6 +4480,7 @@ packages:
       esbuild: 0.19.12
       postcss: 8.4.35
       rollup: 4.10.0
+      sass: 1.70.0
     optionalDependencies:
       fsevents: 2.3.3
     dev: true