增加成都一号线请求堆栈

src/jmapNew/theme/chengdu_01/menus/index.vue

@@ -6,6 +6,7 @@
         <menu-bar ref="menuBar" :selected="selected" />
       </template>
       <menu-button ref="menuButton" />
+      <menu-request ref="menuRequest" />
       <menu-station-control ref="menuStationControl" :selected="selected" />
       <menu-station-stand ref="menuStationStand" :selected="selected" />
       <menu-switch ref="menuSwitch" :selected="selected" />
@@ -23,6 +24,7 @@
 
 <script>
 import { mapGetters } from 'vuex';
+import MenuRequest from './menuRequest';
 import MenuCancel from './menuCancel';
 import MenuSignal from './menuSignal';
 import MenuButton from './menuButton';
@@ -42,6 +44,7 @@ export default {
     name: 'Menus',
     components: {
         MenuBar,
+        MenuRequest,
         MenuButton,
         MenuCancel,
         MenuSignal,

src/jmapNew/theme/chengdu_01/menus/menuRequest.vue

@@ -0,0 +1,135 @@
+<template>
+  <div class="request_box">
+    <div class="title-box">
+      <div class="title-name">操作请求堆栈</div>
+      <div class="icon" :class="{'is-active': unfold}" @click="unflodDiv">
+        <i class="el-icon-arrow-down" />
+      </div>
+    </div>
+    <div class="content-box" :class="{'is-active': unfold}">
+      <el-table ref="table" :data="tempData" border :cell-style="tableStyle" style="width: 100%;background: #000;" size="mini" height="120" highlight-current-row :show-header="false" @row-click="clickEvent">
+        <el-table-column prop="name" style="margin-left:10px" />
+        <el-table-column prop="brief" style="margin-left:10px" />
+      </el-table>
+      <el-row justify="center" class="button-group">
+        <el-col :span="2" :offset="4">
+          <el-button :id="domIdConfirm" size="mini" type="primary" style="float: left;" :loading="loading" :disabled="commitDisabled" @click="commit">重做</el-button>
+        </el-col>
+        <el-col :span="2" :offset="12">
+          <el-button :id="domIdCancel" size="mini" style="float: right;" @click="cancel">撤销</el-button>
+        </el-col>
+      </el-row>
+      <el-row justify="center" class="button-group">
+        <el-col :span="8">
+          <el-button :id="domIdConfirm" size="mini" type="primary" style="float: left;" :loading="loading" :disabled="commitDisabled" @click="commit">发送请求</el-button>
+        </el-col>
+        <el-col :span="8" :offset="8">
+          <el-button :id="domIdCancel" size="mini" style="float: right;" @click="cancel">取消请求</el-button>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
+
+export default {
+    name: 'CancelMenu',
+    components: {
+    },
+    data() {
+        return {
+            unfold: false,
+            tempData: [],
+            tableStyle: {
+                'border-bottom': 'none'
+            }
+        };
+    },
+    computed: {
+        ...mapGetters('map', [
+            'stationList'
+        ]),
+        domIdConfirm() {
+            return OperationEvent.Signal.arrangementRoute.menu.domId;
+        },
+        domIdCancel() {
+            return OperationEvent.Command.cancel.menu.domId;
+        }
+    },
+    mounted() {
+    },
+    methods: {
+        unflodDiv() {
+            this.unfold = !this.unfold;
+        },
+        clickEvent(row, event, column) {
+            if (row.canSetting) {
+                console.log(row);
+            }
+        }
+    }
+};
+</script>
+<style lang="scss" scope>
+    .request_box{
+        width: 600px;
+        height: auto;
+        position: absolute;
+        bottom: 10px;
+        left: 50%;
+        background: #fff;
+        z-index: 10;
+        transform: translateX(-300px);
+        background: #518E86;
+
+        .title-box{
+            width: 100%;
+            height: 25px;
+            color: #333;
+            background: #94A1A3;
+            position: relative;
+
+            .title-name{
+                height: 25px;
+                line-height: 25px;
+                margin: 0 auto;
+                display: table;
+            }
+            .icon{
+                position: absolute;
+                right: 20px;
+                top: 0;
+                font-size: 14px;
+                color: #333;
+                cursor: pointer;
+                height: 25px;
+                line-height: 25px;
+                padding: 0px 6px;
+                transition: transform .3s,-webkit-transform .3s;
+                font-weight: 300;
+                &.is-active{
+                    transform: rotate(180deg);
+                }
+            }
+        }
+
+        .content-box{
+            height: 210px;
+            overflow: hidden;
+            padding: 8px;
+            box-sizing: border-box;
+            transition: height .3s;
+            &.is-active{
+                height: 0;
+                padding: 0;
+            }
+
+            .button-group{
+                margin-top: 8px;
+            }
+        }
+    }
+</style>

vue.config.js

@@ -30,6 +30,7 @@ module.exports = {
     outputDir: 'dist',
     assetsDir: 'static',
     lintOnSave: false,
+    filenameHashing: true,
     productionSourceMap: false,
     devServer: {
         port: port,
@@ -59,6 +60,9 @@ module.exports = {
                 '@': resolve('src')
             }
         };
+        // config.output = {
+        //     filename: '[name].[hash].js'
+        // };
         config.plugins.push(new CopyWebpackPlugin([
             {
                 from: path.resolve(__dirname, './static'),
@@ -66,16 +70,6 @@ module.exports = {
                 ignore: ['.*']
             }
         ]));
-
-        // if (isProduction) {
-        //     config.plugins.push(new CompressionWebpackPlugin({
-        //         algorithm: 'gzip',
-        //         test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
-        //         threshold: 10240,
-        //         minRatio: 0.8
-        //     }));
-        // }
-
         config.externals = { // 配置使用CDN
             'vue': 'Vue',
             'vuex': 'Vuex',
@@ -83,7 +77,6 @@ module.exports = {
             'nprogress': 'NProgress',
             'echarts': 'echarts',
             'element-ui': 'ELEMENT'
-            // 'sockjs': 'sockjs'
         };
 
     },
@@ -136,51 +129,51 @@ module.exports = {
                             inline: /runtime\..*\.js$/
                         }])
                         .end();
-                    config
+                    // config
-                        .optimization.splitChunks({
+                    //     .optimization.splitChunks({
-                            chunks: 'all',
+                    //         chunks: 'all',
-                            cacheGroups: {
+                    //         cacheGroups: {
-                                libs: {
+                    //             libs: {
-                                    name: 'chunk-libs',
+                    //                 name: 'chunk-libs',
-                                    test: /[\\/]node_modules[\\/]/,
+                    //                 test: /[\\/]node_modules[\\/]/,
-                                    priority: 10,
+                    //                 priority: 10,
-                                    chunks: 'initial' // only package third parties that are initially dependent
+                    //                 chunks: 'initial' // only package third parties that are initially dependent
-                                },
+                    //             },
-                                // elementUI: {
+                    //             // elementUI: {
-                                //     name: 'chunk-elementUI', // split elementUI into a single package
+                    //             //     name: 'chunk-elementUI', // split elementUI into a single package
-                                //     priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
+                    //             //     priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
-                                //     test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
+                    //             //     test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
-                                // },
+                    //             // },
-                                commons: {
+                    //             commons: {
-                                    name: 'chunk-commons',
+                    //                 name: 'chunk-commons',
-                                    test: resolve('src/components'), // can customize your rules
+                    //                 test: resolve('src/components'), // can customize your rules
-                                    minChunks: 3, //  minimum common number
+                    //                 minChunks: 3, //  minimum common number
-                                    priority: 5,
+                    //                 priority: 5,
-                                    reuseExistingChunk: true
+                    //                 reuseExistingChunk: true
-                                }
+                    //             }
-                                // jmap: {
+                    //             // jmap: {
-                                //     name: 'chunk-jmap',
+                    //             //     name: 'chunk-jmap',
-                                //     test: resolve('src/jmap'), // can customize your rules
+                    //             //     test: resolve('src/jmap'), // can customize your rules
-                                //     minChunks: 3, //  minimum common number
+                    //             //     minChunks: 3, //  minimum common number
-                                //     priority: 5,
+                    //             //     priority: 5,
-                                //     reuseExistingChunk: true
+                    //             //     reuseExistingChunk: true
-                                // },
+                    //             // },
-                                // jlmap3d: {
+                    //             // jlmap3d: {
-                                //     name: 'chunk-jlmap3d',
+                    //             //     name: 'chunk-jlmap3d',
-                                //     test: resolve('src/jlmap3d'), // can customize your rules
+                    //             //     test: resolve('src/jlmap3d'), // can customize your rules
-                                //     minChunks: 3, //  minimum common number
+                    //             //     minChunks: 3, //  minimum common number
-                                //     priority: 5,
+                    //             //     priority: 5,
-                                //     reuseExistingChunk: true
+                    //             //     reuseExistingChunk: true
-                                // },
+                    //             // },
-                                // ibp: {
+                    //             // ibp: {
-                                //     name: 'chunk-ibp',
+                    //             //     name: 'chunk-ibp',
-                                //     test: resolve('src/ibp'), // can customize your rules
+                    //             //     test: resolve('src/ibp'), // can customize your rules
-                                //     minChunks: 3, //  minimum common number
+                    //             //     minChunks: 3, //  minimum common number
-                                //     priority: 5,
+                    //             //     priority: 5,
-                                //     reuseExistingChunk: true
+                    //             //     reuseExistingChunk: true
-                                // }
+                    //             // }
-                            }
+                    //         }
-                        });
+                    //     });
                     config.optimization.runtimeChunk('single');
                 }
             );