diff --git a/Api/Ewide.Core/Service/File/SysFileService.cs b/Api/Ewide.Core/Service/File/SysFileService.cs
index 2cb8716..70e7bc1 100644
--- a/Api/Ewide.Core/Service/File/SysFileService.cs
+++ b/Api/Ewide.Core/Service/File/SysFileService.cs
@@ -133,7 +133,7 @@ namespace Ewide.Core.Service
             var file = await GetFileInfo(input);
             var filePath = Path.Combine(App.WebHostEnvironment.WebRootPath, file.FileBucket, file.FileObjectName);
             var fileName = HttpUtility.UrlEncode(file.FileOriginName, Encoding.GetEncoding("UTF-8"));
-            return new FileStreamResult(new FileStream(filePath, FileMode.Open), "application/octet-stream") { FileDownloadName = fileName };
+            return new FileStreamResult(new FileStream(filePath, FileMode.Open), Util.MimeMapping.GetMimeMapping(filePath)) { FileDownloadName = fileName };
         }
 
         /// <summary>
diff --git a/Api/Ewide.Core/Util/MimeMapping.cs b/Api/Ewide.Core/Util/MimeMapping.cs
new file mode 100644
index 0000000..93ba5c5
--- /dev/null
+++ b/Api/Ewide.Core/Util/MimeMapping.cs
@@ -0,0 +1,232 @@
+using System;
+using System.Collections;
+
+namespace Ewide.Core.Util
+{
+    public class MimeMapping
+    {
+        private static Hashtable _mimeMappingTable;
+
+        private static void AddMimeMapping(string extension, string MimeType)
+        {
+            MimeMapping._mimeMappingTable.Add(extension, MimeType);
+        }
+
+        public static string GetMimeMapping(string FileName)
+        {
+            string text = null;
+            int num = FileName.LastIndexOf('.');
+            if (0 < num && num > FileName.LastIndexOf('\\'))
+            {
+                text = (string)MimeMapping._mimeMappingTable[FileName.Substring(num)];
+            }
+            if (text == null)
+            {
+                text = (string)MimeMapping._mimeMappingTable[".*"];
+            }
+            return text;
+        }
+
+        static MimeMapping()
+        {
+            MimeMapping._mimeMappingTable = new Hashtable(190, StringComparer.CurrentCultureIgnoreCase);
+            MimeMapping.AddMimeMapping(".323", "text/h323");
+            MimeMapping.AddMimeMapping(".asx", "video/x-ms-asf");
+            MimeMapping.AddMimeMapping(".acx", "application/internet-property-stream");
+            MimeMapping.AddMimeMapping(".ai", "application/postscript");
+            MimeMapping.AddMimeMapping(".aif", "audio/x-aiff");
+            MimeMapping.AddMimeMapping(".aiff", "audio/aiff");
+            MimeMapping.AddMimeMapping(".axs", "application/olescript");
+            MimeMapping.AddMimeMapping(".aifc", "audio/aiff");
+            MimeMapping.AddMimeMapping(".asr", "video/x-ms-asf");
+            MimeMapping.AddMimeMapping(".avi", "video/x-msvideo");
+            MimeMapping.AddMimeMapping(".asf", "video/x-ms-asf");
+            MimeMapping.AddMimeMapping(".au", "audio/basic");
+            MimeMapping.AddMimeMapping(".application", "application/x-ms-application");
+            MimeMapping.AddMimeMapping(".bin", "application/octet-stream");
+            MimeMapping.AddMimeMapping(".bas", "text/plain");
+            MimeMapping.AddMimeMapping(".bcpio", "application/x-bcpio");
+            MimeMapping.AddMimeMapping(".bmp", "image/bmp");
+            MimeMapping.AddMimeMapping(".cdf", "application/x-cdf");
+            MimeMapping.AddMimeMapping(".cat", "application/vndms-pkiseccat");
+            MimeMapping.AddMimeMapping(".crt", "application/x-x509-ca-cert");
+            MimeMapping.AddMimeMapping(".c", "text/plain");
+            MimeMapping.AddMimeMapping(".css", "text/css");
+            MimeMapping.AddMimeMapping(".cer", "application/x-x509-ca-cert");
+            MimeMapping.AddMimeMapping(".crl", "application/pkix-crl");
+            MimeMapping.AddMimeMapping(".cmx", "image/x-cmx");
+            MimeMapping.AddMimeMapping(".csh", "application/x-csh");
+            MimeMapping.AddMimeMapping(".cod", "image/cis-cod");
+            MimeMapping.AddMimeMapping(".cpio", "application/x-cpio");
+            MimeMapping.AddMimeMapping(".clp", "application/x-msclip");
+            MimeMapping.AddMimeMapping(".crd", "application/x-mscardfile");
+            MimeMapping.AddMimeMapping(".deploy", "application/octet-stream");
+            MimeMapping.AddMimeMapping(".dll", "application/x-msdownload");
+            MimeMapping.AddMimeMapping(".dot", "application/msword");
+            MimeMapping.AddMimeMapping(".doc", "application/msword");
+            MimeMapping.AddMimeMapping(".dvi", "application/x-dvi");
+            MimeMapping.AddMimeMapping(".dir", "application/x-director");
+            MimeMapping.AddMimeMapping(".dxr", "application/x-director");
+            MimeMapping.AddMimeMapping(".der", "application/x-x509-ca-cert");
+            MimeMapping.AddMimeMapping(".dib", "image/bmp");
+            MimeMapping.AddMimeMapping(".dcr", "application/x-director");
+            MimeMapping.AddMimeMapping(".disco", "text/xml");
+            MimeMapping.AddMimeMapping(".exe", "application/octet-stream");
+            MimeMapping.AddMimeMapping(".etx", "text/x-setext");
+            MimeMapping.AddMimeMapping(".evy", "application/envoy");
+            MimeMapping.AddMimeMapping(".eml", "message/rfc822");
+            MimeMapping.AddMimeMapping(".eps", "application/postscript");
+            MimeMapping.AddMimeMapping(".flr", "x-world/x-vrml");
+            MimeMapping.AddMimeMapping(".fif", "application/fractals");
+            MimeMapping.AddMimeMapping(".gtar", "application/x-gtar");
+            MimeMapping.AddMimeMapping(".gif", "image/gif");
+            MimeMapping.AddMimeMapping(".gz", "application/x-gzip");
+            MimeMapping.AddMimeMapping(".hta", "application/hta");
+            MimeMapping.AddMimeMapping(".htc", "text/x-component");
+            MimeMapping.AddMimeMapping(".htt", "text/webviewhtml");
+            MimeMapping.AddMimeMapping(".h", "text/plain");
+            MimeMapping.AddMimeMapping(".hdf", "application/x-hdf");
+            MimeMapping.AddMimeMapping(".hlp", "application/winhlp");
+            MimeMapping.AddMimeMapping(".html", "text/html");
+            MimeMapping.AddMimeMapping(".htm", "text/html");
+            MimeMapping.AddMimeMapping(".hqx", "application/mac-binhex40");
+            MimeMapping.AddMimeMapping(".isp", "application/x-internet-signup");
+            MimeMapping.AddMimeMapping(".iii", "application/x-iphone");
+            MimeMapping.AddMimeMapping(".ief", "image/ief");
+            MimeMapping.AddMimeMapping(".ivf", "video/x-ivf");
+            MimeMapping.AddMimeMapping(".ins", "application/x-internet-signup");
+            MimeMapping.AddMimeMapping(".ico", "image/x-icon");
+            MimeMapping.AddMimeMapping(".jpg", "image/jpeg");
+            MimeMapping.AddMimeMapping(".jfif", "image/pjpeg");
+            MimeMapping.AddMimeMapping(".jpe", "image/jpeg");
+            MimeMapping.AddMimeMapping(".jpeg", "image/jpeg");
+            MimeMapping.AddMimeMapping(".js", "application/x-javascript");
+            MimeMapping.AddMimeMapping(".lsx", "video/x-la-asf");
+            MimeMapping.AddMimeMapping(".latex", "application/x-latex");
+            MimeMapping.AddMimeMapping(".lsf", "video/x-la-asf");
+            MimeMapping.AddMimeMapping(".manifest", "application/x-ms-manifest");
+            MimeMapping.AddMimeMapping(".mhtml", "message/rfc822");
+            MimeMapping.AddMimeMapping(".mny", "application/x-msmoney");
+            MimeMapping.AddMimeMapping(".mht", "message/rfc822");
+            MimeMapping.AddMimeMapping(".mid", "audio/mid");
+            MimeMapping.AddMimeMapping(".mpv2", "video/mpeg");
+            MimeMapping.AddMimeMapping(".man", "application/x-troff-man");
+            MimeMapping.AddMimeMapping(".mvb", "application/x-msmediaview");
+            MimeMapping.AddMimeMapping(".mpeg", "video/mpeg");
+            MimeMapping.AddMimeMapping(".m3u", "audio/x-mpegurl");
+            MimeMapping.AddMimeMapping(".mdb", "application/x-msaccess");
+            MimeMapping.AddMimeMapping(".mpp", "application/vnd.ms-project");
+            MimeMapping.AddMimeMapping(".m1v", "video/mpeg");
+            MimeMapping.AddMimeMapping(".mpa", "video/mpeg");
+            MimeMapping.AddMimeMapping(".me", "application/x-troff-me");
+            MimeMapping.AddMimeMapping(".m13", "application/x-msmediaview");
+            MimeMapping.AddMimeMapping(".movie", "video/x-sgi-movie");
+            MimeMapping.AddMimeMapping(".m14", "application/x-msmediaview");
+            MimeMapping.AddMimeMapping(".mpe", "video/mpeg");
+            MimeMapping.AddMimeMapping(".mp2", "video/mpeg");
+            MimeMapping.AddMimeMapping(".mov", "video/quicktime");
+            MimeMapping.AddMimeMapping(".mp3", "audio/mpeg");
+            MimeMapping.AddMimeMapping(".mpg", "video/mpeg");
+            MimeMapping.AddMimeMapping(".ms", "application/x-troff-ms");
+            MimeMapping.AddMimeMapping(".nc", "application/x-netcdf");
+            MimeMapping.AddMimeMapping(".nws", "message/rfc822");
+            MimeMapping.AddMimeMapping(".oda", "application/oda");
+            MimeMapping.AddMimeMapping(".ods", "application/oleobject");
+            MimeMapping.AddMimeMapping(".pmc", "application/x-perfmon");
+            MimeMapping.AddMimeMapping(".p7r", "application/x-pkcs7-certreqresp");
+            MimeMapping.AddMimeMapping(".p7b", "application/x-pkcs7-certificates");
+            MimeMapping.AddMimeMapping(".p7s", "application/pkcs7-signature");
+            MimeMapping.AddMimeMapping(".pmw", "application/x-perfmon");
+            MimeMapping.AddMimeMapping(".ps", "application/postscript");
+            MimeMapping.AddMimeMapping(".p7c", "application/pkcs7-mime");
+            MimeMapping.AddMimeMapping(".pbm", "image/x-portable-bitmap");
+            MimeMapping.AddMimeMapping(".ppm", "image/x-portable-pixmap");
+            MimeMapping.AddMimeMapping(".pub", "application/x-mspublisher");
+            MimeMapping.AddMimeMapping(".pnm", "image/x-portable-anymap");
+            MimeMapping.AddMimeMapping(".png", "image/png");
+            MimeMapping.AddMimeMapping(".pml", "application/x-perfmon");
+            MimeMapping.AddMimeMapping(".p10", "application/pkcs10");
+            MimeMapping.AddMimeMapping(".pfx", "application/x-pkcs12");
+            MimeMapping.AddMimeMapping(".p12", "application/x-pkcs12");
+            MimeMapping.AddMimeMapping(".pdf", "application/pdf");
+            MimeMapping.AddMimeMapping(".pps", "application/vnd.ms-powerpoint");
+            MimeMapping.AddMimeMapping(".p7m", "application/pkcs7-mime");
+            MimeMapping.AddMimeMapping(".pko", "application/vndms-pkipko");
+            MimeMapping.AddMimeMapping(".ppt", "application/vnd.ms-powerpoint");
+            MimeMapping.AddMimeMapping(".pmr", "application/x-perfmon");
+            MimeMapping.AddMimeMapping(".pma", "application/x-perfmon");
+            MimeMapping.AddMimeMapping(".pot", "application/vnd.ms-powerpoint");
+            MimeMapping.AddMimeMapping(".prf", "application/pics-rules");
+            MimeMapping.AddMimeMapping(".pgm", "image/x-portable-graymap");
+            MimeMapping.AddMimeMapping(".qt", "video/quicktime");
+            MimeMapping.AddMimeMapping(".ra", "audio/x-pn-realaudio");
+            MimeMapping.AddMimeMapping(".rgb", "image/x-rgb");
+            MimeMapping.AddMimeMapping(".ram", "audio/x-pn-realaudio");
+            MimeMapping.AddMimeMapping(".rmi", "audio/mid");
+            MimeMapping.AddMimeMapping(".ras", "image/x-cmu-raster");
+            MimeMapping.AddMimeMapping(".roff", "application/x-troff");
+            MimeMapping.AddMimeMapping(".rtf", "application/rtf");
+            MimeMapping.AddMimeMapping(".rtx", "text/richtext");
+            MimeMapping.AddMimeMapping(".sv4crc", "application/x-sv4crc");
+            MimeMapping.AddMimeMapping(".spc", "application/x-pkcs7-certificates");
+            MimeMapping.AddMimeMapping(".setreg", "application/set-registration-initiation");
+            MimeMapping.AddMimeMapping(".snd", "audio/basic");
+            MimeMapping.AddMimeMapping(".stl", "application/vndms-pkistl");
+            MimeMapping.AddMimeMapping(".setpay", "application/set-payment-initiation");
+            MimeMapping.AddMimeMapping(".stm", "text/html");
+            MimeMapping.AddMimeMapping(".shar", "application/x-shar");
+            MimeMapping.AddMimeMapping(".sh", "application/x-sh");
+            MimeMapping.AddMimeMapping(".sit", "application/x-stuffit");
+            MimeMapping.AddMimeMapping(".spl", "application/futuresplash");
+            MimeMapping.AddMimeMapping(".sct", "text/scriptlet");
+            MimeMapping.AddMimeMapping(".scd", "application/x-msschedule");
+            MimeMapping.AddMimeMapping(".sst", "application/vndms-pkicertstore");
+            MimeMapping.AddMimeMapping(".src", "application/x-wais-source");
+            MimeMapping.AddMimeMapping(".sv4cpio", "application/x-sv4cpio");
+            MimeMapping.AddMimeMapping(".tex", "application/x-tex");
+            MimeMapping.AddMimeMapping(".tgz", "application/x-compressed");
+            MimeMapping.AddMimeMapping(".t", "application/x-troff");
+            MimeMapping.AddMimeMapping(".tar", "application/x-tar");
+            MimeMapping.AddMimeMapping(".tr", "application/x-troff");
+            MimeMapping.AddMimeMapping(".tif", "image/tiff");
+            MimeMapping.AddMimeMapping(".txt", "text/plain");
+            MimeMapping.AddMimeMapping(".texinfo", "application/x-texinfo");
+            MimeMapping.AddMimeMapping(".trm", "application/x-msterminal");
+            MimeMapping.AddMimeMapping(".tiff", "image/tiff");
+            MimeMapping.AddMimeMapping(".tcl", "application/x-tcl");
+            MimeMapping.AddMimeMapping(".texi", "application/x-texinfo");
+            MimeMapping.AddMimeMapping(".tsv", "text/tab-separated-values");
+            MimeMapping.AddMimeMapping(".ustar", "application/x-ustar");
+            MimeMapping.AddMimeMapping(".uls", "text/iuls");
+            MimeMapping.AddMimeMapping(".vcf", "text/x-vcard");
+            MimeMapping.AddMimeMapping(".wps", "application/vnd.ms-works");
+            MimeMapping.AddMimeMapping(".wav", "audio/wav");
+            MimeMapping.AddMimeMapping(".wrz", "x-world/x-vrml");
+            MimeMapping.AddMimeMapping(".wri", "application/x-mswrite");
+            MimeMapping.AddMimeMapping(".wks", "application/vnd.ms-works");
+            MimeMapping.AddMimeMapping(".wmf", "application/x-msmetafile");
+            MimeMapping.AddMimeMapping(".wcm", "application/vnd.ms-works");
+            MimeMapping.AddMimeMapping(".wrl", "x-world/x-vrml");
+            MimeMapping.AddMimeMapping(".wdb", "application/vnd.ms-works");
+            MimeMapping.AddMimeMapping(".wsdl", "text/xml");
+            MimeMapping.AddMimeMapping(".xap", "application/x-silverlight-app");
+            MimeMapping.AddMimeMapping(".xml", "text/xml");
+            MimeMapping.AddMimeMapping(".xlm", "application/vnd.ms-excel");
+            MimeMapping.AddMimeMapping(".xaf", "x-world/x-vrml");
+            MimeMapping.AddMimeMapping(".xla", "application/vnd.ms-excel");
+            MimeMapping.AddMimeMapping(".xls", "application/vnd.ms-excel");
+            MimeMapping.AddMimeMapping(".xof", "x-world/x-vrml");
+            MimeMapping.AddMimeMapping(".xlt", "application/vnd.ms-excel");
+            MimeMapping.AddMimeMapping(".xlc", "application/vnd.ms-excel");
+            MimeMapping.AddMimeMapping(".xsl", "text/xml");
+            MimeMapping.AddMimeMapping(".xbm", "image/x-xbitmap");
+            MimeMapping.AddMimeMapping(".xlw", "application/vnd.ms-excel");
+            MimeMapping.AddMimeMapping(".xpm", "image/x-xpixmap");
+            MimeMapping.AddMimeMapping(".xwd", "image/x-xwindowdump");
+            MimeMapping.AddMimeMapping(".xsd", "text/xml");
+            MimeMapping.AddMimeMapping(".z", "application/x-compress");
+            MimeMapping.AddMimeMapping(".zip", "application/x-zip-compressed");
+            MimeMapping.AddMimeMapping(".*", "application/octet-stream");
+        }
+    }
+}
diff --git a/Web/package.json b/Web/package.json
index 02b1808..1604acb 100644
--- a/Web/package.json
+++ b/Web/package.json
@@ -19,6 +19,7 @@
     "less-loader": "4.1.0",
     "lodash": "^4.17.21",
     "nprogress": "^0.2.0",
+    "photoswipe": "^4.1.3",
     "swiper": "^6.5.0",
     "vue": "^2.6.11",
     "vue-awesome-swiper": "^4.1.1",
diff --git a/Web/public/index.html b/Web/public/index.html
index 1bb8f06..8e7c4be 100644
--- a/Web/public/index.html
+++ b/Web/public/index.html
@@ -6,7 +6,7 @@
     <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 src="https://webapi.amap.com/maps?v=1.4.15&key=c6a4832b8afbde0361b36630a3fc5bdc"></script>
+	<script src="https://webapi.amap.com/maps?v=2.0&key=c6a4832b8afbde0361b36630a3fc5bdc"></script>
   </head>
   <body>
     <noscript>
diff --git a/Web/src/assets/style/app.less b/Web/src/assets/style/app.less
index 3049253..4950e95 100644
--- a/Web/src/assets/style/app.less
+++ b/Web/src/assets/style/app.less
@@ -27,10 +27,13 @@
 @import './lib/select.less';
 @import './lib/checkbox.less';
 @import './lib/cascader.less';
+@import './lib/upload.less';
 @import './lib/dropdown.less';
 @import './lib/modal.less';
 @import './lib/tree-layout.less';
 @import './lib/authority-view.less';
 @import './lib/icon-selector.less';
+@import './lib/anchor.less';
 @import './theme/primary.less';
 // @import './lib/font-weight.less';
+@import './public.less';
diff --git a/Web/src/assets/style/lib/anchor.less b/Web/src/assets/style/lib/anchor.less
new file mode 100644
index 0000000..4c05379
--- /dev/null
+++ b/Web/src/assets/style/lib/anchor.less
@@ -0,0 +1,11 @@
+@import (reference) '~@/assets/style/extend.less';
+.ant-anchor-ink-ball {
+  width: 2px;
+  height: 28px;
+
+  transform: translate(-50%, -10px);
+
+  border: 0;
+  border-radius: 0;
+  background-color: @primary-color;
+}
diff --git a/Web/src/assets/style/lib/form.less b/Web/src/assets/style/lib/form.less
index e47c00b..213b919 100644
--- a/Web/src/assets/style/lib/form.less
+++ b/Web/src/assets/style/lib/form.less
@@ -282,3 +282,49 @@
     }
   }
 }
+.ant-form-item-required {
+  @keyframes required-animation {
+    // 0% {
+    //   transform: translateX(-5px) scale(.1);
+
+    //   opacity: .1;
+    // }
+
+    // 15% {
+    //   transform: translateX(-3px) scale(.5);
+
+    //   opacity: .5;
+    // }
+
+    // 30%,
+    // 70% {
+    //   transform: translateX(0) scale(1);
+
+    //   opacity: 1;
+    // }
+
+    // 85% {
+    //   transform: translateX(-3px) scale(.5);
+
+    //   opacity: .5;
+    // }
+
+    // 100% {
+    //   transform: translateX(-5px) scale(.1);
+
+    //   opacity: .1;
+    // }
+  }
+  &::before {
+    margin-top: -4px;
+
+    content: '';
+    animation: required-animation 2s linear infinite;
+    vertical-align: middle;
+
+    border-top: 4px solid transparent;
+    border-bottom: 4px solid transparent;
+    border-left: 5px solid #f5222d;
+    background: none;
+  }
+}
diff --git a/Web/src/assets/style/lib/input.less b/Web/src/assets/style/lib/input.less
index 2220f7c..33e48c3 100644
--- a/Web/src/assets/style/lib/input.less
+++ b/Web/src/assets/style/lib/input.less
@@ -1,6 +1,10 @@
 @import (reference) '~@/assets/style/extend.less';
+/* input前缀有2个字符的 */
 .yo-input-prefix-2 {
   .ant-input:not(:first-child) {
     padding-left: 45px;
   }
 }
+.yo-addon {
+  padding: 0 @padding-xs;
+}
diff --git a/Web/src/assets/style/lib/upload.less b/Web/src/assets/style/lib/upload.less
new file mode 100644
index 0000000..a320f3f
--- /dev/null
+++ b/Web/src/assets/style/lib/upload.less
@@ -0,0 +1,29 @@
+@import (reference) '~@/assets/style/extend.less';
+.ant-upload-list-text {
+  display: flex;
+  flex-wrap: wrap;
+  .ant-upload-list-item {
+    height: auto;
+    margin-right: @padding-xs;
+  }
+  .ant-upload-list-item-info {
+    position: relative;
+
+    padding: @padding-xxs @padding-xs;
+
+    border: @border-width-base @border-style-base @border-color-split;
+    .anticon-paper-clip {
+      top: 7.5px;
+    }
+    >span {
+      display: flex;
+    }
+  }
+  .ant-upload-list-item-card-actions {
+    position: relative;
+
+    margin-left: @padding-xs;
+
+    white-space: nowrap;
+  }
+}
diff --git a/Web/src/assets/style/lib/width-height.less b/Web/src/assets/style/lib/width-height.less
index b226176..6746e2e 100644
--- a/Web/src/assets/style/lib/width-height.less
+++ b/Web/src/assets/style/lib/width-height.less
@@ -1,25 +1,26 @@
 @import (reference) '~@/assets/style/extend.less';
-.w-100-p {
-  width: 100%;
-}
-.w-100 {
-  width: 100px;
-}
-.w-200 {
-  width: 200px;
-}
-.w-300 {
-  width: 300px;
-}
-.h-100-p {
-  height: 100%;
-}
-.h-100 {
-  height: 100px;
-}
-.h-200 {
-  height: 200px;
-}
-.h-300 {
-  height: 300px;
+
+.width-height (@i) when (@i <=20) {
+
+  @n : @i * 50;
+
+  .w-@{n} {
+    width: @n * 1px;
+  }
+
+  .h-@{n} {
+    height: @n * 1px;
+  }
+
+  .w-@{n}-p {
+    width: @n * 1%;
+  }
+
+  .h-@{n}-p {
+    height: @n * 1%;
+  }
+
+  .width-height(@i + 1);
 }
+
+.width-height(0);
\ No newline at end of file
diff --git a/Web/src/assets/style/public.less b/Web/src/assets/style/public.less
new file mode 100644
index 0000000..c726287
--- /dev/null
+++ b/Web/src/assets/style/public.less
@@ -0,0 +1,32 @@
+@import (reference) './extend.less';
+.yo-map {
+  &-container {
+    position: relative;
+
+    padding: @padding-sm;
+
+    border: @border-width-base @border-style-base @border-color-split;
+    border-radius: @border-radius-base;
+    background-color: @white;
+    .amap-icon {
+      img {
+        width: 25px;
+      }
+    }
+  }
+  &--search {
+    position: absolute;
+    top: @padding-md;
+    left: @padding-md;
+    z-index: 20;
+
+    width: 25%;
+    min-width: 300px;
+    padding: @padding-xxs @padding-sm;
+
+    background: fade(@black, 20%);
+    box-shadow: @box-shadow-base;
+
+    backdrop-filter: blur(5px);
+  }
+}
diff --git a/Web/src/common/api/requests/sys/dictManage.js b/Web/src/common/api/requests/sys/dictManage.js
index e0d1269..c3c2c93 100644
--- a/Web/src/common/api/requests/sys/dictManage.js
+++ b/Web/src/common/api/requests/sys/dictManage.js
@@ -19,6 +19,10 @@ export default {
      * 获取字典类型下所有字典，举例，返回格式为：[{code:"M",value:"男"},{code:"F",value:"女"}]
      */
     sysDictTypeDropDown: ['/sysDictType/dropDown', 'get'],
+    /**
+     * 获取字典类型下所有的字典,可批量获取
+     */
+    sysDictTypeDropDowns: ['/sysDictType/dropDowns', 'get'],
     /**
      * 获取所有字典，启动时加入缓存使用
      */
diff --git a/Web/src/components/photoSwipe/index.vue b/Web/src/components/photoSwipe/index.vue
new file mode 100644
index 0000000..9189cb4
--- /dev/null
+++ b/Web/src/components/photoSwipe/index.vue
@@ -0,0 +1,56 @@
+<template>
+  <div aria-hidden="true" class="pswp" role="dialog" tabindex="-1">
+    <div class="pswp__bg"></div>
+    <div class="pswp__scroll-wrap">
+      <div class="pswp__container">
+        <div class="pswp__item"></div>
+        <div class="pswp__item"></div>
+        <div class="pswp__item"></div>
+      </div>
+      <div class="pswp__ui pswp__ui--hidden">
+        <div class="pswp__top-bar">
+          <div class="pswp__counter"></div>
+          <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
+          <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
+          <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
+          <div class="pswp__preloader">
+            <div class="pswp__preloader__icn">
+              <div class="pswp__preloader__cut">
+                <div class="pswp__preloader__donut"></div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
+          <div class="pswp__share-tooltip"></div>
+        </div>
+        <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button>
+        <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button>
+        <div class="pswp__caption">
+          <div class="pswp__caption__center"></div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import 'photoswipe/dist/photoswipe.css';
+import 'photoswipe/dist/default-skin/default-skin.css';
+import PhotoSwipe from 'photoswipe';
+import PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default';
+
+const defaultOptions = {
+  index: 0,
+  bgOpacity: 0.75,
+};
+
+export default {
+  methods: {
+    initPhotoSwipe(items = [], options) {
+      const pswpElement = this.$el;
+      const gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, Object.assign(defaultOptions, options));
+      gallery.init();
+    },
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/components/yoImage/index.js b/Web/src/components/yoImage/index.js
index b6fa7ea..a65e344 100644
--- a/Web/src/components/yoImage/index.js
+++ b/Web/src/components/yoImage/index.js
@@ -1,4 +1,4 @@
-import { ArrayBufferToBase64 } from '@/util/file'
+import { PreviewFileBase64 } from '@/util/file'
 
 export default {
     props: {
@@ -31,11 +31,9 @@ export default {
 
     methods: {
 
-        getSrc() {
-            return this.$api.sysFileInfoPreview({ id: this.id }).then(async ({ data }) => {
-                const base64 = await ArrayBufferToBase64(data)
-                return base64
-            })
+        async getSrc() {
+            const base64 = await PreviewFileBase64(this.id)
+            return base64
         }
 
     },
diff --git a/Web/src/pages/business/house/houseInfo/form/base/aspect.vue b/Web/src/pages/business/house/houseInfo/form/base/aspect.vue
new file mode 100644
index 0000000..1a4e0cb
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/aspect.vue
@@ -0,0 +1,217 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-form-model-item class="ant-row-flex" label="外立面照片" prop="facadePhoto">
+        <a-upload
+          :custom-request="onFileUpload"
+          :file-list="form.facadePhoto"
+          :preview-file="onPreviewFile"
+          @change="onFileChange"
+          @preview="onFilePreview"
+          list-type="picture-card"
+        >
+          <div>
+            <a-icon type="plus" />
+            <div class="ant-upload-text">外立面照片</div>
+          </div>
+        </a-upload>
+      </a-form-model-item>
+    </a-spin>
+    <PhotoSwipe ref="photo-swipe" />
+  </a-form-model>
+</template>
+<script>
+import { PreviewFile, BlobToBase64 } from '@/util/file';
+
+import PhotoSwipe from '@/components/photoSwipe';
+
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+  facadePhoto: [],
+};
+
+export default {
+  components: {
+    PhotoSwipe,
+  },
+
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+        facadePhoto: [{ required: true, message: '请上传外立面照片' }],
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+      previewVisible: false,
+      previewImage: '',
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    async onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record,
+        facadePhoto = [];
+
+      // 从数据中的文件id转换成uploader所需的格式
+      if (record) {
+        const fileList = record.facadePhoto.split(',');
+        for (let i = 0; i < fileList.length; i++) {
+          const file = await PreviewFile(fileList[i]);
+          const base64 = await BlobToBase64(file);
+          facadePhoto.push({
+            uid: fileList[i],
+            response: fileList[i], // 用于和新上传的文件一同回传
+            name: file.name,
+            url: base64,
+            status: 'done',
+          });
+        }
+      }
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+        facadePhoto,
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+            record.facadePhoto = record.facadePhoto.map((p) => p.response).join(',');
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+
+    /* 上传图片相关 Begin */
+    onFileChange({ fileList }) {
+      this.form.facadePhoto = fileList;
+    },
+    onPreviewFile(file) {
+      return new Promise((resolve) => {
+        const base64 = BlobToBase64(file);
+        resolve(base64);
+      });
+    },
+    async onFileUpload({ file, onProgress, onSuccess, onError }) {
+      onProgress();
+      const fd = new FormData();
+      fd.append('file', file);
+      try {
+        const { data: fileId } = await this.$api.sysFileInfoUpload(fd);
+        onSuccess(fileId);
+      } catch {
+        onError();
+      }
+    },
+    onFilePreview(file) {
+      const items = [];
+      for (let i = 0; i < this.form.facadePhoto.length; i++) {
+        const _file = this.form.facadePhoto[i];
+        const img = new Image();
+        const src = _file.url || _file.thumbUrl;
+        img.src = src;
+        items.push({
+          src,
+          w: img.naturalWidth,
+          h: img.naturalHeight,
+        });
+      }
+      this.$refs['photo-swipe'].initPhotoSwipe(items, {
+        index: this.form.facadePhoto.indexOf(file),
+      });
+    },
+    /* 上传图片相关 End */
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/attachments.vue b/Web/src/pages/business/house/houseInfo/form/base/attachments.vue
new file mode 100644
index 0000000..6cac21a
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/attachments.vue
@@ -0,0 +1,252 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-row type="flex">
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="立项文件" prop="anEntryDocument">
+            <a-upload
+              :custom-request="onFileUpload"
+              :file-list="form.anEntryDocument"
+              :showUploadList=" { showRemoveIcon: true, showDownloadIcon: true }"
+              @change="(data) => onFileChange(data, 'anEntryDocument')"
+              @download="onFileDownload"
+            >
+              <a-button icon="upload" type="dashed">上传立项文件</a-button>
+            </a-upload>
+          </a-form-model-item>
+        </a-col>
+
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="规划许可" prop="planningPermission">
+            <a-upload
+              :custom-request="onFileUpload"
+              :file-list="form.planningPermission"
+              :showUploadList=" { showRemoveIcon: true, showDownloadIcon: true }"
+              @change="(data) => onFileChange(data, 'planningPermission')"
+              @download="onFileDownload"
+            >
+              <a-button icon="upload" type="dashed">上传规划许可</a-button>
+            </a-upload>
+          </a-form-model-item>
+        </a-col>
+
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="竣工验收备案" prop="completionRecord">
+            <a-upload
+              :custom-request="onFileUpload"
+              :file-list="form.completionRecord"
+              :showUploadList=" { showRemoveIcon: true, showDownloadIcon: true }"
+              @change="(data) => onFileChange(data, 'completionRecord')"
+              @download="onFileDownload"
+            >
+              <a-button icon="upload" type="dashed">上传竣工验收备案</a-button>
+            </a-upload>
+          </a-form-model-item>
+        </a-col>
+
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="监理文件" prop="monitor">
+            <a-upload
+              :custom-request="onFileUpload"
+              :file-list="form.monitor"
+              :showUploadList=" { showRemoveIcon: true, showDownloadIcon: true }"
+              @change="(data) => onFileChange(data, 'monitor')"
+              @download="onFileDownload"
+            >
+              <a-button icon="upload" type="dashed">上传监理文件</a-button>
+            </a-upload>
+          </a-form-model-item>
+        </a-col>
+
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="鉴定报告" prop="identificationReport">
+            <a-upload
+              :custom-request="onFileUpload"
+              :file-list="form.identificationReport"
+              :showUploadList=" { showRemoveIcon: true, showDownloadIcon: true }"
+              @change="(data) => onFileChange(data, 'identificationReport')"
+              @download="onFileDownload"
+            >
+              <a-button icon="upload" type="dashed">上传鉴定报告</a-button>
+            </a-upload>
+          </a-form-model-item>
+        </a-col>
+
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="其他附件" prop="otherDocument">
+            <a-upload
+              :custom-request="onFileUpload"
+              :file-list="form.otherDocument"
+              :showUploadList=" { showRemoveIcon: true, showDownloadIcon: true }"
+              @change="(data) => onFileChange(data, 'otherDocument')"
+              @download="onFileDownload"
+            >
+              <a-button icon="upload" type="dashed">上传其他附件</a-button>
+            </a-upload>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+import { GetFileName } from '@/util/file';
+
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+  anEntryDocument: [],
+  planningPermission: [],
+  completionRecord: [],
+  monitor: [],
+  identificationReport: [],
+  otherDocument: [],
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+
+    /* 上传下载文件相关 Begin */
+    async onFileUpload({ file, onProgress, onSuccess, onError }) {
+      onProgress();
+      const fd = new FormData();
+      fd.append('file', file);
+      try {
+        const { data: fileId } = await this.$api.sysFileInfoUpload(fd);
+        onSuccess(fileId);
+      } catch {
+        onError();
+      }
+    },
+    onFileChange({ fileList }, key) {
+      this.form[key] = fileList;
+    },
+    onFileDownload(file) {
+      this.$api.sysFileInfoDownload({ id: file.response }).then((res) => {
+        const url = window.URL.createObjectURL(res.data);
+        const fileName = GetFileName(res.headers['content-disposition']);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = fileName;
+        a.click();
+        window.URL.revokeObjectURL(url);
+        a.remove();
+      });
+    },
+    /* 上传图片相关 End */
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/building.vue b/Web/src/pages/business/house/houseInfo/form/base/building.vue
index dbe0c88..57376e7 100644
--- a/Web/src/pages/business/house/houseInfo/form/base/building.vue
+++ b/Web/src/pages/business/house/houseInfo/form/base/building.vue
@@ -1,8 +1,8 @@
 <template>
   <!-- 
-    普通编辑窗体
-    v 1.2
-    2021-04-30
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
     Lufthafen
   -->
   <a-form-model
@@ -47,192 +47,445 @@
         </a-col>
         <a-col :span="12">
           <a-form-model-item class="ant-row-flex" label="项目名称" prop="projectName">
-            <a-input v-model="form.projectName" />
+            <a-input placeholder="请输入项目名称" v-model="form.projectName" />
           </a-form-model-item>
         </a-col>
         <a-col :span="12">
-          <a-form-model-item class="ant-row-flex" label="幢名称">
-            <a-input />
+          <a-form-model-item class="ant-row-flex" label="幢名称" prop="buildingName">
+            <a-input placeholder="请输入幢名称" v-model="form.buildingName" />
           </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="坐落地址">
-            <a-input />
+          <a-form-model-item class="ant-row-flex" label="坐落地址" prop="address">
+            <a-input placeholder="请输入坐落地址" v-model="form.address" />
           </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="坐落地址">
-            <a-input />
+          <a-form-model-item class="ant-row-flex" label="土地性质" prop="natureLand">
+            <a-radio-group button-style="solid" v-model="form.natureLand">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.natureLand"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
           </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="地理坐标">
+          <a-form-model-item class="ant-row-flex mb-none" label="地理坐标">
             <a-row :gutter="16">
               <a-col :span="12">
-                <a-form-model-item class="mb-none">
-                  <a-input class="yo-input-prefix-2" disabled placeholder="请在地图上选择坐标" prefix="经度" />
+                <a-form-model-item prop="axisX">
+                  <a-input
+                    class="yo-input-prefix-2"
+                    disabled
+                    placeholder="请在地图上选择坐标"
+                    prefix="经度"
+                    v-model="form.axisX"
+                  />
                 </a-form-model-item>
               </a-col>
               <a-col :span="12">
-                <a-form-model-item class="mb-none">
-                  <a-input class="yo-input-prefix-2" disabled placeholder="请在地图上选择坐标" prefix="纬度" />
+                <a-form-model-item prop="axisY">
+                  <a-input
+                    class="yo-input-prefix-2"
+                    disabled
+                    placeholder="请在地图上选择坐标"
+                    prefix="纬度"
+                    v-model="form.axisY"
+                  />
                 </a-form-model-item>
               </a-col>
             </a-row>
           </a-form-model-item>
           <a-form-model-item :colon="false" :label="true" class="ant-row-flex">
             <div class="yo-map-container">
-              缺搜索
-              <div class="h-300" ref="map"></div>
+              <div class="yo-map--search">
+                <a-input-search allow-clear placeholder="请输入关键字" ref="map-search" />
+              </div>
+              <div class="h-500" ref="map"></div>
             </div>
           </a-form-model-item>
         </a-col>
         <a-col :span="12">
-          <a-form-model-item class="ant-row-flex" label="结构类型">
-            <a-select>
+          <a-form-model-item class="ant-row-flex" label="结构类型" prop="structureType">
+            <a-select placeholder="请选择结构类型" v-model="form.structureType">
               <a-select-option
                 :key="item.code"
                 :value="item.code"
-                v-for="item in houseStructureType"
+                v-for="item in codes.houseStructureType"
               >{{ item.value }}</a-select-option>
             </a-select>
           </a-form-model-item>
         </a-col>
         <a-col :span="12">
-          <a-form-model-item class="ant-row-flex" label="抗震等级">
-            <a-radio-group button-style="solid">
+          <a-form-model-item class="ant-row-flex" label="抗震等级" prop="aseismicGrade">
+            <a-radio-group button-style="solid" v-model="form.aseismicGrade">
               <a-radio-button
                 :key="item.code"
                 :value="item.code"
-                v-for="item in houseSseismicGrade"
+                v-for="item in codes.houseSseismicGrade"
               >{{ item.value }}</a-radio-button>
             </a-radio-group>
           </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="基础情况">
-            <a-radio-group button-style="solid">
+          <a-form-model-item class="ant-row-flex" label="基础情况" prop="baseInfo">
+            <a-radio-group button-style="solid" v-model="form.baseInfo">
               <a-radio-button
                 :key="item.code"
                 :value="item.code"
-                v-for="item in houseBaseInfo"
+                v-for="item in codes.houseBaseInfo"
               >{{ item.value }}</a-radio-button>
             </a-radio-group>
           </a-form-model-item>
         </a-col>
         <a-col :span="24">
           <a-form-model-item class="ant-row-flex" label="外墙保温材料" prop="insulationMaterial">
-            <a-checkbox-group button-style="solid" v-model="form.insulationMaterial">
+            <a-checkbox-group v-model="form.insulationMaterial">
               <a-checkbox
                 :key="item.code"
                 :value="item.code"
-                v-for="item in houseInsulationMaterial"
+                class="mb-xs"
+                v-for="item in codes.houseInsulationMaterial"
               >{{ item.value }}</a-checkbox>
               <a-input
+                class="w-300"
                 placeholder="请输入其他外墙保温材料"
-                v-if="form.insulationMaterial && form.insulationMaterial.indexOf(houseInsulationMaterial[houseInsulationMaterial.length - 1].code) >= 0"
+                v-if="form.insulationMaterial && form.insulationMaterial.indexOf(codes.houseInsulationMaterial[codes.houseInsulationMaterial.length - 1].code) >= 0"
                 v-model="form.keepWarmMaterialRest"
               />
             </a-checkbox-group>
           </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="外墙墙体材料"></a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="外墙墙体材料" prop="wallMaterial">
+            <a-checkbox-group v-model="form.wallMaterial">
+              <a-checkbox
+                :key="item.code"
+                :value="item.code"
+                class="mb-xs"
+                v-for="item in codes.houseWallMaterial"
+              >{{ item.value }}</a-checkbox>
+            </a-checkbox-group>
+          </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="外墙外保温材料防火等级"></a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="外墙外保温材料防火等级" prop="fireproofGrade">
+            <a-radio-group button-style="solid" v-model="form.fireproofGrade">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseFireproofGrade"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="建筑幕墙"></a-form-model-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-model-item class="ant-row-flex" label="外墙面砖"></a-form-model-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-model-item class="ant-row-flex" label="外墙粉刷"></a-form-model-item>
-        </a-col>
-        <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="外墙涂料"></a-form-model-item>
-        </a-col>
-        <a-col :span="24">
-          <a-form-model-item class="ant-row-flex" label="电梯"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="竣工日期">
-            <a-date-picker class="w-100-p" />
+          <a-form-model-item class="ant-row-flex" label="建筑幕墙" prop="curtainWall">
+            <a-radio-group button-style="solid" v-model="form.curtainWall">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseBuildingCurtainWall"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
           </a-form-model-item>
         </a-col>
         <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="设计使用年限">
-            <a-input-number :formatter="(number) => `${number}年`" :min="0" class="w-100-p" />
+          <a-form-model-item class="ant-row-flex" label="有无外墙面砖" prop="exteriorWallTile">
+            <a-switch v-model="form.exteriorWallTile" />
           </a-form-model-item>
         </a-col>
         <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="总建筑面积"></a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="有无外墙粉刷" prop="whiteWash">
+            <a-switch v-model="form.whiteWash" />
+          </a-form-model-item>
         </a-col>
         <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="总户数"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="房屋单元数"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="每层每单元户数"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="建设单位"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="建设单位联系人"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="建设单位联系电话"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="设计单位"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="施工单位"></a-form-model-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-model-item class="ant-row-flex" label="监理单位"></a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="有无外墙涂料" prop="coating">
+            <a-switch v-model="form.coating" />
+          </a-form-model-item>
         </a-col>
         <a-col :span="24">
-          <fieldset>
-            <legend>建筑层数</legend>
-            <a-row :gutter="16">
-              <a-col :span="8">
-                <a-form-model-item class="ant-row-flex" label="地上">
-                  <a-input-number
-                    :formatter="(number) => `${number}层`"
-                    :min="0"
-                    :step="1"
-                    class="w-100-p"
-                  />
-                </a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="电梯" prop="elevator">
+            <a-radio-group button-style="solid" v-model="form.elevator">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseElevator"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="竣工日期" prop="completedDate">
+            <a-date-picker class="w-100-p" placeholder="请选择竣工日期" v-model="form.completedDate" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="设计使用年限" prop="useYear">
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  :min="0"
+                  class="w-100-p"
+                  placeholder="请输入设计使用年限"
+                  v-model="form.useYear"
+                />
               </a-col>
-              <a-col :span="8">
-                <a-form-model-item class="ant-row-flex" label="地下">
-                  <a-input-number
-                    :formatter="(number) => `${number}层`"
-                    :min="0"
-                    :step="1"
-                    class="w-100-p"
-                  />
-                </a-form-model-item>
-              </a-col>
-              <a-col :span="8">
-                <a-form-model-item class="ant-row-flex" label="总共">
-                  <a-input-number
-                    :formatter="(number) => `${number}层`"
-                    class="w-100-p"
-                    disabled
-                    suffix="层"
-                  />
-                </a-form-model-item>
+              <a-col>
+                <span class="yo-addon">年</span>
               </a-col>
             </a-row>
-          </fieldset>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="总建筑面积" prop="areaCount">
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  :min="0"
+                  class="w-100-p"
+                  placeholder="请输入总建筑面积"
+                  v-model="form.areaCount"
+                />
+              </a-col>
+              <a-col>
+                <span class="yo-addon">m²</span>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="总户数" prop="households">
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  :min="0"
+                  :step="1"
+                  class="w-100-p"
+                  placeholder="请输入总户数"
+                  v-model="form.households"
+                />
+              </a-col>
+              <a-col>
+                <span class="yo-addon">户</span>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="房屋单元数" prop="units">
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  :min="0"
+                  :step="1"
+                  class="w-100-p"
+                  placeholder="请输入房屋单元数"
+                  v-model="form.units"
+                />
+              </a-col>
+              <a-col>
+                <span class="yo-addon">单元</span>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="每层每单元户数" prop="unitHouseholds">
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  :min="0"
+                  :step="1"
+                  class="w-100-p"
+                  placeholder="请输入每层每单元户数"
+                  v-model="form.unitHouseholds"
+                />
+              </a-col>
+              <a-col>
+                <span class="yo-addon">户</span>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="建设单位" prop="buildingUnit">
+            <a-input placeholder="请输入建设单位" v-model="form.buildingUnit" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="建设单位联系人" prop="buildingUnitUser">
+            <a-input placeholder="请输入建设单位联系人" v-model="form.buildingUnitUser" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="建设单位联系电话" prop="buildingUnitTel">
+            <a-input placeholder="请输入建设单位联系电话" v-model="form.buildingUnitTel" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="设计单位" prop="desingerUnit">
+            <a-input placeholder="请输入设计单位" v-model="form.desingerUnit" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="施工单位" prop="constructionUnit">
+            <a-input placeholder="请输入施工单位" v-model="form.constructionUnit" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="8">
+          <a-form-model-item class="ant-row-flex" label="监理单位" prop="monitorUnit">
+            <a-input placeholder="请输入监理单位" v-model="form.monitorUnit" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex ant-form-inline mb-none" label="建筑层数">
+            <a-form-model-item :colon="false" class="ant-row-flex" label="地上" prop="landLevelCount">
+              <a-row type="flex">
+                <a-col flex="1">
+                  <a-input-number
+                    :min="0"
+                    :step="1"
+                    class="w-100-p"
+                    placeholder="请输入地上层"
+                    v-model="form.landLevelCount"
+                  />
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层</span>
+                </a-col>
+              </a-row>
+            </a-form-model-item>
+            <a-form-model-item
+              :colon="false"
+              class="ant-row-flex"
+              label="地下"
+              prop="undergroundLevelCount"
+            >
+              <a-row type="flex">
+                <a-col flex="1">
+                  <a-input-number
+                    :min="0"
+                    :step="1"
+                    class="w-100-p"
+                    placeholder="请输入地下层"
+                    v-model="form.undergroundLevelCount"
+                  />
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层</span>
+                </a-col>
+              </a-row>
+            </a-form-model-item>
+            <a-form-model-item :colon="false" class="ant-row-flex" label="总共" prop="levelCount">
+              <a-row type="flex">
+                <a-col flex="1">
+                  <a-input-number
+                    :min="0"
+                    :step="1"
+                    class="w-100-p"
+                    disabled
+                    placeholder="请输入总层数"
+                    v-model="form.levelCount"
+                  />
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层</span>
+                </a-col>
+              </a-row>
+            </a-form-model-item>
+          </a-form-model-item>
+          <a-form-model-item class="ant-row-flex ant-form-inline" label="其中">
+            <a-form-model-item class="ant-row-flex">
+              <a-row type="flex">
+                <a-col>
+                  <span class="yo-addon">地上第</span>
+                </a-col>
+                <a-col flex="1">
+                  <a-form-model-item class="mr-none" prop="landBusiness1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.landBusiness1"
+                    />
+                  </a-form-model-item>
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层，至</span>
+                </a-col>
+                <a-col flex="1">
+                  <a-form-model-item class="mr-none" prop="landBusiness2">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.landBusiness2"
+                    />
+                  </a-form-model-item>
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层为商业用房</span>
+                </a-col>
+              </a-row>
+            </a-form-model-item>
+            <a-form-model-item class="ant-row-flex">
+              <a-row type="flex">
+                <a-col>
+                  <span class="yo-addon">地上</span>
+                </a-col>
+                <a-col flex="1">
+                  <a-form-model-item class="mr-none" prop="landBikeshed1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.landBikeshed1"
+                    />
+                  </a-form-model-item>
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层为车棚层</span>
+                </a-col>
+              </a-row>
+            </a-form-model-item>
+            <a-form-model-item class="ant-row-flex">
+              <a-row type="flex">
+                <a-col>
+                  <span class="yo-addon">地上第</span>
+                </a-col>
+                <a-col flex="1">
+                  <a-form-model-item class="mr-none" prop="landResidence1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.landResidence1"
+                    />
+                  </a-form-model-item>
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层，至</span>
+                </a-col>
+                <a-col flex="1">
+                  <a-form-model-item class="mr-none" prop="landResidence2">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.landResidence2"
+                    />
+                  </a-form-model-item>
+                </a-col>
+                <a-col>
+                  <span class="yo-addon">层为住宅</span>
+                </a-col>
+              </a-row>
+            </a-form-model-item>
+          </a-form-model-item>
         </a-col>
       </a-row>
     </a-spin>
@@ -242,6 +495,9 @@
 /* 表单内容默认值 */
 const defaultForm = {
   /* ... */
+  address: '',
+  axisX: '',
+  axisY: '',
 };
 
 export default {
@@ -258,6 +514,29 @@ export default {
       rules: {
         /* ... */
         projectName: [{ required: true, message: '请输入项目名称' }],
+        buildingName: [{ required: true, message: '请输入幢名称' }],
+        address: [{ required: true, message: '请输入坐落地址' }],
+        natureLand: [{ required: true, message: '请选择土地性质' }],
+        axisX: [{ required: true, message: '请在地图上选择坐标' }],
+        axisY: [{ required: true, message: '请在地图上选择坐标' }],
+        structureType: [{ required: true, message: '请选择结构类型' }],
+        aseismicGrade: [{ required: true, message: '请选择抗震等级' }],
+        baseInfo: [{ required: true, message: '请选择基础情况' }],
+        curtainWall: [{ required: true, message: '请选择建筑幕墙' }],
+        elevator: [{ required: true, message: '请选择电梯' }],
+        completedDate: [{ required: true, message: '请选择竣工日期' }],
+        useYear: [{ required: true, message: '请输入设计使用年限' }],
+        areaCount: [{ required: true, message: '请输入总建筑面积' }],
+        households: [{ required: true, message: '请输入总户数' }],
+        units: [{ required: true, message: '请输入房屋单元数' }],
+        unitHouseholds: [{ required: true, message: '请输入每层每单元户数' }],
+        buildingUnit: [{ required: true, message: '请输入建设单位' }],
+        buildingUnitUser: [{ required: true, message: '请输入建设单位联系人' }],
+        buildingUnitTel: [{ required: true, message: '请输入建设单位联系电话' }],
+        desingerUnit: [{ required: true, message: '请输入设计单位' }],
+        constructionUnit: [{ required: true, message: '请输入施工单位' }],
+        landLevelCount: [{ required: true, message: '请输入地上层' }],
+        undergroundLevelCount: [{ required: true, message: '请输入地下层' }],
       },
 
       /** 加载异步数据状态 */
@@ -265,17 +544,24 @@ export default {
 
       /** 其他成员属性 */
       /* ... */
-      houseStructureType: [],
-      houseSseismicGrade: [],
-      houseBaseInfo: [],
-      houseInsulationMaterial: [],
+      codes: {
+        natureLand: [],
+        houseStructureType: [],
+        houseSseismicGrade: [],
+        houseBaseInfo: [],
+        houseInsulationMaterial: [],
+        houseWallMaterial: [],
+        houseFireproofGrade: [],
+        houseBuildingCurtainWall: [],
+        houseElevator: [],
+      },
     };
   },
 
   watch: {
     'form.insulationMaterial'(value, oldValue) {
       // 选中"无"时全不选,反之取消选择"无"
-      if ((value.indexOf('0') >= 0 && oldValue.indexOf('0') === -1) || !value.length) {
+      if (value.indexOf('0') >= 0 && oldValue.indexOf('0') === -1) {
         this.form.insulationMaterial = ['0'];
       } else if (value.indexOf('0') >= 0 && value.length > 1) {
         this.form.insulationMaterial.splice(value.indexOf('0'), 1);
@@ -289,7 +575,11 @@ export default {
   },
 
   mounted() {
-    new AMap.Map(this.$refs.map);
+    this.onMapInit();
+  },
+
+  beforeDestroy() {
+    this.map.destroy();
   },
 
   methods: {
@@ -355,7 +645,7 @@ export default {
      * 必要方法
      * 加载当前表单中所需要的异步数据
      */
-    async onInit(params) {
+    async onInit() {
       this.loading = true;
       /** 可以在这里await获取一些异步数据 */
       /* ... */
@@ -367,26 +657,118 @@ export default {
     /* ... */
     onLoadCodes() {
       return this.$api
-        .$queue([
-          this.$api.sysDictTypeDropDownAwait({ code: 'dic_house_structure_type' }),
-          this.$api.sysDictTypeDropDownAwait({ code: 'dic_house_aseismic_grade' }),
-          this.$api.sysDictTypeDropDownAwait({ code: 'dic_house_base_info' }),
-          this.$api.sysDictTypeDropDownAwait({ code: 'dic_house_insulation_material' }),
-        ])
+        .sysDictTypeDropDowns({
+          code: [
+            'dic_nature_land',
+            'dic_house_structure_type',
+            'dic_house_aseismic_grade',
+            'dic_house_base_info',
+            'dic_house_insulation_material',
+            'dic_house_wall_material',
+            'dic_house_fireproof_grade',
+            'dic_house_building_curtain_wall',
+            'dic_house_elevator',
+          ],
+        })
         .then(
-          ([
-            dic_house_structure_type,
-            dic_house_aseismic_grade,
-            dic_house_base_info,
-            dic_house_insulation_material,
-          ]) => {
-            this.houseStructureType = dic_house_structure_type.data;
-            this.houseSseismicGrade = dic_house_aseismic_grade.data;
-            this.houseBaseInfo = dic_house_base_info.data;
-            this.houseInsulationMaterial = dic_house_insulation_material.data;
+          ({
+            data: {
+              dic_nature_land,
+              dic_house_structure_type,
+              dic_house_aseismic_grade,
+              dic_house_base_info,
+              dic_house_insulation_material,
+              dic_house_wall_material,
+              dic_house_fireproof_grade,
+              dic_house_building_curtain_wall,
+              dic_house_elevator,
+            },
+          }) => {
+            this.codes = {
+              natureLand: dic_nature_land,
+              houseStructureType: dic_house_structure_type,
+              houseSseismicGrade: dic_house_aseismic_grade,
+              houseBaseInfo: dic_house_base_info,
+              houseInsulationMaterial: dic_house_insulation_material,
+              houseWallMaterial: dic_house_wall_material,
+              houseFireproofGrade: dic_house_fireproof_grade,
+              houseBuildingCurtainWall: dic_house_building_curtain_wall,
+              houseElevator: dic_house_elevator,
+            };
           }
         );
     },
+
+    onMapInit() {
+      const city = '3302';
+
+      // 挂载map到this,但不监听
+      this.map = new AMap.Map(this.$refs.map, { city });
+
+      this.map.plugin(['AMap.Geocoder', 'AMap.AutoComplete', 'AMap.PlaceSearch'], () => {
+        const geocoder = new AMap.Geocoder({ city });
+
+        let marker;
+        const setMarker = (position) => {
+          if (marker) {
+            marker.setPosition(position);
+          } else {
+            marker = new AMap.Marker({
+              map: this.map,
+              icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+              position,
+              offset: new AMap.Pixel(-13, -30),
+            });
+          }
+
+          geocoder.getAddress(position, (status, result) => {
+            if (status === 'complete' && result.regeocode) {
+              this.onSetPosition(result.regeocode.formattedAddress, position);
+            } else {
+              console.error('根据经纬度查询地址失败');
+            }
+          });
+        };
+
+        this.map.on('click', (e) => {
+          setMarker(e.lnglat);
+        });
+
+        const auto = new AMap.AutoComplete({
+          input: this.$refs['map-search'].$el.querySelector('input'),
+          city,
+          citylimit: true,
+        });
+
+        const placeSearch = new AMap.PlaceSearch({
+          city,
+          pageSize: 1,
+        });
+
+        auto.on('select', ({ poi: { name: keywords, adcode } }) => {
+          this.map.clearMap();
+          marker = null;
+          placeSearch.search(keywords, (status, result) => {
+            const {
+              poiList: { pois },
+            } = result;
+            pois.forEach((p) => {
+              setMarker(p.location);
+            });
+
+            this.map.setFitView();
+          });
+        });
+      });
+    },
+
+    onSetPosition(address, { lng, lat }) {
+      Object.assign(this.form, {
+        address,
+        axisX: lng.toString(),
+        axisY: lat.toString(),
+      });
+    },
   },
 };
 </script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/drawing.vue b/Web/src/pages/business/house/houseInfo/form/base/drawing.vue
new file mode 100644
index 0000000..6bf62fc
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/drawing.vue
@@ -0,0 +1,162 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-form-model-item class="ant-row-flex" label="图纸资料存档处" prop="drawingMaterial">
+        <a-checkbox-group v-model="form.drawingMaterial">
+          <a-checkbox
+            :key="item.code"
+            :value="item.code"
+            class="mb-xs"
+            v-for="item in codes.houseStorageOfDrawings"
+          >{{ item.value }}</a-checkbox>
+          <a-input
+            class="w-300"
+            placeholder="请输入其他图纸资料存档处"
+            v-if="form.drawingMaterial && form.drawingMaterial.indexOf(codes.houseStorageOfDrawings[codes.houseStorageOfDrawings.length - 1].code) >= 0"
+            v-model="form.drawingMaterialText"
+          />
+        </a-checkbox-group>
+      </a-form-model-item>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+        drawingMaterial: [{ required: true, message: '请选择图纸资料存档处' }],
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+      codes: {
+        houseStorageOfDrawings: [],
+      },
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      await this.onLoadCodes();
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+    onLoadCodes() {
+      return this.$api
+        .sysDictTypeDropDowns({
+          code: ['dic_house_storage_of_drawings'],
+        })
+        .then(({ data: { dic_house_storage_of_drawings } }) => {
+          this.codes = {
+            houseStorageOfDrawings: dic_house_storage_of_drawings,
+          };
+        });
+    },
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/fund.vue b/Web/src/pages/business/house/houseInfo/form/base/fund.vue
new file mode 100644
index 0000000..3ff6de4
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/fund.vue
@@ -0,0 +1,202 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-row type="flex">
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="物业保证金" prop="propertySecurity">
+            <a-switch v-model="form.propertySecurity" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item
+            class="ant-row-flex"
+            label="物业保证金余额"
+            prop="propertySecurity1"
+            v-if="form.propertySecurity"
+          >
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  class="w-100-p"
+                  placeholder="请输入物业保证金余额"
+                  v-model="form.propertySecurity1"
+                />
+              </a-col>
+              <a-col>
+                <span class="yo-addon">元</span>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="物业专项维修资金" prop="maintenanceFunds">
+            <a-switch v-model="form.maintenanceFunds" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item
+            class="ant-row-flex"
+            label="物业管理专项资金余额"
+            prop="maintenanceFunds1"
+            v-if="form.maintenanceFunds"
+          >
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  class="w-100-p"
+                  placeholder="请输入物业管理专项资金余额"
+                  v-model="form.maintenanceFunds1"
+                />
+              </a-col>
+              <a-col>
+                <span class="yo-addon">元</span>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="房改房维修资金余额" prop="maintenanceFunds2">
+            <a-row type="flex">
+              <a-col flex="1">
+                <a-input-number
+                  class="w-100-p"
+                  placeholder="请输入房改房维修资金余额"
+                  v-model="form.maintenanceFunds2"
+                />
+              </a-col>
+              <a-col>
+                <span class="yo-addon">元</span>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+        propertySecurity1: [{ required: true, message: '请输入物业保证金余额' }],
+        maintenanceFunds1: [{ required: true, message: '请输入物业管理专项资金余额' }],
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/identification.vue b/Web/src/pages/business/house/houseInfo/form/base/identification.vue
new file mode 100644
index 0000000..2ae2e08
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/identification.vue
@@ -0,0 +1,206 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-row type="flex">
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="鉴定等级" prop="identification">
+            <a-radio-group button-style="solid" v-model="form.identification">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseIdentification"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="治理改造措施" prop="government">
+            <a-radio-group button-style="solid" v-model="form.government">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseGovernment"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="是否已通过解危鉴定" prop="fireproofGrade">
+            <a-switch />
+          </a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="房屋使用状态" prop="houseStatus">
+            <a-radio-group button-style="solid" v-model="form.houseStatus">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseStatus"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+          <a-form-model-item class="ant-row-flex" label="综合等级" prop="comprehensiveGrade">
+            <a-radio-group button-style="solid" v-model="form.comprehensiveGrade">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseComprehensiveGrade"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+        identification: [{ required: true, message: '请选择鉴定等级' }],
+        houseStatus: [{ required: true, message: '请选择房屋使用状态' }],
+        comprehensiveGrade: [{ required: true, message: '请选择综合等级' }],
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+      codes: {
+        houseIdentification: [],
+        houseGovernment: [],
+        houseStatus: [],
+        houseComprehensiveGrade: [],
+      },
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      await this.onLoadCodes();
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+    onLoadCodes() {
+      return this.$api
+        .sysDictTypeDropDowns({
+          code: [
+            'dic_house_identification',
+            'dic_house_government',
+            'dic_house_status',
+            'dic_house_comprehensive_grade',
+          ],
+        })
+        .then(
+          ({
+            data: { dic_house_identification, dic_house_government, dic_house_status, dic_house_comprehensive_grade },
+          }) => {
+            this.codes = {
+              houseIdentification: dic_house_identification,
+              houseGovernment: dic_house_government,
+              houseStatus: dic_house_status,
+              houseComprehensiveGrade: dic_house_comprehensive_grade,
+            };
+          }
+        );
+    },
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/index.vue b/Web/src/pages/business/house/houseInfo/form/base/index.vue
index fcd9e5d..0830302 100644
--- a/Web/src/pages/business/house/houseInfo/form/base/index.vue
+++ b/Web/src/pages/business/house/houseInfo/form/base/index.vue
@@ -51,7 +51,40 @@ export default {
           component: () => import('./building'),
         },
         {
-          title: '第二部分',
+          title: '权属情况',
+          component: () => import('./ownership'),
+        },
+        {
+          title: '管理情况',
+          component: () => import('./manager'),
+        },
+        {
+          title: '调查情况',
+          component: () => import('./investigation'),
+        },
+        {
+          title: '鉴定治理',
+          component: () => import('./identification'),
+        },
+        {
+          title: '图纸资料存档处',
+          component: () => import('./drawing'),
+        },
+        {
+          title: '相关附件资料',
+          component: () => import('./attachments'),
+        },
+        {
+          title: '物业维修资金',
+          component: () => import('./fund'),
+        },
+        {
+          title: '建筑概貌',
+          component: () => import('./aspect'),
+        },
+        {
+          title: '调查单位',
+          component: () => import('./unit'),
         },
       ],
     };
@@ -63,7 +96,8 @@ export default {
      */
     onGetData() {
       return new Promise(async (resolve, reject) => {
-        let formData = {};
+        let formData = {},
+          flag = true;
         for (let i = 0; i < this.$refs.forms.length; i++) {
           const form = this.$refs.forms[i];
           try {
@@ -73,11 +107,14 @@ export default {
               ...data,
             };
           } catch {
-            reject();
-            return;
+            flag = false;
           }
         }
-        resolve(formData);
+        if (flag) {
+          resolve(formData);
+        } else {
+          reject();
+        }
       });
     },
   },
diff --git a/Web/src/pages/business/house/houseInfo/form/base/investigation.vue b/Web/src/pages/business/house/houseInfo/form/base/investigation.vue
new file mode 100644
index 0000000..9f0f65b
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/investigation.vue
@@ -0,0 +1,317 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-row type="flex">
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="房屋场地" prop="houseSite">
+            <a-checkbox-group v-model="form.houseSite">
+              <a-checkbox
+                :key="item.code"
+                :value="item.code"
+                class="mb-xs"
+                v-for="item in codes.houseHouseSite"
+              >{{ item.value }}</a-checkbox>
+            </a-checkbox-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="相邻施工" prop="adjacentConstruction">
+            <a-checkbox-group v-model="form.adjacentConstruction">
+              <a-checkbox
+                :key="item.code"
+                :value="item.code"
+                class="mb-xs"
+                v-for="item in codes.houseAdjacentConstruction"
+              >{{ item.value }}</a-checkbox>
+            </a-checkbox-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="化学侵蚀" prop="chemicalErosion">
+            <a-checkbox-group v-model="form.chemicalErosion">
+              <a-checkbox
+                :key="item.code"
+                :value="item.code"
+                class="mb-xs"
+                v-for="item in codes.houseChemicalErosion"
+              >{{ item.value }}</a-checkbox>
+            </a-checkbox-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="结构拆改" prop="structuralDismantling">
+            <a-radio-group button-style="solid" v-model="form.structuralDismantling">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseStructuralDismantling"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="加层改造" prop="addingLayer">
+            <a-radio-group button-style="solid" v-model="form.addingLayer">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.houseAddingLayer"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="修缮加固" prop="repairAndReinforce">
+            <a-checkbox-group v-model="form.repairAndReinforce">
+              <a-checkbox
+                :key="item.code"
+                :value="item.code"
+                class="mb-xs"
+                v-for="item in codes.houseRepairAndReinforce"
+              >{{ item.value }}</a-checkbox>
+            </a-checkbox-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="历史灾害" prop="historicalCalamity">
+            <a-checkbox-group v-model="form.historicalCalamity">
+              <a-checkbox
+                :key="item.code"
+                :value="item.code"
+                class="mb-xs"
+                v-for="item in codes.houseHistoricalCalamity"
+              >{{ item.value }}</a-checkbox>
+            </a-checkbox-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="使用功能变更" prop="functionalChange">
+            <a-checkbox-group v-model="form.functionalChange">
+              <a-checkbox
+                :key="item.code"
+                :value="item.code"
+                class="mb-xs"
+                v-for="item in codes.houseFunctionalChange"
+              >{{ item.value }}</a-checkbox>
+            </a-checkbox-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="其他调查内容">
+            <a-textarea auto-size placeholder="请输入其他调查内容" />
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+        houseSite: [{ required: true, message: '请选择房屋场地' }],
+        adjacentConstruction: [{ required: true, message: '请选择相邻施工' }],
+        chemicalErosion: [{ required: true, message: '请选择化学侵蚀' }],
+        structuralDismantling: [{ required: true, message: '请选择结构拆改' }],
+        addingLayer: [{ required: true, message: '请选择加层改造' }],
+        repairAndReinforce: [{ required: true, message: '请选择修缮加固' }],
+        historicalCalamity: [{ required: true, message: '请选择历史灾害' }],
+        functionalChange: [{ required: true, message: '请选择使用功能变更' }],
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+      codes: {
+        houseHouseSite: [],
+        houseAdjacentConstruction: [],
+        houseChemicalErosion: [],
+        houseStructuralDismantling: [],
+        houseAddingLayer: [],
+        houseRepairAndReinforce: [],
+        houseHistoricalCalamity: [],
+        houseFunctionalChange: [],
+      },
+    };
+  },
+
+  watch: {
+    'form.adjacentConstruction'(value, oldValue) {
+      this.onCheckedNone(value, oldValue, 'adjacentConstruction');
+    },
+    'form.chemicalErosion'(value, oldValue) {
+      this.onCheckedNone(value, oldValue, 'chemicalErosion');
+    },
+    'form.repairAndReinforce'(value, oldValue) {
+      this.onCheckedNone(value, oldValue, 'repairAndReinforce');
+    },
+    'form.historicalCalamity'(value, oldValue) {
+      this.onCheckedNone(value, oldValue, 'historicalCalamity');
+    },
+    'form.functionalChange'(value, oldValue) {
+      this.onCheckedNone(value, oldValue, 'functionalChange');
+    },
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      await this.onLoadCodes();
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+    onLoadCodes() {
+      return this.$api
+        .sysDictTypeDropDowns({
+          code: [
+            'dic_house_house_site',
+            'dic_house_adjacent_construction',
+            'dic_house_chemical_erosion',
+            'dic_house_structural_dismantling',
+            'dic_house_adding_layer',
+            'dic_house_repair_and_reinforce',
+            'dic_house_historical_calamity',
+            'dic_house_functional_change',
+          ],
+        })
+        .then(
+          ({
+            data: {
+              dic_house_house_site,
+              dic_house_adjacent_construction,
+              dic_house_chemical_erosion,
+              dic_house_structural_dismantling,
+              dic_house_adding_layer,
+              dic_house_repair_and_reinforce,
+              dic_house_historical_calamity,
+              dic_house_functional_change,
+            },
+          }) => {
+            this.codes = {
+              houseHouseSite: dic_house_house_site,
+              houseAdjacentConstruction: dic_house_adjacent_construction,
+              houseChemicalErosion: dic_house_chemical_erosion,
+              houseStructuralDismantling: dic_house_structural_dismantling,
+              houseAddingLayer: dic_house_adding_layer,
+              houseRepairAndReinforce: dic_house_repair_and_reinforce,
+              houseHistoricalCalamity: dic_house_historical_calamity,
+              houseFunctionalChange: dic_house_functional_change,
+            };
+          }
+        );
+    },
+
+    onCheckedNone(value, oldValue, key) {
+      // 选中"无"时全不选,反之取消选择"无"
+      if (value.indexOf('0') >= 0 && oldValue.indexOf('0') === -1) {
+        this.form[key] = ['0'];
+      } else if (value.indexOf('0') >= 0 && value.length > 1) {
+        this.form[key].splice(value.indexOf('0'), 1);
+      }
+    },
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/manager.vue b/Web/src/pages/business/house/houseInfo/form/base/manager.vue
new file mode 100644
index 0000000..83dd03c
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/manager.vue
@@ -0,0 +1,167 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-row type="flex">
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="物业（经营）单位" prop="wuYeUnit">
+            <a-input placeholder="请输入物业（经营）单位" v-model="form.wuYeUnit" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="负责人" prop="wuYeUnitUser">
+            <a-input placeholder="请输入负责人" v-model="form.wuYeUnitUser" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="电话" prop="wuYeUnitUserTel">
+            <a-input placeholder="请输入负责人电话" v-model="form.wuYeUnitUserTel" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="属地管理社区负责人" prop="manageAreaUser">
+            <a-input placeholder="请输入属地管理社区负责人" v-model="form.manageAreaUser" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="电话" prop="manageAreaUserTel">
+            <a-input placeholder="请输入属地管理社区负责人电话" v-model="form.manageAreaUserTel" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="属地管理社区联系人" prop="manageAreaConent">
+            <a-input placeholder="请输入属地管理社区联系人" v-model="form.manageAreaConent" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="电话" prop="manageAreaConentTel">
+            <a-input placeholder="请输入属地管理社区联系人电话" v-model="form.manageAreaConentTel" />
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/ownership.vue b/Web/src/pages/business/house/houseInfo/form/base/ownership.vue
new file mode 100644
index 0000000..9d7c46e
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/ownership.vue
@@ -0,0 +1,340 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-row type="flex">
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="产权性质" prop="propertyRights">
+            <a-radio-group button-style="solid" v-model="form.propertyRights">
+              <a-radio-button
+                :key="item.code"
+                :value="item.code"
+                v-for="item in codes.housePropertyRights"
+              >{{ item.value }}</a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex ant-form-inline" label="房屋包含的住宅总套数">
+            <section>
+              <a-form-model-item
+                :colon="false"
+                class="ant-row-flex"
+                label="直管公房"
+                prop="straightHouseCount"
+              >
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.straightHouseCount"
+                    />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+              <a-form-model-item
+                :colon="false"
+                class="ant-row-flex"
+                label="单位自管公房"
+                prop="selfHouseCount"
+              >
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.selfHouseCount"
+                    />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+              <a-form-model-item :colon="false" class="ant-row-flex" label="其他" props="otherCount">
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number :min="0" :step="1" placeholder="几" v-model="form.otherCount" />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+            </section>
+            <section>
+              <a-form-model-item
+                :colon="false"
+                class="ant-row-flex"
+                label="商品房"
+                prop="businessCount"
+              >
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.businessCount"
+                    />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+              <a-form-model-item
+                :colon="false"
+                class="ant-row-flex"
+                label="房改房"
+                prop="changeHouseCount"
+              >
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.changeHouseCount"
+                    />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+              <a-form-model-item
+                :colon="false"
+                class="ant-row-flex"
+                label="拆迁安置房"
+                prop="resettlementHouseCount"
+              >
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.resettlementHouseCount"
+                    />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+            </section>
+            <section>
+              <a-form-model-item
+                :colon="false"
+                class="ant-row-flex"
+                label="私房"
+                prop="privateHouseCount"
+              >
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number
+                      :min="0"
+                      :step="1"
+                      placeholder="几"
+                      v-model="form.privateHouseCount"
+                    />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+              <a-form-model-item :colon="false" class="ant-row-flex" label="总共" prop="houseCount">
+                <a-row type="flex">
+                  <a-col flex="1">
+                    <a-input-number :min="0" :step="1" placeholder="几" v-model="form.houseCount" />
+                  </a-col>
+                  <a-col>
+                    <span class="yo-addon">套</span>
+                  </a-col>
+                </a-row>
+              </a-form-model-item>
+            </section>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item class="ant-row-flex" label="产权单位" prop="propertyUnit">
+            <a-input placeholder="请输入产权单位" v-model="form.propertyUnit" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="负责人" prop="propertyUnitUser">
+            <a-input placeholder="请输入负责人" v-model="form.propertyUnitUser" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="负责人电话" prop="propertyUnitUserTel">
+            <a-input placeholder="请输入负责人电话" v-model="form.propertyUnitUserTel" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="联系人" prop="propertyUnitConent">
+            <a-input placeholder="请输入联系人" v-model="form.propertyUnitConent" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="联系人电话" prop="propertyUnitConentTel">
+            <a-input placeholder="请输入联系人电话" v-model="form.propertyUnitConentTel" />
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+        propertyRights: [{ required: true, message: '请选择产权性质' }],
+        straightHouseCount: [{ required: true, message: '请输入直管公房' }],
+        selfHouseCount: [{ required: true, message: '请输入单位自管公房' }],
+        otherCount: [{ required: true, message: '请输入其他' }],
+        businessCount: [{ required: true, message: '请输入商品房' }],
+        changeHouseCount: [{ required: true, message: '请输入房改房' }],
+        resettlementHouseCount: [{ required: true, message: '请输入拆迁安置房' }],
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+      codes: {
+        housePropertyRights: [],
+      },
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      await this.onLoadCodes();
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+    onLoadCodes() {
+      return this.$api
+        .sysDictTypeDropDowns({
+          code: ['dic_house_property_rights'],
+        })
+        .then(({ data: { dic_house_property_rights } }) => {
+          this.codes = {
+            housePropertyRights: dic_house_property_rights,
+          };
+        });
+    },
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/base/unit.vue b/Web/src/pages/business/house/houseInfo/form/base/unit.vue
new file mode 100644
index 0000000..7f975bf
--- /dev/null
+++ b/Web/src/pages/business/house/houseInfo/form/base/unit.vue
@@ -0,0 +1,156 @@
+<template>
+  <!-- 
+    整页表单的分片表单
+    v 1.0
+    2021-05-12
+    Lufthafen
+  -->
+  <a-form-model
+    :label-col="labelCol"
+    :model="form"
+    :rules="rules"
+    :wrapper-col="wrapperCol"
+    ref="form"
+  >
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" spin type="loading" />
+      <!-- 表单控件 -->
+      <!-- ... -->
+      <a-row type="flex">
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="调查登记机构" prop="aegistrationAgency">
+            <a-input placeholder="请输入登记机构" v-model="form.aegistrationAgency" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="调查人员" prop="aegistrationUser">
+            <a-input placeholder="请输入调查人员" v-model="form.aegistrationUser" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="审核人员" prop="checkUser">
+            <a-input placeholder="请输入审核人员" v-model="form.checkUser" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item class="ant-row-flex" label="主管部门" prop="competentDepartment">
+            <a-input placeholder="请输入主管部门" v-model="form.competentDepartment" />
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-spin>
+  </a-form-model>
+</template>
+<script>
+/* 表单内容默认值 */
+const defaultForm = {
+  /* ... */
+};
+
+export default {
+  props: ['param'],
+
+  data() {
+    return {
+      labelCol: { flex: '150px' },
+      wrapperCol: { flex: '1' },
+
+      /** 表单数据 */
+      form: {},
+      /** 验证格式 */
+      rules: {
+        /* ... */
+        aegistrationAgency: [{ required: true, message: '请输入调查登记机构' }],
+        aegistrationUser: [{ required: true, message: '请输入调查人员' }],
+        checkUser: [{ required: true, message: '请输入审核人员' }],
+        competentDepartment: [{ required: true, message: '请输入主管部门' }],
+      },
+
+      /** 加载异步数据状态 */
+      loading: false,
+
+      /** 其他成员属性 */
+      /* ... */
+    };
+  },
+
+  async created() {
+    await this.onInit();
+    this.onFillData();
+  },
+
+  methods: {
+    /**
+     * 必要的方法
+     * 在打开编辑页时允许填充数据
+     */
+    onFillData() {
+      /** 将默认数据覆盖到form */
+      const record = this.param && this.param.record;
+
+      this.form = this.$_.cloneDeep({
+        ...defaultForm,
+        ...record,
+        /** 在此处添加其他默认数据转换 */
+        /* ... */
+      });
+    },
+
+    /**
+     * 必要方法
+     * 验证表单并获取表单数据
+     */
+    onGetData() {
+      return new Promise((reslove, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            const record = this.$_.cloneDeep(this.form);
+
+            /** 验证通过后可以对数据进行转换得到想要提交的格式 */
+            /* ... */
+
+            reslove(record);
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口进行保存时调用表单验证
+     */
+    onValidate(callback) {
+      this.$refs.form.validate(callback);
+    },
+
+    /**
+     * 必要的方法
+     * 在外部窗口关闭或重置时对表单验证进行初始化
+     */
+    onResetFields() {
+      setTimeout(() => {
+        this.$refs.form.resetFields();
+
+        /** 在这里可以初始化当前组件中其他属性 */
+        /* ... */
+      }, 300);
+    },
+
+    /**
+     * 必要方法
+     * 加载当前表单中所需要的异步数据
+     */
+    async onInit() {
+      this.loading = true;
+      /** 可以在这里await获取一些异步数据 */
+      /* ... */
+      this.loading = false;
+    },
+
+    /** 当前组件的其他方法 */
+    /* ... */
+  },
+};
+</script>
\ No newline at end of file
diff --git a/Web/src/pages/business/house/houseInfo/form/index.vue b/Web/src/pages/business/house/houseInfo/form/index.vue
index 2729df5..74ce2f8 100644
--- a/Web/src/pages/business/house/houseInfo/form/index.vue
+++ b/Web/src/pages/business/house/houseInfo/form/index.vue
@@ -7,7 +7,6 @@
           <span>
             <!-- 可以在工具栏中增加其他控件(只能在一行内) -->
             <!-- ... -->
-            <a-input />
           </span>
           <span>
             <a-button @click="closeContentWindow()">取消</a-button>
diff --git a/Web/src/util/file/index.js b/Web/src/util/file/index.js
index e6678ce..4432f9d 100644
--- a/Web/src/util/file/index.js
+++ b/Web/src/util/file/index.js
@@ -1,3 +1,5 @@
+import app from '@/main'
+
 const _getFileTypeByBase64 = (base64) => {
     let arr = base64.split(','),
         fileType = arr[0].match(/:(.*?);/)[1]
@@ -82,4 +84,42 @@ export const BlobToBase64 = async (blob) => {
             resolve(e.target.result)
         }
     })
+}
+
+export const GetFileName = (disposition) => {
+    const dispositionSplit = disposition.split(';')
+    const fileName = decodeURI(
+        dispositionSplit[1].split('=')[1],
+        dispositionSplit[2].match(/(?<=\*=).*?(?=\')/)[0]
+    )
+    return fileName
+}
+
+export const PreviewFileResponse = async (id) => {
+    return app.$api.sysFileInfoPreview({ id }).then((res) => {
+        return res
+    })
+}
+
+export const PreviewFileArrayBuffer = async (id) => {
+    const response = await PreviewFileResponse(id)
+    return response.data
+}
+
+export const PreviewFileBase64 = async (id) => {
+    const file = await PreviewFile(id)
+    if (!file) return
+    const base64 = await BlobToBase64(file)
+    return base64
+}
+
+export const PreviewFile = async (id) => {
+    const response = await PreviewFileResponse(id)
+    const arrayBuffer = response.data
+    const blob = ArrayBufferToBlob(arrayBuffer)
+    const disposition = response.headers['content-disposition']
+    if (!disposition) return
+    const fileName = GetFileName(disposition)
+    const file = BlobToFile(blob, fileName, response.headers['content-type'])
+    return file
 }
\ No newline at end of file
diff --git a/Web/yarn.lock b/Web/yarn.lock
index 0760d99..eb91bce 100644
--- a/Web/yarn.lock
+++ b/Web/yarn.lock
@@ -6438,6 +6438,11 @@ performance-now@^2.1.0:
   resolved "https://registry.npm.taobao.org/performance-now/download/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
   integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=
 
+photoswipe@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.npm.taobao.org/photoswipe/download/photoswipe-4.1.3.tgz#59f49494eeb9ddab5888d03392926a19bc197550"
+  integrity sha1-WfSUlO653atYiNAzkpJqGbwZdVA=
+
 picomatch@^2.0.4, picomatch@^2.0.5, picomatch@^2.2.1:
   version "2.2.2"
   resolved "https://registry.npm.taobao.org/picomatch/download/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"