样式

build/build.js

@@ -0,0 +1,41 @@
+'use strict'
+require('./check-versions')()
+
+process.env.NODE_ENV = 'production'
+
+const ora = require('ora')
+const rm = require('rimraf')
+const path = require('path')
+const chalk = require('chalk')
+const webpack = require('webpack')
+const config = require('../config')
+const webpackConfig = require('./webpack.prod.conf')
+
+const spinner = ora('building for production...')
+spinner.start()
+
+rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
+  if (err) throw err
+  webpack(webpackConfig, (err, stats) => {
+    spinner.stop()
+    if (err) throw err
+    process.stdout.write(stats.toString({
+      colors: true,
+      modules: false,
+      children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build.
+      chunks: false,
+      chunkModules: false
+    }) + '\n\n')
+
+    if (stats.hasErrors()) {
+      console.log(chalk.red('  Build failed with errors.\n'))
+      process.exit(1)
+    }
+
+    console.log(chalk.cyan('  Build complete.\n'))
+    console.log(chalk.yellow(
+      '  Tip: built files are meant to be served over an HTTP server.\n' +
+      '  Opening index.html over file:// won\'t work.\n'
+    ))
+  })
+})

build/check-versions.js

@@ -0,0 +1,54 @@
+'use strict'
+const chalk = require('chalk')
+const semver = require('semver')
+const packageConfig = require('../package.json')
+const shell = require('shelljs')
+
+function exec (cmd) {
+  return require('child_process').execSync(cmd).toString().trim()
+}
+
+const versionRequirements = [
+  {
+    name: 'node',
+    currentVersion: semver.clean(process.version),
+    versionRequirement: packageConfig.engines.node
+  }
+]
+
+if (shell.which('npm')) {
+  versionRequirements.push({
+    name: 'npm',
+    currentVersion: exec('npm --version'),
+    versionRequirement: packageConfig.engines.npm
+  })
+}
+
+module.exports = function () {
+  const warnings = []
+
+  for (let i = 0; i < versionRequirements.length; i++) {
+    const mod = versionRequirements[i]
+
+    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
+      warnings.push(mod.name + ': ' +
+        chalk.red(mod.currentVersion) + ' should be ' +
+        chalk.green(mod.versionRequirement)
+      )
+    }
+  }
+
+  if (warnings.length) {
+    console.log('')
+    console.log(chalk.yellow('To use this template, you must update following to modules:'))
+    console.log()
+
+    for (let i = 0; i < warnings.length; i++) {
+      const warning = warnings[i]
+      console.log('  ' + warning)
+    }
+
+    console.log()
+    process.exit(1)
+  }
+}

build/utils.js

@@ -0,0 +1,101 @@
+'use strict'
+const path = require('path')
+const config = require('../config')
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const packageConfig = require('../package.json')
+
+exports.assetsPath = function (_path) {
+  const assetsSubDirectory = process.env.NODE_ENV === 'production'
+    ? config.build.assetsSubDirectory
+    : config.dev.assetsSubDirectory
+
+  return path.posix.join(assetsSubDirectory, _path)
+}
+
+exports.cssLoaders = function (options) {
+  options = options || {}
+
+  const cssLoader = {
+    loader: 'css-loader',
+    options: {
+      sourceMap: options.sourceMap
+    }
+  }
+
+  const postcssLoader = {
+    loader: 'postcss-loader',
+    options: {
+      sourceMap: options.sourceMap
+    }
+  }
+
+  // generate loader string to be used with extract text plugin
+  function generateLoaders (loader, loaderOptions) {
+    const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
+
+    if (loader) {
+      loaders.push({
+        loader: loader + '-loader',
+        options: Object.assign({}, loaderOptions, {
+          sourceMap: options.sourceMap
+        })
+      })
+    }
+
+    // Extract CSS when that option is specified
+    // (which is the case during production build)
+    if (options.extract) {
+      return ExtractTextPlugin.extract({
+        use: loaders,
+        fallback: 'vue-style-loader'
+      })
+    } else {
+      return ['vue-style-loader'].concat(loaders)
+    }
+  }
+
+  // https://vue-loader.vuejs.org/en/configurations/extract-css.html
+  return {
+    css: generateLoaders(),
+    postcss: generateLoaders(),
+    less: generateLoaders('less'),
+    sass: generateLoaders('sass', { indentedSyntax: true }),
+    scss: generateLoaders('sass'),
+    stylus: generateLoaders('stylus'),
+    styl: generateLoaders('stylus')
+  }
+}
+
+// Generate loaders for standalone style files (outside of .vue)
+exports.styleLoaders = function (options) {
+  const output = []
+  const loaders = exports.cssLoaders(options)
+
+  for (const extension in loaders) {
+    const loader = loaders[extension]
+    output.push({
+      test: new RegExp('\\.' + extension + '$'),
+      use: loader
+    })
+  }
+
+  return output
+}
+
+exports.createNotifierCallback = () => {
+  const notifier = require('node-notifier')
+
+  return (severity, errors) => {
+    if (severity !== 'error') return
+
+    const error = errors[0]
+    const filename = error.file && error.file.split('!').pop()
+
+    notifier.notify({
+      title: packageConfig.name,
+      message: severity + ': ' + error.name,
+      subtitle: filename || '',
+      icon: path.join(__dirname, 'logo.png')
+    })
+  }
+}

build/vue-loader.conf.js

@@ -0,0 +1,22 @@
+'use strict'
+const utils = require('./utils')
+const config = require('../config')
+const isProduction = process.env.NODE_ENV === 'production'
+const sourceMapEnabled = isProduction
+  ? config.build.productionSourceMap
+  : config.dev.cssSourceMap
+
+module.exports = {
+  loaders: utils.cssLoaders({
+    sourceMap: sourceMapEnabled,
+    extract: isProduction
+  }),
+  cssSourceMap: sourceMapEnabled,
+  cacheBusting: config.dev.cacheBusting,
+  transformToRequire: {
+    video: ['src', 'poster'],
+    source: 'src',
+    img: 'src',
+    image: 'xlink:href'
+  }
+}

build/webpack.base.conf.js

@@ -0,0 +1,83 @@
+'use strict'
+const path = require('path')
+const utils = require('./utils')
+const config = require('../config')
+const vueLoaderConfig = require('./vue-loader.conf')
+
+function resolve (dir) {
+  return path.join(__dirname, '..', dir)
+}
+
+module.exports = {
+  context: path.resolve(__dirname, '../'),
+  entry: {
+    app:["babel-polyfill","./src/main.js"]
+  },
+  output: {
+    path: config.build.assetsRoot,
+    filename: '[name].js',
+    publicPath: process.env.NODE_ENV === 'production'
+      ? config.build.assetsPublicPath
+      : config.dev.assetsPublicPath
+  },
+  resolve: {
+    extensions: ['.js', '.vue', '.json'],
+    alias: {
+      'vue$': 'vue/dist/vue.esm.js',
+      '@': resolve('src'),
+      'static':resolve('static')
+    }
+  },
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: vueLoaderConfig
+      },
+      {
+        test: /\.js$/,
+        loader: 'babel-loader',
+        include: [resolve('src'), resolve('test'),resolve('config'),
+        resolve('static'),resolve('node_modules/webpack-dev-server/client'),
+        resolve('node_modules/vue-baidu-map/components')]
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('img/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('media/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
+        }
+      }
+    ]
+  },
+  node: {
+    // prevent webpack from injecting useless setImmediate polyfill because Vue
+    // source contains it (although only uses it if it's native).
+    setImmediate: false,
+    // prevent webpack from injecting mocks to Node native modules
+    // that does not make sense for the client
+    dgram: 'empty',
+    fs: 'empty',
+    net: 'empty',
+    tls: 'empty',
+    child_process: 'empty'
+  }
+}

build/webpack.dev.conf.js

@@ -0,0 +1,95 @@
+'use strict'
+const utils = require('./utils')
+const webpack = require('webpack')
+const config = require('../config')
+const merge = require('webpack-merge')
+const path = require('path')
+const baseWebpackConfig = require('./webpack.base.conf')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
+const portfinder = require('portfinder')
+
+const HOST = process.env.HOST
+const PORT = process.env.PORT && Number(process.env.PORT)
+
+const devWebpackConfig = merge(baseWebpackConfig, {
+  module: {
+    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
+  },
+  // cheap-module-eval-source-map is faster for development
+  devtool: config.dev.devtool,
+
+  // these devServer options should be customized in /config/index.js
+  devServer: {
+    clientLogLevel: 'warning',
+    historyApiFallback: {
+      rewrites: [
+        { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
+      ],
+    },
+    hot: true,
+    contentBase: false, // since we use CopyWebpackPlugin.
+    compress: true,
+    host: HOST || config.dev.host,
+    port: PORT || config.dev.port,
+    open: config.dev.autoOpenBrowser,
+    overlay: config.dev.errorOverlay
+      ? { warnings: false, errors: true }
+      : false,
+    publicPath: config.dev.assetsPublicPath,
+    proxy: config.dev.proxyTable,
+    quiet: true, // necessary for FriendlyErrorsPlugin
+    watchOptions: {
+      poll: config.dev.poll,
+    }
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env': require('../config/dev.env')
+    }),
+    new webpack.HotModuleReplacementPlugin(),
+    new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
+    new webpack.NoEmitOnErrorsPlugin(),
+    // https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: 'index.html',
+      template: 'index.html',
+      inject: true
+    }),
+    // copy custom static assets
+    new CopyWebpackPlugin([
+      {
+        from: path.resolve(__dirname, '../static'),
+        to: config.dev.assetsSubDirectory,
+        ignore: ['.*']
+      }
+    ])
+  ]
+})
+
+module.exports = new Promise((resolve, reject) => {
+  portfinder.basePort = process.env.PORT || config.dev.port
+  portfinder.getPort((err, port) => {
+    if (err) {
+      reject(err)
+    } else {
+      // publish the new Port, necessary for e2e tests
+      process.env.PORT = port
+      // add port to devServer config
+      devWebpackConfig.devServer.port = port
+
+      // Add FriendlyErrorsPlugin
+      devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
+        compilationSuccessInfo: {
+          messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
+        },
+        onErrors: config.dev.notifyOnErrors
+        ? utils.createNotifierCallback()
+        : undefined
+      }))
+
+      resolve(devWebpackConfig)
+    }
+  })
+})

build/webpack.prod.conf.js

@@ -0,0 +1,145 @@
+'use strict'
+const path = require('path')
+const utils = require('./utils')
+const webpack = require('webpack')
+const config = require('../config')
+const merge = require('webpack-merge')
+const baseWebpackConfig = require('./webpack.base.conf')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
+const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
+
+const env = require('../config/prod.env')
+
+const webpackConfig = merge(baseWebpackConfig, {
+  module: {
+    rules: utils.styleLoaders({
+      sourceMap: config.build.productionSourceMap,
+      extract: true,
+      usePostCSS: true
+    })
+  },
+  devtool: config.build.productionSourceMap ? config.build.devtool : false,
+  output: {
+    path: config.build.assetsRoot,
+    filename: utils.assetsPath('js/[name].[chunkhash].js'),
+    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
+  },
+  plugins: [
+    // http://vuejs.github.io/vue-loader/en/workflow/production.html
+    new webpack.DefinePlugin({
+      'process.env': env
+    }),
+    new UglifyJsPlugin({
+      uglifyOptions: {
+        compress: {
+          warnings: false
+        }
+      },
+      sourceMap: config.build.productionSourceMap,
+      parallel: true
+    }),
+    // extract css into its own file
+    new ExtractTextPlugin({
+      filename: utils.assetsPath('css/[name].[contenthash].css'),
+      // Setting the following option to `false` will not extract CSS from codesplit chunks.
+      // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
+      // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, 
+      // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
+      allChunks: true,
+    }),
+    // Compress extracted CSS. We are using this plugin so that possible
+    // duplicated CSS from different components can be deduped.
+    new OptimizeCSSPlugin({
+      cssProcessorOptions: config.build.productionSourceMap
+        ? { safe: true, map: { inline: false } }
+        : { safe: true }
+    }),
+    // generate dist index.html with correct asset hash for caching.
+    // you can customize output by editing /index.html
+    // see https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: config.build.index,
+      template: 'index.html',
+      inject: true,
+      minify: {
+        removeComments: true,
+        collapseWhitespace: true,
+        removeAttributeQuotes: true
+        // more options:
+        // https://github.com/kangax/html-minifier#options-quick-reference
+      },
+      // necessary to consistently work with multiple chunks via CommonsChunkPlugin
+      chunksSortMode: 'dependency'
+    }),
+    // keep module.id stable when vendor modules does not change
+    new webpack.HashedModuleIdsPlugin(),
+    // enable scope hoisting
+    new webpack.optimize.ModuleConcatenationPlugin(),
+    // split vendor js into its own file
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'vendor',
+      minChunks (module) {
+        // any required modules inside node_modules are extracted to vendor
+        return (
+          module.resource &&
+          /\.js$/.test(module.resource) &&
+          module.resource.indexOf(
+            path.join(__dirname, '../node_modules')
+          ) === 0
+        )
+      }
+    }),
+    // extract webpack runtime and module manifest to its own file in order to
+    // prevent vendor hash from being updated whenever app bundle is updated
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'manifest',
+      minChunks: Infinity
+    }),
+    // This instance extracts shared chunks from code splitted chunks and bundles them
+    // in a separate chunk, similar to the vendor chunk
+    // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'app',
+      async: 'vendor-async',
+      children: true,
+      minChunks: 3
+    }),
+
+    // copy custom static assets
+    new CopyWebpackPlugin([
+      {
+        from: path.resolve(__dirname, '../static'),
+        to: config.build.assetsSubDirectory,
+        ignore: ['.*']
+      }
+    ])
+  ]
+})
+
+if (config.build.productionGzip) {
+  const CompressionWebpackPlugin = require('compression-webpack-plugin')
+
+  webpackConfig.plugins.push(
+    new CompressionWebpackPlugin({
+      asset: '[path].gz[query]',
+      algorithm: 'gzip',
+      test: new RegExp(
+        '\\.(' +
+        config.build.productionGzipExtensions.join('|') +
+        ')$'
+      ),
+      threshold: 10240,
+      minRatio: 0.8
+    })
+  )
+}
+
+if (config.build.bundleAnalyzerReport) {
+  const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
+  webpackConfig.plugins.push(new BundleAnalyzerPlugin())
+}
+
+module.exports = webpackConfig

src/assets/css/global.css

@@ -13,7 +13,7 @@ ul,li{
 p{margin:0}
 .el-breadcrumb{
     margin-bottom:15px;
-    font-size:22px;
+    font-size:26px;
     background:#fff;
     border-top:1px solid #ddd;
     padding:15px 10px;
@@ -23,11 +23,14 @@ p{margin:0}
     z-index: 99;
     left: 220px;
     right: 0;
-    top: 198px;
+    top: 180px;
     /* top: 242px; */
     background: linear-gradient(270deg, rgba(255,255,255,0.05) 0%, #04a7ff7e 100%);
     border: none;
 }
+.el-breadcrumb .el-breadcrumb__item{
+    line-height: 40px;
+}
 .el-dialog__header{
     background:#F2F2F2;
     border-bottom:1px solid #CACACA;

src/components/Index.vue

@@ -1,7 +1,19 @@
 <template>
 	<el-container class="container" style="height: 100%;">
 		<el-header class="header">
-			<img class="RTlogo" src="../assets/images/RTlogo.png" />
+			<div class="RTlogobox">
+				<img class="RTlogo" v-if="userinfo.logo" :src="userinfo.logo" />
+				<img class="RTlogo" v-else src="../assets/images/RTlogo.png" />
+				<!-- 标题 -->
+				<div class="caption">
+					<div v-if="userinfo.user_header" class="tit">
+						{{ userinfo.user_header }}
+					</div>
+					<div v-else class="tit">农业植保监测系统</div>
+					<div style="font-size: 12px;letter-spacing: 0px;">Agricultural Plant Protection Monitoring System</div>
+				</div>
+			</div>
+			
 			<!-- <div v-if="userinfo.logo">
 				<img
 					:src="userinfo.logo"
@@ -19,18 +31,11 @@
 					<span>{{ userinfo.site }}</span>
 				</div>
 
-				<!-- 标题 -->
-				<div class="caption">
-					<div v-if="userinfo.user_header" class="tit">
-						{{ userinfo.user_header }}
-					</div>
-					<div v-else class="tit">农业植保监测系统</div>
-					<div style="font-size: 12px;letter-spacing: 0px;">Agricultural Plant Protection Monitoring System</div>
-				</div>
+				
 			</div>
 
 			<!-- <span class="header_btn" @click="hCheckFun">隐藏</span> -->
-			<span class="header_btn" @click="toggle">{{flag?'隐藏':'展开'}}</span>
+			<!-- <span class="header_btn" @click="toggle">{{flag?'隐藏':'展开'}}</span> -->
 		</el-header>
 
 		<!-- <el-header class="header2" v-show="false">
@@ -268,10 +273,10 @@ export default {
 			currRouter: '/index/bzy',
 			menuList1: [
 				{
-					purview_name: '智能性诱测报',
-					menu: 'xycb',
-					parent_perm_id: 1,
-					pur_id: 1
+					purview_name: '物联网虫情测报灯',
+					menu: 'cbd',
+					parent_perm_id: 3,
+					pur_id: 3
 				},
 				{
 					purview_name: '植物孢子捕捉仪',
@@ -280,10 +285,10 @@ export default {
 					pur_id: 2
 				},
 				{
-					purview_name: '物联网虫情测报',
-					menu: 'cbd',
-					parent_perm_id: 3,
-					pur_id: 3
+					purview_name: '智能性诱设备',
+					menu: 'xycb',
+					parent_perm_id: 1,
+					pur_id: 1
 				},
 				{
 					purview_name: '高空测报灯',
@@ -794,12 +799,35 @@ export default {
 	background-size: 100% 100%;
 	position: relative;
 	// transition: .4s;
-	.RTlogo{
+	.RTlogobox{
 		position: absolute;
-		width: 90px;
-		left: 190px;
-		top: 30px;
+		width: 95%;
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+		height: calc(100% - 70px);
+		color: white;
+		.caption {
+		
+			font-size: 16px;
+			letter-spacing: 0.5px;
+
+			.tit {
+				font-size: 30px;
+				line-height: 46px;
+				font-weight: 700;
+				letter-spacing: 7px;
+			}
+			
+		}
+		.RTlogo{
+			height: 90px;
+			width: auto;
+			margin-right: 20px;
+		}
 	}
+	
+	
 	.navbarBtn {
 		color: #fff;
 		.userinfo {
@@ -816,20 +844,7 @@ export default {
 				margin-right: 6px;
 			}
 		}
-		.caption {
-			margin-top: 7px;
-			text-align: left;
-    		padding-left: 280px;
-			font-size: 16px;
-			letter-spacing: 0.5px;
-
-			.tit {
-				font-size: 30px;
-				line-height: 46px;
-				font-weight: 700;
-				letter-spacing: 7px;
-			}
-		}
+		
 	}
 }
 
@@ -953,6 +968,7 @@ export default {
 	color: #333;
 	background: url(../assets/images/asideBG.png) no-repeat center;
 	background-size: cover;
+	background-position: left -1px;
 	// line-height: 200px;
 	// .el-menu-item.is-active{background:#17BB89!important}
 	// .el-submenu__title i{color:#fff}

src/components/UserManger.vue

@@ -46,7 +46,7 @@
 					<div class="img-box">
 						<img style="width: 60px;height: 60px;margin-right: 15px;" src="@/assets/images/systemManger/user.png" />
 						<div>
-							<div style="font-size: 20px;margin-bottom: 5px;">{{(item.user_have || '无') | ellipsis}}</div>
+							<div style="font-size: 20px;margin-bottom: 5px;">{{(item.username || '无') | ellipsis}}</div>
 							<span v-if="item.user_have_type == '1'">普通用户</span>
 							<span v-if="item.user_have_type == '0'">模块管理员</span>
 							<span v-if="item.user_have_type == '2'">项目管理员</span>
@@ -476,6 +476,7 @@ export default {
 			return isJPG && isLt2M
 		},
 		changeUpload(file, fileList) {
+			console.log(URL.createObjectURL(file.raw))
 			var form = new FormData()
 			form.append('img_file', file.raw)
 			this.$axios({

src/pages/equipmanger/EquipList.vue

@@ -3,7 +3,7 @@
 		<el-breadcrumb separator-class="el-icon-arrow-right" v-show="flag.flag">
 			<el-breadcrumb-item>设备管理</el-breadcrumb-item>
 		</el-breadcrumb>
-		<div class="search-box" style="margin-bottom: 80px;">
+		<div class="search-box" style="margin-bottom: 15px;">
 			<div class="filter-box">
 				<el-select
 					size="small"
@@ -39,87 +39,38 @@
 			</div>
 			
 		</div>
-		<el-row :gutter="10">
-			<el-col
-				:xs="24"
-				:sm="24"
-				:md="12"
-				:lg="6"
-				:xl="6"
-				v-for="item in dataList"
-				:key="item.id"
-				style="width: 400px;height: 102px;padding: 0px;margin-left: 35px;margin-bottom: 122px;position: relative;overflow: visible;"
-			>
-				<el-card class="box-card">
-					<div class="img-box">
-						<template v-if="item.equip_type == '2'">
-							<p>杀虫灯</p>
-							<img src="@/assets/images/equipdistribute/scdIconOn.png" />
-							
-						</template>
-						<template v-if="item.equip_type == '3'">
-							<p>测报灯</p>
-							<img src="@/assets/images/equipdistribute/cbdIconOn.png" />
-							
-						</template>
-						<template v-if="item.equip_type == '4'">
-							<p>智能性诱</p>
-							<img src="@/assets/images/equipdistribute/znxyOn.png" />
-							
-						</template>
-						<template v-if="item.equip_type == '5'">
-							<p>环境监测</p>
-							<img src="@/assets/images/equipdistribute/hjjcIconOn.png" />
-							
-						</template>
-						<template v-if="item.equip_type == '6'">
-							<p>监控设备</p>
-							<img src="@/assets/images/equipdistribute/jkIconOn.png" />
-							
-						</template>
-						<template v-if="item.equip_type == '7'">
-							<p>孢子仪</p>
-							<img src="@/assets/images/equipdistribute/bzyIconOn.png" />
-							
-						</template>
-						<template v-if="item.equip_type == '8'">
-							<p>高空测报灯</p>
-							<img src="@/assets/images/equipdistribute/kkcbIconOn.png" />
-							
-						</template>
-						<template v-if="item.equip_type == 9">
-							<p>糖醋测报</p>
-							<img src="@/assets/images/equipdistribute/tccbOn.png" />
-							
-						</template>
-					</div>
-					<div class="detail">
-						<p>
-							设备ID:
-							<span>{{ item.equip_id }}</span>
-						</p>
-						<p>
-							适配用户:
-							<span :title="item.equip_user">{{ (item.equip_user || '无') | ellipsis }}</span>
-						</p>
-						<p>
-							设备名称:
-							<span :title="item.equip_name">{{ (item.equip_name || '无') | ellipsis }}</span>
-						</p>
-						<p>
-							设备添加时间:
-							<span>{{ item.equip_add_time }}</span>
-						</p>
-					</div>
-					<i class="el-icon-edit-outline" style="position: absolute;right: 15px;bottom: 20px;font-size: 20px;cursor: pointer;" @click="modifyName(item.equip_id, item.equip_name)"></i>
-					<!-- <div class="bottom">
-						<span @click="modifyName(item.equip_id, item.equip_name)">
-							<i class="el-icon-edit-outline"></i> 修改名称
-						</span>
-					</div> -->
-				</el-card>
-			</el-col>
-		</el-row>
+		<div>
+			<el-table :data="dataList">
+				<el-table-column prop="equip_id" label="设备ID"  :align="'center'">
+					<template slot-scope="scope">{{ scope.row.equip_id }}</template>
+				</el-table-column>
+				<el-table-column prop="equip_name" label="设备名称"  :align="'center'">
+					<template slot-scope="scope">{{
+						scope.row.equip_name == '' ? '无' : scope.row.equip_name
+					}}</template>
+				</el-table-column>
+				<el-table-column prop="equip_user" label="适配用户"  :align="'center'">
+					<template slot-scope="scope">{{
+						scope.row.equip_user == '' ? '无' : scope.row.equip_user
+					}}</template>
+				</el-table-column>
+				<el-table-column prop="equip_add_time" label="设备添加时间"  :align="'center'">
+					<template slot-scope="scope">{{
+						scope.row.equip_add_time == '' ? '无' : scope.row.equip_add_time
+					}}</template>
+				</el-table-column>
+				<el-table-column label="操作"  :align="'center'">
+					<template slot-scope="scope">
+						<el-button
+							size="mini"
+							type="info"
+							@click="modifyName(scope.row.equip_id, scope.row.equip_name)"
+							>修改名称</el-button
+						>
+					</template>
+				</el-table-column>
+			</el-table>
+		</div>
 		<!-- 暂无数据 -->
 		<div class="expertDiagnosis_referral_units_not" v-if="dataList.length <= 0">
 			<img

src/pages/equipmanger/EquipList_old.vue

@@ -0,0 +1,554 @@
+<template>
+	<div>
+		<el-breadcrumb separator-class="el-icon-arrow-right" v-show="flag.flag">
+			<el-breadcrumb-item>设备管理</el-breadcrumb-item>
+		</el-breadcrumb>
+		<div class="search-box" style="margin-bottom: 80px;">
+			<div class="filter-box">
+				<el-select
+					size="small"
+					v-model="queryInfo.device_type_id"
+					placeholder="请选择设备类型"
+					@change="searchChange()"
+				>
+					<el-option label="全部" value="23478"></el-option>
+					<el-option label="性诱测报" value="4"></el-option>
+					<el-option label="孢子仪" value="7"></el-option>
+					<el-option label="虫情测报" value="3"></el-option>
+					<el-option label="杀虫灯" value="2"></el-option>
+					<el-option label="高空测报灯" value="8"></el-option>
+				</el-select>
+				<el-input
+					size="small"
+					clearable
+					@change="searchChange()"
+					placeholder="请输入设备ID"
+					v-model="queryInfo.f_id"
+				>
+					<i slot="suffix" class="el-input__icon el-icon-search"></i>
+				</el-input>
+				<el-date-picker
+					size="small"
+					@change="DateChange()"
+					v-model="timeRange"
+					type="daterange"
+					range-separator="至"
+					start-placeholder="开始日期"
+					end-placeholder="结束日期"
+				></el-date-picker>
+			</div>
+			
+		</div>
+		<el-row :gutter="10">
+			<el-col
+				:xs="24"
+				:sm="24"
+				:md="12"
+				:lg="6"
+				:xl="6"
+				v-for="item in dataList"
+				:key="item.id"
+				style="width: 400px;height: 102px;padding: 0px;margin-left: 35px;margin-bottom: 122px;position: relative;overflow: visible;"
+			>
+				<el-card class="box-card">
+					<div class="img-box">
+						<template v-if="item.equip_type == '2'">
+							<p>杀虫灯</p>
+							<img src="@/assets/images/equipdistribute/scdIconOn.png" />
+							
+						</template>
+						<template v-if="item.equip_type == '3'">
+							<p>测报灯</p>
+							<img src="@/assets/images/equipdistribute/cbdIconOn.png" />
+							
+						</template>
+						<template v-if="item.equip_type == '4'">
+							<p>智能性诱</p>
+							<img src="@/assets/images/equipdistribute/znxyOn.png" />
+							
+						</template>
+						<template v-if="item.equip_type == '5'">
+							<p>环境监测</p>
+							<img src="@/assets/images/equipdistribute/hjjcIconOn.png" />
+							
+						</template>
+						<template v-if="item.equip_type == '6'">
+							<p>监控设备</p>
+							<img src="@/assets/images/equipdistribute/jkIconOn.png" />
+							
+						</template>
+						<template v-if="item.equip_type == '7'">
+							<p>孢子仪</p>
+							<img src="@/assets/images/equipdistribute/bzyIconOn.png" />
+							
+						</template>
+						<template v-if="item.equip_type == '8'">
+							<p>高空测报灯</p>
+							<img src="@/assets/images/equipdistribute/kkcbIconOn.png" />
+							
+						</template>
+						<template v-if="item.equip_type == 9">
+							<p>糖醋测报</p>
+							<img src="@/assets/images/equipdistribute/tccbOn.png" />
+							
+						</template>
+					</div>
+					<div class="detail">
+						<p>
+							设备ID:
+							<span>{{ item.equip_id }}</span>
+						</p>
+						<p>
+							适配用户:
+							<span :title="item.equip_user">{{ (item.equip_user || '无') | ellipsis }}</span>
+						</p>
+						<p>
+							设备名称:
+							<span :title="item.equip_name">{{ (item.equip_name || '无') | ellipsis }}</span>
+						</p>
+						<p>
+							设备添加时间:
+							<span>{{ item.equip_add_time }}</span>
+						</p>
+					</div>
+					<i class="el-icon-edit-outline" style="position: absolute;right: 15px;bottom: 20px;font-size: 20px;cursor: pointer;" @click="modifyName(item.equip_id, item.equip_name)"></i>
+					<!-- <div class="bottom">
+						<span @click="modifyName(item.equip_id, item.equip_name)">
+							<i class="el-icon-edit-outline"></i> 修改名称
+						</span>
+					</div> -->
+				</el-card>
+			</el-col>
+		</el-row>
+		<!-- 暂无数据 -->
+		<div class="expertDiagnosis_referral_units_not" v-if="dataList.length <= 0">
+			<img
+				src="@/assets/images/zanwu.png"
+				alt
+				class="expertDiagnosis_referral_units_notImg"
+			/>
+		</div>
+		<el-pagination
+			v-if="dataList.length > 0"
+			background
+			layout="prev, pager, next"
+			:page-size="12"
+			:total="totalNum"
+			:current-page="queryInfo.page"
+			@current-change="changePage"
+		></el-pagination>
+		<!-- 添加定位弹框 -->
+		<el-dialog
+			class="map_dialog"
+			title="添加定位"
+			v-if="addLocationDialogVisible"
+			:visible.sync="addLocationDialogVisible"
+			width="800px"
+			@closed="addLocationDialogClosed"
+		>
+			<el-form
+				:inline="true"
+				:model="locationForm"
+				class="demo-form-inline"
+				size="mini"
+			>
+				<el-form-item label="经度">
+					<el-input clearable v-model="locationForm.lng"></el-input>
+				</el-form-item>
+				<el-form-item label="维度">
+					<el-input clearable v-model="locationForm.lat"></el-input>
+				</el-form-item>
+				<el-form-item>
+					<el-button type="primary" size="mini" @click="locationSearch"
+						>定位</el-button
+					>
+				</el-form-item>
+				<el-form-item label="">
+					<el-input
+						placeholder="请输入地区检索"
+						v-model="addr"
+						clearable
+						@change="addrChange()"
+					></el-input>
+				</el-form-item>
+			</el-form>
+			<baidu-map
+				class="Bmap"
+				:center="center"
+				:zoom="mapZoom"
+				:scroll-wheel-zoom="true"
+				@ready="handlerBMap"
+				@click="locationPoint"
+			>
+				<bm-marker :position="point" :dragging="true"></bm-marker>
+			</baidu-map>
+			<span slot="footer" class="dialog-footer">
+				<el-button @click="addLocationDialogVisible = false">取 消</el-button>
+				<el-button type="primary" @click="addLocationSubm">确 定</el-button>
+			</span>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+export default {
+	props: {
+		flag: {
+			flag: Boolean,
+			siteID: Number
+		},
+	},
+	filters: {
+		ellipsis(value) {
+			if (!value) return ''
+			if (value.length > 10) {
+				return value.slice(0, 10) + '...'
+			}
+			return value
+		}
+	},
+	data() {
+		return {
+			timeRange: '',
+			queryInfo: {
+				f_id: '',
+				page: 1,
+				device_type_id: '23478',
+				start_time: '',
+				end_time: ''
+			},
+			dataList: [],
+			totalNum: 0,
+			addr: '',
+			locationForm: {
+				lat: '',
+				lng: ''
+			},
+			device_id: '',
+			mapZoom: 6,
+			point: { lng: '', lat: '' },
+			center: { lng: '', lat: '' },
+			addLocationDialogVisible: false,
+			objData: {},
+		}
+	},
+	mounted() {
+		this.getEquipList()
+	},
+	beforeMount() {},
+	methods: {
+		//获取设备列表
+		getEquipList(obj, page) {
+			console.log("111111111111",this.queryInfo.device_type_id)
+			if (obj) {
+				console.log(obj)
+				this.queryInfo.page = page
+				this.objData = obj
+			}
+
+			var id = ''
+			if (this.objData !== undefined) {
+				id = this.objData.id
+			} else if (obj !== undefined) {
+				id = obj.id
+			}
+			this.$axios({
+				method: 'POST',
+				url: '/equiplist_filter',
+				data: this.qs.stringify({
+					f_type: this.queryInfo.device_type_id,//设备id
+					f_id: this.queryInfo.f_id,
+					page_size: 12,
+					f_tbegin: this.queryInfo.start_time,
+					f_tend: this.queryInfo.end_time,
+					page: this.queryInfo.page,
+					// site_id: obj == undefined ? '' : obj.id,
+					site_id: id,
+				})
+			}).then((res) => {
+				this.dataList = res.data.dat
+				this.totalNum = res.data.nums
+				console.log(this.dataList);
+			})
+		},
+		searchChange() {
+			this.queryInfo.page = 1
+			this.getEquipList()
+		},
+		DateChange(val) {
+			this.queryInfo.page = 1
+			if (this.timeRange) {
+				this.queryInfo.start_time = new Date(this.timeRange[0])
+					.toLocaleDateString()
+					.replace(/\//g, '-')
+				this.queryInfo.end_time = new Date(this.timeRange[1])
+					.toLocaleDateString()
+					.replace(/\//g, '-')
+				this.getEquipList()
+			} else {
+				this.queryInfo.start_time = ''
+				this.queryInfo.end_time = ''
+				this.getEquipList()
+			}
+		},
+		//在地图中点击定位
+		locationPoint(e) {
+			let { point } = e
+			this.point = point
+			this.locationForm = point
+			this.map.clearOverlays()
+			this.map.addOverlay(new BMap.Marker(this.point))
+		},
+		addrChange() {
+			let local = new this.BMap.LocalSearch(this.map, {
+				renderOptions: { map: this.map, panel: 'r-result' }
+			})
+			local.search(this.addr)
+		},
+		// 修改设备名称
+		modifyName(id, device_name) {
+			let value = device_name
+			this.$prompt('', '修改名字', {
+				confirmButtonText: '确定',
+				cancelButtonText: '取消',
+				inputPlaceholder: device_name
+			})
+				.then(({ value }) => {
+					if (value) {
+						this.$axios({
+							method: 'POST',
+							url: '/equiplist',
+							data: this.qs.stringify({
+								req: 'rename',
+								ename: value,
+								eid: id
+							})
+						}).then((res) => {
+							if (res.data == 0) {
+								this.getList()
+								this.$message({
+									type: 'success',
+									message: '修改成功'
+								})
+							}
+						})
+					} else {
+						this.$message({
+							type: 'info',
+							message: '内容不能为空'
+						})
+					}
+				})
+				.catch(() => {
+					this.$message({
+						type: 'info',
+						message: '取消输入'
+					})
+				})
+		},
+		//通过经纬度搜索定位
+		locationSearch() {
+			if (this.locationForm.lat && this.locationForm.lng) {
+				this.point = this.locationForm
+				this.map.clearOverlays()
+				this.map.addOverlay(new BMap.Marker(this.point))
+			}
+		},
+		handlerBMap({ BMap, map }) {
+			this.BMap = BMap
+			this.map = map
+			let point = new BMap.Point(this.point.lng, this.point.lat)
+			map.centerAndZoom(point, 15)
+		},
+		//点击“添加定位”按钮
+		addPosition(device_id, lng, lat) {
+			this.device_id = device_id
+			this.point = { lng, lat }
+			this.addLocationDialogVisible = true
+		},
+		changePage(val) {
+			console.log(val)
+			this.queryInfo.page = val
+			this.getEquipList()
+		},
+		//关闭定位弹框时调用
+		addLocationDialogClosed() {
+			this.locationForm = { lat: '', lng: '' }
+			this.point = { lng: '', lat: '' }
+			this.center = { lng: 113.271429, lat: 23.135336 }
+
+			//   this.map.clearOverlays();
+			this.map = null
+			this.BMap = null
+		},
+		//选择定位点后，提交
+		addLocationSubm() {
+			console.log(this.point)
+			this.$axios({
+				method: 'POST',
+				url: '/api_gateway?method=forecast.worm_lamp.revise_device',
+				data: this.qs.stringify({
+					device_id: this.device_id,
+					lat: this.point.lat,
+					lng: this.point.lng
+				})
+			}).then((res) => {
+				if (res.data.message == '') {
+					this.getEquipList()
+					this.$message({
+						type: 'success',
+						message: '定位成功'
+					})
+				} else {
+					this.$message({
+						type: 'error',
+						message: '定位失败'
+					})
+				}
+			})
+			this.addLocationDialogVisible = false
+		}
+	}
+}
+</script>
+
+<style lang='less' scoped>
+.search-box {
+	display: flex;
+	justify-content: flex-end;
+	margin-bottom: 10px;
+	.filter-box > div {
+		margin-right: 15px;
+	}
+	.el-input {
+		width: 200px;
+		
+	}
+	.el-date-editor--daterange {
+		width: 222px;
+	}
+	/deep/.el-input__inner{
+		background: #E5E7FF;
+		color: #5361FF;
+		border: none;
+	}
+	/deep/.el-input__inner::placeholder{
+		color: #5361FF;
+	}
+	/deep/.el-input__inner::-moz-placeholder{
+		color: #5361FF;
+	}
+	/deep/.el-input__inner::-webkit-input-placeholder{
+		color: #5361FF;
+	}
+	/deep/.el-input__inner::-ms-input-placeholder{
+		color: #5361FF;
+	}
+	/deep/.el-input__icon{
+		color: #5361FF;
+	}
+	/deep/.el-range-input{
+		color: #5361FF;
+		background: #E5E7FF;
+	}
+	/deep/.el-range-input::placeholder{
+		color: #5361FF;
+	}
+	/deep/.el-range-input::-moz-placeholder{
+		color: #5361FF;
+	}
+	/deep/.el-range-input::-webkit-input-placeholder{
+		color: #5361FF;
+	}
+	/deep/.el-range-input::-ms-input-placeholder{
+		color: #5361FF;
+	}
+}
+.el-card.selected {
+	border: 1px solid #14a478;
+}
+.el-card {
+	.img-box {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		img {
+			width: 20px;
+		}
+		p {
+			font-size: 26px;
+			font-weight: normal;
+			// margin-top: 10px;
+		}
+	}
+	.detail {
+		// border-bottom: 1px solid #e1e1e1;
+		// padding: 10px 0;
+		// padding: 0 20px;
+		p {
+			
+			font-size: 12px;
+			line-height: 20px;
+			color: white;
+		}
+	}
+	.bottom {
+		display: flex;
+		font-size: 13px;
+		color: #666;
+		line-height: 50px;
+		span {
+			flex: 1;
+			text-align: center;
+			cursor: pointer;
+			i {
+				font-size: 16px;
+			}
+		}
+		span:first-child {
+			border-right: 1px solid #e1e1e1;
+		}
+	}
+}
+.Bmap {
+	width: 100%;
+	height: 400px;
+}
+.map_dialog /deep/ .el-dialog__body {
+	padding: 20px 20px 0 20px;
+}
+// 暂无数据
+.expertDiagnosis_referral_units_not {
+	width: 272px;
+	margin: 0 auto;
+}
+
+.breadcrumb_tab {
+	top: 60px !important;
+}
+
+.el-card.box-card{
+	overflow: visible;
+	height: 102px;
+	// margin-bottom: 110px;
+	box-shadow: 0px 18px 12px 0px rgba(82,97,255,0.46), 0px 0px 36px 0px rgba(72,68,219,0.19);
+	/deep/.el-card__body{
+		width: 312px;
+		height: 140px;
+		position: absolute;
+		left: 50%;
+		top: 50%;
+		transform: translate(-50%,-50%);
+		-webkit-transform: translate(-50%,-50%);
+		-moz-transform: translate(-50%,-50%);
+		-ms-transform: translate(-50%,-50%);
+		background: url(../../assets/images/cure/scd/cardBG.png) no-repeat;
+		background-size: cover;
+		// background: linear-gradient(189deg, #40A4F7 0%, #5261FF 100%);
+		box-shadow: 0px 18px 12px 0px rgba(82,97,255,0.46);
+		border-radius: 10px;
+		color: white;
+		padding: 15px;
+	}
+}
+</style>