模板

src/router/routes/routes-file-two.js

@@ -149,6 +149,15 @@ const systemSettingsRoutes = {
             isAlone: true,
             src: require('@/assets/nav/ic_setting_top@2x.png')
           },
+          {
+            path: '/systemSettings/queryTemplate/queryTemplateedit',
+            name: 'queryTemplateadd',
+            component: () => import('@/views/systemSettings/views/queryTemplate/queryTemplateedit'),
+            meta: { title: '编辑查询模板' },
+            hidden: false,
+            isAlone: true,
+            src: require('@/assets/nav/ic_setting_top@2x.png')
+          },
           ]
         },
       ]

src/styles/index.scss

@@ -156,6 +156,9 @@ li {
 .r25 {
   margin-right: 12px;
 }
+.b24{
+  margin-bottom: 24px;
+}
 .b32{
   margin-bottom: 32;
 }

src/views/systemSettings/views/queryTemplate/queryTemplate.vue

@@ -77,124 +77,13 @@
         </div>
       </div>
     </Dialog>
-    <!--新增机场信息弹框-->
-    <Dialog :flag="addFlag" @close="closeForm" v-if="addFlag">
-      <div class="airportInfoDialog dialog-public-background">
-        <div class="flx">新增分类信息</div>
-        <div class="content">
-          <el-form
-            :model="ruleForm"
-            :rules="rules"
-            ref="ruleForms"
-            label-width="100px"
-            class="demo-ruleForm"
-          >
-            <el-form-item label="分类名称" prop="name">
-              <el-input
-                size="medium"
-                placeholder="请输入分类名称（必填）"
-                v-model="ruleForm.name"
-              ></el-input>
-            </el-form-item>
-            <el-form-item label="分类标识符" prop="fullName">
-              <el-input
-                size="medium"
-                placeholder="请输入分类标识符（必填）"
-                v-model="ruleForm.fullName"
-              ></el-input>
-            </el-form-item>
-            <el-form-item label="描述" prop="fullName">
-              <el-input
-                size="medium"
-                type="textarea"
-                maxlength="200"
-                rows="3"
-                resize="none"
-                :autosize="{ minRows: 3, maxRows: 3 }"
-                placeholder="请输入描述"
-                v-model="ruleForm.fullName"
-              ></el-input>
-            </el-form-item>
-          </el-form>
-        </div>
-        <div class="foot center t30">
-          <el-button
-            size="medium"
-            type="primary"
-            @click="addSubmit()"
-            class="r25 r26"
-            >提交</el-button
-          >
-          <el-button class="r26" size="medium" @click="resetForm()"
-            >取消</el-button
-          >
-        </div>
-      </div>
-    </Dialog>
-    <Dialog :flag="EditFlag" @close="closeForm" v-if="EditFlag">
-      <div class="airportInfoDialog dialog-public-background">
-        <div class="flx">编辑分类信息</div>
-        <div class="content">
-          <el-form
-            :model="EditForm"
-            :rules="rules"
-            ref="ruleFormall"
-            label-width="100px"
-            class="demo-ruleForm"
-          >
-            <el-form-item label="分类名称" prop="name">
-              <el-input
-                size="medium"
-                placeholder="请输入分类名称（必填）"
-                v-model="EditForm.name"
-              ></el-input>
-            </el-form-item>
-            <el-form-item label="分类标识符" prop="fullName">
-              <el-input
-                size="medium"
-                placeholder="请输入分类全称（必填）"
-                v-model="EditForm.fullName"
-              ></el-input>
-            </el-form-item>
-            <el-form-item label="描述" prop="fullName">
-              <el-input
-                size="medium"
-                type="textarea"
-                maxlength="200"
-                rows="3"
-                resize="none"
-                :autosize="{ minRows: 3, maxRows: 3 }"
-                placeholder="请输入描述"
-                v-model="ruleForm.fullName"
-              ></el-input>
-            </el-form-item>
-          </el-form>
-        </div>
-        <div class="foot center t30">
-          <el-button
-            size="medium"
-            type="primary"
-            @click="EditSubmit()"
-            class="r25 r26"
-            >提交</el-button
-          >
-          <el-button class="r26" size="medium" @click="resetForm()"
-            >取消</el-button
-          >
-        </div>
-      </div>
-    </Dialog>
   </div>
 </template>
 <script>
 import Search from "@/layout/components/Search/index.vue";
 import Dialog from "@/layout/components/Dialog/index.vue";
 import { findarrays } from "@/utils/validate";
-import {
-  AirlinesInquiry,
-  DelAirlines,
-  AddAirlines,
-} from "@/api/SystemSettings";
+import { AirlinesInquiry } from "@/api/SystemSettings";
 import { exceptiontype, exceptionadd, exceptiondel } from "@/api/acquisition";
 export default {
   name: "AirportInfo",
@@ -292,8 +181,9 @@ export default {
       this.modid = item;
       this.EditForm.name = item.typeName;
       this.EditForm.fullName = item.typeCode;
+      this.$router.push("/systemSettings/queryTemplate/queryTemplateedit");
       // this.EditForm.code = item.code2;
-      this.EditFlag = true;
+      // this.EditFlag = true;
     },
     async EditSubmit() {
       let arr = 0;

src/views/systemSettings/views/queryTemplate/queryTemplateadd.vue

@@ -1,17 +1,147 @@
 <template>
-  <div class="queryTemplate"></div>
+  <div class="queryTemplate">
+    <Search title="新增查询模板" :isSearch="false">
+      <button class="btnAner">测试</button>
+      <button class="btnAn">保存</button>
+    </Search>
+    <el-form
+      style="margin-top: 10px"
+      :inline="true"
+      :rules="infoRules"
+      :model="ruleForm"
+      label-width="auto"
+      ref="ruleForm"
+      class="demo-ruleForm"
+    >
+      <el-row :gutter="24" class="b24">
+        <el-col :span="5">
+          <el-form-item label="查询模板名称" prop="name">
+            <el-input
+              size="medium"
+              placeholder="暂无数据"
+              v-model="ruleForm.name"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="5">
+          <el-form-item label="查询协议" prop="agreement">
+            <el-select v-model="ruleForm.agreement" placeholder="暂无数据">
+              <el-option
+                v-for="item in options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="查询模板描述" prop="describe">
+            <el-input
+              size="medium"
+              placeholder="暂无数据"
+              v-model="ruleForm.describe"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item label="查询配置" prop="desc" style="margin-bottom: 24px">
+        <el-input
+          v-model="ruleForm.desc"
+          class="desc"
+          type="textarea"
+          resize="none"
+          :autosize="{ minRows: 4, maxRows: 4 }"
+          placeholder="描述内容···"
+          size="small"
+        />
+      </el-form-item>
+      <el-form-item label="查询语句" prop="desc">
+        <el-input
+          v-model="ruleForm.sentence"
+          class="desc"
+          type="textarea"
+          resize="none"
+          :autosize="{ minRows: 26, maxRows: 26 }"
+          placeholder="描述内容···"
+          size="small"
+        />
+      </el-form-item>
+    </el-form>
+  </div>
 </template>
 <script>
+import Search from "@/layout/components/Search/index.vue";
 export default {
   data() {
-    return {};
+    return {
+      ruleForm: {
+        name: "",
+        agreement: "",
+        describe: "",
+        desc: "",
+      },
+      options: [],
+      rules: {
+        name: [
+          { required: true, message: "请输入查询模板名称", trigger: "blur" },
+        ],
+        agreement: [
+          { required: true, message: "请输入查询协议", trigger: "blur" },
+        ],
+        agreement: [
+          { required: true, message: "请输入查询模板描述", trigger: "blur" },
+        ],
+        desc: [{ required: true, message: "请选查询配置", trigger: "change" }],
+        sentence: [
+          { required: true, message: "请选择查询语句", trigger: "change" },
+        ],
+      },
+    };
+  },
+  components: {
+    Search,
   },
 };
 </script>
 <style lang="scss" scoped>
 .queryTemplate {
+  padding: 20px 30px 0 24px;
   height: 87vh;
   background: #ffffff;
   border-radius: 4px;
+  .btnAner {
+    width: 64px;
+    height: 32px;
+    background: #ffffff;
+    border: 1px solid #9ebbf7;
+    border-radius: 4px;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: bold;
+    color: #2d67e3;
+    margin-right: 16px;
+  }
+  ::v-deep .el-form-item {
+    margin-bottom: 0px;
+    margin-right: 0px;
+  }
+  .b24 {
+    ::v-deep .el-input__inner {
+      height: 32px;
+    }
+  }
+  ::v-deep .el-form-item__content {
+    width: calc(100% - 96px);
+  }
+  ::v-deep .el-form-item {
+    width: 100%;
+  }
+  // .desc {
+  //   ::v-deep .el-input__inner {
+  //     height: 96px;
+  //   }
+  // }
 }
 </style>

src/views/systemSettings/views/queryTemplate/queryTemplateedit.vue

@@ -0,0 +1,147 @@
+<template>
+  <div class="queryTemplate">
+    <Search title="编辑查询模板" :isSearch="false">
+      <button class="btnAner">测试</button>
+      <button class="btnAn">保存</button>
+    </Search>
+    <el-form
+      style="margin-top: 10px"
+      :inline="true"
+      :rules="infoRules"
+      :model="ruleForm"
+      label-width="auto"
+      ref="ruleForm"
+      class="demo-ruleForm"
+    >
+      <el-row :gutter="24" class="b24">
+        <el-col :span="5">
+          <el-form-item label="查询模板名称" prop="name">
+            <el-input
+              size="medium"
+              placeholder="暂无数据"
+              v-model="ruleForm.name"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="5">
+          <el-form-item label="查询协议" prop="agreement">
+            <el-select v-model="ruleForm.agreement" placeholder="暂无数据">
+              <el-option
+                v-for="item in options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="查询模板描述" prop="describe">
+            <el-input
+              size="medium"
+              placeholder="暂无数据"
+              v-model="ruleForm.describe"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item label="查询配置" prop="desc" style="margin-bottom: 24px">
+        <el-input
+          v-model="ruleForm.desc"
+          class="desc"
+          type="textarea"
+          resize="none"
+          :autosize="{ minRows: 4, maxRows: 4 }"
+          placeholder="描述内容···"
+          size="small"
+        />
+      </el-form-item>
+      <el-form-item label="查询语句" prop="desc">
+        <el-input
+          v-model="ruleForm.sentence"
+          class="desc"
+          type="textarea"
+          resize="none"
+          :autosize="{ minRows: 26, maxRows: 26 }"
+          placeholder="描述内容···"
+          size="small"
+        />
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<script>
+import Search from "@/layout/components/Search/index.vue";
+export default {
+  data() {
+    return {
+      ruleForm: {
+        name: "",
+        agreement: "",
+        describe: "",
+        desc: "",
+      },
+      options: [],
+      rules: {
+        name: [
+          { required: true, message: "请输入查询模板名称", trigger: "blur" },
+        ],
+        agreement: [
+          { required: true, message: "请输入查询协议", trigger: "blur" },
+        ],
+        agreement: [
+          { required: true, message: "请输入查询模板描述", trigger: "blur" },
+        ],
+        desc: [{ required: true, message: "请选查询配置", trigger: "change" }],
+        sentence: [
+          { required: true, message: "请选择查询语句", trigger: "change" },
+        ],
+      },
+    };
+  },
+  components: {
+    Search,
+  },
+};
+</script>
+<style lang="scss" scoped>
+.queryTemplate {
+  padding: 20px 30px 0 24px;
+  height: 87vh;
+  background: #ffffff;
+  border-radius: 4px;
+  .btnAner {
+    width: 64px;
+    height: 32px;
+    background: #ffffff;
+    border: 1px solid #9ebbf7;
+    border-radius: 4px;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: bold;
+    color: #2d67e3;
+    margin-right: 16px;
+  }
+  ::v-deep .el-form-item {
+    margin-bottom: 0px;
+    margin-right: 0px;
+  }
+  .b24 {
+    ::v-deep .el-input__inner {
+      height: 32px;
+    }
+  }
+  ::v-deep .el-form-item__content {
+    width: calc(100% - 96px);
+  }
+  ::v-deep .el-form-item {
+    width: 100%;
+  }
+  // .desc {
+  //   ::v-deep .el-input__inner {
+  //     height: 96px;
+  //   }
+  // }
+}
+</style>