邮箱功能

src/assets/icon/demo_index.html

@@ -55,6 +55,264 @@
           <ul class="icon_lists dib-box">
           
             <li class="dib">
+              <span class="icon iconfont">&#xe832;</span>
+                <div class="name">icomm_delete (1)</div>
+                <div class="code-name">&amp;#xe832;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe833;</span>
+                <div class="name">icomm_delete</div>
+                <div class="code-name">&amp;#xe833;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe834;</span>
+                <div class="name">icomm_contact</div>
+                <div class="code-name">&amp;#xe834;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe835;</span>
+                <div class="name">icomm_wdwjj</div>
+                <div class="code-name">&amp;#xe835;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe836;</span>
+                <div class="name">icomm_ygyx</div>
+                <div class="code-name">&amp;#xe836;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe837;</span>
+                <div class="name">iconm_gfwjj</div>
+                <div class="code-name">&amp;#xe837;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe838;</span>
+                <div class="name">iconm_inbox</div>
+                <div class="code-name">&amp;#xe838;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe839;</span>
+                <div class="name">icomm_draftbox</div>
+                <div class="code-name">&amp;#xe839;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe83a;</span>
+                <div class="name">icomm_fujian</div>
+                <div class="code-name">&amp;#xe83a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe83b;</span>
+                <div class="name">icomm_label</div>
+                <div class="code-name">&amp;#xe83b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe83c;</span>
+                <div class="name">icomm_dings</div>
+                <div class="code-name">&amp;#xe83c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe83d;</span>
+                <div class="name">iconm_sent</div>
+                <div class="code-name">&amp;#xe83d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe83e;</span>
+                <div class="name">iconm_wjj</div>
+                <div class="code-name">&amp;#xe83e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe83f;</span>
+                <div class="name">iconm_ljyx</div>
+                <div class="code-name">&amp;#xe83f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe840;</span>
+                <div class="name">iconm_tupian</div>
+                <div class="code-name">&amp;#xe840;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe841;</span>
+                <div class="name">iconm_set_up</div>
+                <div class="code-name">&amp;#xe841;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe842;</span>
+                <div class="name">iconm_pdf</div>
+                <div class="code-name">&amp;#xe842;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe830;</span>
+                <div class="name">iconm_shez</div>
+                <div class="code-name">&amp;#xe830;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe831;</span>
+                <div class="name">iconm_woddd</div>
+                <div class="code-name">&amp;#xe831;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe818;</span>
+                <div class="name">icomx_jiangdzjzy</div>
+                <div class="code-name">&amp;#xe818;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe819;</span>
+                <div class="name">icomx_banli</div>
+                <div class="code-name">&amp;#xe819;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe81a;</span>
+                <div class="name">icomx_jiand</div>
+                <div class="code-name">&amp;#xe81a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe81b;</span>
+                <div class="name">icomx_shez</div>
+                <div class="code-name">&amp;#xe81b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe81c;</span>
+                <div class="name">icomx_fenz</div>
+                <div class="code-name">&amp;#xe81c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe81d;</span>
+                <div class="name">icomx_jiansgr</div>
+                <div class="code-name">&amp;#xe81d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe81e;</span>
+                <div class="name">icomx_kehukb</div>
+                <div class="code-name">&amp;#xe81e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe81f;</span>
+                <div class="name">iconm_jiansgr</div>
+                <div class="code-name">&amp;#xe81f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe820;</span>
+                <div class="name">icomx_yinhangk</div>
+                <div class="code-name">&amp;#xe820;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe821;</span>
+                <div class="name">icomx_zhaop</div>
+                <div class="code-name">&amp;#xe821;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe822;</span>
+                <div class="name">icomx_shujzs</div>
+                <div class="code-name">&amp;#xe822;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe823;</span>
+                <div class="name">iconm_zhaop</div>
+                <div class="code-name">&amp;#xe823;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe824;</span>
+                <div class="name">iconm_jiand</div>
+                <div class="code-name">&amp;#xe824;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe825;</span>
+                <div class="name">iconm_fenz</div>
+                <div class="code-name">&amp;#xe825;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe826;</span>
+                <div class="name">iconm_kehukb</div>
+                <div class="code-name">&amp;#xe826;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe827;</span>
+                <div class="name">iconm_banli</div>
+                <div class="code-name">&amp;#xe827;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe828;</span>
+                <div class="name">icomx_erwm</div>
+                <div class="code-name">&amp;#xe828;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe829;</span>
+                <div class="name">iconm_jiangdzjzy</div>
+                <div class="code-name">&amp;#xe829;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe82a;</span>
+                <div class="name">iconm_erwm</div>
+                <div class="code-name">&amp;#xe82a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe82b;</span>
+                <div class="name">icomx_woddd</div>
+                <div class="code-name">&amp;#xe82b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe82c;</span>
+                <div class="name">iconm_yinhangk</div>
+                <div class="code-name">&amp;#xe82c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe82d;</span>
+                <div class="name">iconm_shujzs</div>
+                <div class="code-name">&amp;#xe82d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe82e;</span>
+                <div class="name">iconm_xiadje</div>
+                <div class="code-name">&amp;#xe82e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe82f;</span>
+                <div class="name">icomx_xiadje</div>
+                <div class="code-name">&amp;#xe82f;</div>
+              </li>
+          
+            <li class="dib">
               <span class="icon iconfont">&#xe783;</span>
                 <div class="name">icomx_bianj</div>
                 <div class="code-name">&amp;#xe783;</div>
@@ -1818,9 +2076,9 @@
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1681372137646') format('woff2'),
-       url('iconfont.woff?t=1681372137646') format('woff'),
-       url('iconfont.ttf?t=1681372137646') format('truetype');
+  src: url('iconfont.woff2?t=1682402486203') format('woff2'),
+       url('iconfont.woff?t=1682402486203') format('woff'),
+       url('iconfont.ttf?t=1682402486203') format('truetype');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -1847,6 +2105,393 @@
         <ul class="icon_lists dib-box">
           
           <li class="dib">
+            <span class="icon iconfont icon-a-icomm_delete1"></span>
+            <div class="name">
+              icomm_delete (1)
+            </div>
+            <div class="code-name">.icon-a-icomm_delete1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_delete"></span>
+            <div class="name">
+              icomm_delete
+            </div>
+            <div class="code-name">.icon-icomm_delete
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_contact"></span>
+            <div class="name">
+              icomm_contact
+            </div>
+            <div class="code-name">.icon-icomm_contact
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_wdwjj"></span>
+            <div class="name">
+              icomm_wdwjj
+            </div>
+            <div class="code-name">.icon-icomm_wdwjj
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_ygyx"></span>
+            <div class="name">
+              icomm_ygyx
+            </div>
+            <div class="code-name">.icon-icomm_ygyx
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_gfwjj"></span>
+            <div class="name">
+              iconm_gfwjj
+            </div>
+            <div class="code-name">.icon-iconm_gfwjj
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_inbox"></span>
+            <div class="name">
+              iconm_inbox
+            </div>
+            <div class="code-name">.icon-iconm_inbox
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_draftbox"></span>
+            <div class="name">
+              icomm_draftbox
+            </div>
+            <div class="code-name">.icon-icomm_draftbox
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_fujian"></span>
+            <div class="name">
+              icomm_fujian
+            </div>
+            <div class="code-name">.icon-icomm_fujian
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_label"></span>
+            <div class="name">
+              icomm_label
+            </div>
+            <div class="code-name">.icon-icomm_label
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomm_dings"></span>
+            <div class="name">
+              icomm_dings
+            </div>
+            <div class="code-name">.icon-icomm_dings
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_sent"></span>
+            <div class="name">
+              iconm_sent
+            </div>
+            <div class="code-name">.icon-iconm_sent
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_wjj"></span>
+            <div class="name">
+              iconm_wjj
+            </div>
+            <div class="code-name">.icon-iconm_wjj
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_ljyx"></span>
+            <div class="name">
+              iconm_ljyx
+            </div>
+            <div class="code-name">.icon-iconm_ljyx
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_tupian1"></span>
+            <div class="name">
+              iconm_tupian
+            </div>
+            <div class="code-name">.icon-iconm_tupian1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_set_up"></span>
+            <div class="name">
+              iconm_set_up
+            </div>
+            <div class="code-name">.icon-iconm_set_up
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_pdf"></span>
+            <div class="name">
+              iconm_pdf
+            </div>
+            <div class="code-name">.icon-iconm_pdf
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_shez"></span>
+            <div class="name">
+              iconm_shez
+            </div>
+            <div class="code-name">.icon-iconm_shez
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_woddd"></span>
+            <div class="name">
+              iconm_woddd
+            </div>
+            <div class="code-name">.icon-iconm_woddd
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_jiangdzjzy"></span>
+            <div class="name">
+              icomx_jiangdzjzy
+            </div>
+            <div class="code-name">.icon-icomx_jiangdzjzy
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_banli"></span>
+            <div class="name">
+              icomx_banli
+            </div>
+            <div class="code-name">.icon-icomx_banli
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_jiand"></span>
+            <div class="name">
+              icomx_jiand
+            </div>
+            <div class="code-name">.icon-icomx_jiand
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_shez"></span>
+            <div class="name">
+              icomx_shez
+            </div>
+            <div class="code-name">.icon-icomx_shez
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_fenz"></span>
+            <div class="name">
+              icomx_fenz
+            </div>
+            <div class="code-name">.icon-icomx_fenz
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_jiansgr"></span>
+            <div class="name">
+              icomx_jiansgr
+            </div>
+            <div class="code-name">.icon-icomx_jiansgr
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_kehukb"></span>
+            <div class="name">
+              icomx_kehukb
+            </div>
+            <div class="code-name">.icon-icomx_kehukb
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_jiansgr"></span>
+            <div class="name">
+              iconm_jiansgr
+            </div>
+            <div class="code-name">.icon-iconm_jiansgr
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_yinhangk"></span>
+            <div class="name">
+              icomx_yinhangk
+            </div>
+            <div class="code-name">.icon-icomx_yinhangk
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_zhaop"></span>
+            <div class="name">
+              icomx_zhaop
+            </div>
+            <div class="code-name">.icon-icomx_zhaop
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_shujzs"></span>
+            <div class="name">
+              icomx_shujzs
+            </div>
+            <div class="code-name">.icon-icomx_shujzs
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_zhaop"></span>
+            <div class="name">
+              iconm_zhaop
+            </div>
+            <div class="code-name">.icon-iconm_zhaop
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_jiand"></span>
+            <div class="name">
+              iconm_jiand
+            </div>
+            <div class="code-name">.icon-iconm_jiand
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_fenz"></span>
+            <div class="name">
+              iconm_fenz
+            </div>
+            <div class="code-name">.icon-iconm_fenz
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_kehukb"></span>
+            <div class="name">
+              iconm_kehukb
+            </div>
+            <div class="code-name">.icon-iconm_kehukb
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_banli"></span>
+            <div class="name">
+              iconm_banli
+            </div>
+            <div class="code-name">.icon-iconm_banli
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_erwm"></span>
+            <div class="name">
+              icomx_erwm
+            </div>
+            <div class="code-name">.icon-icomx_erwm
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_jiangdzjzy"></span>
+            <div class="name">
+              iconm_jiangdzjzy
+            </div>
+            <div class="code-name">.icon-iconm_jiangdzjzy
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_erwm"></span>
+            <div class="name">
+              iconm_erwm
+            </div>
+            <div class="code-name">.icon-iconm_erwm
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_woddd"></span>
+            <div class="name">
+              icomx_woddd
+            </div>
+            <div class="code-name">.icon-icomx_woddd
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_yinhangk"></span>
+            <div class="name">
+              iconm_yinhangk
+            </div>
+            <div class="code-name">.icon-iconm_yinhangk
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_shujzs"></span>
+            <div class="name">
+              iconm_shujzs
+            </div>
+            <div class="code-name">.icon-iconm_shujzs
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-iconm_xiadje"></span>
+            <div class="name">
+              iconm_xiadje
+            </div>
+            <div class="code-name">.icon-iconm_xiadje
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-icomx_xiadje"></span>
+            <div class="name">
+              icomx_xiadje
+            </div>
+            <div class="code-name">.icon-icomx_xiadje
+            </div>
+          </li>
+          
+          <li class="dib">
             <span class="icon iconfont icon-icomx_bianj"></span>
             <div class="name">
               icomx_bianj
@@ -4494,6 +5139,350 @@
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-a-icomm_delete1"></use>
+                </svg>
+                <div class="name">icomm_delete (1)</div>
+                <div class="code-name">#icon-a-icomm_delete1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_delete"></use>
+                </svg>
+                <div class="name">icomm_delete</div>
+                <div class="code-name">#icon-icomm_delete</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_contact"></use>
+                </svg>
+                <div class="name">icomm_contact</div>
+                <div class="code-name">#icon-icomm_contact</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_wdwjj"></use>
+                </svg>
+                <div class="name">icomm_wdwjj</div>
+                <div class="code-name">#icon-icomm_wdwjj</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_ygyx"></use>
+                </svg>
+                <div class="name">icomm_ygyx</div>
+                <div class="code-name">#icon-icomm_ygyx</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_gfwjj"></use>
+                </svg>
+                <div class="name">iconm_gfwjj</div>
+                <div class="code-name">#icon-iconm_gfwjj</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_inbox"></use>
+                </svg>
+                <div class="name">iconm_inbox</div>
+                <div class="code-name">#icon-iconm_inbox</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_draftbox"></use>
+                </svg>
+                <div class="name">icomm_draftbox</div>
+                <div class="code-name">#icon-icomm_draftbox</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_fujian"></use>
+                </svg>
+                <div class="name">icomm_fujian</div>
+                <div class="code-name">#icon-icomm_fujian</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_label"></use>
+                </svg>
+                <div class="name">icomm_label</div>
+                <div class="code-name">#icon-icomm_label</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomm_dings"></use>
+                </svg>
+                <div class="name">icomm_dings</div>
+                <div class="code-name">#icon-icomm_dings</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_sent"></use>
+                </svg>
+                <div class="name">iconm_sent</div>
+                <div class="code-name">#icon-iconm_sent</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_wjj"></use>
+                </svg>
+                <div class="name">iconm_wjj</div>
+                <div class="code-name">#icon-iconm_wjj</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_ljyx"></use>
+                </svg>
+                <div class="name">iconm_ljyx</div>
+                <div class="code-name">#icon-iconm_ljyx</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_tupian1"></use>
+                </svg>
+                <div class="name">iconm_tupian</div>
+                <div class="code-name">#icon-iconm_tupian1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_set_up"></use>
+                </svg>
+                <div class="name">iconm_set_up</div>
+                <div class="code-name">#icon-iconm_set_up</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_pdf"></use>
+                </svg>
+                <div class="name">iconm_pdf</div>
+                <div class="code-name">#icon-iconm_pdf</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_shez"></use>
+                </svg>
+                <div class="name">iconm_shez</div>
+                <div class="code-name">#icon-iconm_shez</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_woddd"></use>
+                </svg>
+                <div class="name">iconm_woddd</div>
+                <div class="code-name">#icon-iconm_woddd</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_jiangdzjzy"></use>
+                </svg>
+                <div class="name">icomx_jiangdzjzy</div>
+                <div class="code-name">#icon-icomx_jiangdzjzy</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_banli"></use>
+                </svg>
+                <div class="name">icomx_banli</div>
+                <div class="code-name">#icon-icomx_banli</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_jiand"></use>
+                </svg>
+                <div class="name">icomx_jiand</div>
+                <div class="code-name">#icon-icomx_jiand</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_shez"></use>
+                </svg>
+                <div class="name">icomx_shez</div>
+                <div class="code-name">#icon-icomx_shez</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_fenz"></use>
+                </svg>
+                <div class="name">icomx_fenz</div>
+                <div class="code-name">#icon-icomx_fenz</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_jiansgr"></use>
+                </svg>
+                <div class="name">icomx_jiansgr</div>
+                <div class="code-name">#icon-icomx_jiansgr</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_kehukb"></use>
+                </svg>
+                <div class="name">icomx_kehukb</div>
+                <div class="code-name">#icon-icomx_kehukb</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_jiansgr"></use>
+                </svg>
+                <div class="name">iconm_jiansgr</div>
+                <div class="code-name">#icon-iconm_jiansgr</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_yinhangk"></use>
+                </svg>
+                <div class="name">icomx_yinhangk</div>
+                <div class="code-name">#icon-icomx_yinhangk</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_zhaop"></use>
+                </svg>
+                <div class="name">icomx_zhaop</div>
+                <div class="code-name">#icon-icomx_zhaop</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_shujzs"></use>
+                </svg>
+                <div class="name">icomx_shujzs</div>
+                <div class="code-name">#icon-icomx_shujzs</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_zhaop"></use>
+                </svg>
+                <div class="name">iconm_zhaop</div>
+                <div class="code-name">#icon-iconm_zhaop</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_jiand"></use>
+                </svg>
+                <div class="name">iconm_jiand</div>
+                <div class="code-name">#icon-iconm_jiand</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_fenz"></use>
+                </svg>
+                <div class="name">iconm_fenz</div>
+                <div class="code-name">#icon-iconm_fenz</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_kehukb"></use>
+                </svg>
+                <div class="name">iconm_kehukb</div>
+                <div class="code-name">#icon-iconm_kehukb</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_banli"></use>
+                </svg>
+                <div class="name">iconm_banli</div>
+                <div class="code-name">#icon-iconm_banli</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_erwm"></use>
+                </svg>
+                <div class="name">icomx_erwm</div>
+                <div class="code-name">#icon-icomx_erwm</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_jiangdzjzy"></use>
+                </svg>
+                <div class="name">iconm_jiangdzjzy</div>
+                <div class="code-name">#icon-iconm_jiangdzjzy</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_erwm"></use>
+                </svg>
+                <div class="name">iconm_erwm</div>
+                <div class="code-name">#icon-iconm_erwm</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_woddd"></use>
+                </svg>
+                <div class="name">icomx_woddd</div>
+                <div class="code-name">#icon-icomx_woddd</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_yinhangk"></use>
+                </svg>
+                <div class="name">iconm_yinhangk</div>
+                <div class="code-name">#icon-iconm_yinhangk</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_shujzs"></use>
+                </svg>
+                <div class="name">iconm_shujzs</div>
+                <div class="code-name">#icon-iconm_shujzs</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-iconm_xiadje"></use>
+                </svg>
+                <div class="name">iconm_xiadje</div>
+                <div class="code-name">#icon-iconm_xiadje</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-icomx_xiadje"></use>
+                </svg>
+                <div class="name">icomx_xiadje</div>
+                <div class="code-name">#icon-icomx_xiadje</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-icomx_bianj"></use>
                 </svg>
                 <div class="name">icomx_bianj</div>

src/assets/icon/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3933484 */
-  src: url('iconfont.woff2?t=1681372137646') format('woff2'),
-       url('iconfont.woff?t=1681372137646') format('woff'),
-       url('iconfont.ttf?t=1681372137646') format('truetype');
+  src: url('iconfont.woff2?t=1682402486203') format('woff2'),
+       url('iconfont.woff?t=1682402486203') format('woff'),
+       url('iconfont.ttf?t=1682402486203') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,178 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-a-icomm_delete1:before {
+  content: "\e832";
+}
+
+.icon-icomm_delete:before {
+  content: "\e833";
+}
+
+.icon-icomm_contact:before {
+  content: "\e834";
+}
+
+.icon-icomm_wdwjj:before {
+  content: "\e835";
+}
+
+.icon-icomm_ygyx:before {
+  content: "\e836";
+}
+
+.icon-iconm_gfwjj:before {
+  content: "\e837";
+}
+
+.icon-iconm_inbox:before {
+  content: "\e838";
+}
+
+.icon-icomm_draftbox:before {
+  content: "\e839";
+}
+
+.icon-icomm_fujian:before {
+  content: "\e83a";
+}
+
+.icon-icomm_label:before {
+  content: "\e83b";
+}
+
+.icon-icomm_dings:before {
+  content: "\e83c";
+}
+
+.icon-iconm_sent:before {
+  content: "\e83d";
+}
+
+.icon-iconm_wjj:before {
+  content: "\e83e";
+}
+
+.icon-iconm_ljyx:before {
+  content: "\e83f";
+}
+
+.icon-iconm_tupian1:before {
+  content: "\e840";
+}
+
+.icon-iconm_set_up:before {
+  content: "\e841";
+}
+
+.icon-iconm_pdf:before {
+  content: "\e842";
+}
+
+.icon-iconm_shez:before {
+  content: "\e830";
+}
+
+.icon-iconm_woddd:before {
+  content: "\e831";
+}
+
+.icon-icomx_jiangdzjzy:before {
+  content: "\e818";
+}
+
+.icon-icomx_banli:before {
+  content: "\e819";
+}
+
+.icon-icomx_jiand:before {
+  content: "\e81a";
+}
+
+.icon-icomx_shez:before {
+  content: "\e81b";
+}
+
+.icon-icomx_fenz:before {
+  content: "\e81c";
+}
+
+.icon-icomx_jiansgr:before {
+  content: "\e81d";
+}
+
+.icon-icomx_kehukb:before {
+  content: "\e81e";
+}
+
+.icon-iconm_jiansgr:before {
+  content: "\e81f";
+}
+
+.icon-icomx_yinhangk:before {
+  content: "\e820";
+}
+
+.icon-icomx_zhaop:before {
+  content: "\e821";
+}
+
+.icon-icomx_shujzs:before {
+  content: "\e822";
+}
+
+.icon-iconm_zhaop:before {
+  content: "\e823";
+}
+
+.icon-iconm_jiand:before {
+  content: "\e824";
+}
+
+.icon-iconm_fenz:before {
+  content: "\e825";
+}
+
+.icon-iconm_kehukb:before {
+  content: "\e826";
+}
+
+.icon-iconm_banli:before {
+  content: "\e827";
+}
+
+.icon-icomx_erwm:before {
+  content: "\e828";
+}
+
+.icon-iconm_jiangdzjzy:before {
+  content: "\e829";
+}
+
+.icon-iconm_erwm:before {
+  content: "\e82a";
+}
+
+.icon-icomx_woddd:before {
+  content: "\e82b";
+}
+
+.icon-iconm_yinhangk:before {
+  content: "\e82c";
+}
+
+.icon-iconm_shujzs:before {
+  content: "\e82d";
+}
+
+.icon-iconm_xiadje:before {
+  content: "\e82e";
+}
+
+.icon-icomx_xiadje:before {
+  content: "\e82f";
+}
+
 .icon-icomx_bianj:before {
   content: "\e783";
 }

src/assets/icon/iconfont.json

@@ -6,6 +6,307 @@
   "description": "",
   "glyphs": [
     {
+      "icon_id": "35213998",
+      "name": "icomm_delete (1)",
+      "font_class": "a-icomm_delete1",
+      "unicode": "e832",
+      "unicode_decimal": 59442
+    },
+    {
+      "icon_id": "35213999",
+      "name": "icomm_delete",
+      "font_class": "icomm_delete",
+      "unicode": "e833",
+      "unicode_decimal": 59443
+    },
+    {
+      "icon_id": "35214000",
+      "name": "icomm_contact",
+      "font_class": "icomm_contact",
+      "unicode": "e834",
+      "unicode_decimal": 59444
+    },
+    {
+      "icon_id": "35214001",
+      "name": "icomm_wdwjj",
+      "font_class": "icomm_wdwjj",
+      "unicode": "e835",
+      "unicode_decimal": 59445
+    },
+    {
+      "icon_id": "35214002",
+      "name": "icomm_ygyx",
+      "font_class": "icomm_ygyx",
+      "unicode": "e836",
+      "unicode_decimal": 59446
+    },
+    {
+      "icon_id": "35214003",
+      "name": "iconm_gfwjj",
+      "font_class": "iconm_gfwjj",
+      "unicode": "e837",
+      "unicode_decimal": 59447
+    },
+    {
+      "icon_id": "35214004",
+      "name": "iconm_inbox",
+      "font_class": "iconm_inbox",
+      "unicode": "e838",
+      "unicode_decimal": 59448
+    },
+    {
+      "icon_id": "35214005",
+      "name": "icomm_draftbox",
+      "font_class": "icomm_draftbox",
+      "unicode": "e839",
+      "unicode_decimal": 59449
+    },
+    {
+      "icon_id": "35214006",
+      "name": "icomm_fujian",
+      "font_class": "icomm_fujian",
+      "unicode": "e83a",
+      "unicode_decimal": 59450
+    },
+    {
+      "icon_id": "35214007",
+      "name": "icomm_label",
+      "font_class": "icomm_label",
+      "unicode": "e83b",
+      "unicode_decimal": 59451
+    },
+    {
+      "icon_id": "35214008",
+      "name": "icomm_dings",
+      "font_class": "icomm_dings",
+      "unicode": "e83c",
+      "unicode_decimal": 59452
+    },
+    {
+      "icon_id": "35214009",
+      "name": "iconm_sent",
+      "font_class": "iconm_sent",
+      "unicode": "e83d",
+      "unicode_decimal": 59453
+    },
+    {
+      "icon_id": "35214010",
+      "name": "iconm_wjj",
+      "font_class": "iconm_wjj",
+      "unicode": "e83e",
+      "unicode_decimal": 59454
+    },
+    {
+      "icon_id": "35214011",
+      "name": "iconm_ljyx",
+      "font_class": "iconm_ljyx",
+      "unicode": "e83f",
+      "unicode_decimal": 59455
+    },
+    {
+      "icon_id": "35214012",
+      "name": "iconm_tupian",
+      "font_class": "iconm_tupian1",
+      "unicode": "e840",
+      "unicode_decimal": 59456
+    },
+    {
+      "icon_id": "35214013",
+      "name": "iconm_set_up",
+      "font_class": "iconm_set_up",
+      "unicode": "e841",
+      "unicode_decimal": 59457
+    },
+    {
+      "icon_id": "35214014",
+      "name": "iconm_pdf",
+      "font_class": "iconm_pdf",
+      "unicode": "e842",
+      "unicode_decimal": 59458
+    },
+    {
+      "icon_id": "35160921",
+      "name": "iconm_shez",
+      "font_class": "iconm_shez",
+      "unicode": "e830",
+      "unicode_decimal": 59440
+    },
+    {
+      "icon_id": "35160922",
+      "name": "iconm_woddd",
+      "font_class": "iconm_woddd",
+      "unicode": "e831",
+      "unicode_decimal": 59441
+    },
+    {
+      "icon_id": "35160897",
+      "name": "icomx_jiangdzjzy",
+      "font_class": "icomx_jiangdzjzy",
+      "unicode": "e818",
+      "unicode_decimal": 59416
+    },
+    {
+      "icon_id": "35160898",
+      "name": "icomx_banli",
+      "font_class": "icomx_banli",
+      "unicode": "e819",
+      "unicode_decimal": 59417
+    },
+    {
+      "icon_id": "35160899",
+      "name": "icomx_jiand",
+      "font_class": "icomx_jiand",
+      "unicode": "e81a",
+      "unicode_decimal": 59418
+    },
+    {
+      "icon_id": "35160900",
+      "name": "icomx_shez",
+      "font_class": "icomx_shez",
+      "unicode": "e81b",
+      "unicode_decimal": 59419
+    },
+    {
+      "icon_id": "35160901",
+      "name": "icomx_fenz",
+      "font_class": "icomx_fenz",
+      "unicode": "e81c",
+      "unicode_decimal": 59420
+    },
+    {
+      "icon_id": "35160902",
+      "name": "icomx_jiansgr",
+      "font_class": "icomx_jiansgr",
+      "unicode": "e81d",
+      "unicode_decimal": 59421
+    },
+    {
+      "icon_id": "35160903",
+      "name": "icomx_kehukb",
+      "font_class": "icomx_kehukb",
+      "unicode": "e81e",
+      "unicode_decimal": 59422
+    },
+    {
+      "icon_id": "35160904",
+      "name": "iconm_jiansgr",
+      "font_class": "iconm_jiansgr",
+      "unicode": "e81f",
+      "unicode_decimal": 59423
+    },
+    {
+      "icon_id": "35160905",
+      "name": "icomx_yinhangk",
+      "font_class": "icomx_yinhangk",
+      "unicode": "e820",
+      "unicode_decimal": 59424
+    },
+    {
+      "icon_id": "35160906",
+      "name": "icomx_zhaop",
+      "font_class": "icomx_zhaop",
+      "unicode": "e821",
+      "unicode_decimal": 59425
+    },
+    {
+      "icon_id": "35160907",
+      "name": "icomx_shujzs",
+      "font_class": "icomx_shujzs",
+      "unicode": "e822",
+      "unicode_decimal": 59426
+    },
+    {
+      "icon_id": "35160908",
+      "name": "iconm_zhaop",
+      "font_class": "iconm_zhaop",
+      "unicode": "e823",
+      "unicode_decimal": 59427
+    },
+    {
+      "icon_id": "35160909",
+      "name": "iconm_jiand",
+      "font_class": "iconm_jiand",
+      "unicode": "e824",
+      "unicode_decimal": 59428
+    },
+    {
+      "icon_id": "35160910",
+      "name": "iconm_fenz",
+      "font_class": "iconm_fenz",
+      "unicode": "e825",
+      "unicode_decimal": 59429
+    },
+    {
+      "icon_id": "35160911",
+      "name": "iconm_kehukb",
+      "font_class": "iconm_kehukb",
+      "unicode": "e826",
+      "unicode_decimal": 59430
+    },
+    {
+      "icon_id": "35160912",
+      "name": "iconm_banli",
+      "font_class": "iconm_banli",
+      "unicode": "e827",
+      "unicode_decimal": 59431
+    },
+    {
+      "icon_id": "35160913",
+      "name": "icomx_erwm",
+      "font_class": "icomx_erwm",
+      "unicode": "e828",
+      "unicode_decimal": 59432
+    },
+    {
+      "icon_id": "35160914",
+      "name": "iconm_jiangdzjzy",
+      "font_class": "iconm_jiangdzjzy",
+      "unicode": "e829",
+      "unicode_decimal": 59433
+    },
+    {
+      "icon_id": "35160915",
+      "name": "iconm_erwm",
+      "font_class": "iconm_erwm",
+      "unicode": "e82a",
+      "unicode_decimal": 59434
+    },
+    {
+      "icon_id": "35160916",
+      "name": "icomx_woddd",
+      "font_class": "icomx_woddd",
+      "unicode": "e82b",
+      "unicode_decimal": 59435
+    },
+    {
+      "icon_id": "35160917",
+      "name": "iconm_yinhangk",
+      "font_class": "iconm_yinhangk",
+      "unicode": "e82c",
+      "unicode_decimal": 59436
+    },
+    {
+      "icon_id": "35160918",
+      "name": "iconm_shujzs",
+      "font_class": "iconm_shujzs",
+      "unicode": "e82d",
+      "unicode_decimal": 59437
+    },
+    {
+      "icon_id": "35160919",
+      "name": "iconm_xiadje",
+      "font_class": "iconm_xiadje",
+      "unicode": "e82e",
+      "unicode_decimal": 59438
+    },
+    {
+      "icon_id": "35160920",
+      "name": "icomx_xiadje",
+      "font_class": "icomx_xiadje",
+      "unicode": "e82f",
+      "unicode_decimal": 59439
+    },
+    {
       "icon_id": "35023657",
       "name": "icomx_bianj",
       "font_class": "icomx_bianj",

src/router/index.js

@@ -34,6 +34,34 @@ const routes = [{
 				component: () => import('../views/working/index.vue')
 			},
 			{
+				path: 'home',
+				name: '我的中心',
+				component: () => import('../views/home/index.vue')
+			},
+			{
+				path: 'changePassword',
+				name: '修改密码',
+				component: () => import('../views/home/changePassword.vue')
+			},
+			
+			{
+				path: 'message',
+				name: '消息通知',
+				component: () => import('../views/message/index.vue')
+			},
+			{
+				path: 'messageList',
+				name: '消息列表',
+				component: () => import('../views/message/messageList.vue')
+			},
+			
+			{
+				path: 'iframWinfaster',
+				name: '官网',
+				component: () => import('../views/working/iframWinfaster.vue')
+			},
+			
+			{
 				path: 'xiamenList',
 				name: '发酵机列表',
 				component: () => import('../views/equipment/xiamenList.vue')
@@ -274,6 +302,23 @@ const routes = [{
 				name: 'form表单测试',
 				component: () => import('../views/MES/produceManage/completeProject1/index.vue')
 			},
+			//邮箱模块
+			{
+				path: 'email',
+				name: '邮箱',
+				component: () => import('../views/email/index.vue')
+			},
+			{
+				path: 'inbox',
+				name: '收件箱',
+				component: () => import('../views/email/inbox.vue')
+			},
+			{
+				path: 'mailDtl',
+				name: '邮件详情',
+				component: () => import('../views/email/mailDtl.vue')
+			},
+			
 		]
 	},
 ]

src/utils/axios.js

@@ -1,10 +1,12 @@
 import axios from 'axios'
 
+import router from '../router'
 import errorCode from '@/utils/errorCode'
 import { tansParams, blobValidate } from '@/utils/ruoyi'
 import cache from '@/utils/cache'
 import { showLoadingToast, closeToast,showNotify,showFailToast  } from 'vant';
 import { getToken } from '@/utils/auth'
+
 // 是否显示重新登录
 export let isRelogin = { show: false };
 import 'vant/lib/index.css'
@@ -76,15 +78,11 @@ service.interceptors.response.use(res => {
     return res.data
   }
   if (code === 401) {
-    if (!isRelogin.show) {
-      isRelogin.show = true;
-      // ElMessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
-      //   isRelogin.show = false;
+    showFailToast('登录失效，请重新登录');
+    console.log(router)
+    router.push({ path: '/' })
+    
 
-      // }).catch(() => {
-      //   isRelogin.show = false;
-      // });
-    }
     return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
   } else if (code === 500) {
     

src/views/email/inbox.vue

@@ -0,0 +1,224 @@
+<template>
+    <div class="inbox">
+        <van-nav-bar
+            title="收件箱"
+            left-text=""
+            left-arrow
+            @click-left="onClickLeft"
+            right-text="写邮件"
+            @click-right="onClickRight"
+        >
+        </van-nav-bar>
+        <van-search v-model="value" show-action placeholder="请输入搜索关键词">
+            <template #action>
+                <div @click="onClickButton">搜索</div>
+            </template>
+        </van-search>
+        <van-pull-refresh v-model="loading" @refresh="onRefresh">
+            <div class="list">
+                <van-list
+                    v-model:loading="loading"
+                    :finished="finished"
+                    finished-text="没有更多了"
+                    @load="onLoad"
+                    style="margin-bottom: 60px"
+                >
+                    <ul>
+                        <li v-for="i in listData" :key="i.id" @click="toDtl(i)">
+                            <div class="user-icon">
+                                <i class="icon-iconm_mine iconfont"></i>
+                            </div>
+                            <div class="text">
+                                <div class="title">
+                                    <span class="name"><span class="unread"></span>{{i.fromEmail}}</span>
+                                    <span class="time">{{i.sendDate}}</span>
+                                </div>
+                                <div class="content">
+                                    <div class="title">{{i.subject}}</div>
+                                    <div class="centent-text">
+                                        {{i.subject}}
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                    </ul>
+                </van-list>
+            </div>
+        </van-pull-refresh>
+        
+    </div>
+</template>
+<script setup>
+import { ref, getCurrentInstance, onMounted } from 'vue'
+import commonList from '@/components/common-list.vue'
+import { useRoute } from 'vue-router'
+const loading = ref(false)
+const router = useRoute()
+const req = ref({
+	pageNum: 1,
+	type: '1',
+	keyword: null,
+})
+const finished = ref(false)
+const proxy = getCurrentInstance().proxy
+const listData = ref([])
+
+const listConfig = ref([
+	{
+		label: '申购单号',
+		prop: 'subscribeCode',
+	},
+	{
+		label: '物品名称',
+		prop: 'productName',
+	},
+	{
+		label: '申购数量',
+		prop: 'count',
+	},
+	{
+		label: '已采购',
+		prop: 'count',
+	},
+])
+const onRefresh = () => {
+	req.value.pageNum = 1
+	finished.value = false
+	getList('refresh')
+}
+const onLoad = () => {
+	getList()
+}
+let ids = []
+
+const onCkeckbox = (row) => {
+	ids = []
+	row.map((i) => {
+		ids.push(i.id)
+	})
+}
+
+const onClickLeft = () => {
+    proxy.$router.go(-1)
+}
+
+const onClickRight = () => {
+	proxy.$router.push({
+		path: 'procureListAdd',
+		query: {
+			ids: JSON.stringify(ids),
+		},
+	})
+}
+
+const toDtl = (row) => {
+	proxy.$router.push({
+		path: 'mailDtl',
+		query: {
+			...row,
+            type: router.query.type,
+		},
+	})
+}
+
+const getList = (type) => {
+	loading.value = true
+	proxy
+		.post('/mailService/getMessagePage', req.value)
+		.then((res) => {
+			console.log(req.value)
+			listData.value =
+				type === 'refresh'
+					? res.data.rows
+					: listData.value.concat(res.data.rows)
+			if (req.value.pageNum * 10 >= res.data.total) {
+				finished.value = true
+			}
+			req.value.pageNum++
+			loading.value = false
+            console.log(listData)
+		})
+		.catch((err) => {
+			loading.value = false
+            finished.value = true
+		})
+}
+
+onMounted(() => {
+    console.log(router)
+    req.value.folderId = router.query.id
+    req.value.type = router.query.type
+	getList()
+})
+</script>
+<style lang="scss">
+    .inbox{
+        ul{
+            margin-top: 12px;
+            background: #fff;
+            li{
+                display: flex;
+                padding: 16px 12px;
+                border-bottom: 1px solid #E5E5E5;
+                .user-icon{
+                    width: 40px;
+                    height: 40px;
+                    background: #cccccc;
+                    border-radius: 50%;
+                    text-align: center;
+                    i{
+                        font-size: 24px;
+                        color: #fff;
+                        line-height: 40px;
+                    }
+                }
+                .text{
+                    width:calc(100vw - 76px);
+                    margin-left: 12px;
+                    .title{
+                        display: flex;
+                        justify-content: space-between;
+                        .name{
+                            font-size: 16px;
+                            color: #333333;
+                            font-weight: bold;
+                            .unread{
+                                display: inline-block;
+                                width: 8px;
+                                height: 8px;
+                                background: #0084FF;
+                                border-radius: 50%;
+                                margin-right: 4px;
+                                position: relative;
+                                top:-2px;
+                            }
+                        }
+                        .time{
+                            font-size: 12px;
+                            color: #999999;
+                        }
+                    }
+                    .content{
+                        margin-top: 8px;
+                        .title{
+                            font-size: 14px;
+                            color: #333333;
+                            margin-bottom: 4px;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                        .centent-text{
+                            font-size: 12px;
+                            color: #999999;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                    }
+                }
+                
+            }
+        }
+    }
+</style>

src/views/email/index.vue

@@ -0,0 +1,228 @@
+<template>
+    <div class="email">
+        <van-nav-bar
+            title="邮箱"
+            left-text=""
+            left-arrow
+            @click-left="onClickLeft"
+            
+        >
+        </van-nav-bar>
+        <van-search v-model="value" show-action placeholder="请输入搜索关键词">
+            <template #action>
+                <div @click="onClickButton">搜索</div>
+            </template>
+        </van-search>
+        <div class="email-card" style="margin-top:1px" @click="toRouter('inbox')">
+            <div class="left-icon">
+                <i style="color:#FFAF53" class="iconfont icon-iconm_youxsz"></i>
+            </div>
+            <div class="center-text">
+                所有收件箱
+            </div>
+            <div class="right-box right-text">
+                99
+            </div>
+        </div>
+        <div class="title">
+            账户
+        </div>
+        <div class="email-card" @click="showPicker = true">
+            
+            <div class="center-text">
+                {{selectMailData.text || selectMailData.receiveHost || '请选择邮箱'}}
+            </div>
+            <div class="right-box right-text more">
+                <i class="iconfont icon-iconm_xialan1"></i>
+            </div>
+        </div>
+        <van-popup v-model:show="showPicker" round position="bottom">
+            <van-picker
+                :columns="columns"
+                @cancel="showPicker = false"
+                @confirm="onConfirm"
+            />
+        </van-popup>
+        <div class="email-card" style="margin-top:12px">
+            <div class="left-icon">
+                <i  style="color:#46A6FF" class="iconfont icon-icomm_contact"></i>
+            </div>
+            <div class="center-text">
+                联系人
+            </div>
+            <div class="right-box right-text more">
+                <van-icon name="arrow" size='16' />
+            </div>
+        </div>
+        <div class="email-card">
+            <div class="left-icon">
+                <i  style="color:#FF655B" class="iconfont icon-iconm_mine"></i>
+            </div>
+            <div class="center-text">
+                客户
+            </div>
+            <div class="right-box right-text more">
+                <van-icon name="arrow" size='16' />
+            </div>
+        </div>
+        <div class="email-card" style="margin-top:12px">
+            <div class="left-icon">
+                <i  style="color:#46A6FF" class="iconfont icon-iconm_inbox"></i>
+            </div>
+            <div class="center-text">
+                收件箱
+            </div>
+            <div class="right-box right-text more">
+                99
+            </div>
+        </div>
+        <div class="email-card">
+            <div class="left-icon">
+                <i  style="color:#FFAF53" class="iconfont icon-icon_email"></i>
+            </div>
+            <div class="center-text">
+                未读邮件
+            </div>
+            <div class="right-box right-text more">
+                99
+            </div>
+        </div>
+        <div class="email-card">
+            <div class="left-icon">
+                <i  style="color:#FF655B" class="iconfont icon-icon_dz"></i>
+            </div>
+            <div class="center-text">
+                草稿箱
+            </div>
+            <div class="right-box right-text more">
+                
+            </div>
+        </div>
+        <div class="email-card">
+            <div class="left-icon">
+                <i  style="color:#39C55A" class="iconfont icon-iconm_sent"></i>
+            </div>
+            <div class="center-text">
+                已发送
+            </div>
+            <div class="right-box right-text more">
+                
+            </div>
+        </div>
+        <div class="email-card">
+            <div class="left-icon">
+                <i  style="color:#999999" class="iconfont icon-icomm_delete"></i>
+            </div>
+            <div class="center-text">
+                已删除
+            </div>
+            <div class="right-box right-text more">
+                
+            </div>
+        </div>
+        <div class="email-card">
+            <div class="left-icon">
+                <i  style="color:#999999" class="iconfont icon-iconm_ljyx"></i>
+            </div>
+            <div class="center-text">
+                垃圾邮箱
+            </div>
+            <div class="right-box right-text more">
+                
+            </div>
+        </div>
+    </div>
+</template>
+<script setup>
+import { ref,getCurrentInstance } from 'vue'
+import { getUserInfo } from '@/utils/auth'
+import { showSuccessToast, showFailToast } from 'vant'
+const proxy = getCurrentInstance().proxy
+const onClickLeft = () => proxy.$router.push('/main/working')
+const toRouter = (name) => {
+    if(!selectMailData.value.id) {
+        showSuccessToast('请选择邮箱')
+        return
+    }
+    proxy.$router.push({
+		path: name,
+        query: {
+            ...selectMailData.value.mailFolderInfoList[0],
+            type:selectMailData.value.type,
+        }
+	})
+}
+
+let selectMailData = ref({})
+
+const showPicker = ref(false)
+let columns = ref([])
+
+const getUserEmailList = () => {
+    proxy.post('/mailInfo/getUserEmailList',{
+        id:getUserInfo().userId
+    }).then(res => {
+        columns.value = res.data.map(item => {
+            return {
+                ...item,
+                text:item.receiveHost,
+                value:item.id
+            }
+        })
+        if(res.data.length > 0) {
+            selectMailData.value = res.data[0]
+        }
+        console.log(columns)
+    })
+}
+
+
+const onConfirm = ({ selectedOptions }) => {
+    showPicker.value = false;
+    selectMailData.value = selectedOptions[0];
+    fieldValue.value = selectedOptions[0].text;
+};
+getUserEmailList()
+</script>
+<style lang="scss">
+    .email{
+        .email-card{
+            height: 60px;
+            line-height: 60px;
+            padding: 0 12px;
+            background: #fff;
+            border-bottom: 1px solid #ddd;
+            display: flex;
+            justify-content: space-between;
+            .center-text{
+                font-size: 16px;
+                font-weight: 500;
+                flex: 1;
+                color: #333;
+                font-weight: 500;
+            }
+            .left-icon{
+                
+                margin-right: 14px;
+                i{
+                    font-size: 20px;
+                }
+            }
+            .right-text{
+                font-size: 14px;
+                color: #333;
+                font-weight: 500;
+            }
+        }
+        .email-card {
+            
+        }
+        .title{
+            height: 46px;
+            line-height: 46px;
+            padding: 0 12px;
+            font-size: 16px;
+            color: #333;
+        }
+    }
+</style>

src/views/email/mailDtl.vue

@@ -0,0 +1,118 @@
+<template>
+    <div class="mailDtl">
+        <van-nav-bar
+            title="收件箱"
+            left-text=""
+            left-arrow
+            @click-left="onClickLeft"
+        >
+        </van-nav-bar>
+        <div class="title">
+            {{router.query.subject}}
+        </div>
+        <ul>
+            <li>
+                <span class="label">发件人</span>
+                <span class="value">{{router.query.fromPersonalName}}</span>
+            </li>
+            <li style="height:auto">
+                <span class="label">收件人</span>
+                <span class="value">
+                    <span class="AddressList" v-for="i in mailData.messageAddressList" :key='i.email'>
+                        {{i.personalName}}({{i.email}})
+                    </span>
+                </span>
+            </li>
+            <li>
+                <span class="label">时&nbsp;&nbsp;&nbsp;间</span>
+                <span class="value">{{router.query.sendDate}}</span>
+            </li>
+            <li>
+                <span class="label">附&nbsp;&nbsp;&nbsp;件</span>
+                <span class="value">{{mailData.sendDate}}</span>
+            </li>
+        </ul>
+        <div class="content" v-html="mailData.content"></div>
+        <div class="flie-list">
+            <div class="title">附件列表</div>
+            <div class="list">
+                <div class="item" v-for="i in mailData.messageAttachmentList" :key="i.id">
+                    <div class="icon">
+                        <i class="icon-iconm_mine iconfont"></i>
+                    </div>
+                    <div class="text">
+                        <div class="name">{{i.name}}</div>
+                        <div class="size">{{i.name}}</div>
+                    </div>
+                    <div class="btn">
+                        <van-button type="primary" size="small" round>下载</van-button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script setup>
+import { ref, getCurrentInstance, onMounted } from 'vue'
+import commonList from '@/components/common-list.vue'
+import { useRoute } from 'vue-router'
+const loading = ref(false)
+const router = useRoute()
+const proxy = getCurrentInstance().proxy
+
+const onClickLeft = () => {
+    proxy.$router.go(-1)
+}
+
+let mailData = ref({})
+
+const getMessageDetail = () => {
+    proxy.post('/mailService/getMessageDetail', {
+        messageId: router.query.id,
+        type: router.query.type
+    }).then((res) => {
+        console.log(res)
+        mailData.value = res.data
+    })
+}
+
+onMounted(() => {
+    console.log(router)
+	getMessageDetail()
+})
+</script>
+<style lang="scss">
+    .mailDtl{
+        overflow: hidden;
+        width: 100vw;
+        background: #fff;
+        .content{
+            overflow-x: auto;
+            padding: 20px 12px;
+        }
+        .title{
+            padding: 20px 12px 12px;
+            font-size: 16px;
+            font-weight: 500;
+        }
+        ul{
+            padding: 0 12px 8px;
+            border-bottom: 1px solid #ddd;
+            li{
+                height: 32px;
+                line-height: 32px;
+                color:#999;
+                font-size: 14px;
+                //英文换行
+                word-break: break-all;
+                .AddressList{
+                    display: inline-block;
+                }
+                .label{
+                    width: 60px;
+                    display: inline-block;
+                }
+            }
+        }
+    }
+</style>

src/views/home/changePassword.vue

@@ -0,0 +1,59 @@
+<template>
+	<div class="form">
+		<van-nav-bar
+			title="修改密码"
+			left-text="返回"
+			left-arrow
+			@click-left="onClickLeft"
+		>
+		</van-nav-bar>
+		<van-form @submit="onSubmit" label-align="top" style="margin-top: 20px">
+			<van-cell-group inset>
+				<van-field
+					v-model="formData.password"
+					label="新密码"
+					placeholder="请输入新密码"
+					:rules="[{ required: true, message: '新密码不能为空' }]"
+					required
+				/>
+			</van-cell-group>
+			<div style="margin: 16px">
+				<van-button round block type="primary" native-type="submit">
+					提交
+				</van-button>
+			</div>
+		</van-form>
+	</div>
+</template>
+  
+  <script setup>
+import { ref, getCurrentInstance, onMounted } from 'vue'
+import { showSuccessToast, showFailToast } from 'vant'
+import { useRoute } from 'vue-router'
+import { getUserInfo } from '@/utils/auth'
+const proxy = getCurrentInstance().proxy
+const formData = ref({
+	password: '',
+	userId: getUserInfo().userId,
+})
+const onClickLeft = () => history.back()
+
+const onSubmit = () => {
+	proxy.post('/tenantUser/resetPwd' , formData.value,'PUT').then(
+		(res) => {
+			setTimeout(() => {
+				showSuccessToast('修改成功')
+				history.back()
+			}, 500)
+		},
+		(err) => {
+			return showFailToast(err.message)
+		}
+	)
+}
+onMounted(() => {
+	console.log(getUserInfo())
+})
+</script>
+  <style lang="scss" scoped>
+</style>

src/views/home/index.vue

@@ -1,7 +1,182 @@
 <template>
-    <div class="home">
-        <van-nav-bar title="ByteSailing">
-            <template #right> <van-icon name="more-o" /> </template>
-        </van-nav-bar>
-    </div>
-</template>
+	<div class="home">
+		<div class="header">
+			<div class="title">
+				<div class="back">
+					<!-- <van-icon name="arrow-left" size='20' /> -->
+				</div>
+				<div class="text">客户画像</div>
+				<div class="more"></div>
+			</div>
+			<div class="user-info">
+				<div class="user-icon">
+					<img src="../../assets/images/people.png" alt="" />
+				</div>
+				<div class="user-text">
+					<div class="name">{{userInfo.nickName}}</div>
+					<div class="company">{{userInfo.dept ? userInfo.dept.deptName  : ''}}</div>
+				</div>
+				<div class="more">
+					<van-icon name="arrow" size="16" />
+				</div>
+			</div>
+		</div>
+		<ul class="set-list">
+			<li @click="toChanagePassword">
+				<div class="icon-box">
+					<i class="iconfont icon-icon_pz"></i>
+				</div>
+				<div class="text">修改密码</div>
+				<div class="more">
+					<van-icon name="arrow" size="16" />
+				</div>
+			</li>
+		</ul>
+		<van-button class="logout" type="primary" @click="logout" block
+			>退出登录</van-button
+		>
+	</div>
+</template>
+<script setup>
+import { ref, getCurrentInstance, onMounted } from 'vue'
+import { showSuccessToast, showFailToast,showConfirmDialog } from 'vant'
+import { useRoute } from 'vue-router'
+import { getUserInfo } from '@/utils/auth'
+const onClickLeft = () => history.back()
+const proxy = getCurrentInstance().proxy
+const userInfo = ref(getUserInfo())
+console.log(userInfo)
+const toMessageList = () => {
+	proxy.$router.push('/main/messageList')
+}
+const toChanagePassword = () => {
+    proxy.$router.push('/main/changePassword')
+}
+const logout = () => {
+	showConfirmDialog({
+		title: '提示',
+		message: '您确定退出本次登录么？',
+	}).then(() => {
+		proxy.get('logout').then((res) => {
+            if (res.code == 200) {
+                showSuccessToast('退出成功')
+                //清除路由历史记录
+                proxy.$router.replace('/')
+            } else {
+                showFailToast('退出失败')
+            }
+        })
+	})
+	
+}
+</script>
+<style lang="scss">
+.home {
+	background: #fff;
+	min-height: 100vh;
+	.van-nav-bar {
+		background: rgba(0, 0, 0, 0);
+	}
+	.logout {
+		border-radius: 22px;
+		background: #eaf0ff;
+		border: 1px solid #eaf0ff;
+		color: #3370ff;
+		width: 80% !important;
+		margin: 0 auto;
+		position: fixed;
+		bottom: 100px;
+		left: 10%;
+	}
+	.set-list {
+		position: relative;
+		top: -80px;
+		background: #fff;
+		min-height: 200px;
+		border-radius: 10px;
+		padding-top: 10px;
+		li {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 40px;
+			padding: 0 12px;
+			.icon-box {
+				width: 40px;
+				height: 40px;
+				text-align: center;
+				line-height: 40px;
+				i {
+					font-size: 20px;
+					color: #3370ff;
+				}
+			}
+			.text {
+				flex: 1;
+				margin: 0 12px;
+				font-size: 16px;
+				color: #333;
+			}
+			.more {
+				i {
+					color: #999;
+				}
+			}
+		}
+	}
+	.header {
+		background: linear-gradient(180deg, #3370ff 0%, #f1f1f1 100%);
+		height: 250px;
+		.user-info {
+			display: flex;
+			justify-content: space-between;
+			padding: 0 12px;
+			height: 60px;
+			margin-top: 10px;
+			.user-text {
+				color: #fff;
+				.name {
+					font-size: 20px;
+					font-weight: bold;
+					margin: 5px 0;
+					width: calc(100vw - 140px);
+				}
+			}
+			.user-icon {
+				width: 60px;
+				height: 60px;
+				background-color: #f1f1f1;
+				border-radius: 50%;
+				text-align: center;
+
+				img {
+					width: 40px;
+					margin-top: 10px;
+				}
+				overflow: hidden;
+			}
+			.more {
+				line-height: 60px;
+				i {
+					color: #fff;
+				}
+			}
+		}
+		.title {
+			display: flex;
+			justify-content: space-between;
+			height: 46px;
+			line-height: 46px;
+			padding: 0 12px;
+			color: #fff;
+			font-size: 16px;
+			font-weight: bold;
+			.back,
+			.more {
+				width: 40px;
+				height: 100%;
+			}
+		}
+	}
+}
+</style>

src/views/main.vue

@@ -2,16 +2,16 @@
 	<div class="main">
 		<div class="footer">
 			<van-tabbar v-model="tabType">
-				<!-- <van-tabbar-item icon="home-o" to="/main/equipment">消息</van-tabbar-item> -->
+				<van-tabbar-item icon="home-o" to="/main/message">消息</van-tabbar-item>
 				<van-tabbar-item icon="search" to="/main/working">工作台</van-tabbar-item>
 				<van-tabbar-item
 					icon="friends-o"
 					:to="tenantId == 'xmhjc' ? '/main/xiamenList' : '/main/equipment'"
 				>物联网</van-tabbar-item>
-				<!-- <van-tabbar-item
+				<van-tabbar-item
 					icon="setting-o"
-					to="/setting"
-				>我的</van-tabbar-item> -->
+					to="/main/home"
+				>我的</van-tabbar-item>
 			</van-tabbar>
 		</div>
 	</div>

src/views/message/index.vue

@@ -1,7 +1,158 @@
 <template>
-    <div class="home">
+    <div class="message">
         <van-nav-bar title="ByteSailing">
+            
             <template #right> <van-icon name="more-o" /> </template>
         </van-nav-bar>
+        <ul>
+            <li>
+                <div class="icon-box">
+                    <i  class="iconfont icon-iconm_xitxx"></i>
+                </div>
+                <div class="text-center">
+                    <div class="title">系统通知</div>
+                    <div class="content">啊实打实多阿萨德啊撒打说的啊打打萨达打萨达萨达阿萨德啊打萨达</div>
+                </div>
+                <div class="text-right">
+                    <div class="time-or-num">
+                        <div class="time">12:00</div>
+                        <div class="num">122</div>
+                    </div>
+                    <van-icon name="arrow" size='16' />
+                </div>
+            </li>
+            <li>
+                <div class="icon-box" style="background:#A06CFB">
+                    <i  class="iconfont icon-iconm_yewtx"></i>
+                </div>
+                <div class="text-center">
+                    <div class="title">业务提醒</div>
+                    <div class="content">asdlojaskldajsdlakj</div>
+                </div>
+                <div class="text-right">
+                    <div class="time-or-num">
+                        <div class="time">12:00</div>
+                        <div class="num">122</div>
+                    </div>
+                    <van-icon name="arrow" size='16' />
+                </div>
+            </li>
+            <li>
+                <div class="icon-box"  style="background:#FF8800">
+                    <i  class="iconfont icon-iconx_dianzyx"></i>
+                </div>
+                <div class="text-center">
+                    <div class="title">邮箱提醒</div>
+                    <div class="content">asdlojaskldajsdlakj</div>
+                </div>
+                <div class="text-right">
+                    <div class="time-or-num">
+                        <div class="time">12:00</div>
+                        <div class="num">122</div>
+                    </div>
+                    <van-icon name="arrow" size='16' />
+                </div>
+            </li>
+            <li @click="toMessageList">
+                <div class="icon-box" style="background:#38CBD8">
+                    <i  class="iconfont icon-iconm_kehd"></i>
+                </div>
+                <div class="text-center">
+                    <div class="title">私信</div>
+                    <div class="content">asdlojaskldajsdlakj</div>
+                </div>
+                <div class="text-right">
+                    <div class="time-or-num">
+                        <div class="time">12:00</div>
+                        <div class="num">122</div>
+                    </div>
+                    <van-icon name="arrow" size='16' />
+                </div>
+            </li>
+        </ul>
     </div>
-</template>
+</template>
+<script setup>
+import { ref, getCurrentInstance, onMounted } from 'vue'
+import { showSuccessToast, showFailToast } from 'vant'
+import { useRoute } from 'vue-router'
+const proxy = getCurrentInstance().proxy
+const toMessageList = () => {
+    proxy.$router.push('/main/messageList')
+}
+</script>
+<style lang="scss">
+    .message{
+        ul{
+            margin: 12px 0 0 0;
+            padding-left: 12px;
+            background: #fff;
+            li{
+                
+                padding: 20px 12px 20px 0;
+                display: flex;
+                justify-content: space-between;
+                height: 80px;
+                box-sizing: border-box;
+                border-bottom: 1px solid #ddd;
+                .text-center{
+                    flex: 1;
+                    max-width: calc(100vw - 140px);
+                    .title{
+                        font-size: 16px;
+                        font-weight: bold;
+                        color: #333;
+                    }
+                    .content{
+                        font-size: 14px;
+                        color: #999;
+                        margin-top: 4px;
+                        //文字一行多余省略
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        white-space: nowrap;
+
+                    }
+                }
+                .text-right{
+                    display: flex;
+                    .van-badge__wrapper{
+                        line-height: 40px;
+                    }
+                    .time-or-num {
+                        text-align: center;
+                        margin-right: 5px;
+                        .time{
+                            font-size: 12px;
+                            color: #999;
+                        }
+                        .num {
+                            
+                            height: 16px;
+                            background: #FF4D4F;
+                            border-radius: 8px;
+                            text-align: center;
+                            line-height: 16px;
+                            font-size: 12px;
+                            color: #fff;
+                            margin-top: 8px;
+                        }
+                    }
+                }
+                .icon-box{
+                    width: 40px;
+                    height: 40px;
+                    background: #46A6FF;
+                    border-radius: 20px;
+                    text-align: center;
+                    line-height: 40px;
+                    margin-right: 20px;
+                    i{
+                        font-size: 20px;
+                        color: #fff;
+                    }
+                }
+            }
+        }
+    }
+</style>

src/views/message/messageList.vue

@@ -0,0 +1,131 @@
+<template>
+    <div class="messageList">
+        <van-nav-bar
+			title="带采购"
+			left-text="返回"
+			left-arrow
+			@click-left="onClickLeft"
+		></van-nav-bar>
+        <ul>
+            <li>
+                <div class="icon-box">
+                    <i  class="iconfont icon-iconm_xitxx"></i>
+                </div>
+                <div class="text-center">
+                    <div class="title">张三</div>
+                    <div class="content">啊实打实多阿萨德啊撒打说的啊打打萨达打萨达萨达阿萨德啊打萨达</div>
+                </div>
+                <div class="text-right">
+                    <div class="time-or-num">
+                        <div class="time">12:00</div>
+                        <div class="num">122</div>
+                    </div>
+                    <van-icon name="arrow" size='16' />
+                </div>
+            </li>
+            
+            <li>
+                <div class="icon-box">
+                    <i  class="iconfont icon-iconm_kehd"></i>
+                </div>
+                <div class="text-center">
+                    <div class="title">李四</div>
+                    <div class="content">asdlojaskldajsdlakj</div>
+                </div>
+                <div class="text-right">
+                    <div class="time-or-num">
+                        <div class="time">12:00</div>
+                        <div class="num">122</div>
+                    </div>
+                    <van-icon name="arrow" size='16' />
+                </div>
+            </li>
+        </ul>
+    </div>
+</template>
+
+<script setup>
+import { ref, getCurrentInstance, onMounted } from 'vue'
+import { showSuccessToast, showFailToast } from 'vant'
+import { useRoute } from 'vue-router'
+const onClickLeft = () => history.back()
+const proxy = getCurrentInstance().proxy
+const toMessageList = () => {
+    proxy.$router.push('/main/messageList')
+}
+</script>
+<style lang="scss">
+    .messageList{
+        ul{
+            margin: 12px 0 0 0;
+            padding-left: 12px;
+            background: #fff;
+            li{
+                
+                padding: 20px 12px 20px 0;
+                display: flex;
+                justify-content: space-between;
+                height: 80px;
+                box-sizing: border-box;
+                border-bottom: 1px solid #ddd;
+                .text-center{
+                    flex: 1;
+                    max-width: calc(100vw - 140px);
+                    .title{
+                        font-size: 16px;
+                        font-weight: bold;
+                        color: #333;
+                    }
+                    .content{
+                        font-size: 14px;
+                        color: #999;
+                        margin-top: 4px;
+                        //文字一行多余省略
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        white-space: nowrap;
+
+                    }
+                }
+                .text-right{
+                    display: flex;
+                    .van-badge__wrapper{
+                        line-height: 40px;
+                    }
+                    .time-or-num {
+                        text-align: center;
+                        margin-right: 5px;
+                        .time{
+                            font-size: 12px;
+                            color: #999;
+                        }
+                        .num {
+                            
+                            height: 16px;
+                            background: #FF4D4F;
+                            border-radius: 8px;
+                            text-align: center;
+                            line-height: 16px;
+                            font-size: 12px;
+                            color: #fff;
+                            margin-top: 8px;
+                        }
+                    }
+                }
+                .icon-box{
+                    width: 40px;
+                    height: 40px;
+                    background: #ccc;
+                    border-radius: 20px;
+                    text-align: center;
+                    line-height: 40px;
+                    margin-right: 20px;
+                    i{
+                        font-size: 20px;
+                        color: #fff;
+                    }
+                }
+            }
+        }
+    }
+</style>

src/views/working/iframWinfaster.vue

@@ -0,0 +1,26 @@
+<template>
+    <van-nav-bar
+        title="产品库"
+        left-text="返回"
+        left-arrow
+        @click-left="onClickLeft"
+    ></van-nav-bar>
+    <div class="iframWinfaster">
+        <iframe src="https://www.winfaster.cn/#/" frameborder="0"></iframe>
+    </div>
+</template>
+<style lang="scss">
+    .iframWinfaster{
+        height: calc(100vh - 100px);
+        width: 100vw;
+        iframe{
+            width: 100%;
+            height: 100%;
+        }
+    }
+</style>
+<script setup>
+import { ref, reactive, getCurrentInstance, toRaw } from "vue";
+const proxy = getCurrentInstance().proxy;
+const onClickLeft = () => history.back();
+</script>

src/views/working/index.vue

@@ -1,6 +1,10 @@
 <template>
   <div class="working">
-    
+    <van-swipe class="my-swipe" indicator-color="white">
+      <van-swipe-item @click="toWinfaster">官网</van-swipe-item>
+      <van-swipe-item>2</van-swipe-item>
+
+    </van-swipe>
     <div class="card" v-for="i in routerData" :key="i.path">
       <div class="title">{{ i.meta.title }}</div>
       <ul>
@@ -35,6 +39,11 @@ const getRouter = () => {
   });
 };
 getRouter();
+const toWinfaster = () => {
+  proxy.$router.push({
+    path: "/main/iframWinfaster",
+  });
+};
 const toRouter = (item) => {
   proxy.$router.push({
     path: item.path,
@@ -69,6 +78,18 @@ const handleGo = (type) => {
   padding: 12px;
   color: #333;
   margin-bottom:60px;
+  .my-swipe{
+    height: 150px;
+    background: #0084ff;
+    color: #fff;
+    border-radius: 5px;
+    text-align: center;
+    .van-swipe-item{
+      height: 150px;
+      text-align: center;
+      line-height: 150px;
+    }
+  }
   .card {
     background: #fff;
     border-radius: 5px;