|
|
@@ -0,0 +1,353 @@
|
|
|
+<template>
|
|
|
+ <div class="airportInfo scroll-y">
|
|
|
+ <div class="wrap">
|
|
|
+ <Minheader :is-auth="true" :is-statuser="true" @addForm="addForm">
|
|
|
+ <template #header>
|
|
|
+ <div class="status flex-wrap">
|
|
|
+ <div class="manageTitle">数据项</div>
|
|
|
+ </div>
|
|
|
+ </template></Minheader
|
|
|
+ >
|
|
|
+ <div class="app-containers">
|
|
|
+ <DataTable
|
|
|
+ :tableHeader="state.list"
|
|
|
+ :tableData="tableData"
|
|
|
+ :tableBtnGroup="tableBtnGroup"
|
|
|
+ :tableProperty="{ rowKey: 'ID' }"
|
|
|
+ @btnClick="btnClick"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <Dialog
|
|
|
+ width="800px"
|
|
|
+ :flag="flag"
|
|
|
+ :type="type"
|
|
|
+ :msgTitle="msgTitle"
|
|
|
+ @resetForm="resetForm"
|
|
|
+ @delRest="delRest"
|
|
|
+ >
|
|
|
+ <div class="diacont">
|
|
|
+ <el-form :model="tableForm">
|
|
|
+ <el-row :gutter="24">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="数据项名称" size="default">
|
|
|
+ <el-input
|
|
|
+ v-model="tableForm.name"
|
|
|
+ placeholder="请输入数据项名称"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="数据项类型" size="default">
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="tableForm.china"
|
|
|
+ class="input-shadow"
|
|
|
+ filterable
|
|
|
+ default-first-option
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in tableOptionser"
|
|
|
+ :key="item.v ? item.v : item.planDepartureApt"
|
|
|
+ :label="item.k ? item.k : item.planDepartureApt"
|
|
|
+ :value="item.v ? item.v : item.planDepartureApt"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="输出标识符" size="default">
|
|
|
+ <el-input
|
|
|
+ v-model="tableForm.englin"
|
|
|
+ placeholder="请输入输出标识符"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="描述" size="default">
|
|
|
+ <el-input v-model="tableForm.two" placeholder="请输入描述" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="唯一项" size="default">
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="tableForm.three"
|
|
|
+ class="input-shadow"
|
|
|
+ filterable
|
|
|
+ default-first-option
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in tableOptionser"
|
|
|
+ :key="item.v ? item.v : item.planDepartureApt"
|
|
|
+ :label="item.k ? item.k : item.planDepartureApt"
|
|
|
+ :value="item.v ? item.v : item.planDepartureApt"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="必填项" size="default">
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="tableForm.text"
|
|
|
+ class="input-shadow"
|
|
|
+ filterable
|
|
|
+ default-first-option
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in tableOptionser"
|
|
|
+ :key="item.v ? item.v : item.planDepartureApt"
|
|
|
+ :label="item.k ? item.k : item.planDepartureApt"
|
|
|
+ :value="item.v ? item.v : item.planDepartureApt"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="多条拆分" size="default">
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="tableForm.text1"
|
|
|
+ class="input-shadow"
|
|
|
+ filterable
|
|
|
+ default-first-option
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in tableOptionser"
|
|
|
+ :key="item.v ? item.v : item.planDepartureApt"
|
|
|
+ :label="item.k ? item.k : item.planDepartureApt"
|
|
|
+ :value="item.v ? item.v : item.planDepartureApt"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item label="取值表达式" size="default">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ v-model="tableForm.text2"
|
|
|
+ placeholder="请输入取值表达式"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item label="实时计算表达式" size="default">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ v-model="tableForm.text3"
|
|
|
+ placeholder="请输入实时计算表达式"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item label="计算结果标识符" size="default">
|
|
|
+ <el-input
|
|
|
+ v-model="tableForm.text4"
|
|
|
+ placeholder="请输入计算结果标识符"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item label="计算参数" size="default">
|
|
|
+ <el-input
|
|
|
+ v-model="tableForm.text5"
|
|
|
+ placeholder="请输入计算参数"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="计算数据源" size="default">
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="tableForm.text6"
|
|
|
+ class="input-shadow"
|
|
|
+ filterable
|
|
|
+ default-first-option
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in tableOptionser"
|
|
|
+ :key="item.v ? item.v : item.planDepartureApt"
|
|
|
+ :label="item.k ? item.k : item.planDepartureApt"
|
|
|
+ :value="item.v ? item.v : item.planDepartureApt"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </Dialog>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+import DataTable from "@/components/tableTemp/index.vue";
|
|
|
+import Minheader from "@/components/minheader/index.vue";
|
|
|
+import Dialog from "@/components/dialog/index.vue";
|
|
|
+const flag = ref<Boolean>(false); //弹窗开关
|
|
|
+const type = ref<String>(""); //判断是否删除
|
|
|
+const msgTitle = ref<String>("新增数据项"); //弹窗标题
|
|
|
+const tableColsCopys = reactive<Object>({}); //弹窗
|
|
|
+const tableOptionser = ref<Array>([]); //弹窗下拉
|
|
|
+const tableForm = reactive({
|
|
|
+ name: "",
|
|
|
+ china: "",
|
|
|
+ englin: "",
|
|
|
+ two: "",
|
|
|
+ three: "",
|
|
|
+ text: "",
|
|
|
+ text1: "",
|
|
|
+ text2: "",
|
|
|
+ text3: "",
|
|
|
+ text4: "",
|
|
|
+ text5: "",
|
|
|
+ text6: "",
|
|
|
+}); //弹窗内容
|
|
|
+//列表
|
|
|
+const tableData = ref([
|
|
|
+ {
|
|
|
+ name: "测试",
|
|
|
+ china: "测试",
|
|
|
+ englin: "测试",
|
|
|
+ two: "测试",
|
|
|
+ three: "测试",
|
|
|
+ text: "测试",
|
|
|
+ text1: "测试",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "测试",
|
|
|
+ china: "测试",
|
|
|
+ englin: "测试",
|
|
|
+ two: "测试",
|
|
|
+ three: "测试",
|
|
|
+ text: "测试",
|
|
|
+ text1: "测试",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "测试",
|
|
|
+ china: "测试",
|
|
|
+ englin: "测试",
|
|
|
+ two: "测试",
|
|
|
+ three: "测试",
|
|
|
+ text: "测试",
|
|
|
+ text1: "测试",
|
|
|
+ },
|
|
|
+]);
|
|
|
+//表头
|
|
|
+const state = reactive({
|
|
|
+ list: [
|
|
|
+ { label: "项名称", key: "name" },
|
|
|
+ { label: "输出标识符", key: "china" },
|
|
|
+ { label: "数据类型", key: "englin" },
|
|
|
+ { label: "唯一项", key: "two" },
|
|
|
+ { label: "必填项", key: "three" },
|
|
|
+ { label: "拆分项", key: "text" },
|
|
|
+ { label: "计算数据源", key: "text1" },
|
|
|
+ ],
|
|
|
+ listLoading: true,
|
|
|
+});
|
|
|
+const tableBtnGroup = ref([
|
|
|
+ {
|
|
|
+ name: "编辑",
|
|
|
+ className: "editBtn",
|
|
|
+ param: 2,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "删除",
|
|
|
+ className: "delBtn",
|
|
|
+ param: 3,
|
|
|
+ },
|
|
|
+]);
|
|
|
+//新增
|
|
|
+const addForm = () => {
|
|
|
+ msgTitle.value = "新增数据项";
|
|
|
+ flag.value = true;
|
|
|
+ type.value = "";
|
|
|
+};
|
|
|
+//取消
|
|
|
+const resetForm = () => {
|
|
|
+ flag.value = false;
|
|
|
+ tableForm.name = "";
|
|
|
+ tableForm.china = "";
|
|
|
+ tableForm.englin = "";
|
|
|
+ tableForm.two = "";
|
|
|
+ tableForm.three = "";
|
|
|
+ tableForm.text = "";
|
|
|
+ tableForm.text1 = "";
|
|
|
+ tableForm.text2 = "";
|
|
|
+ tableForm.text3 = "";
|
|
|
+ tableForm.text4 = "";
|
|
|
+ tableForm.text5 = "";
|
|
|
+ tableForm.text6 = "";
|
|
|
+};
|
|
|
+//编辑
|
|
|
+// const editDialog = (data) => {
|
|
|
+// msgTitle.value = "编辑航司信息维护";
|
|
|
+// flag.value = true;
|
|
|
+// type.value = "";
|
|
|
+// tableForm.name = data.name;
|
|
|
+// tableForm.china = data.china;
|
|
|
+// tableForm.englin = data.englin;
|
|
|
+// tableForm.two = data.two;
|
|
|
+// tableForm.three = data.three;
|
|
|
+// tableForm.text = data.text;
|
|
|
+// };
|
|
|
+//编辑-删除
|
|
|
+const btnClick = (row, index, param) => {
|
|
|
+ if (param === 2) {
|
|
|
+ msgTitle.value = "编辑数据项";
|
|
|
+ flag.value = true;
|
|
|
+ type.value = "";
|
|
|
+ tableForm.name = index.name;
|
|
|
+ tableForm.china = index.china;
|
|
|
+ tableForm.englin = index.englin;
|
|
|
+ tableForm.two = index.two;
|
|
|
+ tableForm.three = index.three;
|
|
|
+ tableForm.text = index.text;
|
|
|
+ tableForm.text1 = index.text1;
|
|
|
+ tableForm.text2 = index.text2;
|
|
|
+ tableForm.text3 = index.text3;
|
|
|
+ tableForm.text4 = index.text4;
|
|
|
+ tableForm.text5 = index.text5;
|
|
|
+ tableForm.text6 = index.text6;
|
|
|
+ } else if (param === 3) {
|
|
|
+ msgTitle.value = "删除数据项";
|
|
|
+ flag.value = true;
|
|
|
+ type.value = "del";
|
|
|
+ } else if (param === 4) {
|
|
|
+ }
|
|
|
+};
|
|
|
+//删除
|
|
|
+const eleDialog = () => {
|
|
|
+ msgTitle.value = "删除数据项";
|
|
|
+ flag.value = true;
|
|
|
+ type.value = "del";
|
|
|
+};
|
|
|
+//删除
|
|
|
+const delRest = () => {
|
|
|
+ flag.value = false;
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+::v-deep .el-form-item__label {
|
|
|
+ width: 110px;
|
|
|
+}
|
|
|
+.app-containers {
|
|
|
+ height: calc(100vh - 180px);
|
|
|
+}
|
|
|
+</style>
|
