Uslugi (Begin)

Diagr.md

+### Создание плана
+
+> Предусловие: список КО приходит в требуемом формате и всеми необходимыми данными
+1. Выбор оптического средства (ОС)
+2. Выбор типа плана для работы ОС
+3. Выбор актуального списка космических объектов (КО) для создания плана
+4. Установка оптических ограничений для ОС
+5. Создание плана 
+6. Отправка созданного плана на ОС
+7. Выполнение плана средством
+8. Получние результатов
+
+> Постусловие: результаты измерений отправляются в систему обработки и верификации информации

src/components/Amenites.vue

@@ -2,7 +2,7 @@
 	<div id="amenites">
 			<div class="section">
 				<div class="content">
-
+					
 				</div>
 				<div id="footer_amenites">
 					<div>
@@ -24,7 +24,7 @@ export default {
 		text:[
 			{
 				Russia:{
-					
+					Title:'Основные характеристики модульных оптико-электронных комплексов',
 				},
 				English:{
 					

src/components/Equipment.vue

@@ -2,7 +2,21 @@
 	<div id="equipment">
 			<div class="section">
 				<div class="content">
-
+					<div id="mini_menu">
+						<div class="block_menu" v-for="item, index in page.menu">
+							<div @click="menu(item.value)" class="name"><div class="text">{{item.name}}</div></div>
+							<transition name="block-menu-fade">
+								<div v-show="item.value == tab" ref="infoBox" class="list_block">
+									<div v-for="tit in item.parts" class="list_menu">
+										{{tit.name}}
+									</div>
+								</div>
+							</transition>
+						</div>
+					</div>
+				</div>
+				<div id="name_page">
+					<p>{{page.Title}}</p>
 				</div>
 				<div id="footer_equipment">
 					<div>
@@ -19,12 +33,87 @@ export default {
   data () {
     return {
 	  msg: 'Equipment',
+	  tab: '',
 	  page: [],
 		select: '',
 		text:[
 			{
 				Russia:{
-					
+					Title:'Основные характеристики модульных оптико-электронных комплексов',
+					menu: [
+						{
+							name: 'Модульные оптико-электронные средства',
+							value: 'OK',
+							parts: [
+								{
+									name: 'МОЭК 19',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'МОЭК 25',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'МОЭК 30',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'МОЭК 40',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'МОЭК 50',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'МОЭК 60',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+							]
+						},
+						{
+							name: 'Фотоприемные устройства',
+							value: 'PD',
+							parts: [
+								{
+									name: 'ФПУ 4040',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'ФПУ 6060',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+							]
+						},
+						{
+							name: 'Опорно-поворотные устройства',
+							value: 'RD',
+							parts: [
+								{
+									name: 'АВМ 700',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'АВМ 820',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+							]
+						},
+						{
+							name: 'Павильоны укрытия',
+							value: 'PU',
+							parts: [
+								{
+									name: 'ПУ 30П',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+								{
+									name: 'ПУ 30М',
+									cont: 'OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO'
+								},
+							]
+						},
+					]
 				},
 				English:{
 					
@@ -34,17 +123,40 @@ export default {
 		],
     }
   },
+  created: function () {
+	this.Before();
+	// alert(this.page.menu);
+  },
   methods: {
-    Before: function () {
-      this.mobile = this.$parent.mobile
-    },
-    move: function (section) {
-      this.$refs.fullpage.api.moveTo(section)
-	},
-	SelectLang (lang) {
-		this.page = this.text[0][lang];
-	}
-  }
+		Before: function () {
+			this.mobile = this.$parent.mobile;
+			this.select = this.$parent.select;
+			this.page = this.text[0][this.select];
+		},
+		menu: function(index){
+			// alert(index);
+			if(this.tab == index){
+				this.tab = ''
+			}else{
+				this.tab = index;
+			}
+		},
+		SelectLang (lang) {
+			this.page = this.text[0][lang];
+		},
+		// matchHeight() {
+		// 	var heightString = this.$refs.infoBox[0].clientHeight + 'px';
+		// 	this.tab = '';
+        //     console.log(heightString);
+        // }
+  },
+//   mounted() {
+// 	for(var i in this.page.menu){
+// 		this.tab = this.page.menu[i].value;
+// 		console.log(this.page.menu[i].value);
+// 	}
+// 	this.matchHeight();
+//   }
 }
 </script>
 
@@ -59,10 +171,73 @@ export default {
 #equipment .section{
 	background-image: url('../source/Background.png') ;
 	background-size: cover;
-}
-#equipment .content{
 	height: 100vh;
 }
+#equipment #mini_menu{
+	margin: 0 auto;
+	padding-top: 12%;
+}
+#equipment #mini_menu{
+	color: red;
+}
+#equipment #mini_menu .block_menu{
+	display: inline-table;
+	width: calc(60%/4);
+	padding: 7px;
+	margin: 0 auto;
+	position: relative;
+}
+#equipment #mini_menu .block_menu div.name{
+	width: 100%;
+	padding-right: 15%;
+	padding-left: 15%;
+	background-color: rgba(2, 55, 76, 0.72);
+	display: flex;
+	min-height: 6em;
+	border: 1px none solid;
+	/* display: inline-block; */
+}
+#equipment #mini_menu .block_menu div.name div.text{
+	color: White;
+	text-transform: uppercase;
+    vertical-align: middle;
+	margin: auto;
+
+}
+#equipment #mini_menu .list_block{
+	margin: 0;
+	width: 100%;
+	margin-top: 10px;
+	position: absolute;
+}
+#equipment #mini_menu .list_menu{
+	color: white;
+	display: inline-table;
+	width: calc(100%/2);
+	background-color: rgba(2, 55, 76, 0.72);
+	padding: 0.4em;
+	border: 1px black solid;
+}
+
+
+
+
+#equipment .section #name_page{
+	width: 40%;
+	margin: 0 auto;
+	margin-top: 6%;
+}
+#equipment .section #name_page p{
+	color: white;
+	font-size: 1rem;
+	text-transform: uppercase;
+}
+
+
+
+
+
+
 #equipment #footer_equipment{
 	position: absolute;
 	bottom: 0;
@@ -86,4 +261,29 @@ export default {
 	margin-left: 10px;
 	margin-right: 10px;
 }
+
+
+
+
+
+
+
+
+
+
+
+
+
+/* Animate */
+.block-menu-fade-enter-active {
+  transition: all .3s ease;
+}
+.block-menu-fade-leave-active {
+  transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
+}
+.block-menu-fade-enter, .block-menu-fade-leave-to
+/* .block-menu-fade-leave-active до версии 2.1.8 */ {
+  transform: translateX(10px);
+  opacity: 0;
+}
 </style>

src/components/Main.vue

@@ -315,9 +315,10 @@
 }
 /* INFO */
 #main #info{
-	height: 100%;
+	height: 100vh;
 	margin: 0 auto;
-	margin-top: 14%;
+	margin-top: 7%;
+	padding-top: 5%;
 }
 #main #info_block{
 	margin: 0 auto;
@@ -386,8 +387,9 @@
 /* BASE */
 #main #base{
 	margin: 0 auto;
-	padding-top: 10%;
-	min-height: 90%;
+	margin-top: 5%;
+	padding-top: 12%;
+	min-height: 80%;
 }
 #main #base_block{
 	margin: 0 auto;