消息模板模块全部完成，修复消息点部分bug ，新增了写模板的 .vue 7月10日11:10:06

src/router/routes.js

@@ -12,6 +12,16 @@ import MessagePoint from '../views/messageManagement/MessagePoint.vue'
 import MessageServicMer from '../views/messageManagement/MessageServicMer.vue'
 import MessageTemplate from '../views/messageManagement/MessageTemplate.vue'
 
+
+/* 模板 */
+import Aa from '../views/template/Aa.vue'
+import Ab from '../views/template/Ab.vue'
+import Ac from '../views/template/Ac.vue'
+import Add from '../views/template/Ad.vue'
+import Ae from '../views/template/Ae.vue'
+import Af from '../views/template/Af.vue'
+
+
 export default [
   {
     path: '/about',
@@ -39,6 +49,7 @@ export default [
 				name: 'subDeviceAdmin',
 				component: SubDeviceAdmin
 			},
+			
 			{
 				path: '/home1_4',
 				name: 'home1_4',
@@ -70,7 +81,40 @@ export default [
 				path: '/messageTemplate',
 				name: 'messageTemplate',
 				component: MessageTemplate
+			},
+			
+			// 模板
+			{
+				path: '/aa',
+				name: 'aa',
+				component: Aa
+			},
+			{
+				path: '/ab',
+				name: 'ab',
+				component: Ab
+			},
+			{
+				path: '/ac',
+				name: 'ac',
+				component: Ac
+			},
+			{
+				path: '/add',
+				name: 'add',
+				component: Add
+			},
+			{
+				path: '/ae',
+				name: 'ae',
+				component: Ae
+			},
+			{
+				path: '/af',
+				name: 'af',
+				component: Af
 			}
+
 		]
 	},
 ]

src/views/Home/Home.vue

@@ -137,6 +137,7 @@ export default {
             // 如果要跳转的路由和当前路由一致就 return
             if (this.$router.history.current.name == e.$attrs.routerName)
                 return;
+
             this.$router.push({
                 path: "/" + e.$attrs.routerName
             });

src/views/Home/mencCofig.js

@@ -18,9 +18,9 @@ export const menuData = [
                 routerName: "deviceInfo"
             },
             {
-                optionName: '选项3',
+                optionName: '模板',
                 index: '1-3',
-                routerName: "home1_3"
+                routerName: "ac"
             },
             {
                 optionName: '选项4',
@@ -80,25 +80,40 @@ export const menuData = [
     },
     // 有子菜单 字菜单不分组的
     {
-        oneMenuName: "导航四",
+        oneMenuName: "模板",
         iconClassName: "el-icon-menu",
-        index: '4',
+        index: '100',
         disabled: false, // 是否禁用
         childList: [ 
             {
-                optionName: '选项1',
-                index: '4-1',
-                routerName: "home4-1"
+                optionName: '模板 1',
+                index: '100-1',
+                routerName: "aa"
             },
             {
-                optionName: '选项2',
-                index: '4-2',
-                routerName: "home4-2"
+                optionName: '普通表格',
+                index: '100-2',
+                routerName: "ab"
+            },
+            {
+                optionName: '模板 3',
+                index: '100-3',
+                routerName: "ac"
+            },
+            {
+                optionName: '模板 4',
+                index: '100-4',
+                routerName: "add"
+            },
+            {
+                optionName: '模板 5',
+                index: '100-5',
+                routerName: "ee"
             },
             {
-                optionName: '选项3',
-                index: '4-3',
-                routerName: "home4-3"
+                optionName: '模板 6',
+                index: '100-6',
+                routerName: "af"
             }
             
         ]

src/views/messageManagement/MessagePoint.vue

@@ -1,16 +1,16 @@
 <template>
     <div class="MessagePoint">
-        <h1>MessagePoint MessagePoint 9999</h1>
         <el-button @click="add" type="primary" icon="el-icon-document-add">添加</el-button>
         <el-table :data="tableData" border style="width: 60%">
-            <el-table-column prop="id" label="序号" width="180"></el-table-column>
-            <el-table-column prop="code" label="消息点编码" width="180"></el-table-column>
-            <el-table-column label="地址">
+            <el-table-column prop="id" label="序号" width="120"></el-table-column>
+            <el-table-column prop="code" label="消息点编码" width="120" ></el-table-column>
+            <el-table-column label="消息点描述">
                 <template slot-scope="scope">
                     <p>{{scope.row.description}}</p>
                 </template>
             </el-table-column>
-            <el-table-column fixed="right" label="操作" width="100">
+            <el-table-column prop="remark" label="备注" ></el-table-column>
+            <el-table-column fixed="right" label="操作" width="150">
                 <template slot-scope="scope">
                     <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
                     <el-popconfirm title="是否删除此设备的信息？" @onConfirm="del(scope.row)">
@@ -100,11 +100,16 @@ export default {
         add() {
             this.isAdd = true;
             this.showDialog = true;
+            this.dyForm = {
+                code: null,
+                description: "",
+                remark: ""
+            }
         },
         edit(row) {
             this.isAdd = false;
             this.showDialog = true;
-            this.dyForm.id = row.id;
+            this.dyForm = row;
         },
         del(row) {
             this.fetch({
@@ -128,7 +133,7 @@ export default {
             this.$refs[formName].validate(valid => {
                 if (valid) {
                     console.log(this.dyForm);
-                    this.dyForm
+                    this.isAdd
                         ? this.reqSave("/message/point/add")
                         : this.reqSave("/message/point/update");
                 } else {

src/views/messageManagement/MessageTemplate.vue

@@ -1,27 +1,196 @@
 <template>
     <div class="MessageTemplate">
-        <h1>MessageTemplate dddddddddddddddddddd</h1>
+        <el-button @click="add" type="primary" icon="el-icon-document-add">添加</el-button>
+        <el-table :data="tableData" border style="width: 80%">
+            <el-table-column prop="id" label="序号" width="120"></el-table-column>
+            <el-table-column prop="code" label="模板编码" width="120"></el-table-column>
+            <el-table-column label="发送方式" width="100">
+                <template slot-scope="scope">
+                    <!-- <p>{{scope.row.description}}</p> -->
+                    <span v-for="item in sendMethod" :key="item.code">
+                        <el-tag size="small" type="warning" v-if="scope.row.methodCode == item.code" >{{item.description}}</el-tag>
+                    </span>
+                </template>
+            </el-table-column>
+            <el-table-column label="模板描述">
+                <template slot-scope="scope">
+                    <p>{{scope.row.description}}</p>
+                </template>
+            </el-table-column>
+            <el-table-column prop="content" label="模板内容"></el-table-column>
+            <el-table-column prop="providerTemplateCode" label="服务商模板编码" width="150"></el-table-column>
+            <el-table-column fixed="right" label="操作" width="150">
+                <template slot-scope="scope">
+                    <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
+                    <el-popconfirm title="是否删除此设备的信息？" @onConfirm="del(scope.row)">
+                        <el-button slot="reference" type="text" size="small">删除</el-button>
+                    </el-popconfirm>
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <el-dialog :title="isAdd?'添加消息模板':'编辑消息模板'" :visible.sync="showDialog">
+            <el-row type="flex">
+                <el-col :span="14">
+                    <el-form
+                        ref="dyForm"
+                        :model="dyForm"
+                        :rules="rules"
+                        label-width="100px"
+                        class="demo-dynamic"
+                    >
+                        <el-form-item label="模板编码:" prop="code">
+                            <el-input v-model="dyForm.code"></el-input>
+                        </el-form-item>
+                        <el-form-item label="模板描述:" prop="description">
+                            <el-input type="textarea" v-model="dyForm.description"></el-input>
+                        </el-form-item>
+                        <el-form-item label="模板内容:">
+                            <el-input type="textarea" v-model="dyForm.content"></el-input>
+                        </el-form-item>
+                        <el-form-item label="服务商模板编码:">
+                            <el-input v-model="dyForm.providerTemplateCode"></el-input>
+                        </el-form-item>
+                        <el-form-item label="发送方式" prop="region">
+                            <el-select v-model="dyForm.methodCode" placeholder="请选择发送方式">
+                                <el-option v-for="item in sendMethod"  :label="item.description" :value="item.code" :key="item.code"></el-option>
+
+                                <!-- <el-option label="区域二" value="beijing"></el-option> -->
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button @click="showDialog=false">取 消</el-button>
+                            <el-button type="primary" @click="submitForm('dyForm')">保 存</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+        </el-dialog>
     </div>
 </template>
 <script>
 import { mapActions } from "vuex";
+const rules = {
+    code: [{ required: true, message: "请输入消息模板编码", trigger: "blur" }],
+    description: [
+        { required: true, message: "请输入消息点描述", trigger: "blur" }
+    ]
+};
 
 export default {
     name: "MessageTemplate",
     data() {
-        return {};
+        return {
+            tableData: [],
+            showDialog: false,
+            dyForm: {
+                code: "",
+                description: "",
+                content: "",
+                providerTemplateCode: "",
+                methodCode: ""
+            },
+            sendMethod: "",
+            rules,
+            isAdd: true
+        };
+    },
+    mounted() {
+        this.getMessageTemplate();
+        this.getSendMethod();
     },
-    created() {},
     methods: {
-		...mapActions(["fetch"]),
-		getMessageTemplate() {
+        ...mapActions(["fetch"]),
+        // 获取消息点
+        getMessageTemplate() {
             this.fetch({
                 api: "/message/template/list",
                 method: "GET",
                 data: {},
                 success: res => {
-                    console.log(res)
-                    // this.subDeviceList = res;
+                    this.tableData = res;
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        },
+        // 获取发送方式
+        getSendMethod() {
+            this.fetch({
+                api: "/message/method/list",
+                method: "GET",
+                data: {},
+                success: res => {
+                    this.sendMethod = res;
+                    this.dyForm.methodCode = res[0].code
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        },
+        add() {
+            this.isAdd = true;
+            this.showDialog = true;
+            this.dyForm = {
+                code: "",
+                description: "",
+                content: "",
+                providerTemplateCode: "",
+                methodCode: this.sendMethod[0].code
+            }
+        },
+        edit(row) {
+            console.log(row)
+            this.isAdd = false;
+            this.showDialog = true;
+            this.dyForm = row
+        },
+        del(row) {
+            this.fetch({
+                api: "/message/template/delete",
+                method: "POST",
+                data: { id: row.id },
+                success: res => {
+                    console.log(res);
+                    this.getMessageTemplate();
+                    this.$message, success("删除成功！");
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        },
+        submitForm(formName) {
+            this.$refs[formName].validate(valid => {
+                if (valid) {
+                    console.log(this.dyForm);
+                    this.isAdd
+                        ? this.reqSave("/message/template/add")
+                        : this.reqSave("/message/template/update");
+                } else {
+                    return false;
+                }
+            });
+        },
+        // 请求 保存 （添加 和 更新）
+        reqSave(api) {
+            this.fetch({
+                api,
+                method: "POST",
+                data: this.dyForm,
+                success: res => {
+                    console.log(res);
+                    this.getMessageTemplate();
+                    this.$message.success("添加消息模板成功！");
+                    this.showDialog = false;
                 },
                 fail: err => {
                     console.log(err);

src/views/template/Aa.vue

@@ -0,0 +1,165 @@
+<template>
+    <div class="MessagePoint">
+        <el-button @click="add" type="primary" icon="el-icon-document-add">添加</el-button>
+        <el-table :data="tableData" border style="width: 60%">
+            <el-table-column prop="id" label="序号" width="120"></el-table-column>
+            <el-table-column prop="code" label="消息点编码" width="120" ></el-table-column>
+            <el-table-column label="消息点描述">
+                <template slot-scope="scope">
+                    <p>{{scope.row.description}}</p>
+                </template>
+            </el-table-column>
+            <el-table-column prop="remark" label="备注" ></el-table-column>
+            <el-table-column fixed="right" label="操作" width="150">
+                <template slot-scope="scope">
+                    <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
+                    <el-popconfirm title="是否删除此设备的信息？" @onConfirm="del(scope.row)">
+                        <el-button slot="reference" type="text" size="small">删除</el-button>
+                    </el-popconfirm>
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <el-dialog :title="isAdd?'添加消息点':'编辑消息点'" :visible.sync="showDialog">
+            <el-row type="flex">
+                <el-col :span="14">
+                    <el-form
+                        ref="dyForm"
+                        :model="dyForm"
+                        :rules="rules"
+                        label-width="100px"
+                        class="demo-dynamic"
+                    >
+                        <el-form-item label="消息点编码:" prop="code">
+                            <el-input v-model="dyForm.code"></el-input>
+                        </el-form-item>
+                        <el-form-item label="消息点描述:" prop="description">
+                            <el-input v-model="dyForm.description"></el-input>
+                        </el-form-item>
+                        <el-form-item label="备注:">
+                            <el-input type="textarea" v-model="dyForm.remark"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button @click="showDialog=false">取 消</el-button>
+                            <el-button type="primary" @click="submitForm('dyForm')">保 存</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+        </el-dialog>
+    </div>
+</template>
+<script>
+import { mapActions } from "vuex";
+const rules = {
+    code: [{ required: true, message: "请输入消息点编码", trigger: "blur" }],
+    description: [
+        { required: true, message: "请输入消息点描述", trigger: "blur" }
+    ]
+};
+
+export default {
+    name: "MessagePoint",
+    data() {
+        return {
+            tableData: [],
+            showDialog: false,
+            dyForm: {
+                code: null,
+                description: "",
+                remark: ""
+            },
+            rules,
+            isAdd: true
+        };
+    },
+    created() {},
+    mounted() {
+        this.getMessagePoint();
+    },
+    methods: {
+        ...mapActions(["fetch"]),
+        // 获取消息点
+        getMessagePoint() {
+            this.fetch({
+                api: "/message/point/list",
+                method: "GET",
+                data: {},
+                success: res => {
+                    console.log(res);
+                    this.tableData = res;
+                    // this.subDeviceList = res;
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        },
+        add() {
+            this.isAdd = true;
+            this.showDialog = true;
+            this.dyForm = {
+                code: null,
+                description: "",
+                remark: ""
+            }
+        },
+        edit(row) {
+            this.isAdd = false;
+            this.showDialog = true;
+            this.dyForm = row;
+        },
+        del(row) {
+            this.fetch({
+                api: "/message/point/delete",
+                method: "POST",
+                data: {id:row.id},
+                success: res => {
+                    console.log(res);
+                    this.getMessagePoint();
+                    this.$message,success("删除成功！")
+                    // this.$message.success(res.msg);
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        },
+        submitForm(formName) {
+            this.$refs[formName].validate(valid => {
+                if (valid) {
+                    console.log(this.dyForm);
+                    this.isAdd
+                        ? this.reqSave("/message/point/add")
+                        : this.reqSave("/message/point/update");
+                } else {
+                    return false;
+                }
+            });
+        },
+        // 请求 保存 （添加 和 更新）
+        reqSave(api) {
+            this.fetch({
+                api,
+                method: "POST",
+                data: this.dyForm,
+                success: res => {
+                    console.log(res);
+                    this.getMessagePoint();
+                    this.$message.success('添加消息点成功！')
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        }
+    }
+};
+</script>
+

src/views/template/Ab.vue

@@ -0,0 +1,165 @@
+<template>
+    <div class="MessagePoint">
+        <el-button @click="add" type="primary" icon="el-icon-document-add">添加</el-button>
+        <el-table :data="tableData" border style="width: 60%">
+            <el-table-column prop="id" label="序号" width="120"></el-table-column>
+            <el-table-column prop="code" label="消息点编码" width="120" ></el-table-column>
+            <el-table-column label="消息点描述">
+                <template slot-scope="scope">
+                    <p>{{scope.row.description}}</p>
+                </template>
+            </el-table-column>
+            <el-table-column prop="remark" label="备注" ></el-table-column>
+            <el-table-column fixed="right" label="操作" width="150">
+                <template slot-scope="scope">
+                    <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
+                    <el-popconfirm title="是否删除此设备的信息？" @onConfirm="del(scope.row)">
+                        <el-button slot="reference" type="text" size="small">删除</el-button>
+                    </el-popconfirm>
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <el-dialog :title="isAdd?'添加消息点':'编辑消息点'" :visible.sync="showDialog">
+            <el-row type="flex">
+                <el-col :span="14">
+                    <el-form
+                        ref="dyForm"
+                        :model="dyForm"
+                        :rules="rules"
+                        label-width="100px"
+                        class="demo-dynamic"
+                    >
+                        <el-form-item label="消息点编码:" prop="code">
+                            <el-input v-model="dyForm.code"></el-input>
+                        </el-form-item>
+                        <el-form-item label="消息点描述:" prop="description">
+                            <el-input v-model="dyForm.description"></el-input>
+                        </el-form-item>
+                        <el-form-item label="备注:">
+                            <el-input type="textarea" v-model="dyForm.remark"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button @click="showDialog=false">取 消</el-button>
+                            <el-button type="primary" @click="submitForm('dyForm')">保 存</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+        </el-dialog>
+    </div>
+</template>
+<script>
+import { mapActions } from "vuex";
+const rules = {
+    code: [{ required: true, message: "请输入消息点编码", trigger: "blur" }],
+    description: [
+        { required: true, message: "请输入消息点描述", trigger: "blur" }
+    ]
+};
+
+export default {
+    name: "MessagePoint",
+    data() {
+        return {
+            tableData: [],
+            showDialog: false,
+            dyForm: {
+                code: null,
+                description: "",
+                remark: ""
+            },
+            rules,
+            isAdd: true
+        };
+    },
+    created() {},
+    mounted() {
+        this.getMessagePoint();
+    },
+    methods: {
+        ...mapActions(["fetch"]),
+        // 获取消息点
+        getMessagePoint() {
+            this.fetch({
+                api: "/message/point/list",
+                method: "GET",
+                data: {},
+                success: res => {
+                    console.log(res);
+                    this.tableData = res;
+                    // this.subDeviceList = res;
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        },
+        add() {
+            this.isAdd = true;
+            this.showDialog = true;
+            this.dyForm = {
+                code: null,
+                description: "",
+                remark: ""
+            }
+        },
+        edit(row) {
+            this.isAdd = false;
+            this.showDialog = true;
+            this.dyForm = row;
+        },
+        del(row) {
+            this.fetch({
+                api: "/message/point/delete",
+                method: "POST",
+                data: {id:row.id},
+                success: res => {
+                    console.log(res);
+                    this.getMessagePoint();
+                    this.$message,success("删除成功！")
+                    // this.$message.success(res.msg);
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        },
+        submitForm(formName) {
+            this.$refs[formName].validate(valid => {
+                if (valid) {
+                    console.log(this.dyForm);
+                    this.isAdd
+                        ? this.reqSave("/message/point/add")
+                        : this.reqSave("/message/point/update");
+                } else {
+                    return false;
+                }
+            });
+        },
+        // 请求 保存 （添加 和 更新）
+        reqSave(api) {
+            this.fetch({
+                api,
+                method: "POST",
+                data: this.dyForm,
+                success: res => {
+                    console.log(res);
+                    this.getMessagePoint();
+                    this.$message.success('添加消息点成功！')
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        }
+    }
+};
+</script>
+

src/views/template/Ac.vue

@@ -0,0 +1,35 @@
+<template>
+    <div class="Ad">
+        <h1>Ad33</h1>
+    </div>
+</template>
+
+<script>
+import { mapActions } from "vuex";
+
+export default {
+    name: "Ac",
+    data() {
+        return {};
+    },
+    created() {},
+    methods: {
+        ...mapActions(["fetch"]),
+        get() {
+            this.fetch({
+                api: "aaa",
+                method: "GET",
+                data: {},
+                success: res => {
+                    console.log(res);
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        }
+    }
+};
+</script>

src/views/template/Ad.vue

@@ -0,0 +1,35 @@
+<template>
+    <div class="Ad">
+        <h1>Ad444</h1>
+    </div>
+</template>
+
+<script>
+import { mapActions } from "vuex";
+
+export default {
+    name: "Ad",
+    data() {
+        return {};
+    },
+    created() {},
+    methods: {
+        ...mapActions(["fetch"]),
+        get() {
+            this.fetch({
+                api: "aaa",
+                method: "GET",
+                data: {},
+                success: res => {
+                    console.log(res);
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        }
+    }
+};
+</script>

src/views/template/Ae.vue

@@ -0,0 +1,35 @@
+<template>
+    <div class="Ad">
+        <h1>Ad555</h1>
+    </div>
+</template>
+
+<script>
+import { mapActions } from "vuex";
+
+export default {
+    name: "Ae",
+    data() {
+        return {};
+    },
+    created() {},
+    methods: {
+        ...mapActions(["fetch"]),
+        get() {
+            this.fetch({
+                api: "aaa",
+                method: "GET",
+                data: {},
+                success: res => {
+                    console.log(res);
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        }
+    }
+};
+</script>

src/views/template/Af.vue

@@ -0,0 +1,35 @@
+<template>
+    <div class="Ad">
+        <h1>Ad666</h1>
+    </div>
+</template>
+
+<script>
+import { mapActions } from "vuex";
+
+export default {
+    name: "Af",
+    data() {
+        return {};
+    },
+    created() {},
+    methods: {
+        ...mapActions(["fetch"]),
+        get() {
+            this.fetch({
+                api: "aaa",
+                method: "GET",
+                data: {},
+                success: res => {
+                    console.log(res);
+                },
+                fail: err => {
+                    console.log(err);
+                    if (err.errMsg) this.$message.error(err.errMsg);
+                    else this.$message.error("服务器发生异常");
+                }
+            });
+        }
+    }
+};
+</script>