diff --git a/package.json b/package.json
index d3a218d..e4ec599 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
     "ant-design-vue": "^2.0.0-beta.9",
     "axios": "^0.20.0",
     "core-js": "^3.6.5",
+    "postcss-pxtorem": "^5.1.1",
     "vue": "^3.0.0-0",
     "vue-router": "^4.0.0-0",
     "vuex": "^4.0.0-0"
diff --git a/public/index.html b/public/index.html
index 4123528..a2b9665 100644
--- a/public/index.html
+++ b/public/index.html
@@ -6,6 +6,60 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title><%= htmlWebpackPlugin.options.title %></title>
+    <script>
+       //designWidth:设计稿的实际宽度值，需要根据实际设置
+      //maxWidth:制作稿的最大宽度值，需要根据实际设置
+      //这段js的最后面有两个参数记得要设置，一个为设计稿实际宽度，一个为制作稿最大宽度，例如设计稿为750，最大宽度为750，则为(750,750)
+      (function (designWidth, maxWidth) {
+        var doc = document,
+          win = window,
+          docEl = doc.documentElement,
+          remStyle = document.createElement("style"),
+          tid;
+
+        function refreshRem() {
+
+          var width = docEl.getBoundingClientRect().width;
+          // maxWidth = maxWidth || 540; //不需要判断最大宽度
+          // width > maxWidth && (width = maxWidth);
+          var rem = width * 100 / designWidth;
+        console.log(rem)
+
+          remStyle.innerHTML = 'html{font-size:' + rem + 'px;}';
+        }
+
+        if (docEl.firstElementChild) {
+          docEl.firstElementChild.appendChild(remStyle);
+        } else {
+          var wrap = doc.createElement("div");
+          wrap.appendChild(remStyle);
+          doc.write(wrap.innerHTML);
+          wrap = null;
+        }
+        //要等 wiewport 设置好后才能执行 refreshRem，不然 refreshRem 会执行2次；
+        refreshRem();
+
+        win.addEventListener("resize", function () {
+          clearTimeout(tid); //防止执行两次
+          tid = setTimeout(refreshRem, 300);
+        }, false);
+
+        win.addEventListener("pageshow", function (e) {
+          if (e.persisted) { // 浏览器后退的时候重新计算
+            clearTimeout(tid);
+            tid = setTimeout(refreshRem, 300);
+          }
+        }, false);
+
+        if (doc.readyState === "complete") {
+          doc.body.style.fontSize = "16px";
+        } else {
+          doc.addEventListener("DOMContentLoaded", function (e) {
+            doc.body.style.fontSize = "16px";
+          }, false);
+        }
+      })(1366, 1024);
+    </script>
   </head>
   <body>
     <noscript>
diff --git a/src/App.vue b/src/App.vue
index a99cb28..d831336 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -12,4 +12,5 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
 </style>
diff --git a/src/components/NavTop.vue b/src/components/NavTop.vue
index e4548f4..267a5a9 100644
--- a/src/components/NavTop.vue
+++ b/src/components/NavTop.vue
@@ -37,6 +37,8 @@
 .nav{
     display: flex;
     background-color: #fff;
+    min-width: 1366px;
+    user-select: none;
     .logo{
         width: 171px;
         height: 57px;
@@ -111,10 +113,14 @@
 </style>
 <script lang="ts">
 import { defineComponent } from 'vue';
+import { useRoute } from 'vue-router';
 
 export default defineComponent({
     setup(){
-        console.log(1)
+        // console.log(useRoute().currentRoute.value.name)
+        const routes = useRoute();
+        console.log(routes.path);
+
         interface Nav{
             name: string;
             route: string;
diff --git a/src/layout/Mine.vue b/src/layout/Mine.vue
index 4043123..4e543ba 100644
--- a/src/layout/Mine.vue
+++ b/src/layout/Mine.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="mine">
+    <div class="mine" :style="{height:height + 'px'}">
         <NavTop style="flex-shrink:0"></NavTop>
         <div class="body">
             <Menu></Menu>
@@ -13,9 +13,10 @@
 .mine{
     display: flex;
     flex-direction: column;
-    height: 100vh;
     .body{
         display: flex;
+        width: 100%;
+        min-width: 1366px;
         height:  calc(100% - 57px);
         .container{
             width: calc(100% - 171px);
@@ -28,7 +29,7 @@
 }
 </style>
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, onMounted, ref } from 'vue';
 import Menu from "@/components/Menu.vue";
 import NavTop from "@/components/NavTop.vue"
 
@@ -39,6 +40,16 @@ export default defineComponent({
     },
     setup(){
         console.log(1)
+        const height = ref(0);
+        onMounted(() => {
+            height.value = document.documentElement.clientHeight;
+        })
+        window.onresize=function(){  
+            height.value = document.documentElement.clientHeight;
+        }
+        return {
+            height
+        }
     }
 })
 </script>
\ No newline at end of file
diff --git a/src/views/mine/Archives.vue b/src/views/mine/Archives.vue
index dc18d34..86a258b 100644
--- a/src/views/mine/Archives.vue
+++ b/src/views/mine/Archives.vue
@@ -20,6 +20,7 @@
                             style="width: 171px"
                             size="small"
                             ref="select"
+                            :getPopupContainer="triggerNode => triggerNode.parentNode"
                         >
                             <a-select-option v-for="(item, index) in ['美国', '英国']" :key="index" :value="item">
                                 {{ item }}
@@ -37,6 +38,7 @@
                             style="width: 171px"
                             size="small"
                             ref="select"
+                            :getPopupContainer="triggerNode => triggerNode.parentNode"
                         >
                             <a-select-option v-for="(item, index) in ['英语', '法语']" :key="index" :value="item">
                                 {{ item }}
@@ -53,6 +55,7 @@
                                         style="width: 171px"
                                         size="small"
                                         ref="select"
+                                        :getPopupContainer="triggerNode => triggerNode.parentNode"
                                     >
                                         <a-select-option v-for="(item, index) in ['英语', '法语']" :key="index" :value="item">
                                             {{ item }}
@@ -78,6 +81,7 @@
                             style="width: 171px"
                             size="small"
                             ref="select"
+                            :getPopupContainer="triggerNode => triggerNode.parentNode"
                         >
                             <a-select-option v-for="(item, index) in ['英语', '法语']" :key="index" :value="item">
                                 {{ item }}
@@ -136,6 +140,7 @@
                             style="width: 171px"
                             size="small"
                             ref="select"
+                            :getPopupContainer="triggerNode => triggerNode.parentNode"
                         >
                             <a-select-option v-for="(item, index) in ['北京 GMT +08:00']" :key="index" :value="item">
                                 {{ item }}
@@ -149,6 +154,7 @@
                             style="width: 171px"
                             size="small"
                             ref="select"
+                            :getPopupContainer="triggerNode => triggerNode.parentNode"
                         >
                             <a-select-option v-for="(item, index) in ['人民币']" :key="index" :value="item">
                                 {{ item }}
@@ -162,6 +168,7 @@
                             style="width: 171px"
                             size="small"
                             ref="select"
+                            :getPopupContainer="triggerNode => triggerNode.parentNode"
                         >
                             <a-select-option v-for="(item, index) in ['英语', '中文']" :key="index" :value="item">
                                 {{ item }}
@@ -222,7 +229,6 @@ export default defineComponent({
          */
         function updateUserName (): void {
             console.log('修改');
-            
         }
         /**
          * 添加我还会说语言
@@ -258,6 +264,7 @@ export default defineComponent({
             console.log('12');
             
         }
+
         return {
             formData,
             updateUserName,
@@ -277,6 +284,7 @@ export default defineComponent({
     background-color: #ffffff;
     padding: 46px;
     border-radius: 17px;
+    position: relative;
     .update-btn {
         font-size: 11px;
         color: #08AE98;
@@ -334,6 +342,12 @@ export default defineComponent({
                         border: 1px solid #DCDFE0;
                         font-size: 11px;
                     }
+                    .ant-select {
+                        font-size: 12px;
+                    }
+                    .select-down {
+                        font-size: 12px;
+                    }
                 }
                 .speak-lang {
                     .speak-array {
diff --git a/src/views/mine/ReleaseWebcast.vue b/src/views/mine/ReleaseWebcast.vue
new file mode 100644
index 0000000..dd0e61c
--- /dev/null
+++ b/src/views/mine/ReleaseWebcast.vue
@@ -0,0 +1,92 @@
+<template>
+    <div class="webcast">
+        <a-form :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
+            <a-form-item label="Activity name">
+            <a-input v-model:value="form.name" />
+            </a-form-item>
+            <a-form-item label="Activity zone">
+            <a-select v-model:value="form.region" placeholder="please select your zone">
+                <a-select-option value="shanghai">
+                Zone one
+                </a-select-option>
+                <a-select-option value="beijing">
+                Zone two
+                </a-select-option>
+            </a-select>
+            </a-form-item>
+            <a-form-item label="Activity time">
+            <a-date-picker
+                v-model:value="form.date1"
+                show-time
+                type="date"
+                placeholder="Pick a date"
+                style="width: 100%;"
+            />
+            </a-form-item>
+            <a-form-item label="Instant delivery">
+            <a-switch v-model:checked="form.delivery" />
+            </a-form-item>
+            <a-form-item label="Activity type">
+            <a-checkbox-group v-model:value="form.type">
+                <a-checkbox value="1" name="type">
+                Online
+                </a-checkbox>
+                <a-checkbox value="2" name="type">
+                Promotion
+                </a-checkbox>
+                <a-checkbox value="3" name="type">
+                Offline
+                </a-checkbox>
+            </a-checkbox-group>
+            </a-form-item>
+            <a-form-item label="Resources">
+            <a-radio-group v-model:value="form.resource">
+                <a-radio value="1">
+                Sponsor
+                </a-radio>
+                <a-radio value="2">
+                Venue
+                </a-radio>
+            </a-radio-group>
+            </a-form-item>
+            <a-form-item label="Activity form">
+            <a-input v-model:value="form.desc" type="textarea" />
+            </a-form-item>
+            <a-form-item :wrapper-col="{ span: 14, offset: 4 }">
+            <a-button type="primary" @click="onSubmit">
+                Create
+            </a-button>
+            <a-button style="margin-left: 10px;">
+                Cancel
+            </a-button>
+            </a-form-item>
+        </a-form>
+    </div>
+</template>
+<script lang="ts">
+import { defineComponent } from 'vue';
+export default defineComponent({
+    name: 'ReleaseWebcast',
+    setup() {
+        function onSubmit(): void {
+
+        }
+        return {
+            labelCol: { span: 4 },
+            wrapperCol: { span: 14 },
+            form: {
+                name: '',
+                region: undefined,
+                date1: undefined,
+                delivery: false,
+                type: [],
+                resource: '',
+                desc: '',
+            },
+            onSubmit
+        }
+    }
+})
+</script>
+<style lang="scss" scoped>
+</style>
\ No newline at end of file
diff --git a/static/js/common.ts b/static/js/common.ts
new file mode 100644
index 0000000..e69de29
diff --git a/vue.config.js b/vue.config.js
new file mode 100644
index 0000000..b397fed
--- /dev/null
+++ b/vue.config.js
@@ -0,0 +1,22 @@
+module.exports = {
+    css: {
+      loaderOptions: {
+        postcss: {
+          plugins: [
+            require('postcss-pxtorem')({ // 把px单位换算成rem单位
+              rootValue: 100, // 换算的基数(设计图750的根字体为32)
+              selectorBlackList: ['weui', 'mu'], // 忽略转换正则匹配项
+              propList: ['*']
+            })
+          ]
+        }
+      }
+    },
+    configureWebpack: config => {
+      if (process.env.NODE_ENV === 'production') {
+        // 为生产环境修改配置...
+      } else {
+        // 为开发环境修改配置...
+      }
+    }
+  }
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index 4b4f37f..df7a4cd 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7235,6 +7235,13 @@ postcss-ordered-values@^4.1.2:
     postcss "^7.0.0"
     postcss-value-parser "^3.0.0"
 
+postcss-pxtorem@^5.1.1:
+  version "5.1.1"
+  resolved "https://registry.npm.taobao.org/postcss-pxtorem/download/postcss-pxtorem-5.1.1.tgz#198a68c10f9ad2d42370ef66299d7b3168f8cffa"
+  integrity sha1-GYpowQ+a0tQjcO9mKZ17MWj4z/o=
+  dependencies:
+    postcss "^7.0.27"
+
 postcss-reduce-initial@^4.0.3:
   version "4.0.3"
   resolved "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-4.0.3.tgz#7fd42ebea5e9c814609639e2c2e84ae270ba48df"
