|
|
@@ -1,283 +1,8 @@
|
|
|
<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">{{pageTitle}}</div>
|
|
|
- </div>
|
|
|
- </template></Minheader
|
|
|
- >
|
|
|
- <div class="app-containers">
|
|
|
- <DataTable
|
|
|
- :tableHeader="tableCols"
|
|
|
- :tableData="tableData"
|
|
|
- :tableBtnGroup="tableBtnGroup"
|
|
|
- :tableProperty="{ rowKey: 'ID' }"
|
|
|
- @btnClick="btnClick"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <Dialog
|
|
|
- :flag="flag"
|
|
|
- :type="type"
|
|
|
- :msgTitle="msgTitle"
|
|
|
- @resetForm="resetForm"
|
|
|
- @delRest="delRest"
|
|
|
- @submitForm="submitForm"
|
|
|
- @delRemove="delRemove"
|
|
|
- >
|
|
|
- <div class="diacont">
|
|
|
- <el-form
|
|
|
- :model="tableForm"
|
|
|
- :rules="formRules"
|
|
|
- ref="messageTemplateForm"
|
|
|
- >
|
|
|
- <el-row :gutter="24">
|
|
|
- <el-col>
|
|
|
- <el-form-item
|
|
|
- label="消息标题"
|
|
|
- size="default"
|
|
|
- prop="newsTitle"
|
|
|
- :rules="formRules.isNotNull"
|
|
|
- >
|
|
|
- <el-input
|
|
|
- v-model="tableForm.newsTitle"
|
|
|
- placeholder="请输入名称"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col>
|
|
|
- <el-form-item
|
|
|
- label="消息内容"
|
|
|
- size="default"
|
|
|
- prop="newContent"
|
|
|
- :rules="formRules.isNotNull"
|
|
|
- >
|
|
|
- <el-input
|
|
|
- type="textarea"
|
|
|
- v-model="tableForm.newContent"
|
|
|
- placeholder="请输入消息内容"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- </Dialog>
|
|
|
- </div>
|
|
|
+ <DataTable />
|
|
|
</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";
|
|
|
-import { ref,onMounted } from "vue";
|
|
|
-import { Query, GeneralDataReception } from "@/api/webApi";
|
|
|
-import { ElMessage } from "element-plus";
|
|
|
-const formRules = useElement().formRules;
|
|
|
-const page = ref<number>(0); //分页参数
|
|
|
-const dataContent = ref<object>({});
|
|
|
-const noMore = ref<Boolean>(false);
|
|
|
-const rowTitle = ref<String>("");
|
|
|
-const tableCols = ref([]); //表头数据
|
|
|
-const serviceId = ref<String>("");
|
|
|
-const tableObj = ref({}); //增删改数据缓存
|
|
|
-const flag = ref<Boolean>(false); //弹窗开关
|
|
|
-const type = ref<String>(""); //判断是否删除
|
|
|
-const msgTitle = ref<String>("新增消息模板"); //弹窗标题
|
|
|
-const tableColsCopys = reactive<Object>({}); //弹窗
|
|
|
-const tempID = ref("");
|
|
|
-const pageTitle = ref<String>("");
|
|
|
-const tableForm = reactive({
|
|
|
- newsId: "",
|
|
|
- newsTitle: "",
|
|
|
- newContent: "",
|
|
|
- event: "",
|
|
|
-}); //弹窗内容
|
|
|
-//列表
|
|
|
-const tableData = ref([]);
|
|
|
-//表头
|
|
|
-const state = reactive({
|
|
|
- list: [
|
|
|
- { label: "名称", key: "name" },
|
|
|
- { label: "描述", key: "china" },
|
|
|
- ],
|
|
|
- listLoading: true,
|
|
|
-});
|
|
|
-const tableBtnGroup = ref([
|
|
|
- {
|
|
|
- name: "编辑",
|
|
|
- className: "editBtn",
|
|
|
- param: 2,
|
|
|
- },
|
|
|
- {
|
|
|
- name: "删除",
|
|
|
- className: "delBtn",
|
|
|
- param: 3,
|
|
|
- },
|
|
|
-]);
|
|
|
-//新增
|
|
|
-const addForm = () => {
|
|
|
- msgTitle.value = "新增消息模板";
|
|
|
- flag.value = true;
|
|
|
- tableForm.event = 1;
|
|
|
- type.value = "";
|
|
|
-};
|
|
|
-//取消
|
|
|
-const resetForm = () => {
|
|
|
- flag.value = false;
|
|
|
- tableForm.newsId = "";
|
|
|
- tableForm.newsTitle = "";
|
|
|
- tableForm.newContent = "";
|
|
|
-};
|
|
|
-//编辑
|
|
|
-// 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.event = 2;
|
|
|
- tableForm.newsId = index.newsId;
|
|
|
- tableForm.newsTitle = index.newsTitle;
|
|
|
- tableForm.newContent = index.newContent;
|
|
|
- } else if (param === 3) {
|
|
|
- msgTitle.value = "删除消息模板";
|
|
|
- flag.value = true;
|
|
|
- type.value = "del";
|
|
|
- tableForm.event = 3;
|
|
|
- tableForm.newsId = index.newsId;
|
|
|
- tableForm.newsTitle = index.newsTitle;
|
|
|
- tableForm.newContent = index.newContent;
|
|
|
- } else if (param === 4) {
|
|
|
- }
|
|
|
-};
|
|
|
-//删除
|
|
|
-const eleDialog = () => {
|
|
|
- msgTitle.value = "删除消息模板";
|
|
|
- flag.value = true;
|
|
|
- type.value = "del";
|
|
|
-};
|
|
|
-const delRemove = () => {
|
|
|
- tableForm.event = 3;
|
|
|
- generalDataReception(tableForm);
|
|
|
-};
|
|
|
-//删除
|
|
|
-const delRest = () => {
|
|
|
- flag.value = false;
|
|
|
-};
|
|
|
-//获取表格数据
|
|
|
-const getQuery = async () => {
|
|
|
- console.log(tempID.value)
|
|
|
- try {
|
|
|
- const { code, returnData } = await Query({
|
|
|
- id: tempID.value,
|
|
|
- needPage: ++page.value,
|
|
|
- dataContent: Object.values(dataContent.value),
|
|
|
- });
|
|
|
- if (code === "0") {
|
|
|
- if (returnData.listValues.length === 0) {
|
|
|
- page.value--;
|
|
|
- noMore.value = true;
|
|
|
- }
|
|
|
- const titleColumn = returnData.columnSet.find(
|
|
|
- (item) => item.needShow === 1
|
|
|
- );
|
|
|
- if (titleColumn) {
|
|
|
- rowTitle.value = titleColumn.columnName;
|
|
|
- }
|
|
|
- tableData.value.push(...returnData.listValues);
|
|
|
- tableCols.value = returnData.columnSet;
|
|
|
- tableCols.value.forEach((element) => {
|
|
|
- element.label = element.columnLabel;
|
|
|
- element.key = element.columnName;
|
|
|
- // if (element.columnName === "queryTemplate") {
|
|
|
- // element.width = "300px";
|
|
|
- // }
|
|
|
- });
|
|
|
- serviceId.value = returnData.submitID;
|
|
|
- } else {
|
|
|
- page.value--;
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
- page.value--;
|
|
|
- }
|
|
|
-};
|
|
|
-//确认提交
|
|
|
-const messageTemplateForm: any = ref(null);
|
|
|
-const submitForm = () => {
|
|
|
- messageTemplateForm.value.validate((valid: any) => {
|
|
|
- if (valid) {
|
|
|
- generalDataReception(tableForm);
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
-};
|
|
|
-const resetTable = () => {
|
|
|
- page.value = 0;
|
|
|
- noMore.value = false;
|
|
|
- tableData.value = [];
|
|
|
-};
|
|
|
-//新增-编辑-删除
|
|
|
-const generalDataReception = async (data) => {
|
|
|
- try {
|
|
|
- data = {
|
|
|
- ...data,
|
|
|
- };
|
|
|
- const { code } = await GeneralDataReception({
|
|
|
- serviceId: serviceId.value,
|
|
|
- dataContent: JSON.stringify(data),
|
|
|
- });
|
|
|
- if (code == 0) {
|
|
|
- ElMessage.success(`操作成功`);
|
|
|
- // this.$message.success("操作成功");
|
|
|
- resetTable();
|
|
|
- getQuery();
|
|
|
- resetForm();
|
|
|
- flag.value = false;
|
|
|
- // rmFlag.value = false;
|
|
|
- tableObj.value = {};
|
|
|
- // this.$router.go(0);
|
|
|
- } else {
|
|
|
- ElMessage.error(`操作失败`);
|
|
|
- // this.$message.error("操作失败");
|
|
|
- // this.flag = false;
|
|
|
- // this.rmFlag = false;
|
|
|
- tableObj.value = {};
|
|
|
- resetForm();
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
- flag.value = false;
|
|
|
- // rmFlag.value = false;
|
|
|
- tableObj.value = {};
|
|
|
- resetForm();
|
|
|
- }
|
|
|
-};
|
|
|
-onMounted(()=>{
|
|
|
- const route = useRoute();
|
|
|
- console.log(route.meta)
|
|
|
- tempID.value = route.meta.qid;
|
|
|
- pageTitle.value = route.meta.title;
|
|
|
- getQuery();
|
|
|
-})
|
|
|
+import DataTable from "@/components/table/index.vue";
|
|
|
</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
-::v-deep .el-form-item__label {
|
|
|
- width: 80px;
|
|
|
-}
|
|
|
-.app-containers {
|
|
|
- height: calc(100vh - 180px);
|
|
|
-}
|
|
|
-</style>
|
