init
This commit is contained in:
commit
01e645d900
|
|
@ -0,0 +1,18 @@
|
|||
{
|
||||
"presets": [
|
||||
["env", {
|
||||
"modules": false,
|
||||
"targets": {
|
||||
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
|
||||
}
|
||||
}],
|
||||
"stage-2"
|
||||
],
|
||||
"plugins": ["transform-vue-jsx", "transform-runtime"],
|
||||
"env": {
|
||||
"test": {
|
||||
"presets": ["env", "stage-2"],
|
||||
"plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "dynamic-import-node"]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
build/*.js
|
||||
src/assets
|
||||
public
|
||||
dist
|
||||
|
|
@ -0,0 +1,198 @@
|
|||
module.exports = {
|
||||
root: true,
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint',
|
||||
sourceType: 'module'
|
||||
},
|
||||
env: {
|
||||
browser: true,
|
||||
node: true,
|
||||
es6: true
|
||||
},
|
||||
extends: ['plugin:vue/recommended', 'eslint:recommended'],
|
||||
|
||||
// add your custom rules here
|
||||
// it is base on https://github.com/vuejs/eslint-config-vue
|
||||
rules: {
|
||||
'vue/max-attributes-per-line': [2, {
|
||||
'singleline': 10,
|
||||
'multiline': {
|
||||
'max': 1,
|
||||
'allowFirstLine': false
|
||||
}
|
||||
}],
|
||||
'vue/singleline-html-element-content-newline': 'off',
|
||||
'vue/multiline-html-element-content-newline': 'off',
|
||||
'vue/name-property-casing': ['error', 'PascalCase'],
|
||||
'vue/no-v-html': 'off',
|
||||
'accessor-pairs': 2,
|
||||
'arrow-spacing': [2, {
|
||||
'before': true,
|
||||
'after': true
|
||||
}],
|
||||
'block-spacing': [2, 'always'],
|
||||
'brace-style': [2, '1tbs', {
|
||||
'allowSingleLine': true
|
||||
}],
|
||||
'camelcase': [0, {
|
||||
'properties': 'always'
|
||||
}],
|
||||
'comma-dangle': [2, 'never'],
|
||||
'comma-spacing': [2, {
|
||||
'before': false,
|
||||
'after': true
|
||||
}],
|
||||
'comma-style': [2, 'last'],
|
||||
'constructor-super': 2,
|
||||
'curly': [2, 'multi-line'],
|
||||
'dot-location': [2, 'property'],
|
||||
'eol-last': 2,
|
||||
'eqeqeq': ['error', 'always', { 'null': 'ignore' }],
|
||||
'generator-star-spacing': [2, {
|
||||
'before': true,
|
||||
'after': true
|
||||
}],
|
||||
'handle-callback-err': [2, '^(err|error)$'],
|
||||
'indent': [2, 2, {
|
||||
'SwitchCase': 1
|
||||
}],
|
||||
'jsx-quotes': [2, 'prefer-single'],
|
||||
'key-spacing': [2, {
|
||||
'beforeColon': false,
|
||||
'afterColon': true
|
||||
}],
|
||||
'keyword-spacing': [2, {
|
||||
'before': true,
|
||||
'after': true
|
||||
}],
|
||||
'new-cap': [2, {
|
||||
'newIsCap': true,
|
||||
'capIsNew': false
|
||||
}],
|
||||
'new-parens': 2,
|
||||
'no-array-constructor': 2,
|
||||
'no-caller': 2,
|
||||
'no-console': 'off',
|
||||
'no-class-assign': 2,
|
||||
'no-cond-assign': 2,
|
||||
'no-const-assign': 2,
|
||||
'no-control-regex': 0,
|
||||
'no-delete-var': 2,
|
||||
'no-dupe-args': 2,
|
||||
'no-dupe-class-members': 2,
|
||||
'no-dupe-keys': 2,
|
||||
'no-duplicate-case': 2,
|
||||
'no-empty-character-class': 2,
|
||||
'no-empty-pattern': 2,
|
||||
'no-eval': 2,
|
||||
'no-ex-assign': 2,
|
||||
'no-extend-native': 2,
|
||||
'no-extra-bind': 2,
|
||||
'no-extra-boolean-cast': 2,
|
||||
'no-extra-parens': [2, 'functions'],
|
||||
'no-fallthrough': 2,
|
||||
'no-floating-decimal': 2,
|
||||
'no-func-assign': 2,
|
||||
'no-implied-eval': 2,
|
||||
'no-inner-declarations': [2, 'functions'],
|
||||
'no-invalid-regexp': 2,
|
||||
'no-irregular-whitespace': 2,
|
||||
'no-iterator': 2,
|
||||
'no-label-var': 2,
|
||||
'no-labels': [2, {
|
||||
'allowLoop': false,
|
||||
'allowSwitch': false
|
||||
}],
|
||||
'no-lone-blocks': 2,
|
||||
'no-mixed-spaces-and-tabs': 2,
|
||||
'no-multi-spaces': 2,
|
||||
'no-multi-str': 2,
|
||||
'no-multiple-empty-lines': [2, {
|
||||
'max': 1
|
||||
}],
|
||||
'no-native-reassign': 2,
|
||||
'no-negated-in-lhs': 2,
|
||||
'no-new-object': 2,
|
||||
'no-new-require': 2,
|
||||
'no-new-symbol': 2,
|
||||
'no-new-wrappers': 2,
|
||||
'no-obj-calls': 2,
|
||||
'no-octal': 2,
|
||||
'no-octal-escape': 2,
|
||||
'no-path-concat': 2,
|
||||
'no-proto': 2,
|
||||
'no-redeclare': 2,
|
||||
'no-regex-spaces': 2,
|
||||
'no-return-assign': [2, 'except-parens'],
|
||||
'no-self-assign': 2,
|
||||
'no-self-compare': 2,
|
||||
'no-sequences': 2,
|
||||
'no-shadow-restricted-names': 2,
|
||||
'no-spaced-func': 2,
|
||||
'no-sparse-arrays': 2,
|
||||
'no-this-before-super': 2,
|
||||
'no-throw-literal': 2,
|
||||
'no-trailing-spaces': 2,
|
||||
'no-undef': 2,
|
||||
'no-undef-init': 2,
|
||||
'no-unexpected-multiline': 2,
|
||||
'no-unmodified-loop-condition': 2,
|
||||
'no-unneeded-ternary': [2, {
|
||||
'defaultAssignment': false
|
||||
}],
|
||||
'no-unreachable': 2,
|
||||
'no-unsafe-finally': 2,
|
||||
'no-unused-vars': [2, {
|
||||
'vars': 'all',
|
||||
'args': 'none'
|
||||
}],
|
||||
'no-useless-call': 2,
|
||||
'no-useless-computed-key': 2,
|
||||
'no-useless-constructor': 2,
|
||||
'no-useless-escape': 0,
|
||||
'no-whitespace-before-property': 2,
|
||||
'no-with': 2,
|
||||
'one-var': [2, {
|
||||
'initialized': 'never'
|
||||
}],
|
||||
'operator-linebreak': [2, 'after', {
|
||||
'overrides': {
|
||||
'?': 'before',
|
||||
':': 'before'
|
||||
}
|
||||
}],
|
||||
'padded-blocks': [2, 'never'],
|
||||
'quotes': [2, 'single', {
|
||||
'avoidEscape': true,
|
||||
'allowTemplateLiterals': true
|
||||
}],
|
||||
'semi': [2, 'never'],
|
||||
'semi-spacing': [2, {
|
||||
'before': false,
|
||||
'after': true
|
||||
}],
|
||||
'space-before-blocks': [2, 'always'],
|
||||
'space-before-function-paren': [2, 'never'],
|
||||
'space-in-parens': [2, 'never'],
|
||||
'space-infix-ops': 2,
|
||||
'space-unary-ops': [2, {
|
||||
'words': true,
|
||||
'nonwords': false
|
||||
}],
|
||||
'spaced-comment': [2, 'always', {
|
||||
'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
|
||||
}],
|
||||
'template-curly-spacing': [2, 'never'],
|
||||
'use-isnan': 2,
|
||||
'valid-typeof': 2,
|
||||
'wrap-iife': [2, 'any'],
|
||||
'yield-star-spacing': [2, 'both'],
|
||||
'yoda': [2, 'never'],
|
||||
'prefer-const': 2,
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
|
||||
'object-curly-spacing': [2, 'always', {
|
||||
objectsInObjects: false
|
||||
}],
|
||||
'array-bracket-spacing': [2, 'never']
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
.DS_Store
|
||||
node_modules/
|
||||
/dist/
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
/test/unit/coverage/
|
||||
/test/e2e/reports/
|
||||
selenium-debug.log
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
// https://github.com/michael-ciniawsky/postcss-load-config
|
||||
|
||||
module.exports = {
|
||||
"plugins": {
|
||||
"postcss-import": {},
|
||||
"postcss-url": {},
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
"autoprefixer": {}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
# vue-cil2.0-template
|
||||
|
||||
> A Vue.js project
|
||||
|
||||
## Build Setup
|
||||
|
||||
``` bash
|
||||
# install dependencies
|
||||
npm install
|
||||
|
||||
# serve with hot reload at localhost:8080
|
||||
npm run dev
|
||||
|
||||
# build for production with minification
|
||||
npm run build
|
||||
|
||||
# build for production and view the bundle analyzer report
|
||||
npm run build --report
|
||||
|
||||
# run unit tests
|
||||
npm run unit
|
||||
|
||||
# run e2e tests
|
||||
npm run e2e
|
||||
|
||||
# run all tests
|
||||
npm test
|
||||
```
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
module.exports = {
|
||||
presets: ["@babel/preset-env"],
|
||||
};
|
||||
|
|
@ -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'
|
||||
))
|
||||
})
|
||||
})
|
||||
|
|
@ -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)
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
|
|
@ -0,0 +1,102 @@
|
|||
'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,
|
||||
publicPath:'../../',
|
||||
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')
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -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'
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,91 @@
|
|||
'use strict'
|
||||
const path = require('path')
|
||||
const utils = require('./utils')
|
||||
const config = require('../config')
|
||||
var webpack = require("webpack");
|
||||
const vueLoaderConfig = require('./vue-loader.conf')
|
||||
|
||||
function resolve (dir) {
|
||||
return path.join(__dirname, '..', dir)
|
||||
}
|
||||
|
||||
|
||||
|
||||
module.exports = {
|
||||
context: path.resolve(__dirname, '../'),
|
||||
entry: {
|
||||
app: './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'),
|
||||
'jquery': 'jquery'
|
||||
}
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.vue$/,
|
||||
loader: 'vue-loader',
|
||||
options: vueLoaderConfig
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
loader: 'babel-loader',
|
||||
// include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')],
|
||||
exclude: /node_modules/, // 排除node_modules代码不编译
|
||||
},
|
||||
{
|
||||
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'
|
||||
},
|
||||
plugins: [
|
||||
new webpack.ProvidePlugin({
|
||||
$: "jquery",
|
||||
jQuery: "jquery"
|
||||
}),
|
||||
]
|
||||
}
|
||||
|
|
@ -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)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
|
@ -0,0 +1,149 @@
|
|||
'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 = process.env.NODE_ENV === 'testing'
|
||||
? require('../config/test.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: process.env.NODE_ENV === 'testing'
|
||||
? 'index.html'
|
||||
: 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
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
'use strict'
|
||||
const merge = require('webpack-merge')
|
||||
const prodEnv = require('./prod.env')
|
||||
|
||||
module.exports = merge(prodEnv, {
|
||||
NODE_ENV: '"development"',
|
||||
// 测试环境1
|
||||
// VUE_APP_BASE_API: '"/service"',
|
||||
// VUE_APP_FULL_API: '"http://10.10.150.160:5555"',
|
||||
// VUE_APP_BASE_API_FRONT: '"http://10.10.150.128:8080/satellitePub/pub/index.html"',
|
||||
// VUE_APP_FILE_API: '"http://10.10.150.160:5555/archives"',
|
||||
// VUE_APP_FLAG_API: '"http://10.10.150.237/login?service=http://10.10.150.160:5555/api/login/cas&sign="',
|
||||
// VUE_APP_CAS_LOGIN_FRONT: '"http://10.10.150.237/login?service=http://10.10.150.160:5555/api/login/cas?sign=asos_client"',
|
||||
// VUE_APP_CAS_LOGIN_BACK: '"http://10.10.150.237/login?service=http://10.10.150.160:5555/api/login/cas?sign=asos_service"',
|
||||
// VUE_APP_CAS_LOGOUT_URL_FRONT: '"http://10.10.150.160:5555/api/login/validate?sign=asos_client"',
|
||||
// VUE_APP_CAS_LOGOUT_URL_BACK: '"http://10.10.150.160:5555/api/login/validate?sign=asos_service"',
|
||||
// VUE_APP_API_URL: '"http://10.10.150.237/"'
|
||||
|
||||
VUE_APP_BASE_API: '"/api"',
|
||||
VUE_APP_BASE_APIURL: '"http://10.0.90.70/api"',
|
||||
VUE_APP_FULL_API: '"http://10.10.151.5:5555"',
|
||||
VUE_APP_BASE_API_FRONT: '"http://10.10.150.128:8080/satellitePub/pub/index.html"',
|
||||
VUE_APP_FILE_API: '"http://10.10.151.5:5555/archives"',
|
||||
VUE_APP_FLAG_API: '"http://10.10.150.237/login?service=http://10.10.151.5:5555/api/login/cas&sign="',
|
||||
VUE_APP_CAS_LOGIN_FRONT: '"http://10.10.150.237/login?service=http://10.10.151.5:5555/api/login/cas?sign=asos_client"',
|
||||
VUE_APP_CAS_LOGIN_BACK: '"http://10.10.150.237/login?service=http://10.10.151.5:5555/api/login/cas?sign=asos_service"',
|
||||
VUE_APP_CAS_LOGOUT_URL_FRONT: '"http://10.10.151.5:5555/api/login/validate?sign=asos_client"',
|
||||
VUE_APP_CAS_LOGOUT_URL_BACK: '"http://10.10.151.5:5555/api/login/validate?sign=asos_service"',
|
||||
VUE_APP_API_URL: '"http://10.10.150.237/"'
|
||||
})
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
'use strict'
|
||||
// Template version: 1.3.1
|
||||
// see http://vuejs-templates.github.io/webpack for documentation.
|
||||
|
||||
const path = require('path')
|
||||
|
||||
module.exports = {
|
||||
dev: {
|
||||
|
||||
// Paths
|
||||
assetsSubDirectory: 'static',
|
||||
assetsPublicPath: '/',
|
||||
proxyTable: {
|
||||
'/api': {
|
||||
// target: 'http://120.48.105.88', // 线上
|
||||
// target: 'http://10.0.90.70', // 测试环境
|
||||
target: 'http://1.95.42.191:8080', // 测试环境
|
||||
changeOrigin: true, // 是否跨域
|
||||
secure: false, // 是否使用https
|
||||
pathRewrite: {
|
||||
'^/api': '' // 线上
|
||||
// '^/service': '/service' //线上
|
||||
}
|
||||
},
|
||||
'/geoserver': {
|
||||
// target: 'http://120.48.105.88', // 线上
|
||||
target: 'http://124.16.219.154:8080', // 测试环境
|
||||
changeOrigin: true, // 是否跨域
|
||||
secure: false, // 是否使用https
|
||||
pathRewrite: {
|
||||
'^/geoserver': '/geoserver' // 线上
|
||||
// '^/service': '/service' //线上
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// Various Dev Server settings
|
||||
host: 'localhost', // can be overwritten by process.env.HOST
|
||||
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
|
||||
autoOpenBrowser: false,
|
||||
errorOverlay: true,
|
||||
notifyOnErrors: true,
|
||||
poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
|
||||
|
||||
/**
|
||||
* Source Maps
|
||||
*/
|
||||
|
||||
// https://webpack.js.org/configuration/devtool/#development
|
||||
devtool: 'cheap-module-eval-source-map',
|
||||
|
||||
// If you have problems debugging vue-files in devtools,
|
||||
// set this to false - it *may* help
|
||||
// https://vue-loader.vuejs.org/en/options.html#cachebusting
|
||||
cacheBusting: true,
|
||||
|
||||
cssSourceMap: true
|
||||
},
|
||||
|
||||
build: {
|
||||
// Template for index.html
|
||||
index: path.resolve(__dirname, '../dist/index.html'),
|
||||
|
||||
// Paths
|
||||
assetsRoot: path.resolve(__dirname, '../dist'),
|
||||
assetsSubDirectory: 'static',
|
||||
assetsPublicPath: './',
|
||||
|
||||
/**
|
||||
* Source Maps
|
||||
*/
|
||||
|
||||
productionSourceMap: true,
|
||||
// https://webpack.js.org/configuration/devtool/#production
|
||||
devtool: '#source-map',
|
||||
|
||||
// Gzip off by default as many popular static hosts such as
|
||||
// Surge or Netlify already gzip all static assets for you.
|
||||
// Before setting to `true`, make sure to:
|
||||
// npm install --save-dev compression-webpack-plugin
|
||||
productionGzip: false,
|
||||
productionGzipExtensions: ['js', 'css'],
|
||||
|
||||
// Run the build command with an extra argument to
|
||||
// View the bundle analyzer report after build finishes:
|
||||
// `npm run build --report`
|
||||
// Set to `true` or `false` to always turn it on or off
|
||||
bundleAnalyzerReport: process.env.npm_config_report
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
'use strict'
|
||||
module.exports = {
|
||||
NODE_ENV: '"production"',
|
||||
|
||||
// 测试环境
|
||||
// VUE_APP_BASE_API: '"127.0.0.1"', // 打包环境
|
||||
// VUE_APP_BASE_APIURL: '"127.0.0.1"', // 打包环境
|
||||
// VUE_APP_BASE_API: '"http://10.0.90.70/api"', // 测试环境
|
||||
// VUE_APP_BASE_APIURL: '"http://10.0.90.70/api"', // 测试环境
|
||||
// VUE_APP_BASE_API: '"http://120.48.105.88/api"', // 生产环境
|
||||
// VUE_APP_BASE_APIURL: '"http://120.48.105.88/api"', // 生产环境
|
||||
// VUE_APP_BASE_API: '"http://120.48.105.88/api"', // 生产环境
|
||||
// VUE_APP_BASE_APIURL: '"http://120.48.105.88/api"', // 生产环境
|
||||
VUE_APP_BASE_API: '"/api"', // 生产环境
|
||||
VUE_APP_BASE_APIURL: '"http://1.95.42.191:8080/api"', // 生产环境
|
||||
VUE_APP_FULL_API: '"http://10.10.151.3:5555"',
|
||||
VUE_APP_BASE_API_FRONT: '"http://10.10.150.128:8080/satellitePub/pub/index.html"',
|
||||
VUE_APP_CAS_LOGIN_FRONT: '"http://10.10.150.237/login?service=http://10.10.151.3:5555/api/login/cas?sign=asos_client"',
|
||||
VUE_APP_CAS_LOGIN_BACK: '"http://10.10.150.237/login?service=http://10.10.151.3:5555/api/login/cas?sign=asos_service"',
|
||||
VUE_APP_CAS_LOGOUT_URL_FRONT: '"http://10.10.151.3:5555/api/login/validate?sign=asos_client"',
|
||||
VUE_APP_CAS_LOGOUT_URL_BACK: '"http://10.10.151.3:5555/api/login/validate?sign=asos_service"',
|
||||
VUE_APP_API_URL: '"http://10.10.150.237/"'
|
||||
|
||||
// 生产环境
|
||||
// VUE_APP_BASE_API: '"http://10.0.7.30:5555"',
|
||||
// VUE_APP_FULL_API: '"http://10.0.7.30:5555"',
|
||||
// VUE_APP_BASE_API_FRONT: '"http://10.10.150.128:8080/satellitePub/pub/index.html"',
|
||||
// VUE_APP_CAS_LOGIN_FRONT: '"https://umt.nssdc.ac.cn/login?service=http://10.0.7.30:5555/api/login/cas?sign=asos_client"',
|
||||
// VUE_APP_CAS_LOGIN_BACK: '"https://umt.nssdc.ac.cn/login?service=http://10.0.7.30:5555/api/login/cas?sign=asos_service"',
|
||||
// VUE_APP_CAS_LOGOUT_URL_FRONT: '"http://10.0.7.30:5555/api/login/validate?sign=asos_client"',
|
||||
// VUE_APP_CAS_LOGOUT_URL_BACK: '"http://10.0.7.30:5555/api/login/validate?sign=asos_service"',
|
||||
// VUE_APP_API_URL: '"https://umt.nssdc.ac.cn/"'
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
'use strict'
|
||||
const merge = require('webpack-merge')
|
||||
const devEnv = require('./dev.env')
|
||||
|
||||
module.exports = merge(devEnv, {
|
||||
NODE_ENV: '"testing"'
|
||||
})
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<title>vue-cil2.0-template</title>
|
||||
<link rel="stylesheet" href="./static/css/reset.css">
|
||||
<link rel="stylesheet" href="./static/js/Cesium-1.53/Build/Cesium/Widgets/widgets.css">
|
||||
<script type="text/javascript" src="./static/js/Cesium-1.53/Build/CesiumUnminified/Cesium.js"></script>
|
||||
<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=uu7pXHZLZOejrWXyTK2lVMHASObAg8Fz"></script>
|
||||
<!-- <script src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script> -->
|
||||
<!-- <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIzaSyD9kf3RTO2HwggOQ1_fbZawfiKzyBNPXeY"></script> -->
|
||||
<!-- <script type="text/javascript" src="http://124.16.219.154:8080/geoserver/gwc/service/wmts?service=WMTS&version=1.1.1&request=GetCapabilities"></script> -->
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,102 @@
|
|||
{
|
||||
"name": "asos-satellite-release",
|
||||
"version": "1.0.0",
|
||||
"description": "A Vue.js project",
|
||||
"author": "zlluGitHub <18230086651@163.com>",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
|
||||
"start": "npm run dev",
|
||||
"unit": "jest --config test/unit/jest.conf.js --coverage",
|
||||
"e2e": "node test/e2e/runner.js",
|
||||
"test": "npm run unit && npm run e2e",
|
||||
"build": "node build/build.js",
|
||||
"lint": "eslint --ext .js,.vue src --fix"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.2",
|
||||
"baidu-map": "^0.1.4",
|
||||
"cesium": "^1.117.0",
|
||||
"echarts": "^4.9.0",
|
||||
"echarts-gl": "^1.1.0",
|
||||
"element-ui": "^2.13.0",
|
||||
"js-cookie": "^2.2.0",
|
||||
"js-pinyin": "^0.1.9",
|
||||
"leaflet": "^1.9.4",
|
||||
"leaflet.wmts": "^1.0.2",
|
||||
"node-sass": "^4.12.0",
|
||||
"ol": "6.4.0",
|
||||
"sass-loader": "^7.1.0",
|
||||
"swiper": "^6.8.4",
|
||||
"vue": "^2.5.2",
|
||||
"vue-awesome-swiper": "^3.1.3",
|
||||
"vue-baidu-map": "^0.21.22",
|
||||
"vue-router": "^3.0.1",
|
||||
"vue2-google-maps": "^0.10.7",
|
||||
"vuex": "^3.1.1",
|
||||
"xml2js": "^0.6.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.24.5",
|
||||
"@babel/preset-env": "^7.24.5",
|
||||
"autoprefixer": "^7.1.2",
|
||||
"babel-core": "^6.22.1",
|
||||
"babel-eslint": "10.0.1",
|
||||
"babel-helper-vue-jsx-merge-props": "^2.0.3",
|
||||
"babel-jest": "^21.0.2",
|
||||
"babel-loader": "^7.1.5",
|
||||
"babel-plugin-dynamic-import-node": "^1.2.0",
|
||||
"babel-plugin-syntax-jsx": "^6.18.0",
|
||||
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
|
||||
"babel-plugin-transform-runtime": "^6.22.0",
|
||||
"babel-plugin-transform-vue-jsx": "^3.5.0",
|
||||
"babel-preset-env": "^1.3.2",
|
||||
"babel-preset-stage-2": "^6.22.0",
|
||||
"babel-register": "^6.22.0",
|
||||
"chalk": "^2.0.1",
|
||||
"chromedriver": "^2.27.2",
|
||||
"copy-webpack-plugin": "^4.0.1",
|
||||
"cross-spawn": "^5.0.1",
|
||||
"css-loader": "^0.28.0",
|
||||
"eslint": "^7.28.0",
|
||||
"eslint-plugin-vue": "^7.11.1",
|
||||
"extract-text-webpack-plugin": "^3.0.0",
|
||||
"file-loader": "^1.1.4",
|
||||
"friendly-errors-webpack-plugin": "^1.6.1",
|
||||
"html-webpack-plugin": "^2.30.1",
|
||||
"jest": "^22.0.4",
|
||||
"jest-serializer-vue": "^0.3.0",
|
||||
"jquery": "^3.6.0",
|
||||
"nightwatch": "^0.9.12",
|
||||
"node-notifier": "^5.1.2",
|
||||
"optimize-css-assets-webpack-plugin": "^3.2.0",
|
||||
"ora": "^1.2.0",
|
||||
"portfinder": "^1.0.13",
|
||||
"postcss-import": "^11.0.0",
|
||||
"postcss-loader": "^2.0.8",
|
||||
"postcss-url": "^7.2.1",
|
||||
"rimraf": "^2.6.0",
|
||||
"selenium-server": "^3.0.1",
|
||||
"semver": "^5.3.0",
|
||||
"shelljs": "^0.7.6",
|
||||
"uglifyjs-webpack-plugin": "^1.1.1",
|
||||
"url-loader": "^0.5.8",
|
||||
"vue-jest": "^1.0.2",
|
||||
"vue-loader": "^13.3.0",
|
||||
"vue-style-loader": "^3.0.1",
|
||||
"vue-template-compiler": "^2.5.2",
|
||||
"webpack": "^3.6.0",
|
||||
"webpack-bundle-analyzer": "^2.9.0",
|
||||
"webpack-dev-server": "^2.9.1",
|
||||
"webpack-merge": "^4.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 6.0.0",
|
||||
"npm": ">= 3.0.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not ie <= 8"
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<template>
|
||||
<div id="app">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'App',
|
||||
// components: {
|
||||
// Main
|
||||
// },
|
||||
mounted() {
|
||||
//* ****************************解决刷新页面数据丢失开始**************************************** */
|
||||
// if (sessionStorage.getItem("store")) {
|
||||
// this.$store.replaceState(
|
||||
// Object.assign(
|
||||
// {},
|
||||
// this.$store.state,
|
||||
// JSON.parse(sessionStorage.getItem("store"))
|
||||
// )
|
||||
// );
|
||||
// sessionStorage.removeItem("store");
|
||||
// }
|
||||
|
||||
// //在页面刷新时将vuex里的信息保存到sessionStorage里
|
||||
// window.addEventListener("beforeunload", () => {
|
||||
// sessionStorage.setItem("store", JSON.stringify(this.$store.state));
|
||||
// });
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
@import '../static/css/iconfont.css';
|
||||
</style>
|
||||
<style lang="scss">
|
||||
@import "../static/css/sidebar.scss";
|
||||
@import "./style/gloable.scss";
|
||||
@import "./style/style.scss";
|
||||
|
||||
</style>
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
||||
|
|
@ -0,0 +1,120 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 字典列表检索
|
||||
export function getDicList(data) {
|
||||
return request({
|
||||
url: '/dic/type/list?' + 'page=' + data.page + '&size=' + data.size + '&type=' + data.type,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 字典删除
|
||||
export function deleteDoc(data) {
|
||||
return request({
|
||||
url: '/dic/type/delete',
|
||||
method: 'post',
|
||||
type: 'application/x-www-form-urlencoded',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 设备类型字典添加
|
||||
export function equAdd(data) {
|
||||
return request({
|
||||
url: '/dic/equ/add',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 设备类型字典修改
|
||||
export function equUpdate(data) {
|
||||
return request({
|
||||
url: '/dic/equ/update',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 参航单位字典添加
|
||||
export function partAdd(data) {
|
||||
return request({
|
||||
url: '/dic/part/add',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 参航单位字典修改
|
||||
export function partUpdate(data) {
|
||||
return request({
|
||||
url: '/dic/part/update',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 平台类型字典添加
|
||||
export function platformAdd(data) {
|
||||
return request({
|
||||
url: '/dic/platform/add',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 平台类型字典修改
|
||||
export function platformUpdate(data) {
|
||||
return request({
|
||||
url: '/dic/platform/update',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 数据样品类型字典添加
|
||||
export function sampleAdd(data) {
|
||||
return request({
|
||||
url: '/dic/sample/add',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 数据样品类型字典修改
|
||||
export function sampleUpdate(data) {
|
||||
return request({
|
||||
url: '/dic/sample/update',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 共享机构字典添加
|
||||
export function shareAdd(data) {
|
||||
return request({
|
||||
url: '/dic/share/add',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 共享机构字典修改
|
||||
export function shareUpdate(data) {
|
||||
return request({
|
||||
url: '/dic/share/update',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 按获取权限1
|
||||
export function getByUname() {
|
||||
return request({
|
||||
url: '/service/api/roles/get-by-uname',
|
||||
method: 'POST'
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,64 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 发布动态配置 检索
|
||||
export function pubDynamicSearch(data) {
|
||||
return request({
|
||||
url: '/Index/search',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// RelatedLinks 检索
|
||||
export function findRelatedLinks(data) {
|
||||
return request({
|
||||
url: '/Index/findRelatedLinks',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 首页轮播图查询信息
|
||||
export function findMovies(data) {
|
||||
return request({
|
||||
url: '/Index/findMovies',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 首页查询统计信息
|
||||
export function dataStatistics(data) {
|
||||
return request({
|
||||
url: '/Index/dataStatistics',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 访问信息入库
|
||||
export function saveVisits(data) {
|
||||
return request({
|
||||
url: '/Index/saveVisits',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 所有航次
|
||||
export function getVoyage() {
|
||||
return request({
|
||||
url: '/remit/voyage/name?type=' + '',
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 某个航次的轨迹
|
||||
export function getVoyageLine(voyageName) {
|
||||
return request({
|
||||
url: '/remit/voyage/tra?voyageName=' + voyageName,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 数据汇交展示列表检索
|
||||
export function getVoyageList(data) {
|
||||
return request({
|
||||
url: '/physical/sample?' + 'page=' + data.page + '&size=' + data.size + '&voyageName=' + data.voyageName + '&equipmentType=' + data.equipmentType + '&platformName=' + data.platformName + '&platformType=' + data.platformType + '&sampleType=' + data.sampleType,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 删除已上传文件
|
||||
export function deleteDoc(data) {
|
||||
return request({
|
||||
url: '/physical/file/delete?' + 'documentId=' + data.documentId,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 文件下载
|
||||
export function downLoadDoc(data) {
|
||||
return request({
|
||||
url: '/physical/file/download?' + 'documentId=' + data.documentId,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 上传文件或文件夹
|
||||
export function physicalUpload(data) {
|
||||
return request({
|
||||
url: '/physical/upload',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 文件详情
|
||||
export function fileDetail(data) {
|
||||
return request({
|
||||
url: '/physical/file/detail?' + 'sampleId=' + data.sampleId + '&type=' + data.type,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,189 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// FAQ保存
|
||||
export function faqConfigSave(data) {
|
||||
return request({
|
||||
url: '/faqConfig/save',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// FAQ检索
|
||||
export function faqConfigSearch(data) {
|
||||
return request({
|
||||
url: '/faqConfig/search',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// FAQ编辑保存
|
||||
export function faqConfigEdit(data) {
|
||||
return request({
|
||||
url: '/faqConfig/edit',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// FAQ删除
|
||||
export function faqConfigDelete(data) {
|
||||
return request({
|
||||
url: '/faqConfig/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// soft 下载
|
||||
export function softwareDownload(data) {
|
||||
return request({
|
||||
url: '/downloadInfo/downloadSoftwareFileOrDocument?id=' + data.id + '&fileFlag=' + data.fileFlag,
|
||||
method: 'GET'
|
||||
})
|
||||
}
|
||||
// soft 文件上传
|
||||
export function fileUpload(data) {
|
||||
return request({
|
||||
url: '/service/softwareConfig/upload',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
// soft 保存
|
||||
export function softwareConfigSave(data) {
|
||||
return request({
|
||||
url: '/service/softwareConfig/save',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
// soft 检索
|
||||
export function softwareConfigSearch(data) {
|
||||
return request({
|
||||
url: '/service/softwareConfig/search',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// soft 编辑文件查询
|
||||
export function softwareEditSearch(data) {
|
||||
return request({
|
||||
url: '/service/softwareConfig/searchSoftwareConfigFileByFk',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// soft 删除上传的文件
|
||||
export function requestDelete(data) {
|
||||
return request({
|
||||
url: '/service/softwareConfig/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// soft 编辑保存
|
||||
export function softwareConfigEdit(data) {
|
||||
return request({
|
||||
url: '/service/softwareConfig/edit',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// soft 删除
|
||||
export function softwareConfigDelete(data) {
|
||||
return request({
|
||||
url: '/service/softwareConfig/deleteSoftwareConfig',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// URL 检索
|
||||
export function urlConfigSearch(data) {
|
||||
return request({
|
||||
url: '/service/urlConfig/search',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// URL 编辑保存
|
||||
export function urlConfigEdit(data) {
|
||||
return request({
|
||||
url: '/service/urlConfig/edit',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// URL 保存
|
||||
export function urlConfigSave(data) {
|
||||
return request({
|
||||
url: '/service/urlConfig/save',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
// URL 删除
|
||||
export function urlConfigDelete(data) {
|
||||
return request({
|
||||
url: '/service/urlConfig/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 发布动态配置 文件上传
|
||||
export function pubDynamicFileUpload(data) {
|
||||
return request({
|
||||
url: '/pubDynamic/upload',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 发布动态配置 保存
|
||||
export function pubDynamicSave(data) {
|
||||
return request({
|
||||
url: '/pubDynamic/save',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 发布动态配置 检索
|
||||
export function pubDynamicSearch(data) {
|
||||
return request({
|
||||
url: '/Index/search',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 发布动态配置 编辑文件查询
|
||||
export function searchPubTrendsConfigFile(data) {
|
||||
return request({
|
||||
url: '/pubDynamic/searchPubTrendsConfigFile',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 发布动态配置 删除上传的文件
|
||||
export function pubDynamicDelete(data) {
|
||||
return request({
|
||||
url: '/pubDynamic/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 发布动态配置 编辑保存
|
||||
export function pubDynamicEdit(data) {
|
||||
return request({
|
||||
url: '/pubDynamic/edit',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 发布动态配置 删除
|
||||
export function deletePubTrendsConfig(data) {
|
||||
return request({
|
||||
url: '/pubDynamic/deletePubTrendsConfig',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 数据及信息检索
|
||||
export function statisticsByMonth(data) {
|
||||
return request({
|
||||
url: '/service/statistic/statisticsByMonth',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// Top5
|
||||
export function getTopData(data) {
|
||||
return request({
|
||||
url: '/service/statistic/statisticsByDate',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 统计个数
|
||||
export function countTotal(data) {
|
||||
return request({
|
||||
url: '/service/statistic/init',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,232 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 航次信息展示列表检索
|
||||
export function getVoyageList(data) {
|
||||
return request({
|
||||
url: '/remit/voyage/list?' + 'page=' + data.page + '&size=' + data.size + '&voyageName=' + data.voyageName,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 航次批量导入
|
||||
export function voyageUpload(data) {
|
||||
return request({
|
||||
url: '/remit/voyage/upload',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'multipart/form-data'
|
||||
})
|
||||
}
|
||||
|
||||
// 航次批量导出
|
||||
export function voyageExport(data) {
|
||||
return request({
|
||||
url: '/remit/voyage/download',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'application/x-www-form-urlencoded',
|
||||
responseType: 'blob'
|
||||
})
|
||||
}
|
||||
|
||||
// 航次信息录入
|
||||
export function voyageAdd(data) {
|
||||
return request({
|
||||
url: '/remit/voyage',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'application/json'
|
||||
})
|
||||
}
|
||||
// 航次信息删除
|
||||
export function deleteVoyageList(data) {
|
||||
return request({
|
||||
url: '/remit/delete/voyage?' + 'voyageName=' + data.voyageName,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 上传文件
|
||||
export function upload(data) {
|
||||
return request({
|
||||
url: '/remit/upload/dir',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'multipart/form-data'
|
||||
})
|
||||
}
|
||||
|
||||
// 参航人员信息录入
|
||||
export function userAdd(data) {
|
||||
return request({
|
||||
url: '/remit/nav/user',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'multipart/form-data'
|
||||
})
|
||||
}
|
||||
|
||||
// 航次信息查看
|
||||
export function voyageShow(data) {
|
||||
return request({
|
||||
url: '/remit/voyage/show?' + 'voyageName=' + data.voyageName,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 航次信息编辑
|
||||
export function voyageUpdate(data) {
|
||||
return request({
|
||||
url: '/remit/voyage/update',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 样本信息展示列表加数据样品编号检索
|
||||
export function getSampleList(data) {
|
||||
return request({
|
||||
url: '/remit/sample/list?' + 'page=' + data.page + '&size=' + data.size + '&sampleNumber=' + data.sampleNumber,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 平台/样本信息录入 第一步保存 返回id1
|
||||
export function platformAdd(data) {
|
||||
return request({
|
||||
url: '/remit/platform',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'application/json'
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
// 设备信息录入 第二步保存 返回id2 入参id:id1
|
||||
export function equAdd(data) {
|
||||
return request({
|
||||
url: '/remit/equ',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'application/json'
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
// 样本信息录入 第三步保存 返回 入参id:id1 id2
|
||||
export function sampleAdd(data) {
|
||||
return request({
|
||||
url: '/remit/sample',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'application/json'
|
||||
})
|
||||
}
|
||||
|
||||
// 样本信息删除
|
||||
export function deleteSampleList(data) {
|
||||
return request({
|
||||
url: '/remit/sample/delete?' + 'sampleId=' + data.sampleId,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 删除已上传文件
|
||||
export function deleteDoc(data) {
|
||||
return request({
|
||||
url: '/remit/delete/doc?' + 'documentId=' + data.documentId,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 样本信息详情查看
|
||||
export function sampleShow(data) {
|
||||
return request({
|
||||
url: '/remit/sample/show?' + 'platformId=' + data.platformId + '&equipmentId=' + data.equipmentId,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 样本信息编辑
|
||||
export function sampleUpdate(data) {
|
||||
return request({
|
||||
url: '/remit/sample/update',
|
||||
method: 'post',
|
||||
type: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 文件下载
|
||||
export function downLoadDoc(data) {
|
||||
return request({
|
||||
url: '/remit/download?' + 'documentId=' + data.documentId,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 查询所有航次
|
||||
export function getAllVoyage() {
|
||||
return request({
|
||||
url: '/remit/voyage/name',
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 查询该航次下的所有资助机构
|
||||
export function getAllVoyageOrg(voyageName) {
|
||||
return request({
|
||||
url: '/remit/voyage/org?voyageName=' + voyageName,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 查询不同type关联的字典表 全部类型
|
||||
export function getDataList(data) {
|
||||
return request({
|
||||
url: '/dic/type/name?type=' + data.type,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 查询不同type关联的字典表 常用类型
|
||||
export function getCommonDataList(data) {
|
||||
return request({
|
||||
url: '/dic/type/usual?type=' + data.type,
|
||||
method: 'get',
|
||||
type: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
}
|
||||
|
||||
// 样本批量导入
|
||||
export function sampleUpload(data) {
|
||||
return request({
|
||||
url: '/remit/sample/upload',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'multipart/form-data'
|
||||
})
|
||||
}
|
||||
|
||||
// 样本批量导出
|
||||
export function sampleExport(data) {
|
||||
return request({
|
||||
url: '/remit/sample/download',
|
||||
method: 'post',
|
||||
data,
|
||||
type: 'application/x-www-form-urlencoded',
|
||||
responseType: 'blob'
|
||||
})
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
|
|
@ -0,0 +1,81 @@
|
|||
<template>
|
||||
<el-breadcrumb class="app-breadcrumb" separator="/">
|
||||
<transition-group name="breadcrumb">
|
||||
<el-breadcrumb-item v-for="(item,index) in levelList" :key="item.path">
|
||||
<span v-if="item.redirect==='noRedirect'||index==levelList.length-1" class="no-redirect">{{ item.meta.title }}</span>
|
||||
<a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
|
||||
</el-breadcrumb-item>
|
||||
</transition-group>
|
||||
<!-- <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>活动列表</el-breadcrumb-item> -->
|
||||
</el-breadcrumb>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pathToRegexp from 'path-to-regexp'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
levelList: null
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route() {
|
||||
this.getBreadcrumb()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getBreadcrumb()
|
||||
},
|
||||
methods: {
|
||||
getBreadcrumb() {
|
||||
// only show routes with meta.title
|
||||
let matched = this.$route.matched.filter(item => item.meta && item.meta.title)
|
||||
const first = matched[0]
|
||||
|
||||
if (!this.isDashboard(first)) {
|
||||
matched = [{ path: '/', meta: { title: '#' }}].concat(matched)
|
||||
}
|
||||
this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
|
||||
},
|
||||
isDashboard(route) {
|
||||
const name = route && route.name
|
||||
if (!name) {
|
||||
return false
|
||||
}
|
||||
return name.trim().toLocaleLowerCase() === 'Dashboard'.toLocaleLowerCase()
|
||||
},
|
||||
pathCompile(path) {
|
||||
// To solve this problem https://github.com/PanJiaChen/vue-element-admin/issues/561
|
||||
const { params } = this.$route
|
||||
var toPath = pathToRegexp.compile(path)
|
||||
return toPath(params)
|
||||
},
|
||||
handleLink(item) {
|
||||
const { redirect, path } = item
|
||||
console.log(item)
|
||||
if (redirect) {
|
||||
this.$router.push(redirect)
|
||||
return
|
||||
}
|
||||
this.$router.push(this.pathCompile(path))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.app-breadcrumb.el-breadcrumb {
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
line-height: 50px;
|
||||
margin-left: 8px;
|
||||
|
||||
.no-redirect {
|
||||
color: #97a8be;
|
||||
cursor: text;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
<template>
|
||||
<div style="padding: 0 15px;" @click="toggleClick">
|
||||
<i class="el-icon-s-unfold hamburger" style="fontSize:20px" :class="{'is-active':isActive}" />
|
||||
<!-- <i class="el-icon-s-fold" v-else></i> -->
|
||||
<!-- <svg
|
||||
:class="{'is-active':isActive}"
|
||||
class="hamburger"
|
||||
viewBox="0 0 1024 1024"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="64"
|
||||
height="64"
|
||||
>
|
||||
<path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
|
||||
</svg> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
export default {
|
||||
name: 'Hamburger',
|
||||
props: {
|
||||
isActive: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'sidebar',
|
||||
'avatar'
|
||||
])
|
||||
},
|
||||
methods: {
|
||||
toggleClick() {
|
||||
this.$emit('toggleClick')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.hamburger {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.hamburger.is-active {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<template>
|
||||
<div>
|
||||
<Header v-if="name!='biologyIndex' && name!='genovariation' && name!='physicalIndex' && name!='physicalDataSearchCTD' && name!='physicalDataDelivery' && name!='phoneVideoIndex'" />
|
||||
<div class="container container_a">
|
||||
<router-view />
|
||||
</div>
|
||||
|
||||
<Footer />
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Footer from './public/Footer'
|
||||
import Header from './public/Header'
|
||||
export default {
|
||||
name: 'Container',
|
||||
components: {
|
||||
Footer,
|
||||
Header
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
ss: 1,
|
||||
name: ''
|
||||
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route: {
|
||||
handler: function() {
|
||||
this.name = this.$route.name
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,138 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-aside width="30%">
|
||||
<h3>列表</h3>
|
||||
<ul>
|
||||
<li v-for="(item,index) in list" :key="index" :class="activeIndex==index?'active':'hh'" @click="handleClick(item.id,index)">
|
||||
{{ item.title }}
|
||||
</li>
|
||||
</ul>
|
||||
</el-aside>
|
||||
<el-main>
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form-item label="篇名">
|
||||
<el-input v-model="form.name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="篇名分词">
|
||||
<el-input v-model="form.keyWord" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div>
|
||||
<h3>文献表格</h3>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column
|
||||
prop="date"
|
||||
label="日期"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="姓名"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="address"
|
||||
label="地址"
|
||||
/>
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<h3>段落内容</h3>
|
||||
<p>
|
||||
哈啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Sections',
|
||||
// props: {
|
||||
// msg: String
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
list: [
|
||||
{
|
||||
title: '标题一',
|
||||
id: '1'
|
||||
},
|
||||
{
|
||||
title: '标题二',
|
||||
id: '2'
|
||||
}
|
||||
],
|
||||
activeIndex: 0,
|
||||
form: {
|
||||
name: '',
|
||||
keyWord: ''
|
||||
},
|
||||
tableData: [{
|
||||
date: '2016-05-02',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄'
|
||||
}, {
|
||||
date: '2016-05-04',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1517 弄'
|
||||
}, {
|
||||
date: '2016-05-01',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1519 弄'
|
||||
}, {
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1516 弄'
|
||||
}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
mounted() {},
|
||||
init() {
|
||||
|
||||
},
|
||||
handleClick(id, index) {
|
||||
this.activeIndex = index
|
||||
console.log('id', id)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.el-main{
|
||||
padding:0;
|
||||
padding:2% 1% 0 5%;
|
||||
}
|
||||
.el-aside{
|
||||
padding:0 4%;
|
||||
}
|
||||
.el-aside ul li{
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-aside ul li:hover{
|
||||
color:blue;
|
||||
}
|
||||
.active{
|
||||
color:blue;
|
||||
}
|
||||
h3{
|
||||
margin-top:30px;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
.el-form label,h3{
|
||||
text-align: left;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
color: rgb(68, 68, 68);
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -0,0 +1,243 @@
|
|||
<template>
|
||||
<div class="footer">
|
||||
<div class="footer_con">
|
||||
<div class="footer_left">
|
||||
<div class="left_top">
|
||||
<a href="###">网站地图</a>
|
||||
</div>
|
||||
<div class="left_list">
|
||||
<ul>
|
||||
|
||||
<li><router-link to="/">首页</router-link></li>
|
||||
<li><router-link to="/">样品发现</router-link></li>
|
||||
<li><router-link to="/">数据资源</router-link></li>
|
||||
<li><router-link to="/">在线服务</router-link></li>
|
||||
<li> <router-link to="/container/news">新闻动态</router-link>
|
||||
</li>
|
||||
<li><router-link to="/">通知公告</router-link></li>
|
||||
<li><router-link to="/">联系我们</router-link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer_right">
|
||||
<div class="right_top">
|
||||
<p>中国科学院深海科学与工程研究所</p>
|
||||
</div>
|
||||
<div class="right_list">
|
||||
<div class="list1">
|
||||
<div class="img">
|
||||
<img src="../../../static/images/lianxi.png" alt="" />
|
||||
</div>
|
||||
<p>联系方式:Email:office@idsse.ac.cn</p>
|
||||
</div>
|
||||
|
||||
<div class="list1">
|
||||
<div class="img">
|
||||
<img src="../../../static/images/address.png" alt="" />
|
||||
</div>
|
||||
<p>地址:三亚市鹿回头路28号</p>
|
||||
</div>
|
||||
|
||||
<div class="list1">
|
||||
<div class="img">
|
||||
<img src="../../../static/images/email.png" alt="" />
|
||||
</div>
|
||||
<p>邮编:572000</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="more">
|
||||
<a href="/">更多 ></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dibu">
|
||||
<div class="dibu_1">
|
||||
<p>中国科学院深海科学与工程研究所.IDSSE</p>
|
||||
</div>
|
||||
<div class="dibu_2">
|
||||
<el-select v-model="value" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
options: [
|
||||
{
|
||||
value: "选项1",
|
||||
label: "英语",
|
||||
},
|
||||
{
|
||||
value: "选项2",
|
||||
label: "中文",
|
||||
},
|
||||
],
|
||||
value: "选项2",
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.footer{
|
||||
width: 100%;
|
||||
height: 320px;
|
||||
background: url(../../../static/images/footBg.jpg) center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 50px;
|
||||
padding-bottom: 20px;
|
||||
.footer_con{
|
||||
margin: auto;
|
||||
width: 1200px;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.footer_left{
|
||||
width: 405px;
|
||||
height: 140px;
|
||||
border-right: 1px solid #34455d;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.left_top{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 20px;
|
||||
a{
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.left_list{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
ul{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
li{
|
||||
width: 31%;
|
||||
height: auto;
|
||||
margin-bottom: 20px;
|
||||
a{
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.footer_right{
|
||||
width: 720px;
|
||||
height: 140px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.right_top{
|
||||
margin-bottom: 20px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
p{
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.right_list{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
.list1{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 33%;
|
||||
&:nth-child(1){
|
||||
width: 45%;
|
||||
}
|
||||
.img{
|
||||
margin-right: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: #263954;
|
||||
border-radius: 50%;
|
||||
// img{
|
||||
// width: 90%;
|
||||
// height: 90%;
|
||||
// object-fit: contain;
|
||||
// }
|
||||
}
|
||||
p{
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.more{
|
||||
margin-top: 30px;
|
||||
width: auto;
|
||||
a{
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.dibu{
|
||||
margin: auto;
|
||||
margin-top: 60px;
|
||||
width: 1200px;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.dibu_1{
|
||||
width: auto;
|
||||
p{
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
.dibu_2{
|
||||
.el-select{
|
||||
width: 100px;
|
||||
height: 30px;
|
||||
// border: 1px solid rgba($color: #fff, $alpha: 0.8);
|
||||
// border-radius: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
.dibu_2 .el-input__inner{
|
||||
background: none;
|
||||
border: 1px solid #fff;
|
||||
color: #fff;
|
||||
height: 30px;
|
||||
}
|
||||
.dibu_2 .el-input{
|
||||
height: 35px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,406 @@
|
|||
<template>
|
||||
<header>
|
||||
<div id="topnavbar">
|
||||
<div class="logo logo2 cursor">
|
||||
<img src="../../../static/images/logo.png" alt="">
|
||||
</div>
|
||||
<div id="topnanv" v-show="!collapse || navShow">
|
||||
<nav>
|
||||
<ul class="content clearfix">
|
||||
<li class="dropdown" v-for="(item,index) in menu" :key="index">
|
||||
<a href="javascript:void(0);" @click="routerTurn(item.path)">{{item.name}}<img v-show="item.children.length" src="../../../static/images/arrow-down.png" alt=""></a>
|
||||
<ul class="sub-menu" v-show="item.children.length">
|
||||
<li v-for="(item1,index1) in item.children" :key="index1">
|
||||
<a href="javascript:void(0);" @click="routerTurn(item1.path)">{{item1.name}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<el-dropdown trigger="click">
|
||||
<span class="el-dropdown-link userClass">
|
||||
<a href="javascript:void(0);">admin<img src="../../../static/images/arrow-down.png" alt=""></a>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item>
|
||||
<a href="javascript:void(0);" @click="routerTurn('personalCenter')">个人中心</a>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="menu2" >
|
||||
<i class="el-icon-menu" @click="handleMenu"></i>
|
||||
</div>
|
||||
<div class="fr">
|
||||
<i v-if="loginStatuss" class="logOut" @click="loginOut">logOut</i>
|
||||
</div>
|
||||
<!-- <div class="fr loginReg ovh">
|
||||
<div v-if="loginStatuss"FV>
|
||||
<span>welcome!</span>
|
||||
<el-tooltip v-if="loginStatuss.length>5" :content="loginStatuss" placement="bottom" effect="dark">
|
||||
<span class="ellCu">{{ loginStatuss }}</span>
|
||||
</el-tooltip>
|
||||
<span v-else class="ellCu">
|
||||
{{ $store.state.app.cu }}
|
||||
</span>
|
||||
</div>
|
||||
<div v-else class="login cursor" @click="loginIn"> <img src="../../../static/images/形状 1@2x.png" alt=""> LOGIN | REGISTER</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
logoutCas
|
||||
} from '@/utils/logoutCas' // get token from cookie
|
||||
import {
|
||||
removeToken
|
||||
} from '@/utils/auth' // get token from cookie
|
||||
export default {
|
||||
name: 'headers',
|
||||
props: {
|
||||
msg: String
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
collapse:true,
|
||||
loginStatuss: '',
|
||||
menu:[
|
||||
{
|
||||
name:"首页",
|
||||
path:"home",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"数据检索",
|
||||
path:"",
|
||||
children:[
|
||||
{
|
||||
name:"数据检索",
|
||||
path:"dataSearch",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"航次详情",
|
||||
path:"voyagedetail",
|
||||
children:[]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name:"统计分析",
|
||||
path:"analyse",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"数据资源",
|
||||
path:"",
|
||||
children:[
|
||||
{
|
||||
name:"海洋地球物理与物理海洋信息库",
|
||||
path:"physicalIndex",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"海洋生物样品信息库",
|
||||
path:"biologyIndex",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"深海海洋视频音像信息库",
|
||||
path:"phoneVideoIndex",
|
||||
children:[]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name:"数据汇交",
|
||||
path:"voyageDelivery",
|
||||
children:[
|
||||
{
|
||||
name:"航次数据汇交",
|
||||
path:"voyageDelivery",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"数据样品信息汇交",
|
||||
path:"sampleRemitt",
|
||||
children:[]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name:"字典管理",
|
||||
children:[
|
||||
{
|
||||
name:"数据样品类型",
|
||||
path:"dataSampleType",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"设备类型",
|
||||
path:"docType",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"平台类型",
|
||||
path:"platformType",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"参航单位",
|
||||
path:"visitorUnit",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"共享单位",
|
||||
path:"sharedUnit",
|
||||
children:[]
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
name:"系统管理",
|
||||
children:[
|
||||
{
|
||||
name:"用户管理",
|
||||
path:"userManage",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"角色管理",
|
||||
path:"roleManage",
|
||||
children:[]
|
||||
},
|
||||
{
|
||||
name:"单位管理",
|
||||
path:"unitManage",
|
||||
children:[]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name:"关于我们",
|
||||
path:"",
|
||||
children:[]
|
||||
},
|
||||
// {
|
||||
// name:"个人中心",
|
||||
// path:"personalCenter",
|
||||
// children:[]
|
||||
// },
|
||||
// {
|
||||
// name:"登录",
|
||||
// path:"login",
|
||||
// children:[]
|
||||
// },
|
||||
|
||||
],
|
||||
nowPathName: '',
|
||||
navShow:false,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loginStatuss = this.$store.state.app.cu
|
||||
// this.loginStatuss = 'test_jisjf'
|
||||
|
||||
},
|
||||
mounted(){
|
||||
$('.dropdown').hover(
|
||||
function () {
|
||||
$(this).children('.sub-menu').slideDown(200);
|
||||
},
|
||||
function () {
|
||||
$(this).children('.sub-menu').slideUp(200);
|
||||
}
|
||||
);
|
||||
this.changeClass()
|
||||
//浏览器的窗口大小发生改变时执行
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
this.changeClass();
|
||||
})()
|
||||
}
|
||||
this.nowPathName = this.$route.name
|
||||
|
||||
},
|
||||
methods:{
|
||||
//当屏幕小于1400时添加一个属性,大于的时候删除属性
|
||||
changeClass() {
|
||||
let ww = document.body.clientWidth;
|
||||
if( ww > 1300 ){
|
||||
this.navShow=true
|
||||
} else{
|
||||
this.navShow=false
|
||||
|
||||
}
|
||||
},
|
||||
handleMenu(){
|
||||
this.collapse=!this.collapse
|
||||
},
|
||||
activeMethod(item){
|
||||
if(this.nowPathName==item.path){
|
||||
return 'activeClass'
|
||||
}else{
|
||||
return ''
|
||||
}
|
||||
},
|
||||
routerTurn(name){
|
||||
this.nowPathName = name
|
||||
if(name!=this.$route.name && name){
|
||||
// debugger
|
||||
this.$router.push({name:name})
|
||||
this.collapse=true
|
||||
}
|
||||
},
|
||||
// 中英文切换
|
||||
handleCommand(value) {
|
||||
localStorage.setItem('user_lang', value)
|
||||
this.$i18n.locale = value// 改变当前语言
|
||||
location.reload()
|
||||
},
|
||||
handleClick() {
|
||||
console.log(this.activeName)
|
||||
},
|
||||
loginIn() {
|
||||
window.location.href = process.env.VUE_APP_CAS_LOGIN_FRONT
|
||||
},
|
||||
loginOut() {
|
||||
this.$confirm('Are you sure you want to log out?', 'hint', {
|
||||
confirmButtonText: 'Sure',
|
||||
cancelButtonText: 'Cancel',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
removeToken()
|
||||
this.loginStatuss = ''
|
||||
window.sessionStorage.setItem('cu', '')
|
||||
window.sessionStorage.setItem('userID', '')
|
||||
logoutCas(process.env.VUE_APP_CAS_LOGOUT_URL_FRONT, true)
|
||||
}).catch(() => {
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
.loginReg {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.topic {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
position: relative;
|
||||
background: #1d2a73;
|
||||
// padding: 0 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.loginReg .login{
|
||||
color:white;
|
||||
|
||||
// text-decoration: underline;
|
||||
}
|
||||
.loginReg img{
|
||||
width:13px;
|
||||
padding-right:10px;
|
||||
margin-bottom:-2px;
|
||||
}
|
||||
.topic .fr i{
|
||||
font-style: normal;
|
||||
color:white;
|
||||
width: 56px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
margin-top: 9px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ellCu{
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width:40px;
|
||||
|
||||
}
|
||||
.loginReg>div{
|
||||
display: inline-block;
|
||||
width:148px;
|
||||
}
|
||||
.loginReg>div span{
|
||||
float:left;
|
||||
}
|
||||
.el-icon-menu{
|
||||
float:right;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-icon-menu:hover{
|
||||
color:red;
|
||||
}
|
||||
.menu2{
|
||||
width:25%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
// .menu>li>a
|
||||
@media (max-width: 1300px){
|
||||
.container_a{
|
||||
padding-top:0;
|
||||
}
|
||||
.menu2{
|
||||
display: block;
|
||||
}
|
||||
header{
|
||||
position: relative;
|
||||
}
|
||||
header #topnanv{
|
||||
width: 50%;
|
||||
margin:0 auto;
|
||||
left: 22%;
|
||||
top: 90px;
|
||||
position: absolute;
|
||||
z-index: 45;
|
||||
|
||||
nav>ul{
|
||||
background: #253340;
|
||||
}
|
||||
nav>ul>li{
|
||||
text-align: left;
|
||||
display: block;
|
||||
float:none;
|
||||
line-height: 60px;
|
||||
}
|
||||
nav a{
|
||||
margin: -3px 35px;
|
||||
}
|
||||
nav>ul li>ul{
|
||||
width:87%;
|
||||
left: 34px;
|
||||
top: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.userClass{
|
||||
color:white;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<template>
|
||||
<section class="app-main">
|
||||
<transition name="fade-transform" mode="out-in">
|
||||
<router-view :key="key" />
|
||||
</transition>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'AppMain',
|
||||
computed: {
|
||||
key() {
|
||||
return this.$route.path
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-main {
|
||||
/*50 = navbar */
|
||||
min-height: calc(100vh - 50px);
|
||||
/* width: 100%; */
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding:10px 34px;
|
||||
background:white;
|
||||
}
|
||||
.allClosed .app-main{
|
||||
padding:0;
|
||||
}
|
||||
.fixed-header+.app-main {
|
||||
padding-top: 50px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
// fix css style bug in open el-dialog
|
||||
.el-popup-parent--hidden {
|
||||
.fixed-header {
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,231 @@
|
|||
<template>
|
||||
<div v-if="!$route.meta.closed" class="navbar">
|
||||
<!-- <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
|
||||
<breadcrumb class="breadcrumb-container" /> -->
|
||||
<div class="right-menu">
|
||||
<div class="cu">软件版本:V1.20
|
||||
<span v-if="loginStatuss">欢迎!{{ $store.state.app.cu }}
|
||||
<i class="cursor" @click="loginOut">注销</i></span>
|
||||
<span v-else class="cursor" @click="loginIn">登录/注册</span>
|
||||
|
||||
<!-- <el-dropdown @command="handleCommand">
|
||||
<span v-if="$route.meta.closed" class="el-dropdown-link">
|
||||
<span v-if="$i18n.locale=='cn'">中文</span>
|
||||
<span v-else>英文</span>
|
||||
<i class="el-icon-arrow-down el-icon--right" />
|
||||
</span>
|
||||
<el-dropdown-menu v-if="$route.meta.closed" slot="dropdown">
|
||||
<el-dropdown-item command="cn">中文</el-dropdown-item>
|
||||
<el-dropdown-item command="en">英文</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown></div>-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import Breadcrumb from '@/components/Breadcrumb'
|
||||
import Hamburger from '@/components/Hamburger'
|
||||
import {
|
||||
removeToken
|
||||
} from '@/utils/auth' // get token from cookie
|
||||
import {
|
||||
logoutCas
|
||||
} from '@/utils/logoutCas' // get token from cookie
|
||||
export default {
|
||||
components: {
|
||||
Breadcrumb,
|
||||
Hamburger
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loginStatuss: '',
|
||||
activeIndex: '1',
|
||||
options: [{
|
||||
value: '选项1',
|
||||
label: '黄金糕'
|
||||
}, {
|
||||
value: '选项2',
|
||||
label: '双皮奶'
|
||||
}, {
|
||||
value: '选项3',
|
||||
label: '蚵仔煎'
|
||||
}, {
|
||||
value: '选项4',
|
||||
label: '龙须面'
|
||||
}, {
|
||||
value: '选项5',
|
||||
label: '北京烤鸭'
|
||||
}],
|
||||
value: '',
|
||||
cu: 'cas'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'sidebar',
|
||||
'avatar'
|
||||
])
|
||||
},
|
||||
created() {
|
||||
this.getZw()
|
||||
this.loginStatuss = this.$store.state.app.cu
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
loginIn() {
|
||||
debugger
|
||||
window.location.href = process.env.VUE_APP_CAS_LOGIN_BACK
|
||||
},
|
||||
loginOut() {
|
||||
this.$confirm('是否确定注销?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
removeToken()
|
||||
this.loginStatuss = ''
|
||||
window.sessionStorage.setItem('cu', '')
|
||||
window.sessionStorage.setItem('userID', '')
|
||||
logoutCas(process.env.VUE_APP_CAS_LOGOUT_URL_BACK, true)
|
||||
}).catch(() => {
|
||||
})
|
||||
},
|
||||
handleSelect(key, keyPath) {
|
||||
console.log(key, keyPath)
|
||||
},
|
||||
toggleSideBar() {
|
||||
this.$store.dispatch('app/toggleSideBar')
|
||||
},
|
||||
getZw() {
|
||||
|
||||
},
|
||||
handleCommand(value) {
|
||||
localStorage.setItem('user_lang', value)
|
||||
this.$i18n.locale = value// 改变当前语言
|
||||
// localStorage.language = value
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// #app .hideSidebar .el-submenu>.el-submenu__title .el-submenu__icon-arrow{
|
||||
// display: block;
|
||||
// }
|
||||
// .right-menu.el-menu--popup{
|
||||
// width:180px;
|
||||
// }
|
||||
// .el-input__inner{
|
||||
// border: 1px solid white;
|
||||
// outline:none;
|
||||
// }
|
||||
|
||||
.user-dropdown {
|
||||
top:55px
|
||||
}
|
||||
.cu {
|
||||
// display:inline-block;
|
||||
font-size: 14px;
|
||||
line-height: 15px;
|
||||
position: absolute;
|
||||
right: 22px;
|
||||
top: 19px;
|
||||
.cursor{
|
||||
color:#409EFF
|
||||
}
|
||||
.cursor:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar {
|
||||
height: 50px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
border-bottom:2px solid #e8e8e8;
|
||||
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
|
||||
|
||||
.hamburger-container {
|
||||
line-height: 46px;
|
||||
height: 100%;
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
transition: background .3s;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, .025)
|
||||
}
|
||||
}
|
||||
|
||||
.breadcrumb-container {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.right-menu {
|
||||
width:20%;
|
||||
float: right;
|
||||
height: 100%;
|
||||
line-height: 50px;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.right-menu-item {
|
||||
display: inline-block;
|
||||
padding: 0 8px;
|
||||
height: 100%;
|
||||
font-size: 18px;
|
||||
color: #5a5e66;
|
||||
vertical-align: text-bottom;
|
||||
|
||||
&.hover-effect {
|
||||
cursor: pointer;
|
||||
transition: background .3s;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, .025)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.avatar-container {
|
||||
margin-right: 30px;
|
||||
|
||||
.avatar-wrapper {
|
||||
margin-top: 5px;
|
||||
position: relative;
|
||||
|
||||
.user-avatar {
|
||||
cursor: pointer;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.el-icon-caret-bottom {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: -20px;
|
||||
top: 25px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-dropdown-link {
|
||||
cursor: pointer;
|
||||
color: #409EFF;
|
||||
}
|
||||
.el-icon-arrow-down {
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
export default {
|
||||
computed: {
|
||||
device() {
|
||||
return this.$store.state.app.device
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// In order to fix the click on menu on the ios device will trigger the mouseleave bug
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/1135
|
||||
this.fixBugIniOS()
|
||||
},
|
||||
methods: {
|
||||
fixBugIniOS() {
|
||||
const $subMenu = this.$refs.subMenu
|
||||
if ($subMenu) {
|
||||
const handleMouseleave = $subMenu.handleMouseleave
|
||||
$subMenu.handleMouseleave = (e) => {
|
||||
if (this.device === 'mobile') {
|
||||
return
|
||||
}
|
||||
handleMouseleave(e)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<script>
|
||||
export default {
|
||||
name: 'MenuItem',
|
||||
functional: true,
|
||||
props: {
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
render(h, context) {
|
||||
const { icon, title } = context.props
|
||||
const vnodes = []
|
||||
|
||||
if (icon) {
|
||||
// vnodes.push(<svg-icon icon-class={icon}/>)
|
||||
|
||||
}
|
||||
|
||||
if (title) {
|
||||
vnodes.push(<span slot='title'>{(title)}</span>)
|
||||
}
|
||||
return vnodes
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
|
||||
<template>
|
||||
<!-- eslint-disable vue/require-component-is -->
|
||||
<component v-bind="linkProps(to)">
|
||||
<slot />
|
||||
</component>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { isExternal } from '@/utils/validate'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
to: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
linkProps(url) {
|
||||
if (isExternal(url)) {
|
||||
return {
|
||||
is: 'a',
|
||||
href: url,
|
||||
target: '_blank',
|
||||
rel: 'noopener'
|
||||
}
|
||||
}
|
||||
return {
|
||||
is: 'router-link',
|
||||
to: url
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,116 @@
|
|||
<template>
|
||||
<div v-if="!item.hidden">
|
||||
<template v-if="hasOneShowingChild(item.children,item) && (!onlyOneChild.children||onlyOneChild.noShowingChildren)&&!item.alwaysShow">
|
||||
<app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path)">
|
||||
<el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{'submenu-title-noDropdown':!isNest}">
|
||||
<!-- <item :icon="onlyOneChild.meta.icon||(item.meta&&item.meta.icon)" :title="onlyOneChild.meta.title" /> -->
|
||||
<i class="iconfont" :class="'svg-icon '+onlyOneChild.meta.icon||(item.meta&&item.meta.icon)" aria-hidden="true" v-on="$listeners" />
|
||||
<span>{{ onlyOneChild.meta.title }}</span>
|
||||
</el-menu-item>
|
||||
</app-link>
|
||||
</template>
|
||||
|
||||
<el-submenu v-else ref="subMenu" :index="resolvePath(item.path)" popper-append-to-body>
|
||||
<template slot="title">
|
||||
<!-- <item v-if="item.meta" :icon="item.meta && item.meta.icon" :title="item.meta.title" /> -->
|
||||
<i v-if="item.meta" class="iconfont" :class="'svg-icon '+item.meta && item.meta.icon" aria-hidden="true" v-on="$listeners" />
|
||||
<span v-if="item.meta">{{ item.meta.title }}</span>
|
||||
</template>
|
||||
<sidebar-item
|
||||
v-for="child in item.children"
|
||||
:key="child.path"
|
||||
:is-nest="true"
|
||||
:item="child"
|
||||
:base-path="resolvePath(child.path)"
|
||||
class="nest-menu"
|
||||
/>
|
||||
</el-submenu>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import path from 'path'
|
||||
import { isExternal } from '@/utils/validate'
|
||||
// import Item from './Item'
|
||||
import AppLink from './Link'
|
||||
import FixiOSBug from './FixiOSBug'
|
||||
|
||||
export default {
|
||||
name: 'SidebarItem',
|
||||
components: {
|
||||
// Item,
|
||||
AppLink },
|
||||
mixins: [FixiOSBug],
|
||||
props: {
|
||||
// route object
|
||||
item: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
isNest: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
basePath: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
// To fix https://github.com/PanJiaChen/vue-admin-template/issues/237
|
||||
// TODO: refactor with render function
|
||||
this.onlyOneChild = null
|
||||
return {}
|
||||
},
|
||||
methods: {
|
||||
hasOneShowingChild(children = [], parent) {
|
||||
const showingChildren = children.filter(item => {
|
||||
if (item.hidden) {
|
||||
return false
|
||||
} else {
|
||||
// Temp set(will be used if only has one showing child)
|
||||
this.onlyOneChild = item
|
||||
return true
|
||||
}
|
||||
})
|
||||
|
||||
// When there is only one child router, the child router is displayed by default
|
||||
if (showingChildren.length === 1) {
|
||||
return true
|
||||
}
|
||||
|
||||
// Show parent if there are no child router to display
|
||||
if (showingChildren.length === 0) {
|
||||
this.onlyOneChild = { ... parent, path: '', noShowingChildren: true }
|
||||
return true
|
||||
}
|
||||
|
||||
return false
|
||||
},
|
||||
resolvePath(routePath) {
|
||||
if (isExternal(routePath)) {
|
||||
return routePath
|
||||
}
|
||||
if (isExternal(this.basePath)) {
|
||||
return this.basePath
|
||||
}
|
||||
return path.resolve(this.basePath, routePath)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.svg-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
vertical-align: -0.15em;
|
||||
fill: currentColor;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.svg-external-icon {
|
||||
background-color: currentColor;
|
||||
mask-size: cover!important;
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
<template>
|
||||
<div>
|
||||
<!-- <logo :collapse="isCollapse" /> -->
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper">
|
||||
<el-menu
|
||||
:default-active="activeMenu"
|
||||
:collapse="isCollapse"
|
||||
:background-color="variables.menuBg"
|
||||
:text-color="variables.menuText"
|
||||
:unique-opened="false"
|
||||
:active-text-color="variables.menuActiveText"
|
||||
:collapse-transition="false"
|
||||
mode="vertical"
|
||||
>
|
||||
<sidebar-item
|
||||
v-for="route in roleMenu"
|
||||
:key="route.path"
|
||||
:item="route"
|
||||
:base-path="route.path"
|
||||
/>
|
||||
</el-menu>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
// import Logo from './Logo'
|
||||
import SidebarItem from './SidebarItem'
|
||||
// import variables from './variables.scss'
|
||||
/* Layout */
|
||||
// import Layout from '@/layout'
|
||||
export default {
|
||||
components: { SidebarItem },
|
||||
data() {
|
||||
return {
|
||||
roleMenu: [
|
||||
{
|
||||
path: '/releaseManagement',
|
||||
meta: {
|
||||
title: '发布管理',
|
||||
icon: 'icon-cloud_brief'
|
||||
// roles: ['ADMIN']
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'releaseCount',
|
||||
meta: {
|
||||
title: '发布统计',
|
||||
icon: 'icon-2001wuxing'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'releaseConfig',
|
||||
meta: {
|
||||
title: '发布配置',
|
||||
icon: 'icon-2001wuxing'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['sidebar']),
|
||||
routes() {
|
||||
console.log(this.$router.options.routes)
|
||||
// debugger;
|
||||
|
||||
return this.$router.options.routes
|
||||
},
|
||||
activeMenu() {
|
||||
const route = this.$route
|
||||
const { meta, path } = route
|
||||
// if set path, the sidebar will highlight the path you set
|
||||
if (meta.activeMenu) {
|
||||
return meta.activeMenu
|
||||
}
|
||||
return path
|
||||
},
|
||||
showLogo() {
|
||||
return this.$store.state.settings.sidebarLogo
|
||||
},
|
||||
variables() {
|
||||
const variables = {
|
||||
menuText: '#bfcbd9',
|
||||
menuActiveText: '#409EFF',
|
||||
subMenuActiveText: '#f4f4f5', // https://github.com/ElemeFE/element/issues/12951
|
||||
menuBg: '#304156',
|
||||
menuHover: '#263445',
|
||||
subMenuBg: '#1f2d3d',
|
||||
subMenuHover: '#001528',
|
||||
sideBarWidth: '16%'
|
||||
}
|
||||
return variables
|
||||
},
|
||||
isCollapse() {
|
||||
return !this.sidebar.opened
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
a:-webkit-any-link{
|
||||
text-decoration:none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
// sidebar
|
||||
$menuText:#bfcbd9;
|
||||
$menuActiveText:#409EFF;
|
||||
$subMenuActiveText:#f4f4f5; //https://github.com/ElemeFE/element/issues/12951
|
||||
|
||||
$menuBg:#304156;
|
||||
$menuHover:#263445;
|
||||
|
||||
$subMenuBg:#1f2d3d;
|
||||
$subMenuHover:#001528;
|
||||
|
||||
$sideBarWidth: 16%;
|
||||
|
||||
// the :export directive is the magic sauce for webpack
|
||||
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
|
||||
:export {
|
||||
menuText: $menuText;
|
||||
menuActiveText: $menuActiveText;
|
||||
subMenuActiveText: $subMenuActiveText;
|
||||
menuBg: $menuBg;
|
||||
menuHover: $menuHover;
|
||||
subMenuBg: $subMenuBg;
|
||||
subMenuHover: $subMenuHover;
|
||||
sideBarWidth: $sideBarWidth;
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export { default as Navbar } from './Navbar'
|
||||
export { default as Sidebar } from './Sidebar'
|
||||
export { default as AppMain } from './AppMain'
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
<template>
|
||||
<div :class="classObj" class="app-wrapper">
|
||||
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
|
||||
<sidebar v-if="!sidebar.allClosed" class="sidebar-container" />
|
||||
<div class="main-container">
|
||||
<div :class="{'fixed-header':fixedHeader}">
|
||||
<navbar />
|
||||
</div>
|
||||
<app-main />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Navbar, Sidebar, AppMain } from './components'
|
||||
|
||||
export default {
|
||||
name: 'Layout',
|
||||
components: {
|
||||
Navbar,
|
||||
Sidebar,
|
||||
AppMain
|
||||
},
|
||||
// mixins: [ResizeMixin],
|
||||
computed: {
|
||||
sidebar() {
|
||||
return this.$store.state.app.sidebar
|
||||
},
|
||||
device() {
|
||||
return this.$store.state.app.device
|
||||
},
|
||||
fixedHeader() {
|
||||
return this.$store.state.settings.fixedHeader
|
||||
},
|
||||
classObj() {
|
||||
return {
|
||||
hideSidebar: !this.sidebar.opened,
|
||||
openSidebar: this.sidebar.opened,
|
||||
allClosed: this.sidebar.allClosed,
|
||||
withoutAnimation: this.sidebar.withoutAnimation,
|
||||
mobile: this.device === 'mobile'
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log('sidebar', this.sidebar)
|
||||
},
|
||||
methods: {
|
||||
handleClickOutside() {
|
||||
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "../../static/css/variables.scss";
|
||||
|
||||
.app-wrapper {
|
||||
// @include clearfix;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
&.mobile.openSidebar{
|
||||
position: fixed;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
.drawer-bg {
|
||||
background: #000;
|
||||
opacity: 0.3;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.fixed-header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 9;
|
||||
width: calc(100% - #{$sideBarWidth});
|
||||
transition: width 0.28s;
|
||||
}
|
||||
|
||||
.hideSidebar .fixed-header {
|
||||
width: calc(100% - 54px)
|
||||
}
|
||||
|
||||
.mobile .fixed-header {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
import Vue from 'vue'
|
||||
import App from './App.vue'
|
||||
import ElementUI from 'element-ui'
|
||||
import echarts from 'echarts'
|
||||
// import 'element-ui/lib/theme-chalk/index.css'
|
||||
import '../static/css/index.css'
|
||||
import '../static/css/fonts.css'
|
||||
import Enlocale from '../node_modules/element-ui/lib/locale/lang/en'
|
||||
import Zhlocale from '../node_modules/element-ui/lib/locale/lang/zh-CN'
|
||||
import router from './router/index.js'
|
||||
import BaiduMap from 'vue-baidu-map'
|
||||
import 'echarts-gl'
|
||||
Vue.use(BaiduMap, {
|
||||
ak: 'uu7pXHZLZOejrWXyTK2lVMHASObAg8Fz'
|
||||
})
|
||||
import axios from 'axios'
|
||||
import qs from 'qs'
|
||||
|
||||
import store from './store/index'
|
||||
|
||||
// import * as VueGoogleMaps from 'vue2-google-maps'
|
||||
|
||||
// Vue.use(VueGoogleMaps, {
|
||||
// load: {
|
||||
// key: 'AIzaSyD9kf3RTO2HwggOQ1_fbZawfiKzyBNPXeY',
|
||||
// libraries: ['geometry', 'places'] // 如果需要的话
|
||||
// }
|
||||
// })
|
||||
window.sessionStorage.setItem('webInfo', 'ASOS')
|
||||
Vue.use(ElementUI, { locale: Zhlocale })
|
||||
// router.beforeEach((to, from, next) => {
|
||||
// if (to.path.split('/')[1] == 'releaseManagement') {
|
||||
// Vue.use(ElementUI, { locale: Zhlocale })
|
||||
// } else {
|
||||
// Vue.use(ElementUI, { locale: Enlocale })
|
||||
// }
|
||||
// next()
|
||||
// })
|
||||
Vue.prototype.$axios = axios
|
||||
Vue.prototype.$qs = qs
|
||||
Vue.prototype.$echarts = echarts
|
||||
Vue.config.productionTip = false
|
||||
|
||||
new Vue({
|
||||
el: '#app',
|
||||
router,
|
||||
store,
|
||||
components: { App },
|
||||
template: '<App/>'
|
||||
})
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
|
|
@ -0,0 +1,90 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="./style/style.css">
|
||||
<link rel="stylesheet" href="./style/reset.css">
|
||||
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" href="#"></a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="nav1">
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="active">
|
||||
<a href="#">首页</a>
|
||||
<p class="line-top hidden-xs"></p>
|
||||
</li>
|
||||
<li><a href="./taskSubmit.html">任务提交</a></li>
|
||||
<li><a href="#">数据管理</a></li>
|
||||
<li><a href="#">我的任务</a></li>
|
||||
<li><a href="#">空间环境</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
<div id="container" class="home">
|
||||
<div class="left">
|
||||
<h3 class="title">空间科学监测数据分析可视化</h3>
|
||||
<ul class="ofhd">
|
||||
<li>
|
||||
<img src="./image/01.jpg" alt="">
|
||||
</li>
|
||||
<li>
|
||||
<img src="./image/01.jpg" alt="">
|
||||
</li>
|
||||
<li>
|
||||
<img src="./image/01.jpg" alt="">
|
||||
</li>
|
||||
<li>
|
||||
<img src="./image/01.jpg" alt="">
|
||||
</li>
|
||||
</ul>
|
||||
<div> <span class="cursor">显示更多…</span></div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<h4 class="title">分析记录</h4>
|
||||
<table class="table table-bordered">
|
||||
<!-- <caption>基本的表格布局</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>名称</th>
|
||||
</tr>
|
||||
</thead> -->
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tanm1111111ay</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sach111in</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sach111in</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sach111in</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
*{
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
body,html{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
ul{
|
||||
list-style: none;
|
||||
}
|
||||
.ofhd{
|
||||
height:auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.cursor{
|
||||
cursor: pointer;
|
||||
color:#0ba1e4;
|
||||
}
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
|
||||
/* Navbar */
|
||||
.navbar-default{
|
||||
background-color: rgba(255,255,255,0.9);
|
||||
border-bottom: 2px solid #0ba1e4;
|
||||
box-shadow: 0 2px 4px rgb(0 0 0 / 10%);
|
||||
z-index: 1000;
|
||||
}
|
||||
.navbar-nav {
|
||||
float: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
ul.nav.navbar-nav li {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
margin: 0em;
|
||||
}
|
||||
.navbar{
|
||||
padding:15px 0;
|
||||
}
|
||||
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{
|
||||
color:#0ba1e4
|
||||
}
|
||||
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{
|
||||
color:#0ba1e4;
|
||||
background-color: rgba(255,255,255,0);
|
||||
}
|
||||
.navbar-default .navbar-nav>li .line-top {
|
||||
border-top: 1px solid #0ba1e4;
|
||||
width: 18px;
|
||||
margin: auto;
|
||||
}
|
||||
.navbar-default .navbar-nav>li>a {
|
||||
font-size: 16px;
|
||||
padding: 16px 25px 5px !important;
|
||||
}
|
||||
|
||||
|
||||
/* Home */
|
||||
|
||||
#container{
|
||||
display: flex;
|
||||
}
|
||||
#container .right{
|
||||
padding-left:2%;
|
||||
}
|
||||
#container .left{
|
||||
border-right:1px solid rgb(206, 206, 206);
|
||||
width:84%;
|
||||
padding:32px;
|
||||
padding-top:0;
|
||||
padding-right:0;
|
||||
}
|
||||
#container .title{
|
||||
/* padding-left:3%; */
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.home .left ul li{
|
||||
float: left;
|
||||
width:33%;
|
||||
padding:20px 3% 20px 0;
|
||||
/* border:1px solid rgb(206, 206, 206); */
|
||||
}
|
||||
.home .left ul li img{
|
||||
width:100%;
|
||||
}
|
||||
|
||||
/* TaskSubmit */
|
||||
|
||||
.taskSubmit .left li{
|
||||
float: left;
|
||||
width:50%;
|
||||
border-bottom:1px solid rgb(206, 206, 206);
|
||||
}
|
||||
|
|
@ -0,0 +1,170 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="./style/style.css">
|
||||
<link rel="stylesheet" href="./style/reset.css">
|
||||
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" href="#"></a>
|
||||
</div>
|
||||
<div class="nav1">
|
||||
<ul class="nav navbar-nav">
|
||||
<li>
|
||||
<a href="./index.html">首页</a>
|
||||
</li>
|
||||
<li class="active">
|
||||
<a href="#">任务提交</a>
|
||||
<p class="line-top hidden-xs"></p>
|
||||
</li>
|
||||
<li><a href="#">数据管理</a></li>
|
||||
<li><a href="#">我的任务</a></li>
|
||||
<li><a href="#">空间环境</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
<div id="container" class="taskSubmit">
|
||||
<div class="left">
|
||||
<h3 class="title">空间科学监测数据分析可视化</h3>
|
||||
<form role="form" class="form-horizontal">
|
||||
<h4>流水号dfs_3456789123</h4>
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<label for="name" class="col-lg-2 control-label">工具:</label>
|
||||
<div class="col-lg-10">
|
||||
<select class=" form-control">
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<label for="name" class="col-lg-2 control-label">站点:</label>
|
||||
<div class="col-lg-10">
|
||||
<select class="form-control">
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<label class="col-lg-2 control-label">数据类型</label>
|
||||
<div class="col-lg-10">
|
||||
<input class="form-control" id="focusedInput" type="text" value="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-2 col-md-offset-10">
|
||||
<button type="button" class="btn btn-primary">检索</button>
|
||||
<button type="button" class="btn btn-default">重置</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="checkbox">
|
||||
<label class="checkbox-inline">
|
||||
<input type="checkbox" id="inlineCheckbox1" value="option1"> ASDEFRGTYUI7UUUUUUUUUUU5555.TXT
|
||||
</label>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="checkbox">
|
||||
<label class="checkbox-inline">
|
||||
<input type="checkbox" id="inlineCheckbox1" value="option1"> ASDEFRGTYUI7UUUUUUUUUUU5555.TXT
|
||||
</label>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="checkbox">
|
||||
<label class="checkbox-inline">
|
||||
<input type="checkbox" id="inlineCheckbox1" value="option1"> ASDEFRGTYUI7UUUUUUUUUUU5555.TXT
|
||||
</label>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="checkbox">
|
||||
<label class="checkbox-inline">
|
||||
<input type="checkbox" id="inlineCheckbox1" value="option1"> ASDEFRGTYUI7UUUUUUUUUUU5555.TXT
|
||||
</label>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="checkbox">
|
||||
<label class="checkbox-inline">
|
||||
<input type="checkbox" id="inlineCheckbox1" value="option1"> ASDEFRGTYUI7UUUUUUUUUUU5555.TXT
|
||||
</label>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<label for="name" class="col-lg-2 control-label">工具:</label>
|
||||
<div class="col-lg-10">
|
||||
<select class=" form-control">
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right">
|
||||
<h4 class="title">分析记录</h4>
|
||||
<table class="table table-bordered">
|
||||
<!-- <caption>基本的表格布局</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>名称</th>
|
||||
</tr>
|
||||
</thead> -->
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tanm1111111ay</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sach111in</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sach111in</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sach111in</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
const state = {
|
||||
positionIsShow: false
|
||||
}
|
||||
const mutations = {
|
||||
setPositionIsShow(state, data) {
|
||||
state.positionIsShow = data
|
||||
}
|
||||
}
|
||||
const actions = {
|
||||
setArtile(context, data) {
|
||||
context.commit('setArtile', data)
|
||||
}
|
||||
}
|
||||
const getters = {
|
||||
// 获文章取条获件分页列表
|
||||
getArticleReplyPage(state) {
|
||||
return function(pageNo, pageSize) {
|
||||
const list = 0
|
||||
return list
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
state,
|
||||
actions,
|
||||
mutations,
|
||||
getters
|
||||
}
|
||||
|
|
@ -0,0 +1,476 @@
|
|||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
import Layout from '@/layout'
|
||||
import store from '../store'
|
||||
import {
|
||||
getParameterValue
|
||||
} from '@/utils/auth' // get token from cookie
|
||||
import {
|
||||
setToken, getToken, setUser, setUserID, getUserID
|
||||
} from '@/utils/auth' // get token from cookie
|
||||
import {
|
||||
getByUname
|
||||
} from '@/api/getByUname'
|
||||
Vue.use(Router)
|
||||
const originalPush = Router.prototype.push
|
||||
|
||||
Router.prototype.push = function push(location) {
|
||||
return originalPush.call(this, location).catch(err => err)
|
||||
}
|
||||
export const constantRoutes = [
|
||||
{
|
||||
path: '/',
|
||||
name: 'container',
|
||||
redirect: '/container/home',
|
||||
meta: {
|
||||
title: '信息发布网站home',
|
||||
icon: 'peoples'
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: '/',
|
||||
// name: 'releaseConfig',
|
||||
// component: Layout,
|
||||
// redirect: '/releaseManagement',
|
||||
// meta: {
|
||||
// title: '发布管理',
|
||||
// icon: 'peoples'
|
||||
// }
|
||||
// },
|
||||
{
|
||||
path: '/container',
|
||||
name: 'container',
|
||||
redirect: '/container/home',
|
||||
component: () => import('@/components/container.vue'),
|
||||
meta: {
|
||||
title: '信息发布网站',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'home',
|
||||
name: 'home',
|
||||
component: () => import('@/views/home.vue'),
|
||||
meta: {
|
||||
title: 'home',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'voyageDelivery',
|
||||
name: 'voyageDelivery',
|
||||
component: () => import('@/views/voyageDelivery.vue'),
|
||||
meta: {
|
||||
title: '航次数据汇交',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'voyageEntry',
|
||||
name: 'voyageEntry',
|
||||
component: () => import('@/views/voyageEntry.vue'),
|
||||
meta: {
|
||||
title: '航次信息录入',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'sampleRemitt',
|
||||
name: 'sampleRemitt',
|
||||
component: () => import('@/views/sampleRemitt.vue'),
|
||||
meta: {
|
||||
title: '数据样品信息汇交',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'sampleEntry',
|
||||
name: 'sampleEntry',
|
||||
component: () => import('@/views/sampleEntry.vue'),
|
||||
meta: {
|
||||
title: '数据样品信息录入',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'dataSampleType',
|
||||
name: 'dataSampleType',
|
||||
component: () => import('@/views/dicManage/dataSampleType.vue'),
|
||||
meta: {
|
||||
title: '数据样品类型',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'docType',
|
||||
name: 'docType',
|
||||
component: () => import('@/views/dicManage/docType.vue'),
|
||||
meta: {
|
||||
title: '设备类型',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'platformType',
|
||||
name: 'platformType',
|
||||
component: () => import('@/views/dicManage/platformType.vue'),
|
||||
meta: {
|
||||
title: '平台类型',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'visitorUnit',
|
||||
name: 'visitorUnit',
|
||||
component: () => import('@/views/dicManage/visitorUnit.vue'),
|
||||
meta: {
|
||||
title: '参航单位',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'sharedUnit',
|
||||
name: 'sharedUnit',
|
||||
component: () => import('@/views/dicManage/sharedUnit.vue'),
|
||||
meta: {
|
||||
title: '共享单位',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'userManage',
|
||||
name: 'userManage',
|
||||
component: () => import('@/views/sysManage/userManage.vue'),
|
||||
meta: {
|
||||
title: '用户管理',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'roleManage',
|
||||
name: 'roleManage',
|
||||
component: () => import('@/views/sysManage/roleManage.vue'),
|
||||
meta: {
|
||||
title: '角色管理',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'unitManage',
|
||||
name: 'unitManage',
|
||||
component: () => import('@/views/sysManage/unitManage.vue'),
|
||||
meta: {
|
||||
title: '单位管理',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: 'GMRT',
|
||||
// name: 'GMRT',
|
||||
// component: () => import('@/views/GMRT.vue'),
|
||||
// meta: {
|
||||
// title: '地图',
|
||||
// icon: 'peoples',
|
||||
// loginAuthority: true
|
||||
// }
|
||||
// },
|
||||
{
|
||||
path: 'dataSearch',
|
||||
name: 'dataSearch',
|
||||
component: () => import('@/views/dataSearch.vue'),
|
||||
meta: {
|
||||
title: '数据检索',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'voyagedetail',
|
||||
name: 'voyagedetail',
|
||||
component: () => import('@/views/voyagedetail.vue'),
|
||||
meta: {
|
||||
title: '航次详情',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'dataDetail',
|
||||
name: 'dataDetail',
|
||||
component: () => import('@/views/dataDetail.vue'),
|
||||
meta: {
|
||||
title: '数据产品详情',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'personalCenter',
|
||||
name: 'personalCenter',
|
||||
component: () => import('@/views/personalCenter.vue'),
|
||||
meta: {
|
||||
title: '个人中心',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'biologyIndex',
|
||||
name: 'biologyIndex',
|
||||
component: () => import('@/views/sublibrary/biologyIndex.vue'),
|
||||
meta: {
|
||||
title: '生物子库',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'genovariation',
|
||||
name: 'genovariation',
|
||||
component: () => import('@/views/sublibrary/biologyGenovariation.vue'),
|
||||
meta: {
|
||||
title: '生物基因变异',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'physicalIndex',
|
||||
name: 'physicalIndex',
|
||||
component: () => import('@/views/sublibrary/physicalIndex.vue'),
|
||||
meta: {
|
||||
title: '物理子库',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'physicalDataDelivery',
|
||||
name: 'physicalDataDelivery',
|
||||
component: () => import('@/views/sublibrary/physicalDataDelivery.vue'),
|
||||
meta: {
|
||||
title: '数据汇交',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'physicalDataSearchCTD',
|
||||
name: 'physicalDataSearchCTD',
|
||||
component: () => import('@/views/sublibrary/physicalDataSearchCTD.vue'),
|
||||
meta: {
|
||||
title: '温盐深(CTD) 数据应用',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'phoneVideoIndex',
|
||||
name: 'phoneVideoIndex',
|
||||
component: () => import('@/views/sublibrary/phoneVideoIndex.vue'),
|
||||
meta: {
|
||||
title: '视频音像子库',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'news',
|
||||
name: 'news',
|
||||
component: () => import('@/views/news.vue'),
|
||||
meta: {
|
||||
title: '新闻动态',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'analyse',
|
||||
name: 'analyse',
|
||||
component: () => import('@/views/analyse.vue'),
|
||||
meta: {
|
||||
title: '统计分析',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'login',
|
||||
name: 'login',
|
||||
component: () => import('@/views/login.vue'),
|
||||
meta: {
|
||||
title: '登录',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'links',
|
||||
name: 'links',
|
||||
component: () => import('@/views/links.vue'),
|
||||
meta: {
|
||||
title: 'links',
|
||||
icon: 'peoples',
|
||||
loginAuthority: true
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/releaseManagement',
|
||||
component: Layout,
|
||||
redirect: '/releaseManagement/releaseCount',
|
||||
name: 'releaseCount',
|
||||
meta: {
|
||||
title: '发布管理',
|
||||
icon: 'peoples'
|
||||
// roles: ['ADMIN']
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'releaseCount',
|
||||
name: 'releaseCount',
|
||||
// @ts-ignore
|
||||
component: () => import('@/views/releaseCount.vue'),
|
||||
meta: {
|
||||
title: '发布统计',
|
||||
icon: 'peoples'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'releaseConfig',
|
||||
name: 'releaseConfig',
|
||||
// @ts-ignore
|
||||
component: () => import('@/views/releaseMang/releaseConfig.vue'),
|
||||
redirect: '/releaseManagement/releaseConfig/faqConfig',
|
||||
meta: {
|
||||
title: '发布配置'
|
||||
},
|
||||
children: [{
|
||||
path: 'faqConfig',
|
||||
name: 'faqConfig',
|
||||
component: () => import('@/views/releaseMang/faqConfig.vue'),
|
||||
meta: {
|
||||
title: 'faq配置',
|
||||
icon: 'peoples'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'urlConfig',
|
||||
name: 'urlConfig',
|
||||
component: () => import('@/views/releaseMang/urlConfig.vue'),
|
||||
meta: {
|
||||
title: 'url配置',
|
||||
icon: 'peoples'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'softConfig',
|
||||
name: 'softConfig',
|
||||
component: () => import('@/views/releaseMang/softConfig.vue'),
|
||||
meta: {
|
||||
title: '软件配置',
|
||||
icon: 'peoples'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'pubDynamic',
|
||||
name: 'pubDynamic',
|
||||
component: () => import('@/views/releaseMang/pubDynamic.vue'),
|
||||
meta: {
|
||||
title: '发布动态配置',
|
||||
icon: 'peoples'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/noPermission',
|
||||
name: 'noPermission',
|
||||
component: () => import('@/views/noPermission'),
|
||||
meta: {
|
||||
title: 'noPermission',
|
||||
closed: true,
|
||||
loginAuthority: true
|
||||
}
|
||||
}
|
||||
// {
|
||||
// path: '/second',
|
||||
// name: 'secondIndex',
|
||||
// component: secondIndex,
|
||||
// redirect: '/Index',//设置默认指向的路径
|
||||
// children: [ //这里就是二级路由的配置
|
||||
// {
|
||||
// path: '/talent',
|
||||
// name: 'TalentMain',
|
||||
// component: TalentMain
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
|
||||
]
|
||||
|
||||
const createRouter = () => new Router({
|
||||
// base: '/asos_client/',
|
||||
routes: constantRoutes
|
||||
// mode: "history"
|
||||
})
|
||||
const router = createRouter()
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
to.meta.title && (document.title = to.meta.title + ' | Deep-sea')
|
||||
const jsid = getParameterValue('jsessionid')
|
||||
const cu = getParameterValue('cu')
|
||||
const userID = getParameterValue('userId')
|
||||
// 如果url上用户名 cu userId到本地
|
||||
if (!!jsid && !!cu) {
|
||||
setToken(jsid)
|
||||
setUser(cu)
|
||||
setUserID(userID)
|
||||
window.sessionStorage.setItem('cu', cu)
|
||||
}
|
||||
window.sessionStorage.setItem('userID', getUserID())
|
||||
store.dispatch('app/setUser')
|
||||
const hasToken = getToken()
|
||||
// 个人空间和后台系统需要登录 loginAuthority为true就是可以免登陆
|
||||
// if (!to.meta.loginAuthority) {
|
||||
// window.sessionStorage.setItem('sign', 'asos_service')
|
||||
// if (!hasToken) {
|
||||
// window.location.href = process.env.VUE_APP_CAS_LOGIN_BACK
|
||||
// } else {
|
||||
// getByUname().then(res => {
|
||||
// if (res.data) {
|
||||
// if (res.data.indexOf('admin') > -1) {
|
||||
// next()
|
||||
// } else {
|
||||
// next({
|
||||
// path: '/noPermission'
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// } else {
|
||||
// next()
|
||||
// }
|
||||
|
||||
next() // 继续执行
|
||||
})
|
||||
export default router
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
module.exports = {
|
||||
title: 'Vue Admin Template',
|
||||
/**
|
||||
* @type {boolean} true | false
|
||||
* @description Whether fix the header
|
||||
*/
|
||||
fixedHeader: false,
|
||||
|
||||
/**
|
||||
* @type {boolean} true | false
|
||||
* @description Whether show the logo in sidebar
|
||||
*/
|
||||
sidebarLogo: false
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
const getters = {
|
||||
sidebar: state => state.app.sidebar,
|
||||
device: state => state.app.device,
|
||||
logFlag: state => state.app.logFlag
|
||||
// token: state => state.user.token,
|
||||
}
|
||||
export default getters
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
import getters from './getters'
|
||||
import app from './modules/app'
|
||||
import settings from './modules/settings'
|
||||
// import user from './modules/user'
|
||||
|
||||
Vue.use(Vuex)
|
||||
|
||||
const store = new Vuex.Store({
|
||||
modules: {
|
||||
app,
|
||||
settings
|
||||
// user
|
||||
},
|
||||
getters
|
||||
})
|
||||
|
||||
export default store
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
import Cookies from 'js-cookie'
|
||||
import {
|
||||
getUser
|
||||
} from '@/utils/auth'
|
||||
const state = {
|
||||
cu: getUser(),
|
||||
sidebar: {
|
||||
allClosed: false,
|
||||
opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
|
||||
withoutAnimation: false
|
||||
},
|
||||
device: 'desktop',
|
||||
logFlag: 0
|
||||
}
|
||||
|
||||
const mutations = {
|
||||
SET_USER: state => {
|
||||
state.cu = getUser()
|
||||
},
|
||||
TOGGLE_SIDEBAR: state => {
|
||||
state.sidebar.opened = !state.sidebar.opened
|
||||
state.sidebar.withoutAnimation = false
|
||||
if (state.sidebar.opened) {
|
||||
Cookies.set('sidebarStatus', 1)
|
||||
} else {
|
||||
Cookies.set('sidebarStatus', 0)
|
||||
}
|
||||
},
|
||||
CLOSE_SIDEBAR: (state, withoutAnimation) => {
|
||||
Cookies.set('sidebarStatus', 0)
|
||||
state.sidebar.opened = false
|
||||
state.sidebar.withoutAnimation = withoutAnimation
|
||||
},
|
||||
CLOSE_ALL_SIDEBAR: (state, withoutAnimation) => {
|
||||
state.sidebar.allClosed = true
|
||||
},
|
||||
OPEN_ALL_SIDEBAR: (state, withoutAnimation) => {
|
||||
state.sidebar.allClosed = false
|
||||
},
|
||||
TOGGLE_DEVICE: (state, device) => {
|
||||
state.device = device
|
||||
},
|
||||
SET_LOGFLAG: (state, logFlag) => {
|
||||
state.logFlag = logFlag
|
||||
}
|
||||
}
|
||||
|
||||
const actions = {
|
||||
setUser({
|
||||
commit
|
||||
}) {
|
||||
commit('SET_USER')
|
||||
},
|
||||
toggleSideBar({
|
||||
commit
|
||||
}) {
|
||||
commit('TOGGLE_SIDEBAR')
|
||||
},
|
||||
closeSideBar({
|
||||
commit
|
||||
}, {
|
||||
withoutAnimation
|
||||
}) {
|
||||
commit('CLOSE_SIDEBAR', withoutAnimation)
|
||||
},
|
||||
closeAllSideBar({
|
||||
commit
|
||||
}) {
|
||||
commit('CLOSE_ALL_SIDEBAR')
|
||||
},
|
||||
openAllSideBar({
|
||||
commit
|
||||
}) {
|
||||
commit('OPEN_ALL_SIDEBAR')
|
||||
},
|
||||
toggleDevice({
|
||||
commit
|
||||
}, device) {
|
||||
commit('TOGGLE_DEVICE', device)
|
||||
},
|
||||
setLogFlag({
|
||||
commit
|
||||
}, flag) {
|
||||
commit('SET_LOGFLAG', flag)
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
mutations,
|
||||
actions
|
||||
}
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
import defaultSettings from '@/settings'
|
||||
|
||||
const { showSettings, fixedHeader, sidebarLogo } = defaultSettings
|
||||
|
||||
const state = {
|
||||
showSettings: showSettings,
|
||||
fixedHeader: fixedHeader,
|
||||
sidebarLogo: sidebarLogo
|
||||
}
|
||||
|
||||
const mutations = {
|
||||
CHANGE_SETTING: (state, { key, value }) => {
|
||||
// eslint-disable-next-line no-prototype-builtins
|
||||
if (state.hasOwnProperty(key)) {
|
||||
state[key] = value
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const actions = {
|
||||
changeSetting({ commit }, data) {
|
||||
commit('CHANGE_SETTING', data)
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
mutations,
|
||||
actions
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,263 @@
|
|||
|
||||
|
||||
*,img,header{
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
body,html,#app{
|
||||
height: 100%;
|
||||
}
|
||||
button{
|
||||
font-family: "Roboto"!important
|
||||
}
|
||||
body{
|
||||
// background-color: #1e1e1e;
|
||||
background-color: #ebf1f7;
|
||||
color:rgb(0, 0, 0);
|
||||
font-size: 15px;
|
||||
// font-family: "思源黑体",Arial;
|
||||
font-family: "Roboto";
|
||||
line-height: 1.5;
|
||||
}
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover{
|
||||
text-decoration: underline;
|
||||
|
||||
}
|
||||
button{
|
||||
border:0;
|
||||
cursor:pointer;
|
||||
}
|
||||
.show-enter-active{
|
||||
transition:all 0.25s ease-in;
|
||||
}
|
||||
.show-enter,
|
||||
.show-leave-to {
|
||||
/* transform: scale(0.9); */
|
||||
opacity: 0;
|
||||
margin-top: -6px;
|
||||
}
|
||||
.show-enter-to,
|
||||
.show-leave{
|
||||
opacity: 1;
|
||||
/* transform: scale(1); */
|
||||
margin-top:0px;
|
||||
}
|
||||
.hidden-enter,
|
||||
.hidden-leave-active {
|
||||
/* transform: scale(0.9); */
|
||||
transition:all 0.25s ease-in;
|
||||
opacity: 0;
|
||||
}
|
||||
.hidden-enter-active,
|
||||
.hidden-leave{
|
||||
opacity: 1;
|
||||
/* transform: scale(1); */
|
||||
}
|
||||
|
||||
|
||||
.container{
|
||||
margin:0 auto;
|
||||
// width: 100%;
|
||||
// padding:0 6%;
|
||||
background: #ebf1f7;
|
||||
}
|
||||
|
||||
// @media (min-width: 768px){
|
||||
// .container {
|
||||
// width: 750px;
|
||||
// }
|
||||
// }
|
||||
// @media (min-width: 992px){
|
||||
// .container {
|
||||
// width: 992px;
|
||||
// }
|
||||
// }
|
||||
// @media (min-width: 1200px){
|
||||
// .container {
|
||||
// width: 1240px;
|
||||
// }
|
||||
// }
|
||||
.left49{
|
||||
float: left;
|
||||
width:49%
|
||||
}
|
||||
.left50{
|
||||
float: left;
|
||||
width:calc(51% - 8px)
|
||||
}
|
||||
.ovfd{
|
||||
overflow: hidden;
|
||||
height: auto;
|
||||
}
|
||||
.floatLeft{
|
||||
float: left;
|
||||
}
|
||||
.floatRight{
|
||||
float: right;
|
||||
}
|
||||
.orange{
|
||||
background-color: #e6770f;
|
||||
}
|
||||
.blue{
|
||||
color:#169bd5;
|
||||
}
|
||||
.el-row {
|
||||
margin-bottom: 14px;
|
||||
height: auto;
|
||||
// overflow: hidden;
|
||||
}
|
||||
.el-pagination{
|
||||
padding:7px 5px;
|
||||
}
|
||||
|
||||
.el-carousel__item{
|
||||
text-align: center;
|
||||
}
|
||||
.el-carousel__item:nth-child(2n) {
|
||||
background-color: #99a9bf;
|
||||
}
|
||||
|
||||
.el-carousel__item:nth-child(2n+1) {
|
||||
background-color: #d3dce6;
|
||||
}
|
||||
// .cursor{
|
||||
// cursor:pointer;
|
||||
// }
|
||||
.cursor{
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
.cursor:hover{
|
||||
text-decoration: underline;
|
||||
color:#0ba1e4;
|
||||
}
|
||||
.back{
|
||||
color:#4789c9;
|
||||
cursor:pointer;
|
||||
padding-bottom:15px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.ofhd,.ovfh{
|
||||
height:auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.roundBorder{
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.fl{
|
||||
float: left;
|
||||
}
|
||||
.fr{
|
||||
float: right;
|
||||
}
|
||||
.filter-container {
|
||||
width: 100%;
|
||||
height:auto;
|
||||
overflow: hidden;
|
||||
margin-bottom: 20px;
|
||||
margin-top: 10px;
|
||||
.filter-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
// margin-bottom: 15px;
|
||||
margin-right: 10px;
|
||||
|
||||
// .el-date-editor {
|
||||
// width: 395px !important;
|
||||
// }
|
||||
|
||||
.label {
|
||||
margin-right: 10px;
|
||||
color: #606266;
|
||||
display: inline-block;
|
||||
// min-width: 60px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.el-button {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.el-input {
|
||||
width: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-item + .filter-item {
|
||||
margin-left: 40px;
|
||||
}
|
||||
}
|
||||
.checkBtn{
|
||||
float:right;
|
||||
text-align: right;
|
||||
|
||||
}
|
||||
.topic1{
|
||||
padding:0px 16px;
|
||||
font-size: 18px;
|
||||
margin: 34px 30px;
|
||||
border-bottom: 5px solid #2c95ff;
|
||||
|
||||
}
|
||||
.el-table{
|
||||
margin-bottom:20px;
|
||||
}
|
||||
.el-collapse-item{
|
||||
margin:10px 0;
|
||||
}
|
||||
.mainBox{
|
||||
padding:30px 0 30px 0;
|
||||
}
|
||||
.tep_t{
|
||||
text-align: center;
|
||||
padding-top:24px;
|
||||
}
|
||||
.page-body{
|
||||
padding: 22px 30px;
|
||||
background: #fff;
|
||||
}
|
||||
.page-body .page-header{
|
||||
|
||||
padding: 15px;
|
||||
margin: -15px -15px 15px -15px;
|
||||
}
|
||||
.page-body .page-header .page-title{
|
||||
font-size: 18px;
|
||||
margin: 0;
|
||||
margin-bottom: 15px;
|
||||
color: #585A5F;
|
||||
}
|
||||
.dialog-footer{
|
||||
text-align:center;
|
||||
}
|
||||
// #app>div{
|
||||
// display: flex;
|
||||
// flex-direction:column;
|
||||
// }
|
||||
// #app .container_a{
|
||||
// flex:1;
|
||||
// }
|
||||
.wp{
|
||||
max-width: 1240px;
|
||||
width: 96%;
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
.el-message{
|
||||
z-index:9999 !important
|
||||
}
|
||||
.title{
|
||||
padding:0px 16px;
|
||||
font-size: 18px;
|
||||
margin: 20px 0px;
|
||||
border-left: 5px solid #2c95ff;
|
||||
}
|
||||
.tit_box{
|
||||
border-top: 1px solid #ebeef5;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,51 @@
|
|||
import Cookies from 'js-cookie'
|
||||
|
||||
const TokenKey = 'vue_admin_template_token'
|
||||
|
||||
const Cu = 'cu'
|
||||
|
||||
export function getToken() {
|
||||
return Cookies.get(TokenKey)
|
||||
}
|
||||
|
||||
export function setToken(token) {
|
||||
return Cookies.set(TokenKey, token)
|
||||
}
|
||||
|
||||
export function removeToken() {
|
||||
Cookies.remove(Cu)
|
||||
window.sessionStorage.setItem('AuthorityStatusS', '')
|
||||
return Cookies.remove(TokenKey)
|
||||
}
|
||||
|
||||
export function getUser() {
|
||||
return Cookies.get(Cu)
|
||||
}
|
||||
|
||||
export function setUser(uname) {
|
||||
return Cookies.set(Cu, uname)
|
||||
}
|
||||
|
||||
export function setUserID(UserID) {
|
||||
return Cookies.set('UserID', UserID)
|
||||
}
|
||||
|
||||
export function getUserID() {
|
||||
return Cookies.get('UserID')
|
||||
}
|
||||
export function getParameterValue(name) {
|
||||
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i')
|
||||
var r1 = window.location.search.substr(1).match(reg)
|
||||
var r2 = null
|
||||
if (window.location.href.indexOf('?') > -1) {
|
||||
const arr = window.location.href.split('?')
|
||||
r2 = arr[1].match(reg)
|
||||
}
|
||||
if (r1 != null) {
|
||||
return unescape(r1[2])
|
||||
} else if (r2 != null) {
|
||||
return unescape(r2[2])
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
/**
|
||||
* 注销cas
|
||||
* @param url 客户端的注销回调函数 http://xxxxxx
|
||||
* @param loginFlag 客户端通过接口获取的登录标识 loginFlag
|
||||
*/
|
||||
import $ from 'jquery'
|
||||
export function logoutCas(url, loginFlag) {
|
||||
$.ajax({
|
||||
url: process.env.VUE_APP_API_URL + 'logoutClient.do?loginFlag=' + loginFlag,
|
||||
async: true,
|
||||
type: 'get',
|
||||
dataType: 'JSONP',
|
||||
jsonp: 'callback',
|
||||
jsonpCallback: 'jsonpCallback',
|
||||
success: function(data) {
|
||||
if (data && data !== '') { // 第三方登录进来
|
||||
window.top.location.href = data + url // 注销:第三方、cas、客户端
|
||||
} else { // 非第三方登录进来
|
||||
window.top.location.href = process.env.VUE_APP_API_URL + 'logout?service=' + url // 注销:cas、客户端
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
import axios from 'axios'
|
||||
|
||||
import {
|
||||
Message
|
||||
} from 'element-ui'
|
||||
|
||||
import qs from 'qs'
|
||||
// create an axios instance
|
||||
const service = axios.create({
|
||||
// baseURL: process.env.VUE_APP_BASE_API,
|
||||
baseURL: process.env.VUE_APP_BASE_API,
|
||||
withCredentials: true, // send cookies when cross-domain requests
|
||||
timeout: 900000 // request timeout
|
||||
})
|
||||
service.defaults.headers = {
|
||||
// 'content-type': 'application/x-www-form-urlencoded'
|
||||
'content-type': 'application/json'
|
||||
}
|
||||
service.defaults.crossDomain = true
|
||||
service.interceptors.request.use(
|
||||
config => {
|
||||
if (config.type == 'application/x-www-form-urlencoded') {
|
||||
config.data = qs.stringify(config.data)
|
||||
config.headers['content-type'] = config.type
|
||||
} else {
|
||||
config.headers['content-type'] = config.type ? config.type : 'application/json'
|
||||
}
|
||||
// config.headers['content-type'] = 'application/x-www-form-urlencoded'
|
||||
// if (config.url.indexOf('/event/burst') > -1 || config.url.indexOf('/event/trig') > -1 || config.url.indexOf('/fileInfo/getFileInfo') > -1) {
|
||||
// config.baseURL = process.env.VUE_APP_WS_BASE_API
|
||||
// // config.headers['content-type'] = 'application/x-www-form-urlencoded'
|
||||
// // config.data=qs.stringify(config.data)
|
||||
// }
|
||||
// else if(config.url.indexOf("/downloadInfo")>-1 || config.url.indexOf("/dataSetBase/download")>-1 || config.url.indexOf("/dataSetBase/openFile")>-1 || config.url.indexOf("/personSpace/downLoaddataSet")>-1){
|
||||
// config.baseURL=process.env.VUE_APP_REQUEST_TARGET//线上注释
|
||||
// }
|
||||
return config
|
||||
},
|
||||
error => {
|
||||
// do something with request error
|
||||
console.log(error) // for debug
|
||||
return Promise.reject(error)
|
||||
}
|
||||
)
|
||||
|
||||
// response interceptor
|
||||
service.interceptors.response.use(
|
||||
response => {
|
||||
const res = response.data
|
||||
// if the custom code is not 20000, it is judged as an error.
|
||||
// if (res && res.code && res.code !== 20000) {
|
||||
// if (res.code === 20001 || res.code === 401) {
|
||||
// // 当前未登录或已经过期
|
||||
// Message({
|
||||
// message: '请先登录',
|
||||
// type: 'warning'
|
||||
// })
|
||||
// if (window.sessionStorage.getItem('sign') === 'asos_service') {
|
||||
// window.location.href = process.env.VUE_APP_CAS_LOGIN_BACK
|
||||
// } else {
|
||||
// window.location.href = process.env.VUE_APP_CAS_LOGIN_FRONT
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
return res
|
||||
},
|
||||
error => {
|
||||
console.log('err' + error) // for debug
|
||||
Message({
|
||||
message: error.message,
|
||||
type: 'error',
|
||||
duration: 5 * 1000
|
||||
})
|
||||
return Promise.reject(error)
|
||||
}
|
||||
)
|
||||
|
||||
export default service
|
||||
|
|
@ -0,0 +1,400 @@
|
|||
/* eslint-disable eqeqeq */
|
||||
// @ts-nocheck
|
||||
/**
|
||||
* @param {string} path
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
|
||||
export function validateSpecialChart(value) {
|
||||
if (!value) {
|
||||
return true
|
||||
}
|
||||
var pattern = /[`~!@#?$%^&*()+<>?:"{},\/;'[\]]/im
|
||||
if (value === '' || value === null) return false
|
||||
if (pattern.test(value) || value.length > 50) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
export function isExternal(path) {
|
||||
return /^(https?:|mailto:|tel:)/.test(path)
|
||||
}
|
||||
|
||||
export function formatFileSize(limit) {
|
||||
var size = ''
|
||||
if (!limit) {
|
||||
return '0B'
|
||||
}
|
||||
if (limit < 0.1 * 1024) { // 小于0.1KB,则转化成B
|
||||
size = limit.toFixed(2) + 'B'
|
||||
} else if (limit < 0.1 * 1024 * 1024) { // 小于0.1MB,则转化成KB
|
||||
size = (limit / 1024).toFixed(2) + 'KB'
|
||||
} else if (limit < 0.1 * 1024 * 1024 * 1024) { // 小于0.1GB,则转化成MB
|
||||
size = (limit / (1024 * 1024)).toFixed(2) + 'MB'
|
||||
} else { // 其他转化成GB
|
||||
size = (limit / (1024 * 1024 * 1024)).toFixed(2) + 'GB'
|
||||
}
|
||||
|
||||
var sizeStr = size + '' // 转成字符串
|
||||
var index = sizeStr.indexOf('.') // 获取小数点处的索引
|
||||
var dou = sizeStr.substr(index + 1, 2) // 获取小数点后两位的值
|
||||
if (dou == '00') { // 判断后两位是否为00,如果是则删除00
|
||||
return sizeStr.substring(0, index) + sizeStr.substr(index + 3, 2)
|
||||
}
|
||||
return size
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} str
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
export function validUsername(str) {
|
||||
const valid_map = ['admin', 'editor']
|
||||
return valid_map.indexOf(str.trim()) >= 0
|
||||
}
|
||||
/* 是否合法IP地址*/
|
||||
export function validateIP(rule, value, callback) {
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else {
|
||||
const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
|
||||
if ((!reg.test(value)) && value != '') {
|
||||
callback(new Error('请输入正确的IP地址'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 是否手机号码或者固话*/
|
||||
export function validatePhoneTwo(rule, value, callback) {
|
||||
const reg = /^((0\d{2,3}-\d{7,8})|(1[34578]\d{9}))$/
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else {
|
||||
if ((!reg.test(value)) && value != '') {
|
||||
callback(new Error('请输入正确的电话号码或者固话号码'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 是否固话*/
|
||||
export function validateTelphone(rule, value, callback) {
|
||||
const reg = /0\d{2}-\d{7,8}/
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else {
|
||||
if ((!reg.test(value)) && value != '') {
|
||||
callback(new Error('请输入正确的固话(格式:区号+号码,如010-1234567)'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 是否手机号码*/
|
||||
export function validatePhone(rule, value, callback) {
|
||||
const reg = /^[1][3,4,5,7,8][0-9]{9}$/
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else {
|
||||
if ((!reg.test(value)) && value != '') {
|
||||
callback(new Error('请输入正确的电话号码'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 是否身份证号码*/
|
||||
export function validateIdNo(rule, value, callback) {
|
||||
const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else {
|
||||
if ((!reg.test(value)) && value != '') {
|
||||
callback(new Error('请输入正确的身份证号码'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 是否邮箱*/
|
||||
export function validateEMail(rule, value, callback) {
|
||||
const reg = /^([a-zA-Z0-9]+[-_\.]?)+@[a-zA-Z0-9]+\.[a-z]+$/
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else {
|
||||
if (!reg.test(value)) {
|
||||
callback(new Error('请输入正确的邮箱地址'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 合法uri*/
|
||||
export function validateURL(textval) {
|
||||
const urlregex = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/
|
||||
return urlregex.test(textval)
|
||||
}
|
||||
|
||||
/* 验证内容是否英文数字以及下划线*/
|
||||
export function isPassword(rule, value, callback) {
|
||||
const reg = /^[_a-zA-Z0-9]+$/
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else {
|
||||
if (!reg.test(value)) {
|
||||
callback(new Error('密码仅由英文字母,数字以及下划线组成'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 自动检验数值的范围*/
|
||||
export function checkMax20000(rule, value, callback) {
|
||||
if (value == '' || value == undefined || value == null) {
|
||||
callback()
|
||||
} else if (!Number(value)) {
|
||||
callback(new Error('请输入[1,20000]之间的数字'))
|
||||
} else if (value < 1 || value > 20000) {
|
||||
callback(new Error('请输入[1,20000]之间的数字'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
|
||||
// 验证数字输入框最大数值,32767
|
||||
export function checkMaxVal(rule, value, callback) {
|
||||
if (value < 0 || value > 32767) {
|
||||
callback(new Error('请输入[0,32767]之间的数字'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
// 验证是否1-99之间
|
||||
export function isOneToNinetyNine(rule, value, callback) {
|
||||
if (!value) {
|
||||
return callback(new Error('输入不可以空'))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!Number(value)) {
|
||||
callback(new Error('请输入正整数'))
|
||||
} else {
|
||||
const re = /^[1-9][0-9]{0,1}$/
|
||||
const rsCheck = re.test(value)
|
||||
if (!rsCheck) {
|
||||
callback(new Error('请输入正整数,值为【1,99】'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 0)
|
||||
}
|
||||
|
||||
// 验证是否整数
|
||||
export function isInteger(rule, value, callback) {
|
||||
if (!value) {
|
||||
return callback(new Error('输入不可以为空'))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!Number(value)) {
|
||||
callback(new Error('请输入正整数'))
|
||||
} else {
|
||||
const re = /^[0-9]*[1-9][0-9]*$/
|
||||
const rsCheck = re.test(value)
|
||||
if (!rsCheck) {
|
||||
callback(new Error('请输入正整数'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 0)
|
||||
}
|
||||
// 验证是否整数,非必填
|
||||
export function isIntegerNotMust(rule, value, callback) {
|
||||
if (!value) {
|
||||
callback()
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!Number(value)) {
|
||||
callback(new Error('请输入正整数'))
|
||||
} else {
|
||||
const re = /^[0-9]*[1-9][0-9]*$/
|
||||
const rsCheck = re.test(value)
|
||||
if (!rsCheck) {
|
||||
callback(new Error('请输入正整数'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
// 验证是否是[0-1]的小数
|
||||
export function isDecimal(rule, value, callback) {
|
||||
if (!value) {
|
||||
return callback(new Error('输入不可以为空'))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!Number(value)) {
|
||||
callback(new Error('请输入[0,1]之间的数字'))
|
||||
} else {
|
||||
if (value < 0 || value > 1) {
|
||||
callback(new Error('请输入[0,1]之间的数字'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
|
||||
// 验证是否是[1-10]的小数,即不可以等于0
|
||||
export function isBtnOneToTen(rule, value, callback) {
|
||||
if (typeof value === 'undefined') {
|
||||
return callback(new Error('输入不可以为空'))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!Number(value)) {
|
||||
callback(new Error('请输入正整数,值为[1,10]'))
|
||||
} else {
|
||||
if (!(value == '1' || value == '2' || value == '3' || value == '4' || value == '5' || value == '6' || value == '7' || value == '8' || value == '9' || value == '10')) {
|
||||
callback(new Error('请输入正整数,值为[1,10]'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
// 验证是否是[1-100]的小数,即不可以等于0
|
||||
export function isBtnOneToHundred(rule, value, callback) {
|
||||
if (!value) {
|
||||
return callback(new Error('输入不可以为空'))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!Number(value)) {
|
||||
callback(new Error('请输入整数,值为[1,100]'))
|
||||
} else {
|
||||
if (value < 1 || value > 100) {
|
||||
callback(new Error('请输入整数,值为[1,100]'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
// 验证是否是[0-100]的小数
|
||||
export function isBtnZeroToHundred(rule, value, callback) {
|
||||
if (!value) {
|
||||
return callback(new Error('输入不可以为空'))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!Number(value)) {
|
||||
callback(new Error('请输入[1,100]之间的数字'))
|
||||
} else {
|
||||
if (value < 0 || value > 100) {
|
||||
callback(new Error('请输入[1,100]之间的数字'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
|
||||
// 验证端口是否在[0,65535]之间
|
||||
export function isPort(rule, value, callback) {
|
||||
if (!value) {
|
||||
return callback(new Error('输入不可以为空'))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (value == '' || typeof (value) === undefined) {
|
||||
callback(new Error('请输入端口值'))
|
||||
} else {
|
||||
const re = /^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/
|
||||
const rsCheck = re.test(value)
|
||||
if (!rsCheck) {
|
||||
callback(new Error('请输入在[0-65535]之间的端口值'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
// 验证端口是否在[0,65535]之间,非必填,isMust表示是否必填
|
||||
export function isCheckPort(rule, value, callback) {
|
||||
if (!value) {
|
||||
callback()
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (value == '' || typeof (value) === undefined) {
|
||||
// callback(new Error('请输入端口值'));
|
||||
} else {
|
||||
const re = /^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/
|
||||
const rsCheck = re.test(value)
|
||||
if (!rsCheck) {
|
||||
callback(new Error('请输入在[0-65535]之间的端口值'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
|
||||
/* 小写字母*/
|
||||
export function validateLowerCase(str) {
|
||||
const reg = /^[a-z]+$/
|
||||
return reg.test(str)
|
||||
}
|
||||
/* 保留2为小数*/
|
||||
export function validatetoFixedNew(str) {
|
||||
return str
|
||||
}
|
||||
/* 验证key*/
|
||||
// export function validateKey(str) {
|
||||
// var reg = /^[a-z_\-:]+$/;
|
||||
// return reg.test(str);
|
||||
// }
|
||||
|
||||
/* 大写字母*/
|
||||
export function validateUpperCase(str) {
|
||||
const reg = /^[A-Z]+$/
|
||||
return reg.test(str)
|
||||
}
|
||||
|
||||
/* 大小写字母*/
|
||||
export function validatAlphabets(str) {
|
||||
const reg = /^[A-Za-z]+$/
|
||||
return reg.test(str)
|
||||
}
|
||||
export function time(date, type) {
|
||||
if (typeof (date) == 'string') {
|
||||
return date
|
||||
}
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
if (type == 'date') {
|
||||
return y + '-' + m + '-' + d
|
||||
}
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
}
|
||||
|
||||
// date 代表指定的日期,格式:2018-09-27
|
||||
// day 传-1表始前一天,传1表始后一天
|
||||
// JS获取指定日期的前一天,后一天
|
||||
export function getNextDate(date, day) {
|
||||
var dd = new Date(date)
|
||||
dd.setDate(dd.getDate() + day)
|
||||
var y = dd.getFullYear()
|
||||
var m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1
|
||||
var d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate()
|
||||
return y + '-' + m + '-' + d
|
||||
}
|
||||
|
|
@ -0,0 +1,255 @@
|
|||
<template>
|
||||
<div class="EBrowseData">
|
||||
<div class="echartBox">
|
||||
<div id="lineEchart" style="width:100%;height:500px;padding-top:60px;" />
|
||||
<div class="date">
|
||||
<span>{{ dateRange }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mes ofhd">
|
||||
<div class="type">
|
||||
<h3>Search results:</h3>
|
||||
<ul>
|
||||
<li v-for="(item,index) in list" :key="index" :class="currentIndex==index?'orange':''" @click="searchMessage(index,'index','list')">
|
||||
<span class="no">{{ index+1 }}</span>
|
||||
<span class="name">{{ item.fileName }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="cme">
|
||||
|
||||
<p>
|
||||
{{ currentMes.fileName }}
|
||||
</p>
|
||||
<!-- <div>
|
||||
hxi_event_2022213_lev10_20220101_133000_512x5
|
||||
</div> -->
|
||||
<div class="box">
|
||||
<ul>
|
||||
<li>
|
||||
Start:{{ currentMes.dataStartTime }}
|
||||
</li>
|
||||
<li>
|
||||
End:{{ currentMes.dataEndTime }}
|
||||
</li>
|
||||
<li>
|
||||
Location:{{ currentMes.location }}
|
||||
</li>
|
||||
<li>
|
||||
Instrument:{{ currentMes.instrument }}
|
||||
</li>
|
||||
</ul>
|
||||
<div>
|
||||
<el-button type="primary" @click="routerTurn('SearchData')">DATA</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import { getLatestNews, urlConfig, countTotal, getTreeData } from '@/api/home'
|
||||
// import {
|
||||
// validateSpecialChart
|
||||
// } from '@/utils/validate' // get token from cookie
|
||||
export default {
|
||||
name: 'EBrowseData',
|
||||
components: {},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
searchMes: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentIndex: -1,
|
||||
dateRange: '',
|
||||
dataSource: [
|
||||
{
|
||||
name: 'CACT CME'
|
||||
},
|
||||
{
|
||||
name: 'E Browse Data'
|
||||
},
|
||||
{
|
||||
name: 'CACT CME'
|
||||
},
|
||||
{
|
||||
name: 'E Browse Data'
|
||||
},
|
||||
{
|
||||
name: 'CACT CME'
|
||||
},
|
||||
{
|
||||
name: 'E Browse Data'
|
||||
},
|
||||
{
|
||||
name: 'CACT CME'
|
||||
},
|
||||
{
|
||||
name: 'E Browse Data'
|
||||
}
|
||||
|
||||
],
|
||||
chooseDate: '',
|
||||
currentMes: {
|
||||
fileName: '',
|
||||
dataStartTime: '',
|
||||
dataEndTime: '',
|
||||
location: '',
|
||||
instrument: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'list': {
|
||||
handler: function() {
|
||||
this.init()
|
||||
this.dateRange = this.searchMes.stringStartTime + '--' + this.searchMes.stringEndTime
|
||||
},
|
||||
deep: true
|
||||
// immediate: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 获取最新动态列表
|
||||
async init() {
|
||||
this.currentIndex = -1
|
||||
for (const i in this.currentMes) {
|
||||
this.currentMes[i] = ''
|
||||
}
|
||||
const _this = this
|
||||
// const data = [[13, 40], [23, 89], [20, 80]]; const array = []
|
||||
const data = []; let array = []
|
||||
this.list.map(item => {
|
||||
array = []
|
||||
array.push(item.ra)
|
||||
array.push(item.dec)
|
||||
data.push(array)
|
||||
})
|
||||
|
||||
var myChart = this.$echarts.init(document.getElementById('lineEchart', 'dark'))
|
||||
var option
|
||||
option = {
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside', // 无滑动条内置缩放 type: 'slider', //缩放滑动条
|
||||
show: true, // 开启
|
||||
yAxisIndex: [0], // Y轴滑动
|
||||
// xAxisIndex: [0],//X轴滑动
|
||||
start: 1, // 初始化时,滑动条宽度开始标度
|
||||
end: 50 // 初始化时,滑动条宽度结束标度
|
||||
}
|
||||
// {
|
||||
// type: 'slider'
|
||||
// },
|
||||
// {
|
||||
// type: 'inside'
|
||||
// }
|
||||
],
|
||||
xAxis: {
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: 'white'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
scale: true,
|
||||
name: '',
|
||||
max: 1000,
|
||||
min: -100,
|
||||
boundaryGap: [0.2, 0.2],
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: 'white'
|
||||
}
|
||||
}
|
||||
},
|
||||
toolbox: {
|
||||
show: true,
|
||||
feature: {
|
||||
dataZoom: {
|
||||
realtime: false,
|
||||
yAxisIndex: 'none'
|
||||
},
|
||||
restore: {}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
symbolSize: 20,
|
||||
data,
|
||||
type: 'scatter'
|
||||
}]
|
||||
}
|
||||
myChart.setOption(option)
|
||||
myChart.on('click', function(e) {
|
||||
console.log(e.dataIndex, 'index')// 这里根据param填写你的跳转逻辑
|
||||
_this.searchMessage(e.dataIndex, 'index')
|
||||
// e.color = 'red'
|
||||
// e.event.target.style.fill = 'red'
|
||||
// console.log(e.color)
|
||||
})
|
||||
},
|
||||
searchMessage(index, type, type1) {
|
||||
if (type1 == 'list') {
|
||||
this.currentIndex = index
|
||||
}
|
||||
console.log('this.searchMes', this.searchMes)
|
||||
if (type == 'index') {
|
||||
this.currentMes.fileName = this.list[index].fileName
|
||||
this.currentMes.dataStartTime = this.list[index].dataStartTime
|
||||
this.currentMes.dataEndTime = this.list[index].dataEndTime
|
||||
this.currentMes.location = this.list[index].ra + ',' + this.list[index].dec
|
||||
this.currentMes.instrument = this.list[index].instrument
|
||||
}
|
||||
},
|
||||
|
||||
handleClick() {
|
||||
|
||||
},
|
||||
turnDataSearch(value) {
|
||||
this.$router.push({ name: value, query: { searchKey: this[value] }})
|
||||
},
|
||||
handleNodeClick(data) {
|
||||
if (data.datasetId) {
|
||||
this.$router.push({ name: 'dataSetDetail', query: { datasetId: data.datasetId }})
|
||||
}
|
||||
},
|
||||
routerTurn(name) {
|
||||
this.$router.push({ name: name })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.cme{
|
||||
width:100%;
|
||||
}
|
||||
.cme>p{
|
||||
min-height: 65px;
|
||||
width:100%;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
|
||||
font-size: 18px;
|
||||
margin-bottom: 6px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -0,0 +1,526 @@
|
|||
<template>
|
||||
<div style="height:100%;" class="GMRT">
|
||||
<div id="cesiumContainer" class="" />
|
||||
<!-- <div class="father">
|
||||
<ul>
|
||||
<li onclick="addRain()"><a href="#">城镇预报</a></li>
|
||||
<li onclick="detale()"><a href="#">清除</a></li>
|
||||
</ul>
|
||||
</div> -->
|
||||
<div class="son" style="display: none;">弹框插槽</div>
|
||||
<div v-if="imgFlag" class="image_v">
|
||||
<img src="../../static/images/01.jpg" alt="">
|
||||
</div>
|
||||
<!-- 左下角坐标 -->
|
||||
<div id="latlng_show">
|
||||
<p class="coordinate">
|
||||
经度(°):
|
||||
<span id="longitude_show" />
|
||||
</p>
|
||||
<p class="coordinate">
|
||||
纬度(°):
|
||||
<span id="latitude_show" />
|
||||
</p>
|
||||
<p class="coordinate">
|
||||
水深: <span id="elevation_show" /> m
|
||||
</p>
|
||||
<p class="coordinate">
|
||||
视角高: <span id="altitude_show" /> km
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
/* 初始化变量 */
|
||||
var viewer
|
||||
var stationArrList = [] // 收集所有的棋子实例
|
||||
var stationPrev = '' // 记录上一次点击的站位
|
||||
var handler = ''
|
||||
var ellipsoid = null
|
||||
var elevation_show = document.getElementById('elevation_show') // 水深
|
||||
var altitude_show = document.getElementById('altitude_show') // 视角高
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: 'GMRT',
|
||||
props: {
|
||||
isLine: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//是否需要点击显示图片
|
||||
isImg: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
//图片的显示隐藏
|
||||
imgFlag:false,
|
||||
relatedLinksLoading:false,
|
||||
relatedLinksList:[],
|
||||
iconImgY:require("../../static/images/13-y.png"),
|
||||
iconImgW:require("../../static/images/14-w.png"),
|
||||
iconImgYB:require("../../static/images/13-b.png"),
|
||||
iconImgWB:require("../../static/images/14-b.png"),
|
||||
movementTimer:null
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
// Cesium.Ion.defaultAccessToken='eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJkY2Y5NWY2Ni1mODQ1LTQ3YTUtYjc4Zi1jYzhjMGI2YzcxMWYiLCJpZCI6MTI5ODMwLCJpYXQiOjE2Nzk0Njk5NTd9.DTH54ioOH-HLqeNIetBe9hFyrPOX2Vp1AQmZzw8TIZ4'
|
||||
// viewer = new Cesium.Viewer('cesiumContainer', {
|
||||
// animation: false,// 动画器件,控制视图动画的播放速度
|
||||
// timeline: false,// 时间线,指示当前时间,并允许用户跳到特定的时间
|
||||
// navigationHelpButton: false,// 导航帮助按钮,显示默认的地图控制帮助
|
||||
// baseLayerPicker: true,// 图层选择器,选择要显示的地图服务和地形服务
|
||||
// geocoder: true,// 查找位置工具,查到之后会将镜头对准找到的地址,默认使用bing地图
|
||||
// vrButton: false,// 是否显示地图双屏控件
|
||||
// selectionIndicator: true,// 是否显示选取指示器组件 false禁用实体选中,true选中
|
||||
// infoBox: false,// 是否显示信息框
|
||||
// fullscreenButton: false,// 全屏按钮
|
||||
// selectionIndicator: false,// 设置绿色框框不可见
|
||||
// });
|
||||
// console.log(viewer)
|
||||
// // 添加本地图层(当GMRT图层加载慢的时候,预先加载本地图层,交互更好)
|
||||
// var localProvider = new Cesium.createTileMapServiceImageryProvider({
|
||||
// url: '../../static/js/Cesium-1.53/Build/Cesium/Assets/Textures/NaturalEarthII',
|
||||
// fileExtension: 'jpg'
|
||||
// });
|
||||
// viewer.imageryLayers.addImageryProvider(localProvider);
|
||||
|
||||
// // 添加GMRT图层
|
||||
// var provider = new Cesium.WebMapServiceImageryProvider({
|
||||
// url: 'https://www.gmrt.org/services/mapserver/wms_merc',
|
||||
// layers: 'GMRT',
|
||||
// style: "default",
|
||||
// format: "image/jpeg",
|
||||
// service: 'WMS',
|
||||
// version: '1.3.0',
|
||||
// request: 'GetCapabilities'
|
||||
// });
|
||||
|
||||
// viewer.imageryLayers.addImageryProvider(provider);
|
||||
|
||||
|
||||
|
||||
let earthMap = new Cesium.WebMapTileServiceImageryProvider(
|
||||
{
|
||||
url: 'http://124.16.219.154:8080/geoserver/gwc/service/wmts/rest/ne:gmrt_20231018/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/jpeg',
|
||||
layer: 'ne:gmrt_20231018',
|
||||
style: 'default',
|
||||
tileMatrixSetID: 'EPSG:4326',
|
||||
format: 'image/jpeg',
|
||||
tilingScheme: new Cesium.GeographicTilingScheme()
|
||||
});
|
||||
viewer = new Cesium.Viewer('cesiumContainer', {
|
||||
shadows: false,
|
||||
timeline: false,
|
||||
baseLayerPicker: false,
|
||||
fullscreenButton: false,
|
||||
selectionIndicator: false,
|
||||
homeButton: false,
|
||||
animation: false,
|
||||
infoBox: false,
|
||||
geocoder: false,
|
||||
navigationHelpButton: false,
|
||||
imageryProvider: earthMap
|
||||
});
|
||||
viewer._cesiumWidget._creditContainer.style.display = 'none'
|
||||
viewer.scene.sun.show = false
|
||||
viewer.scene.moon.show = false
|
||||
viewer.scene.fog.enabled = false
|
||||
viewer.scene.skyAtmosphere.show = false
|
||||
viewer.scene.sun.show = false
|
||||
viewer.scene.skyBox.show = false
|
||||
viewer.scene.globe.enableLighting = false;
|
||||
viewer.shadowMap.darkness=0.8;
|
||||
viewer.scene._sunBloom = false
|
||||
viewer.scene.globe.showGroundAtmosphere = false;
|
||||
|
||||
let coastline = new Cesium.WebMapTileServiceImageryProvider(
|
||||
{
|
||||
url: 'http://124.16.219.154:8080/geoserver/gwc/service/wmts/rest/ne:GSHHS_f_L1/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png',
|
||||
layer: 'ne:GSHHS_f_L1',
|
||||
style: 'default',
|
||||
tileMatrixSetID: 'EPSG:4326',
|
||||
format: 'image/png',
|
||||
tilingScheme: new Cesium.GeographicTilingScheme()
|
||||
}
|
||||
);
|
||||
viewer.imageryLayers.addImageryProvider(coastline);
|
||||
|
||||
Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(104.479207, 14.209234, 114.479207, 22.209234);
|
||||
viewer.camera.flyHome();
|
||||
|
||||
handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
|
||||
handler.setInputAction(function (wheelment) {
|
||||
var height = viewer.camera.positionCartographic.height;
|
||||
console.log(height)
|
||||
if (height > 16576914.758292207) {
|
||||
viewer.camera.setView({
|
||||
destination: Cesium.Cartesian3.fromRadians(viewer.camera.positionCartographic.longitude, viewer.camera.positionCartographic.latitude, 16576914.758292207)
|
||||
});
|
||||
}
|
||||
},
|
||||
Cesium.ScreenSpaceEventType.WHEEL);
|
||||
|
||||
viewer.scene.screenSpaceCameraController.enableZoom = true;
|
||||
|
||||
let dataList=[
|
||||
{
|
||||
diveNum: "TY-22",
|
||||
latitude: 0,
|
||||
launchLatitude: 10.99454,
|
||||
launchLongtitude: 141.936603,
|
||||
longtitude: 0,
|
||||
platTypeId: "深海着陆器",
|
||||
platformName: "天涯号1",
|
||||
processStatus: "seatrial",
|
||||
sampleNo: "",
|
||||
shipId: 1,
|
||||
id: 1,
|
||||
stationNum: "TS03-S043LANDER01"
|
||||
},
|
||||
{
|
||||
diveNum: "TY-24",
|
||||
expedition: "TS03",
|
||||
id: 16,
|
||||
jobType: "0",
|
||||
latitude: 0,
|
||||
launchLatitude: 11.326952,
|
||||
launchLongtitude: 142.19354,
|
||||
longtitude: 0,
|
||||
platTypeId: "深海着陆器",
|
||||
platformName: "天涯号2",
|
||||
processStatus: "seatrial",
|
||||
sampleNo: "",
|
||||
shipId: 1,
|
||||
stationNum: "TS03-S085LANDER08"
|
||||
},
|
||||
{
|
||||
diveNum: "TY-25",
|
||||
expedition: "TS04",
|
||||
id: 18,
|
||||
jobType: "0",
|
||||
latitude: 0,
|
||||
launchLatitude: 13.25944,
|
||||
launchLongtitude: 140.841087,
|
||||
longtitude: 0,
|
||||
platTypeId: "深海着陆器",
|
||||
platformName: "天涯号3",
|
||||
processStatus: "seatrial",
|
||||
sampleNo: "",
|
||||
shipId: 1,
|
||||
stationNum: "TS03-S085LANDER08"
|
||||
}
|
||||
|
||||
]
|
||||
let degreeArr=[]
|
||||
for (var i = 0; i < dataList.length; i++) {
|
||||
this.stationData(dataList[i], i);
|
||||
degreeArr=[]
|
||||
if(i<dataList.length-1){
|
||||
degreeArr.push(dataList[i].launchLongtitude,dataList[i].launchLatitude,dataList[i+1].launchLongtitude,dataList[i+1].launchLatitude)
|
||||
if(this.isLine){
|
||||
this.drawLine(degreeArr);
|
||||
}
|
||||
}
|
||||
}
|
||||
let data=[
|
||||
{
|
||||
id:1,
|
||||
expedition:"TS03",
|
||||
track:[
|
||||
{
|
||||
longtitude:141.936603,
|
||||
latitude:10.99454
|
||||
},
|
||||
{
|
||||
longtitude:142.19354,
|
||||
latitude:11.326952
|
||||
},
|
||||
{
|
||||
longtitude:140.841087,
|
||||
latitude:13.25944
|
||||
},
|
||||
// {
|
||||
// longtitude:141.9394,
|
||||
// latitude:10.991922
|
||||
// }
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
// for (var i = 0; i < data.length; i++) {
|
||||
// var item = data[i];
|
||||
// var trackArr = item.track;
|
||||
// var trackId = item.id;
|
||||
// var textName = item.expedition;
|
||||
// var degreeArr = [];
|
||||
// for (var j = 0; j < trackArr.length; j++) {
|
||||
// var trackItem = trackArr[j];
|
||||
// var latitude = trackItem.latitude;
|
||||
// var longtitude = trackItem.longtitude;
|
||||
// degreeArr.push(longtitude, latitude);
|
||||
// }
|
||||
// if (degreeArr.length != 0) {
|
||||
// console.log("degreeArr",degreeArr,degreeArr[0],degreeArr[1])
|
||||
// this.drawLine(degreeArr, trackId, textName);
|
||||
// }
|
||||
// }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
//数据集站位
|
||||
stationData(data, index) {
|
||||
var longtitude = data.longtitude == 0 ? data.launchLongtitude : data.longtitude;
|
||||
var latitude = data.latitude == 0 ? data.launchLatitude : data.latitude;
|
||||
var id = data.id; //
|
||||
var shipId = data.shipId; // 航次Id
|
||||
var stationNum = data.stationNum; //站位号
|
||||
var diveNum = data.diveNum; //潜次编号
|
||||
var sampleNo = data.sampleNo//编号
|
||||
viewer.entities.add({
|
||||
description:data,
|
||||
id: id,
|
||||
name: sampleNo !== '' ? sampleNo : (diveNum !== '' ? stationNum !== '' || stationNum !== 'undefined' ? diveNum : '' : stationNum),
|
||||
position: Cesium.Cartesian3.fromDegrees(longtitude, latitude),
|
||||
//位置
|
||||
label: { //文字标签
|
||||
|
||||
text: sampleNo !== '' ? sampleNo : (diveNum !== '' ? stationNum !== '' || stationNum !== 'undefined' ? diveNum : '' : stationNum),
|
||||
font: '700 16px Arial',
|
||||
fillColor: Cesium.Color.WHITE,//填充颜色
|
||||
outlineColor: Cesium.Color.BLACK,//轮廓颜色
|
||||
outlineWidth: 3,
|
||||
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,//垂直方向以底部来计算标签的位置
|
||||
pixelOffset: new Cesium.Cartesian2(0, 50), //偏移量
|
||||
style: Cesium.LabelStyle.FILL_AND_OUTLINE, //FILL不要轮廓 , OUTLINE只要轮廓,FILL_AND_OUTLINE轮廓加填充
|
||||
horizontalOrigin:Cesium.HorizontalOrigin.CENTER, //确定文字在坐标点的位置, CENTER RIGHT LEFT
|
||||
// showBackground:true, //是否显示背景色,就是文字后面的阴影
|
||||
// backgroundColor: new Cesium.Color.fromCssColorString('#141414'),
|
||||
},
|
||||
billboard: { //图标
|
||||
image: this.iconImgW,
|
||||
scale: 1,
|
||||
}
|
||||
});
|
||||
this.addbounced()
|
||||
// viewer.zoomTo(viewer.entities); //zoomTo方法可以立即定位到某个位置 */
|
||||
// stationArrList.push(this.stationObj);
|
||||
// if (index === 0) {
|
||||
// stationPrev = index;
|
||||
// viewer.camera.flyTo({
|
||||
// destination: Cesium.Cartesian3.fromDegrees(longtitude, latitude, 300000)
|
||||
// });
|
||||
// }
|
||||
},
|
||||
// 移动事件
|
||||
addbounced() {
|
||||
let _this=this
|
||||
var scene = viewer.scene;
|
||||
var num = {};
|
||||
this.movementTimer = null;
|
||||
ellipsoid = viewer.scene.globe.ellipsoid;
|
||||
// 创建移动事件
|
||||
handler.setInputAction(function (movement) {
|
||||
if (scene.mode !== Cesium.SceneMode.MORPHING) {
|
||||
let pickedObject = scene.pick(movement.endPosition);
|
||||
if (
|
||||
scene.pickPositionSupported &&
|
||||
Cesium.defined(pickedObject) &&
|
||||
pickedObject.id !== ""&&
|
||||
pickedObject.id._description
|
||||
) {
|
||||
$(".son").html("");//每次弹出时先清空
|
||||
var windowPosition = movement.startPosition;//获取屏幕坐标
|
||||
num.x = windowPosition.x + 50 + document.getElementById("cesiumContainer").offsetLeft;
|
||||
num.y = windowPosition.y + 50;
|
||||
//获取弹出框需要显示的内容,为创建时的 description 属性
|
||||
var todo = pickedObject.id._description._value;
|
||||
//修改弹出框
|
||||
$(".son").css("display", "block");
|
||||
$(".son").css("left", num.x);
|
||||
$(".son").css("top", num.y);
|
||||
// 内容
|
||||
//es6模板字符串
|
||||
var addHtml = `
|
||||
<h4 style="">科考船只:搜索一号</h4>
|
||||
<p>经度(°):${todo.launchLongtitude}</p>
|
||||
<p>纬度(°):${todo.launchLatitude}</p>
|
||||
<p>航迹向:56°</p>
|
||||
<p>航艏向:252°</p>
|
||||
<p>航速:56km</p>
|
||||
<p>状态:停泊</p>
|
||||
<p>更新时间:2022-3-12 11:23:24</p>`;
|
||||
$(".son").append(addHtml);
|
||||
} else {
|
||||
$(".son").html("");
|
||||
$(".son").css("display", "none");
|
||||
}
|
||||
}
|
||||
var cartesian = viewer.camera.pickEllipsoid(movement.endPosition, ellipsoid);
|
||||
if (cartesian) {
|
||||
viewer.scene.screenSpaceCameraController.enableZoom = true;
|
||||
// 将笛卡尔三维坐标转为地图坐标(弧度)
|
||||
var cartographic = viewer.scene.globe.ellipsoid.cartesianToCartographic(cartesian);
|
||||
// 将地图坐标(弧度)转为十进制的度数
|
||||
var log_String = Cesium.Math.toDegrees(cartographic.longitude).toFixed(4); // 经度
|
||||
var lat_String = Cesium.Math.toDegrees(cartographic.latitude).toFixed(4); // 纬度
|
||||
var alti_String = (viewer.camera.positionCartographic.height / 1000).toFixed(2); // 视角高
|
||||
clearTimeout(_this.movementTimer);
|
||||
_this.movementTimer = setTimeout(function () {
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "https://www.gmrt.org/services/pointserver.php",
|
||||
data: {
|
||||
'latitude': lat_String,
|
||||
'longitude': log_String,
|
||||
'statsoff': 'true'
|
||||
},
|
||||
async: true,
|
||||
success: function (msg) {
|
||||
$("#elevation_show").text(msg); // 水深
|
||||
}
|
||||
});
|
||||
},
|
||||
200);
|
||||
$("#longitude_show").text(log_String); // 经度
|
||||
$("#latitude_show").text(lat_String); // 纬度
|
||||
$("#altitude_show").text(alti_String); // 视角高
|
||||
}
|
||||
|
||||
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE)
|
||||
// if(_this.isImg){
|
||||
// handler.setInputAction(function(movement){
|
||||
// if (scene.mode !== Cesium.SceneMode.MORPHING) {
|
||||
// let pickedObject = scene.pick(movement.position);
|
||||
// if (pickedObject) {
|
||||
// _this.imgFlag=true
|
||||
// }else{
|
||||
// _this.imgFlag=false
|
||||
// }
|
||||
// }
|
||||
|
||||
// },Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
||||
|
||||
// }
|
||||
|
||||
},
|
||||
/* cesium 绘制线 */
|
||||
drawLine(degreeArr, sourceId, textName) {
|
||||
viewer.entities.add({
|
||||
// id: sourceId,
|
||||
// name: textName,
|
||||
// position: Cesium.Cartesian3.fromDegrees(degreeArr[0], degreeArr[1]),
|
||||
//位置
|
||||
// label: { //标签文字
|
||||
// text: textName,
|
||||
// font: '700 16px Arial',
|
||||
// fillColor: Cesium.Color.YELLOW,//填充颜色
|
||||
// outlineColor: Cesium.Color.BLACK,//轮廓颜色
|
||||
// outlineWidth: 3,//轮廓宽度
|
||||
// style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||
// pixelOffset: new Cesium.Cartesian2(0,20),
|
||||
// horizontalOrigin: Cesium.HorizontalOrigin.BOTTOM
|
||||
// },
|
||||
// billboard: { //图标
|
||||
// image: this.iconImg,
|
||||
// scale: 1,
|
||||
// },
|
||||
polyline: { //polyline折线实体
|
||||
positions: Cesium.Cartesian3.fromDegreesArray(degreeArr),//位置
|
||||
width: 20,//折线宽度
|
||||
material: new Cesium.PolylineArrowMaterialProperty(
|
||||
// glowPower: 0.2,//发光的强度,值为线宽的百分比(0-1.0)
|
||||
// Cesium.Color.BLUE //发光的颜色
|
||||
new Cesium.Color.fromCssColorString('#ff9000')
|
||||
),//材质
|
||||
clampToGround: true //地表层高度模式,
|
||||
}
|
||||
});
|
||||
// viewer.zoomTo(viewer.entities); //zoomTo方法可以立即定位到某个位置
|
||||
// viewer.camera.flyTo({
|
||||
// destination: Cesium.Cartesian3.fromDegrees(degreeArr[0], degreeArr[1], 60000)
|
||||
// });
|
||||
},
|
||||
// 获取链接列表
|
||||
async getLinks() {
|
||||
this.relatedLinksLoading = true
|
||||
try {
|
||||
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.relatedLinksLoading = false
|
||||
},
|
||||
handleDetail(row){
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#cesiumContainer {
|
||||
width: 100%;
|
||||
height: calc(100% + 1px);
|
||||
background-color: #a4acac;
|
||||
}
|
||||
.father{
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
left: 100px;
|
||||
}
|
||||
.father li{
|
||||
list-style: none;
|
||||
line-height: 50px;
|
||||
}
|
||||
.father a{
|
||||
color: aliceblue;
|
||||
}
|
||||
.son{
|
||||
position: absolute;
|
||||
left: 1450px;
|
||||
top: 418px;
|
||||
background-color: #062f59c7;
|
||||
color: rgb(253, 253, 253);
|
||||
border-radius: 10px;
|
||||
padding: 20px;
|
||||
border:1px solid #7ba9cacf;
|
||||
font-size: 12px;
|
||||
}
|
||||
.cesium-viewer-bottom{
|
||||
display: none !important;
|
||||
}
|
||||
.GMRT{
|
||||
position: relative;
|
||||
}
|
||||
.GMRT .image_v{
|
||||
position: absolute;
|
||||
left:26%;
|
||||
top:2%;
|
||||
|
||||
}
|
||||
#latlng_show{
|
||||
position: absolute;
|
||||
bottom:0px;
|
||||
color: white;
|
||||
padding:10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,347 @@
|
|||
<template>
|
||||
<div v-loading="loading" class="aboutAsos">
|
||||
<!--内容部分-->
|
||||
<div class="box_w">
|
||||
<div class="leftTree1 roundBorder">
|
||||
<el-tree :data="data" :props="defaultProps" node-key="label" default-expand-all highlight-current current-node-key="About ASO-S" @node-click="handleNodeClick" />
|
||||
<!-- <ul>
|
||||
<li>
|
||||
<span>{{ $t('aboutGecam.GECAMOverview') }}</span>
|
||||
<span>></span>
|
||||
</li>
|
||||
</ul> -->
|
||||
</div>
|
||||
<div class="w_901 roundBorder">
|
||||
<div class="ge_title">
|
||||
<strong>{{ currentLabel }}</strong>
|
||||
</div>
|
||||
<div class="summaryCount">
|
||||
<div v-if="currentLabel=='About ASO-S'">
|
||||
<div class="imgBox">
|
||||
<!-- <img src="../../static/images/04.png" alt=""> -->
|
||||
</div>
|
||||
<p class="bold">Full name: Advanced Space-based Solar Observatory</p>
|
||||
<p class="bold">Abbreviaiton: ASO-S</p>
|
||||
<p>
|
||||
Both the full name and the abbreviation of the mission can be used in publications and presentations.
|
||||
</p>
|
||||
<p>
|
||||
The ASO-S mission aims at exploring connections among solar magnetic field, solar flares, and CMEs. ASO-S mission has three payloads onboard: the Full-disk solar vector MagnetoGraph (FMG), the Lyman-alpha Solar Telescope (LST), and the solar Hard X-ray Imager (HXI). They are proposed to measure solar magnetic field, to observe CMEs and solar flares. The unique combination of these payloads allows simultaneous observations of vector magnetic field of the full Sun, imaging spectroscopy at high energies of solar flares, formation and evolution of solar flares and CMEs on the disk and in the inner corona. It will not only advance our understanding of the underlying physics of solar eruptions, but also help to improve forecast capability of space weather.
|
||||
</p>
|
||||
<p>
|
||||
ASO-S is formally approved by the Chinese Academy of Sciences (CAS) under the Strategic Priority Research Program on Space Science in June 2017. At 07:43:55 Beijing time on October 9, 2022, the satellite is launched with the CZ-2D rocket. The nominal mission life is 4 years.
|
||||
</p>
|
||||
<p>
|
||||
According to the scientific objectives and tasks of the mission, in order to obtain as much observation time as possible, the ASO-S satellite adopts a sun synchronous orbit (SSO) with an altitude of about 720 km and an orbital period of about 99 minutes. It has an inclination angle of around 98.2 degree. The satellite will go through the shadow of the Earth between middle May and August with a maximum eclipse time of 18 minutes. The spacecraft points to the Sun with the three axes stabilized.
|
||||
</p>
|
||||
</div>
|
||||
<div v-else-if="currentLabel=='Scientific Objective'">
|
||||
<p>
|
||||
Solar flares and coronal mass ejections (CMEs) are two of the most powerful eruptive phenomena on the Sun. These eruptions are driven by evolution of the solar magnetic field. The ASO-S mission is uniquely designed to reveal connections among the solar magnetic field, solar flares, and CMEs. Its major scientific objectives therefore can be summarized as '1M2B', standing for the Magnetic field and the two kinds of Bursts (flares and CMEs). Via simultaneous observations of the global vector magnetic field, high-energy emission, and evolution of different layers of the solar atmosphere, the mission aims to achieve the following goals:
|
||||
</p>
|
||||
<p>
|
||||
1)Simultaneous observations of solar flares and CMEs, two dominating eruptive events that regulate the space weather, to understand their connections and formation mechanisms.
|
||||
</p>
|
||||
<p>
|
||||
Solar flares and CMEs are two prominent solar activities. Their occurrence frequency varies with the 11 year cycle of solar activity. Simultaneously observations of them play an essential role in revealing their connections and uncovering the underlying physical processes. The triggering mechanisms and evolution of solar flares and CMEs have been the frontier of solar physics research for several decades. Although flares are usually confined in a local area, CMEs can originate from both local and large scale structures. There is a good correlation between large flares and CMEs. It is still a matter of debate how the two eruptive events are related. Imaging observations of the source region of these two types of eruptions in white light, UV, X-ray, and ϒ-ray will enable us to follow these eruptions from the photosphere to the corona to better appreciate the relevant physical processes.
|
||||
</p>
|
||||
<p>
|
||||
2) Observation of the full-disc vector magnetic field to uncover the build up of magnetic energy and its eruptive release during flares and CMEs and to see how the evolution of flares and CMEs are affected by the magnetic field.
|
||||
</p>
|
||||
<p>
|
||||
A consensus has been reached that solar flares and CMEs are driven by evolution of the magnetic field, and the energy involved in these two eruptions comes from a gradual build-up of magnetic energy stored in the non-potential coronal magnetic field. It remains to be seen whether the energy build-up is dominated by shearing motion of the photosphere or by emergence of magnetic flux, and whether the CMEs are triggered by reconnection on small scales or MHD instabilities on large scales. One of the key issues in solar physics research is the relation between magnetic field configuration and characteristics of these eruptive events. The full-disk vector magnetograph onboard ASO-S will provide detailed information on the magnetic field evolution. HXI and LST are dedicated for flare and CME observations, respectively. Simultaneous observations of solar magnetic field, solar flares, and CMEs will help us to disentangle the relationships among them, and most importantly to establish quantitative relationships between the magnetic field and these eruptions. In particular, the evolution of small scale magnetic fields in the early phase of CMEs has been well-covered by past solar missions.
|
||||
</p>
|
||||
<p>
|
||||
3) Observation of different layers of the solar atmosphere in response to eruptions to uncover the conversion and transport of different forms of energies.
|
||||
</p>
|
||||
<p>
|
||||
Flares and CMEs can not only produce huge numbers of energetic electrons and ions, they can also induce plasma waves on a variety of scales and drive bulk motions of the background plasmas. These accelerated particles will propagate along the magnetic field lines. Some of them can penetrate into the low atmosphere and heat the plasma there producing high-energy emission at the same time. Others may escape into the interplanetary space and be observed as solar energetic particles. The X-ray and γ-ray observations of the ASO-S can reveal properties of accelerated electrons and ions and constrain their propagation in the solar atmosphere.
|
||||
</p>
|
||||
<p>
|
||||
Furthermore, although the ASO-S is primarily a science mission, it has important application in monitoring destructive space weather events:
|
||||
</p>
|
||||
<p>
|
||||
4) Observation of solar eruptions and the magnetic field evolution to facilitate forecasting of the space weather and to safeguard valuable assets in space.
|
||||
</p>
|
||||
<p>
|
||||
Flares and CMEs can have tremendous impact on the space weather and may lead to devastating space environment. Flare observations by the ASO-S can be used to predict the arrival of damaging energetic particles at the Earth a few tens of minutes in advance. From the CME observations by the ASO-S, we can determine their morphology and propagation direction, then predict the arrival of a CME at the Earth tens of hours or a few days in advance. A good understanding of the relationship between the magnetic field configuration and the eruptions can lead to much advanced space weather forecast based on magnetic field observations of the ASO-S.
|
||||
</p>
|
||||
</div>
|
||||
<div v-else-if="currentLabel=='Spacecraft and Instruments'">
|
||||
<div class="imgBox">
|
||||
<img src="../../static/images/05.png" alt="">
|
||||
</div>
|
||||
<p>
|
||||
The proposed ASO-S mission has three payloads onboard, i.e., the Full-disk Vector MagnetoGraph, the Lyman-alpha Solar Telescope and the Hard X-ray Imager.
|
||||
</p>
|
||||
<p class="bold">
|
||||
Full-Disc Vector Magnetograph (FMG)
|
||||
</p>
|
||||
<div class="imgBox" style="width:80%;padding-left: 9%;">
|
||||
<img src="../../static/images/07.png" alt="">
|
||||
</div>
|
||||
<p>
|
||||
The Full-disk vector MagnetoGraph (FMG) measures the magnetic fields of the photosphere over the entire solar disk. FMG consists of an imaging optical system, a polarization optical system, and a image acquisition and processing system. The telescope is a telecentric optical design with 140 mm aperture, and the detector is a CMOS camera with 4k by 4k array and 16 fps. The polarization optical system consists of a traditional Lyot-type birefringent and innovational LCVR-type polarimeter. The birefringent filter works in the Fraunhofer line Fe I 532.4 nm with FWHM 0.011 nm.
|
||||
</p>
|
||||
<p>
|
||||
In order to get higher accuracy, FMG uses multi-frame add mode (deep-integration mode). In normal mode of observation, 256 frames (half for left and half for right) will be collected for one magnetogram. That means within 32s (for obtaining 256 frames) the pointing should be stabilized at least within half pixel, say 0.25". Thus, FMG has itself tip/tilt system. In deep-integration mode, the sensitivities are 5G and 150G for longitudinal and transverse component, respectively.
|
||||
</p>
|
||||
<p>
|
||||
Compared with the Hinode/SP, a famous payload for the measurement of solar magnetic field, FMG has a much larger field of view and higher time cadence. Comparing to the magnetographs onboard SDO/HMI and SOHO/MDI, FMG has a simpler observation mode and a higher measurement precision.
|
||||
</p>
|
||||
<p class="bold">
|
||||
Lyman-alpha Solar Telescope (LST)
|
||||
</p>
|
||||
<div class="imgBox" style="width:80%;padding-left:9%;">
|
||||
<img src="../../static/images/08.png" alt="">
|
||||
</div>
|
||||
<p>
|
||||
The Lyman-alpha Solar Telescope (LST) is composed of a Solar Disk Imager (SDI) with an aperture of 60 mm, a Solar Corona Imager (SCI) also with an aperture of 60 mm, a White-light Solar Telescope (WST) with an aperture of 130mm, and two Guide Telescopes (GTs).
|
||||
</p>
|
||||
<p>
|
||||
The SDI is to image the Sun from the disk center to 1.2 solar radii in the Lyman–alpha waveband (121.6±4.5 nm) with a cadence of 4 – 40 s. The SDI uses a 4608 by 4608 camera as the detector so as to guarantee the resolution of 1.2". A piezoelectric image stabilization system is adopted for both the SDI and the SCI to achieve the high spatial resolution.
|
||||
</p>
|
||||
<p>
|
||||
The SCI uses a 2048 by 2048 camera to image the inner solar corona from 1.1 to 2.5 solar radii with a cadence of 3 – 60 s in both the Lyman-alpha waveband (122.6±3 nm) and white-light (700±32 nm). A beam-splitter divides the coming coronal light into two beams: the reflected beam feeds the Lyman-alpha channel while the transmitted beam feeds the white-light channel. The Lyman-alpha channel consists of a Lyman-alpha filter and a detector; the white-light channel consists of a broadband filter centered at 700 nm, linear polarizers and a detector. Three linear polarizer orientations (0, ±60°) are used to conduct the polarization measurement in the white-light waveband.
|
||||
</p>
|
||||
<p>
|
||||
The WST is designed to image the Sun in violet narrow-band continuum (360±2.0 nm) from the disk center to 1.2 solar radii with a cadence of 1 – 120 s (it can be as high as 0.2 s in the burst mode). A 4608 by 4608 CMOS sensor is selected to be the detector, which allows a windowed observation mode with higher time cadence in the burst mode.
|
||||
</p>
|
||||
<p>
|
||||
The guide telescopes work in 570 nm waveband. To guide, quadrant photodiode detectors are used to monitor the solar limb, calculate the displacement and produce the guiding signal, which is converted to triggering signals to the PZT actuators installed behind the main mirrors of both SCI and SDI. The GTs together with the PZT actuators and relevant electronics forms the image stabilizing system.
|
||||
</p>
|
||||
<p class="bold">
|
||||
Hard X-ray Imager(HXI)
|
||||
</p>
|
||||
<div class="imgBox" style="width:62%;padding-left: 17%;">
|
||||
<img src="../../static/images/09.png" alt="">
|
||||
</div>
|
||||
<p>
|
||||
The Hard X-ray Imager (HXI) aims to image solar flares in hard X-rays from ~30-200 keV with an angular resolution of 3.2 arcseconds, field of view of 40 arcminutes, energy resolution (24% @ 32 keV), high time cadence (as high as 0.125 s). HXI adopts the similar principle used by the Hard X-ray Telescope (HXT) onboard the Japanese YOHKOH satellite and the Spectrometer Telescope for Imaging X-rays (STIX) for the Solar Orbiter mission, i.e., using indirect imaging technique via spatial modulation. This is different from the Reuven Ramaty High Energy Solar Spectroscopic Imager (RHESSI) that images the Sun with the indirect imaging technique via rotational modulation.
|
||||
</p>
|
||||
<p>
|
||||
HXI is a high-precision imaging instrument. We made in total over 3400 slices of tungsten grid layers, which are stacked to produce 91 pairs of tungsten grids. These grids are installed in the front and rear base boards at the ends of the 1.2-meter-long collimator, forming 91 subcollimators. The HXR signals through them are recorded by 91 detectors behind and used to reconstruct images on the ground by several imaging algorithms. Besides, there are three detectors that monitor total fluxes, and another five that monitor the background fluxes. The detector array contains 99 LaBr3 detectors.
|
||||
</p>
|
||||
<p>
|
||||
A solar aspect system is implemented with HXI to monitor the Sun in white-light, which provides pointing information of HXI with an accuracy of <1 arcsec and locates eruptions on the Sun. The data is also used to correct blurry image caused by the pointing changes. Meanwhile, the SAS also monitors the deformation of the base boards at a level of microns and the relative twist at a level of arcseconds.
|
||||
</p>
|
||||
</div>
|
||||
<div v-else-if="currentLabel=='Team'">
|
||||
<p class="bold">
|
||||
Platform
|
||||
</p>
|
||||
<p>
|
||||
Innovation Academy for Microsatellites, Chinese Academy of Sciences (CAS)
|
||||
</p>
|
||||
<p class="bold">
|
||||
Payloads
|
||||
</p>
|
||||
<p class="FMG">
|
||||
<span class="bold" style="padding-top:0"> Full-disk vector Magnetograph (FMG)</span>
|
||||
<span> Teams:</span><br>
|
||||
National Astronomical Observatories of China (NAOC), CAS* <br>
|
||||
Nanjing Institute of Astronomical Optics & Technology (NIAOT), NAOC, CAS <br>
|
||||
Xi'an Institute of Optics and Precision Mechanics (XIOPM), CAS <br>
|
||||
<span> Contractors:</span><br>
|
||||
Xi'an Microelectronics Technology Institute <br>
|
||||
Institute of Fluid Physics, China Academy of Engineering Physics <br>
|
||||
Harbin Core Tomorrow Science&Technology Co., Ltd. <br>
|
||||
Harbin Tianxuan Quartz Crystal Sensing Technology Co., Ltd. <br>
|
||||
Xi'an Kejia Photoelectric Technology Co., Ltd. <br>
|
||||
Xi'an Sushi Guangbo Environmental Reliability Laboratory Co., Ltd. <br>
|
||||
Wuxi Synchronous Electronic Technology Co., Ltd. <br>
|
||||
<span class="bold">Lyman-alpha Solar Telescope (LST)</span>
|
||||
<span> Teams:</span><br>
|
||||
Changchun Institute of Optics, Fine Mechanics and Physics (CIOMP), CAS <br>
|
||||
Xi'an Institute of Optics and Precision Mechanics (XIOPM), CAS <br>
|
||||
Purple Mountain Observatory (PMO), CAS <br>
|
||||
<span> Contractors:</span><br>
|
||||
Changchun UP Optotech (Holding) Co., Ltd <br>
|
||||
<span class="bold">Hard X-ray Imager (HXI)</span>
|
||||
<span> Teams:</span><br>
|
||||
Purple Mountain Observatory (PMO), CAS <br>
|
||||
Innovation Academy for Microsatellites, CAS <br>
|
||||
National Space Science Center (NSSC), CAS <br>
|
||||
<span> Contractors:</span><br>
|
||||
Xiʹan Institute of Optics and Precision Mechanics (XIOPM), CAS <br>
|
||||
Suzhou Delphi Laser Co., Ltd. <br>
|
||||
XiʹanMicroMach Technology Co., Ltd. <br>
|
||||
<span class="bold">Ground Segment (data receiving)</span>
|
||||
National Space Science Center (NSSC), CAS <br>
|
||||
<span class="bold">Science Data Center (SDC)</span>
|
||||
Purple Mountain Observatory (PMO), CAS<br>
|
||||
</p>
|
||||
</div>
|
||||
<div v-else class="Committee">
|
||||
<p class="bold">
|
||||
Science Committee
|
||||
</p>
|
||||
<div class="imgBox" style="width:74%;padding-left:13%;display:block;max-height: 2000px;margin-top:10px;">
|
||||
<img src="../../static/images/10.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--内容部分END-->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import {
|
||||
// getAllData,
|
||||
// eachDownLoad,
|
||||
// allDownLoad,
|
||||
// collectionShow,
|
||||
// cancelCollect,
|
||||
// confirmCollect,
|
||||
// visitSave,
|
||||
// eachOpen
|
||||
// } from "@/api/dataSetDetail";
|
||||
export default {
|
||||
name: 'AboutGecam',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
data: [{
|
||||
label: 'ASO-S Overview',
|
||||
children: [{
|
||||
label: 'About ASO-S',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Scientific Objective',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Spacecraft and Instruments',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Team',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Committee',
|
||||
children: []
|
||||
}
|
||||
]
|
||||
}],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
currentLabel: 'About ASO-S'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {},
|
||||
handleNodeClick(data) {
|
||||
if (data.label != 'ASO-S Overview') {
|
||||
this.currentLabel = data.label
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style >
|
||||
.aboutAsos .el-tree-node,.aboutAsos .el-tree-node__content{
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
border-radius: 5px;
|
||||
/* background: #f1f6fc; */
|
||||
/* padding-bottom: 10px; */
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
// @import url("../../static/css/style.less");
|
||||
.leftTree1{
|
||||
border: 1px solid #dcdcdc;
|
||||
padding: 10px 10px 0;
|
||||
height: 300px;
|
||||
width: 22%;
|
||||
float: left;
|
||||
}
|
||||
.aboutAsos {
|
||||
background: #f7f7f7;
|
||||
.box_w {
|
||||
padding-top:20px;
|
||||
// width: 1200px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.w_901 {
|
||||
border: 1px solid #dcdcdc;
|
||||
background: white;
|
||||
width: 75%;
|
||||
float: right;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.ge_title {
|
||||
height: 56px;
|
||||
box-sizing: border-box;
|
||||
padding: 6px 20px 0;
|
||||
border-bottom: 1px solid #dcdcdc;
|
||||
overflow: hidden;
|
||||
clear: both;
|
||||
strong {
|
||||
float: left;
|
||||
height: 48px;
|
||||
line-height: 46px;
|
||||
border-bottom: 2px solid #285398;
|
||||
font-size: 20px;
|
||||
color: #285398;
|
||||
}
|
||||
}
|
||||
|
||||
.summaryCount{
|
||||
margin-bottom: 50px;
|
||||
color:#323333;
|
||||
p{
|
||||
text-indent:32px;
|
||||
// font-family:Arial,"微软雅黑";
|
||||
margin-bottom: 30px;
|
||||
font-size: 16px;
|
||||
padding: 10px 20px;
|
||||
line-height: 1.8;
|
||||
color: #323333;
|
||||
}
|
||||
.imgBox{
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
max-height:300px;
|
||||
margin:30px 0;
|
||||
img{
|
||||
// display: inline-block;
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
.bold{
|
||||
text-indent:32px ;
|
||||
font-weight: 700;
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
.FMG .bold{
|
||||
padding-bottom:8px;
|
||||
padding-top:20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
.summaryCount>div{
|
||||
height:auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.Committee .bold{
|
||||
text-align: center;
|
||||
margin-top:16px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,163 @@
|
|||
<template>
|
||||
<div class="aboutEP notHomea">
|
||||
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
|
||||
<el-tab-pane label="About EP" name="About EP">
|
||||
<div class="box_w">
|
||||
<div class="w_901 roundBorder">
|
||||
<div class="summaryCount">
|
||||
<div class="imgBox">
|
||||
<!-- <img src="../../static/images/04.png" alt=""> -->
|
||||
</div>
|
||||
<!-- <p class="bold">Abbreviaiton: ASO-S</p> -->
|
||||
<p>The Einstein Probe (EP) is a mission of the Chinese Academy of Sciences (CAS) dedicated to time-domain high-energy astrophysics. Its primary goals are to discover high-energy transients and monitor variable objects. To achieve this, EP employs a very large instantaneous field-of-view (3600 square degrees), along with moderate spatial resolution (FWHM ~5 arcmin) and energy resolution.</p>
|
||||
<p>
|
||||
The Einstein Probe (EP) is a mission of the Chinese Academy of Sciences (CAS) dedicated to time-domain high-energy astrophysics. Its primary goals are to discover high-energy transients and monitor variable objects. To achieve this, EP employs a very large instantaneous field-of-view (3600 square degrees), along with moderate spatial resolution (FWHM ~5 arcmin) and energy resolution.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="Sciences" name="second">Sciences</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<!--内容部分END-->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import {
|
||||
// getAllData,
|
||||
// eachDownLoad,
|
||||
// allDownLoad,
|
||||
// collectionShow,
|
||||
// cancelCollect,
|
||||
// confirmCollect,
|
||||
// visitSave,
|
||||
// eachOpen
|
||||
// } from "@/api/dataSetDetail";
|
||||
export default {
|
||||
name: 'AboutGecam',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
data: [{
|
||||
label: 'ASO-S Overview',
|
||||
children: [{
|
||||
label: 'About ASO-S',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Scientific Objective',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Spacecraft and Instruments',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Team',
|
||||
children: []
|
||||
}, {
|
||||
label: 'Committee',
|
||||
children: []
|
||||
}
|
||||
]
|
||||
}],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
currentLabel: 'About ASO-S',
|
||||
activeName: 'About EP'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {},
|
||||
handleNodeClick(data) {
|
||||
if (data.label != 'ASO-S Overview') {
|
||||
this.currentLabel = data.label
|
||||
}
|
||||
},
|
||||
handleClick(tab, event) {
|
||||
console.log(tab, event)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style >
|
||||
.el-tabs__item{
|
||||
font-size: 18px;
|
||||
}
|
||||
.aboutEP .el-tree-node,.aboutEP .el-tree-node__content{
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
border-radius: 5px;
|
||||
/* background: #f1f6fc; */
|
||||
/* padding-bottom: 10px; */
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.aboutEP {
|
||||
.box_w {
|
||||
padding-top:20px;
|
||||
// width: 1200px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.w_901 {
|
||||
background: white;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.summaryCount{
|
||||
margin-bottom: 50px;
|
||||
color:#323333;
|
||||
p{
|
||||
text-indent:32px;
|
||||
// font-family:Arial,"微软雅黑";
|
||||
margin-bottom: 30px;
|
||||
font-size: 16px;
|
||||
padding: 10px 20px;
|
||||
line-height: 1.8;
|
||||
color: #323333;
|
||||
}
|
||||
.imgBox{
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
max-height:300px;
|
||||
margin:30px 0;
|
||||
img{
|
||||
// display: inline-block;
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
.bold{
|
||||
text-indent:32px ;
|
||||
font-weight: 700;
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
.FMG .bold{
|
||||
padding-bottom:8px;
|
||||
padding-top:20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
.summaryCount>div{
|
||||
height:auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.Committee .bold{
|
||||
text-align: center;
|
||||
margin-top:16px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,673 @@
|
|||
<template>
|
||||
<div class="fenxi">
|
||||
<div class="banner">
|
||||
<img src="../../static/images/bannerny1.jpg" alt="">
|
||||
<div class="banner_con">
|
||||
<div class="con">
|
||||
<h1>探索一号</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="t">
|
||||
<p>26</p>
|
||||
<span>次</span>
|
||||
</div>
|
||||
<div class="b">
|
||||
<p>航次次数</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="t">
|
||||
<p>286</p>
|
||||
<span>天</span>
|
||||
</div>
|
||||
<div class="b">
|
||||
<p>航次天数</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="t">
|
||||
<p>23</p>
|
||||
<span>家</span>
|
||||
</div>
|
||||
<div class="b">
|
||||
<p>参航单位</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="t">
|
||||
<p>279</p>
|
||||
<span>个</span>
|
||||
</div>
|
||||
<div class="b">
|
||||
<p>作业站位个数</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fenxi_con">
|
||||
<div class="fenxi1">
|
||||
<div id="xinxi" class="ccc" />
|
||||
</div>
|
||||
<div class="fenxi1">
|
||||
<h2 class="white">参航单位</h2>
|
||||
<div id="danwei" class="ccc">
|
||||
<baidu-map
|
||||
:center="center1"
|
||||
:zoom="zoom1"
|
||||
:scroll-wheel-zoom="true"
|
||||
map-type="BMAP_SATELLITE_MAP"
|
||||
style="width: 100%; height: 100%"
|
||||
@ready="handler1"
|
||||
>
|
||||
<bm-marker
|
||||
v-for="(item, index) in listxia"
|
||||
:key="index"
|
||||
:position="item.dingwei"
|
||||
:dragging="true"
|
||||
:icon="item.pic"
|
||||
@click="totap1(item)"
|
||||
>
|
||||
<bm-label
|
||||
:content="item.content"
|
||||
:offset="{ width: -35, height: 30 }"
|
||||
/>
|
||||
</bm-marker>
|
||||
</baidu-map>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fenxi1">
|
||||
<div id="renyuan" class="ccc" />
|
||||
</div>
|
||||
<div class="fenxi1">
|
||||
<h2 class="white">作业站位</h2>
|
||||
<div id="zhanwei" class="ccc">
|
||||
<GMRT />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as echarts from 'echarts'
|
||||
import GMRT from './GMRT.vue'
|
||||
|
||||
export default {
|
||||
name: 'Fenxi',
|
||||
components: {
|
||||
GMRT
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
center: { lng: 118.962643, lat: 35.618913 },
|
||||
zoom: 3,
|
||||
center1: { lng: 56.761382, lat: 10.897877 },
|
||||
zoom1: 2,
|
||||
list: [
|
||||
{
|
||||
dingwei: {
|
||||
lng: 119.054629,
|
||||
lat: 36.373917
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 119.919302,
|
||||
lat: 34.226755
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 119.560555,
|
||||
lat: 34.421374
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 116.442213,
|
||||
lat: 35.556921
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
}
|
||||
],
|
||||
listxia: [
|
||||
{
|
||||
dingwei: {
|
||||
lng: 56.761382,
|
||||
lat: 10.897877
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 59.116236,
|
||||
lat: -0.00034
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 47.783501,
|
||||
lat: -2.370556
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 41.160475,
|
||||
lat: -5.474589
|
||||
},
|
||||
content: '',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
}
|
||||
],
|
||||
dataShuju: {
|
||||
value: [800, 1200, 900, 1700, 1410, 1600, 1000, 1100],
|
||||
color: '#ffe866',
|
||||
name: 'Observed'
|
||||
},
|
||||
dataQushi: {
|
||||
value: [1000, 1150, 850, 1600, 1510, 1700, 1100, 1300],
|
||||
color: '#02c464',
|
||||
name: 'Predicted',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getecharts()
|
||||
this.gettubiao2()
|
||||
},
|
||||
methods: {
|
||||
getecharts() {
|
||||
var myChart = this.$echarts.init(document.getElementById('xinxi'))
|
||||
var option = {
|
||||
title: {
|
||||
top: '20',
|
||||
left: '20',
|
||||
text: '航次信息统计',
|
||||
textStyle: {
|
||||
color: '#212121',
|
||||
fontSize: '22px'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '4%',
|
||||
bottom: '10%',
|
||||
top: '20%',
|
||||
containLabel: true
|
||||
// borderColor:'#dce8fe',
|
||||
// borderWidth: 5 ,
|
||||
// show:true,
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
shadowStyle: { color: 'rgba(0,0,0,0.1)' },
|
||||
z: 1
|
||||
},
|
||||
padding: [15, 22],
|
||||
backgroundColor: 'rgba(0,0,0,0.9)',
|
||||
borderColor: '#01a3ce',
|
||||
borderWidth: 1,
|
||||
textStyle: { fontSize: 15, lineHeight: 32, color: '#ffffff' }
|
||||
},
|
||||
xAxis: {
|
||||
data: [
|
||||
'TS03',
|
||||
'TS04',
|
||||
'TS05',
|
||||
'TS06',
|
||||
'TS07',
|
||||
'TS08',
|
||||
'TS09',
|
||||
'TS010',
|
||||
'TS011',
|
||||
'TS012',
|
||||
'TS013'
|
||||
],
|
||||
axisLine: { show: true },
|
||||
axisTick: {
|
||||
show: false,
|
||||
lineStyle: { color: '#0187c4', width: 1, opacity: 1 }
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: { fontSize: 15, color: '#212121' },
|
||||
margin: 25,
|
||||
interval: 0
|
||||
},
|
||||
splitLine: { show: false }
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '天数',
|
||||
nameTextStyle: {
|
||||
fontSize: '14px',
|
||||
padding: [3, 14, 5, -30]
|
||||
},
|
||||
axisLine: { show: false },
|
||||
axisTick: {
|
||||
show: false,
|
||||
lineStyle: { color: '#0187c4', width: 1, opacity: 1 }
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: { fontSize: 14, color: '#212121' },
|
||||
opacity: 0.7,
|
||||
margin: 15
|
||||
},
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: { color: '#212121', width: 1, opacity: 0.2 }
|
||||
}
|
||||
},
|
||||
dataZoom: [
|
||||
{
|
||||
id: 'dataZoomX',
|
||||
type: 'slider',
|
||||
xAxisIndex: [0],
|
||||
filterMode: 'filter'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
// {
|
||||
// type: "pictorialBar",
|
||||
// z: 13,
|
||||
// symbolSize: [30, 12],
|
||||
// symbolOffset: [0, -7],
|
||||
// symbolPosition: "end",
|
||||
// tooltip: { show: false },
|
||||
// itemStyle: { color: "#00a8e6" },
|
||||
// data: [120, 200, 150, 80, 70, 110, 130, 150, 80],
|
||||
// },
|
||||
{
|
||||
type: 'bar',
|
||||
z: 12,
|
||||
itemStyle: {
|
||||
color: '#13a1f0',
|
||||
borderRadius: [5, 5, 0, 0] // (顺时针左上,右上,右下,左下)
|
||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
// { offset: 0, color: "#00e7ff" },
|
||||
// { offset: 1, color: "rgba(0,146,255,0.05)" },
|
||||
// ]),
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
distance: 5,
|
||||
fontSize: 16,
|
||||
color: '#212121',
|
||||
lineHeight: 30,
|
||||
fontFamily: 'DIN-Bold'
|
||||
},
|
||||
// emphasis: {
|
||||
// label: { color: "#f1e06e" },
|
||||
// },
|
||||
barWidth: 20,
|
||||
|
||||
data: [120, 200, 150, 80, 70, 110, 130, 150, 80, 110, 130]
|
||||
}
|
||||
]
|
||||
}
|
||||
myChart.setOption(option)
|
||||
},
|
||||
|
||||
gettubiao2() {
|
||||
var myChart = this.$echarts.init(document.getElementById('renyuan'))
|
||||
var option = {
|
||||
title: {
|
||||
top: '20',
|
||||
left: '20',
|
||||
text: '航次参航人员工作量统计',
|
||||
textStyle: {
|
||||
color: '#212121',
|
||||
fontSize: '22px'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
data: ['天数', '次数'],
|
||||
right: '5%',
|
||||
top: '5%',
|
||||
textStyle: {
|
||||
color: '#212121',
|
||||
fontSize: '15'
|
||||
},
|
||||
icon: 'roundRect'
|
||||
},
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '4%',
|
||||
bottom: '10%',
|
||||
top: '20%',
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
shadowStyle: { color: 'rgba(0,0,0,0.1)' },
|
||||
z: 1
|
||||
},
|
||||
padding: [15, 22],
|
||||
backgroundColor: 'rgba(255,255,255,0.9)',
|
||||
borderColor: '#01a3ce',
|
||||
borderWidth: 1,
|
||||
textStyle: { fontSize: 16, lineHeight: 32, color: '#212121' }
|
||||
},
|
||||
dataZoom: [
|
||||
{
|
||||
id: 'dataZoomX',
|
||||
type: 'slider',
|
||||
xAxisIndex: [0],
|
||||
filterMode: 'filter'
|
||||
}
|
||||
],
|
||||
xAxis: {
|
||||
data: [
|
||||
'高文清',
|
||||
'秋雪玲',
|
||||
'陈传旭',
|
||||
'何恩怨',
|
||||
'金文明',
|
||||
'罗腾也',
|
||||
'唐元贵',
|
||||
'王飒',
|
||||
'李珊珊'
|
||||
],
|
||||
axisLine: { show: false },
|
||||
axisTick: {
|
||||
show: false,
|
||||
lineStyle: { color: '#0187c4', width: 1, opacity: 1 }
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: { fontSize: 16, color: '#212121' },
|
||||
margin: 15,
|
||||
interval: 0
|
||||
},
|
||||
splitLine: { show: false }
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '天数/次数',
|
||||
nameTextStyle: {
|
||||
fontSize: '14px',
|
||||
padding: [3, 14, 5, -10]
|
||||
},
|
||||
axisLine: { show: false },
|
||||
axisTick: {
|
||||
show: false,
|
||||
lineStyle: { color: '#212121', width: 1, opacity: 1 }
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: { fontSize: 15, color: '#212121' },
|
||||
opacity: 0.7,
|
||||
margin: 15
|
||||
},
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: { color: '#212121', width: 1, opacity: 0.2 }
|
||||
}
|
||||
},
|
||||
animationDelay: 900,
|
||||
animationDuration: 2000,
|
||||
animationDurationUpdate: 800,
|
||||
series: [
|
||||
// {
|
||||
// type: "pictorialBar",
|
||||
// z: 13,
|
||||
// symbolSize: [26, 10],
|
||||
// symbolOffset: [0, -6],
|
||||
// symbolPosition: "end",
|
||||
// tooltip: { show: false },
|
||||
// itemStyle: { color: "#ffe866" },
|
||||
// data: [120, 200, 150, 80, 70, 110, 130, 150, 80],
|
||||
// },
|
||||
{
|
||||
type: 'bar',
|
||||
name: '天数',
|
||||
z: 8,
|
||||
barGap: '30%',
|
||||
itemStyle: {
|
||||
color: '#13a1f0',
|
||||
borderRadius: [5, 5, 0, 0]
|
||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
// { offset: 0, color: "#cdc060" },
|
||||
// { offset: 1, color: "rgba(205,192,96,0.05)" },
|
||||
// ]),
|
||||
},
|
||||
barWidth: 20,
|
||||
data: [120, 200, 150, 80, 70, 110, 130, 150, 80]
|
||||
},
|
||||
{
|
||||
name: '次数',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
symbol: 'circle',
|
||||
symbolSize: 10,
|
||||
showSymbol: true,
|
||||
z: 10,
|
||||
data: [100, 150, 200, 100, 80, 90, 100, 110, 100],
|
||||
itemStyle: {
|
||||
color: '#fff',
|
||||
borderColor: '#ffab34',
|
||||
borderWidth: 2,
|
||||
borderType: 'solid'
|
||||
},
|
||||
lineStyle: {
|
||||
color: '#ffab34',
|
||||
width: 4
|
||||
}
|
||||
// areaStyle: {
|
||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
// { offset: 0, color: "#3cefc8" },
|
||||
// { offset: 1, color: "transparent" },
|
||||
// ]),
|
||||
// opacity: 0.15,
|
||||
// },
|
||||
}
|
||||
]
|
||||
}
|
||||
myChart.setOption(option)
|
||||
},
|
||||
|
||||
handler({ BMap, map }) {
|
||||
console.log(BMap, map)
|
||||
this.center.lng = 116.404
|
||||
this.center.lat = 39.915
|
||||
this.zoom = 6
|
||||
},
|
||||
handler1({ BMap, map }) {
|
||||
console.log(BMap, map)
|
||||
this.center1.lng = 56.761382
|
||||
this.center1.lat = 10.897877
|
||||
this.zoom1 = 1
|
||||
},
|
||||
totap(e) {
|
||||
console.log(e)
|
||||
e.pic.url = 'http://shipin.hey17.com/dingwei_a.png'
|
||||
e.pic.size.width = 22
|
||||
e.pic.size.height = 28
|
||||
for (var i = 0; i < this.list.length; i++) {
|
||||
if (this.list[i] != e) {
|
||||
this.list[i].pic.url = 'http://shipin.hey17.com/dingwei.png'
|
||||
this.list[i].pic.size.width = 16
|
||||
this.list[i].pic.size.height = 21
|
||||
}
|
||||
}
|
||||
},
|
||||
totap1(e) {
|
||||
console.log(e)
|
||||
e.pic.url = 'http://shipin.hey17.com/dingwei_a.png'
|
||||
e.pic.size.width = 22
|
||||
e.pic.size.height = 28
|
||||
for (var i = 0; i < this.listxia.length; i++) {
|
||||
if (this.listxia[i] != e) {
|
||||
this.listxia[i].pic.url = 'http://shipin.hey17.com/dingwei1.png'
|
||||
this.listxia[i].pic.size.width = 16
|
||||
this.listxia[i].pic.size.height = 21
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.fenxi {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 20%;
|
||||
position: relative;
|
||||
img {
|
||||
width: 100%;
|
||||
// height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
.banner_con {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 888;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.con {
|
||||
margin: auto;
|
||||
margin-top: 40px;
|
||||
width: 85%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
h1 {
|
||||
display: block;
|
||||
margin-bottom: 40px;
|
||||
font-size: 56px;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
ul {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
li {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 80px;
|
||||
.t {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
p {
|
||||
font-size: 56px;
|
||||
color: #fff;
|
||||
font-family: DIN-Bold;
|
||||
font-weight: bold;
|
||||
}
|
||||
span {
|
||||
font-size: 26px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.b {
|
||||
width: auto;
|
||||
text-align: center;
|
||||
p {
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.fenxi_con {
|
||||
margin: auto;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 90px;
|
||||
width: 85%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
.fenxi1 {
|
||||
position: relative;
|
||||
margin-bottom: 40px;
|
||||
width: 48%;
|
||||
height: 520px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #ccc;
|
||||
overflow: hidden;
|
||||
h2{
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
z-index: 8888;
|
||||
font-size: 22px;
|
||||
color: #212121;
|
||||
&.white{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.ccc {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.anchorBL{
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,337 @@
|
|||
<template>
|
||||
<div class="news dataDetail">
|
||||
<div class="banner">
|
||||
<img src="../../static/images/bannerny.jpg" alt="">
|
||||
</div>
|
||||
<div class="con">
|
||||
<div class="wp">
|
||||
<div class="mbx">
|
||||
<el-breadcrumb separator-class="el-icon-arrow-right">
|
||||
<el-breadcrumb-item
|
||||
:to="{ name: 'dataSearch' }"
|
||||
>数据检索</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>数据样品信息详情</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div>
|
||||
<div class="detail_a">
|
||||
<div class="">
|
||||
<div class="detail_b">
|
||||
<h3>{{ obj.name }}</h3>
|
||||
<p class="tit_a">
|
||||
数据样品信息简述:数据样品SY510-TXS-YS-01为2021年第23个航次,第1次载人潜器下潜中采集到的若干珊瑚礁石样品,样品数据包含原始数据、后处理数据、成果数据。
|
||||
数据样品SY510-TXS-YS-01为2021年第23个航次,第1次载人潜器下潜中采集到的若干珊瑚礁石样品,样品数据包含原始数据、后处理数据、成果数据。
|
||||
|
||||
</p>
|
||||
<h4>
|
||||
数据样品元数据信息:
|
||||
</h4>
|
||||
<div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="4">
|
||||
<label>航次:</label><span>TS-14 </span>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<label>平台:</label><span>着陆器</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="4">
|
||||
<label>设备:</label><span>机械手</span>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<label>机械手:</label><span>岩石</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="4">
|
||||
<label>航次首席:</label><span>MERY</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zhuti">
|
||||
<div class="left">
|
||||
<div class="left1" :class="show ? 'active' : ''">
|
||||
<img v-if="!show" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>数据文件</p>
|
||||
</div>
|
||||
<div class="left1" :class="show1 ? 'active' : ''">
|
||||
<img v-if="!show1" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>文档报告</p>
|
||||
</div>
|
||||
<div class="left1" :class="show2 ? 'active' : ''">
|
||||
<img v-if="!show2" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>数据来源信息</p>
|
||||
</div>
|
||||
<div class="left1" :class="show2 ? 'active' : ''">
|
||||
<img v-if="!show2" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>数据引用信息</p>
|
||||
</div>
|
||||
<div class="left1" :class="show2 ? 'active' : ''">
|
||||
<img v-if="!show2" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>XML元数据文件</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list">
|
||||
<el-row type="flex" justify="space-between">
|
||||
<el-col :span="20">
|
||||
<el-checkbox v-model="checkAll" :indeterminate="isIndeterminate" @change="handleCheckAllChange">全选</el-checkbox>
|
||||
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-button type="primary" @click="download">下载所选文件</el-button>
|
||||
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div style="margin: 15px 0;" />
|
||||
<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
|
||||
|
||||
<el-checkbox v-for="item in cities" :key="item.name" :label="item.name">
|
||||
<div>
|
||||
<span>{{ item.name }}</span>
|
||||
<div class="data_s">
|
||||
<label for="">Size:</label><span>{{ item.size }}</span>
|
||||
<label for="">Format:</label><span>{{ item.format }}</span>
|
||||
|
||||
<a href="http://120.48.105.88:8081/dataDetails/296c1ff351224b3d8a4b856592c0fb67" target="_blank">详情</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-checkbox>
|
||||
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div>
|
||||
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DataDetail',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
checkAll: false,
|
||||
checkedCities: [],
|
||||
cities: [
|
||||
{
|
||||
name: 'SY510-TXS-YS-01_clip1.grd',
|
||||
size: '12',
|
||||
format: 'NetCDF'
|
||||
},
|
||||
{
|
||||
name: 'SY510-TXS-YS-01_clip2.grd',
|
||||
size: '12',
|
||||
format: 'NetCDF'
|
||||
},
|
||||
{
|
||||
name: 'SY510-TXS-YS-01_clip3.grd',
|
||||
size: '12',
|
||||
format: 'NetCDF'
|
||||
},
|
||||
{
|
||||
name: 'SY510-TXS-YS-01_clip4.grd',
|
||||
size: '12',
|
||||
format: 'NetCDF'
|
||||
}
|
||||
],
|
||||
isIndeterminate: true,
|
||||
obj: {
|
||||
name: '数据样品SY510-TXS-YS-01'
|
||||
},
|
||||
show: false,
|
||||
show1: true,
|
||||
show2: false
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
download() {
|
||||
//
|
||||
},
|
||||
handleCheckAllChange(val) {
|
||||
debugger
|
||||
const data = this.cities.map(item => item.name)
|
||||
this.checkedCities = val ? data : []
|
||||
this.isIndeterminate = false
|
||||
},
|
||||
handleCheckedCitiesChange(value) {
|
||||
const checkedCount = value.length
|
||||
this.checkAll = checkedCount === this.cities.length
|
||||
this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.dataDetail .el-checkbox{
|
||||
display: block;
|
||||
}
|
||||
.dataDetail .el-checkbox-group .el-checkbox__input{
|
||||
margin-top:-57px;
|
||||
}
|
||||
.dataDetail .el-checkbox-group>label{
|
||||
margin:10px 0px 20px 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.data_s{
|
||||
padding:10px 0 10px 0;
|
||||
span{
|
||||
padding:0 100px 0 10px;
|
||||
}
|
||||
}
|
||||
.detail_a{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.detail_b{
|
||||
// width: 100%;
|
||||
background: #fff;
|
||||
padding:30px;
|
||||
border-radius: 10px;
|
||||
p{
|
||||
margin:20px 0;
|
||||
}
|
||||
h4{
|
||||
margin:20px 0;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
.news {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.con{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding-bottom: 80px;
|
||||
background: url(../../static/images/news/bg.png) center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.wp{
|
||||
max-width: 1600px;
|
||||
margin:-150px auto 0 auto;
|
||||
width:96%;
|
||||
height: auto;
|
||||
.mbx{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 55px;
|
||||
}
|
||||
.zhuti{
|
||||
margin-top:20px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// background: #ebf1f7;
|
||||
.left{
|
||||
width: 290px;
|
||||
height: 420px;
|
||||
box-sizing: border-box;
|
||||
padding: 25px;
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
.left1{
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
background: #f0f4fa;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
&.active{
|
||||
background: #13a1f0;
|
||||
p{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
background: #13a1f0;
|
||||
p{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
img{
|
||||
width: 13px;
|
||||
height: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
p{
|
||||
font-size: 18px;
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list{
|
||||
width: 80%;
|
||||
height: auto;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
padding: 25px;
|
||||
border-radius: 10px;
|
||||
a{
|
||||
color: #277ace;
|
||||
}
|
||||
.fenye{
|
||||
margin-top: 40px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.news .el-breadcrumb__item{
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
float: none;
|
||||
}
|
||||
.news .el-breadcrumb__inner{
|
||||
font-size: 18px;
|
||||
color: #fff !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,146 @@
|
|||
<template>
|
||||
<div class="containerBox bgf7f8fb dataPolicy notHomea">
|
||||
<div class="tableContainer roundBorder">
|
||||
<div class="ge_title">
|
||||
<strong>Data Policy of ASO-S Mission</strong>
|
||||
</div>
|
||||
<div class="box_t">
|
||||
<div>
|
||||
<p><span>
|
||||
1. The scientific data of ASO-S mission are completely open to the community except the data obtained during the mission commissioning phase and some of the engineering data. All users have the same right to use the scientific data of ASO-S mission as the team members.
|
||||
</span></p>
|
||||
<p><span>
|
||||
2. In order to have the best knowledge of the instrumentation and meaning of the data, users when writing papers are encouraged to collaborate with team members (one is enough), who might be the payload scientist, payload data scientist, or any of team members listed on the homepage of ASO-S mission, especially for the first two years of the mission.
|
||||
</span></p>
|
||||
<p>
|
||||
<span>
|
||||
3. All the scientific data, calibration and processing software, usage documentation, and update information are provided via the ASO-S homepage. Browse and quick-look products are not intended for science analysis and publications.
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
<span>
|
||||
4. Users are suggested to acknowledge the sources of data used in all publications as "ASO-S mission is supported by the Strategic Priority Research Program on Space Science, the Chinese Academy of Sciences, Grant No. XDA15320000". The use of ASO-S images, animations and videos for non-commercial purposes and public outreach efforts is strongly encouraged. It is requested, however, that any such use should mention explicitly the source from the ASO-S mission.
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
<span>
|
||||
5. Any software contributions to the data processing and analyzing by the users are welcome. The payload data scientists are the corresponding persons to contact.
|
||||
</span>
|
||||
</p>
|
||||
<h4 class="mgt15">Licenses</h4>
|
||||
<p class="lh24"><label for=""><a class="link" target="_blank" href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a> </label></p>
|
||||
<h4 class="mgt15">Acknowledgement</h4>
|
||||
<p><span>We acknowledge for the data resources from the Advanced Space-based Solar Observatory (ASO-S) mission and data service provided by National Space Science Data Center of China. </span></p>
|
||||
<h4 class="mgt15">Data Citation</h4>
|
||||
<p><span>Dataset Name. ASO-S mission. Version. National Space Science Data Center. DOI</span></p>
|
||||
<!-- <h4 class="mgt15"><a id="link" :href="base_url" target="_blank">GECAM Satellite Scientific Data Release Management Implementation Rules</a></h4> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import { findUserGroup, deleteUserGroup
|
||||
// } from '@/api/releaseObject'
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: "DataPolicy",
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
search: "",
|
||||
listQuery: {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
},
|
||||
total: 0,
|
||||
//当前行用户组名称
|
||||
editUserName: "",
|
||||
tableData: [
|
||||
// {
|
||||
// qq: "Q:XXXXXXXX",
|
||||
// aa: "A:XXXXXXXX",
|
||||
// },
|
||||
],
|
||||
base_url:''
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
// this.base_url=process.env.VUE_APP_DOWNLOAD_URL+'GECAM卫星科学数据发布管理实施细则.pdf'
|
||||
// console.log(1,this.base_url)
|
||||
},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dataSearch {
|
||||
padding: 20px;
|
||||
}
|
||||
p{
|
||||
text-indent:32px;
|
||||
margin-bottom: 30px;
|
||||
font-size: 16px;
|
||||
padding: 10px 0px;
|
||||
line-height: 1.8;
|
||||
color: #323333;
|
||||
}
|
||||
p label{
|
||||
/* font-weight: 200; */
|
||||
padding-right:10px;
|
||||
}
|
||||
.dataPolicy{
|
||||
background: #f7f7f7;
|
||||
}
|
||||
.box_t{
|
||||
/* width: 1200px;
|
||||
margin: 0 auto; */
|
||||
/* padding:20px 10px 40px 10px; */
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
padding: 10px 20px;
|
||||
text-indent: 32px;
|
||||
|
||||
|
||||
}
|
||||
h4{
|
||||
padding:10px 0 0px 0;
|
||||
}
|
||||
.dataPolicy{
|
||||
background: #fff;
|
||||
padding:20px 35px;
|
||||
/* border: 1px solid #dcdcdc;
|
||||
margin-bottom: 50px; */
|
||||
}
|
||||
.dataPolicy .ge_title{
|
||||
height: 56px;
|
||||
/* -webkit-box-sizing: border-box;
|
||||
box-sizing: border-box; */
|
||||
padding: 6px 20px 0;
|
||||
border-bottom: 1px solid #dcdcdc;
|
||||
overflow: hidden;
|
||||
clear: both;
|
||||
}
|
||||
.dataPolicy .tableContainer{
|
||||
/* font-family: Arial,"\5FAE\8F6F\96C5\9ED1"; */
|
||||
margin-bottom: 30px;
|
||||
font-size: 16px;
|
||||
line-height: 1.8;
|
||||
color: #323333;
|
||||
border: 1px solid #dcdcdc;
|
||||
}
|
||||
.dataPolicy .ge_title strong {
|
||||
float: left;
|
||||
height: 54px;
|
||||
line-height: 55px;
|
||||
border-bottom: 2px solid #285398;
|
||||
font-size: 20px;
|
||||
color: #285398;
|
||||
}
|
||||
.link{
|
||||
color:#1843a3
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,529 @@
|
|||
<template>
|
||||
<div class="shuju">
|
||||
<div class="shuju_con">
|
||||
<div v-show="showa == false" class="left">
|
||||
<div class="left1">
|
||||
<div class="xiala">
|
||||
<el-select v-model="value" placeholder="平台类型">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<el-input v-model="type_b" placeholder="" />
|
||||
<el-button
|
||||
class="sousuo"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
/>
|
||||
<el-button
|
||||
class="caidan"
|
||||
type="default"
|
||||
icon="el-icon-s-operation"
|
||||
@click="openList(0,'列表')"
|
||||
/>
|
||||
</div>
|
||||
<div class="left2">
|
||||
<el-tag v-for="tag in tags" :key="tag.name" closable :type="tag.type" @close="handleClose(tag)" @click="tosearch(tag.name)">
|
||||
{{ tag.name }}
|
||||
</el-tag>
|
||||
</div>
|
||||
<div class="left3">
|
||||
<p>搜索结果</p>
|
||||
<div class="left3_1">
|
||||
<el-radio-group v-model="radio">
|
||||
<el-radio :label="3">数据样品</el-radio>
|
||||
<el-radio :label="6">航次</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div class="left3_2">
|
||||
<span>排序:</span>
|
||||
<el-select v-model="value1" placeholder="航次名称">
|
||||
<el-option
|
||||
v-for="item in options1"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left4">
|
||||
<div v-for="(item,index) in detail" :key="index" class="left4_1" @click="turnDeatilPage(item)">
|
||||
<div class="left4_top">
|
||||
<p>{{ item.title }}</p>
|
||||
<span>{{ item.year }}</span>
|
||||
</div>
|
||||
<div class="left4_list">
|
||||
<div class="list1">
|
||||
<p>航次:</p>
|
||||
<span>{{ item.hangci }}</span>
|
||||
</div>
|
||||
<div class="list1">
|
||||
<p>平台:</p>
|
||||
<span>{{ item.pingtai }}</span>
|
||||
</div>
|
||||
|
||||
<div class="list1">
|
||||
<p>设备:</p>
|
||||
<span>{{ item.shebei }}</span>
|
||||
</div>
|
||||
|
||||
<div class="list1">
|
||||
<p>数据样品:</p>
|
||||
<span>{{ item.shuju }}</span>
|
||||
</div>
|
||||
|
||||
<div class="list1">
|
||||
<p>航次首席:</p>
|
||||
<span>{{ item.shouxi }}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="arrow">
|
||||
<img src="../../static/images/arrow_nav.png" alt="" @click="shousuo">
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="showa" class="arrow_r" @click="toshow">
|
||||
<img src="../../static/images/arrow_nav1.png" alt="">
|
||||
</div>
|
||||
<div class="right">
|
||||
<GMRT :is-line="line" />
|
||||
<!-- <baidu-map
|
||||
:center="center"
|
||||
:zoom="zoom"
|
||||
map-type="BMAP_SATELLITE_MAP"
|
||||
style="width: 100%; height: 100%"
|
||||
@ready="handler"
|
||||
>
|
||||
<bm-marker
|
||||
v-for="(item, index) in list"
|
||||
:key="index"
|
||||
:position="item.dingwei"
|
||||
:dragging="true"
|
||||
:icon="item.pic"
|
||||
@click="totap(item)"
|
||||
>
|
||||
<bm-label
|
||||
:content="item.content"
|
||||
:offset="{ width: -35, height: 30 }"
|
||||
/>
|
||||
</bm-marker>
|
||||
</baidu-map> -->
|
||||
</div>
|
||||
</div>
|
||||
<el-dialog
|
||||
:title="dialogTitle"
|
||||
:visible.sync="showListDialog"
|
||||
:close-on-click-modal="false"
|
||||
:height="300"
|
||||
:append-to-body="true"
|
||||
width="800px"
|
||||
>
|
||||
<list-dialog v-if="showListDialog" :choose-data="chooseData" @handleClose="closeListForm" @handleConfirm="confirmListForm" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ListDialog from './listDialog.vue'
|
||||
import GMRT from './GMRT.vue'
|
||||
export default {
|
||||
name: 'Shuju',
|
||||
components: {
|
||||
ListDialog,
|
||||
GMRT
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
line: true,
|
||||
showListDialog: false,
|
||||
chooseData: '',
|
||||
dialogTitle: '',
|
||||
type_b: '',
|
||||
showa: false,
|
||||
center: { lng: 118.962643, lat: 35.618913 },
|
||||
zoom: 3,
|
||||
list: [
|
||||
{
|
||||
dingwei: {
|
||||
lng: 119.054629,
|
||||
lat: 36.373917
|
||||
},
|
||||
content: 'DY31-II-W1306-BC',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 119.919302,
|
||||
lat: 34.226755
|
||||
},
|
||||
content: 'DY31-II-W1306-BC',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 119.560555,
|
||||
lat: 34.421374
|
||||
},
|
||||
content: 'DY31-II-W1306-BC',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
},
|
||||
{
|
||||
dingwei: {
|
||||
lng: 116.442213,
|
||||
lat: 35.556921
|
||||
},
|
||||
content: 'DY31-II-W1306-BC',
|
||||
pic: {
|
||||
url: 'http://shipin.hey17.com/dingwei1.png',
|
||||
size: { width: 16, height: 21 }
|
||||
}
|
||||
}
|
||||
],
|
||||
radio: 3,
|
||||
options: [
|
||||
{
|
||||
value: '选项1',
|
||||
label: '类型1'
|
||||
},
|
||||
{
|
||||
value: '选项2',
|
||||
label: '类型2'
|
||||
},
|
||||
{
|
||||
value: '选项3',
|
||||
label: '类型3'
|
||||
},
|
||||
{
|
||||
value: '选项4',
|
||||
label: '类型4'
|
||||
},
|
||||
{
|
||||
value: '选项5',
|
||||
label: '类型5'
|
||||
}
|
||||
],
|
||||
value: '',
|
||||
options1: [
|
||||
{
|
||||
value: '选项1',
|
||||
label: '航次1'
|
||||
},
|
||||
{
|
||||
value: '选项2',
|
||||
label: '航次2'
|
||||
},
|
||||
{
|
||||
value: '选项3',
|
||||
label: '航次3'
|
||||
},
|
||||
{
|
||||
value: '选项4',
|
||||
label: '航次4'
|
||||
},
|
||||
{
|
||||
value: '选项5',
|
||||
label: '航次5'
|
||||
}
|
||||
],
|
||||
value1: '',
|
||||
tags: [
|
||||
{ name: '探索一号', type: 'info' },
|
||||
{ name: '船载CTD', type: 'info' }
|
||||
],
|
||||
detail: [
|
||||
{
|
||||
title: '岩石SY510-TXS-YS-01',
|
||||
year: '2012',
|
||||
hangci: 'TS-14',
|
||||
pingtai: '着陆器',
|
||||
shebei: '机械手',
|
||||
shuju: '岩石',
|
||||
shouxi: 'MERY'
|
||||
},
|
||||
{
|
||||
title: '岩石SY510-TXS-YS-01',
|
||||
year: '2012',
|
||||
hangci: 'TS-14',
|
||||
pingtai: '着陆器',
|
||||
shebei: '机械手',
|
||||
shuju: '岩石',
|
||||
shouxi: 'MERY'
|
||||
},
|
||||
{
|
||||
title: '岩石SY510-TXS-YS-01',
|
||||
year: '2012',
|
||||
hangci: 'TS-14',
|
||||
pingtai: '着陆器',
|
||||
shebei: '机械手',
|
||||
shuju: '岩石',
|
||||
shouxi: 'MERY'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
turnDeatilPage() {
|
||||
this.$router.push({ name: 'dataDetail' })
|
||||
},
|
||||
handleClose(tag) {
|
||||
this.tags.splice(this.tags.indexOf(tag), 1)
|
||||
},
|
||||
tosearch(e) {
|
||||
this.input = e
|
||||
},
|
||||
openList(value, title) {
|
||||
this.dialogTitle = title
|
||||
this.showListDialog = true
|
||||
},
|
||||
// 关闭列表
|
||||
closeListForm() {
|
||||
this.showListDialog = false
|
||||
// this.init()
|
||||
},
|
||||
// 保存列表
|
||||
confirmListForm(val) {
|
||||
this.showListDialog = false
|
||||
if (val) {
|
||||
this.type_b = val
|
||||
}
|
||||
// this.init()
|
||||
},
|
||||
handler({ BMap, map }) {
|
||||
console.log(BMap, map)
|
||||
this.center.lng = 116.404
|
||||
this.center.lat = 39.915
|
||||
this.zoom = 6
|
||||
},
|
||||
totap(e) {
|
||||
console.log(e)
|
||||
e.pic.url = 'http://shipin.hey17.com/dingwei_a.png'
|
||||
e.pic.size.width = 22
|
||||
e.pic.size.height = 28
|
||||
for (var i = 0; i < this.list.length; i++) {
|
||||
if (this.list[i] != e) {
|
||||
this.list[i].pic.url = 'http://shipin.hey17.com/dingwei1.png'
|
||||
this.list[i].pic.size.width = 16
|
||||
this.list[i].pic.size.height = 21
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
shousuo() {
|
||||
this.showa = true
|
||||
},
|
||||
toshow() {
|
||||
this.showa = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.shuju {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.shuju_con {
|
||||
width: 100%;
|
||||
height: 995px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.left {
|
||||
position: relative;
|
||||
width: 30%;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
padding: 50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.left1 {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.xiala {
|
||||
width: 25%;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.el-input {
|
||||
width: 50%;
|
||||
height: 40px;
|
||||
}
|
||||
.el-button {
|
||||
width: 12%;
|
||||
font-size: 20px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.sousuo {
|
||||
margin-right: 1%;
|
||||
}
|
||||
.caidan {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
.left2 {
|
||||
margin-top: 20px;
|
||||
.el-tag {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.left3 {
|
||||
padding-bottom: 10px;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
p {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
}
|
||||
.left3_1 {
|
||||
width: 40%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.el-radio-group{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.left3_2 {
|
||||
width: 30%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
span {
|
||||
font-size: 15px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.el-select {
|
||||
margin-left: 5px;
|
||||
width: 100px;
|
||||
.el-input {
|
||||
.el-input__inner {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.left4{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
.left4_1{
|
||||
padding:20px 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
cursor: pointer;
|
||||
&:hover{
|
||||
.left4_top{
|
||||
p{
|
||||
color: #409eff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.left4_top{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
p{
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
font-weight: bold;
|
||||
}
|
||||
span{
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
.left4_list{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
.list1{
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
p{
|
||||
font-size: 16px;
|
||||
color: #999;
|
||||
}
|
||||
span{
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.arrow{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 40%;
|
||||
z-index: 888;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.arrow_r{
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 0;
|
||||
z-index: 888;
|
||||
cursor: pointer;
|
||||
}
|
||||
.right {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.left3_1 .el-radio {
|
||||
margin-right: 15px;
|
||||
}
|
||||
.left3_1 .el-radio__label {
|
||||
font-size: 15px;
|
||||
}
|
||||
.el-input__inner::-webkit-input-placeholder {
|
||||
color: #333;
|
||||
}
|
||||
.left3_2 .el-input__inner {
|
||||
padding-left: 0;
|
||||
border: none;
|
||||
font-size: 15px;
|
||||
}
|
||||
.BMapLabel{
|
||||
border: none !important;
|
||||
color: #fff;
|
||||
background: none !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,339 @@
|
|||
<template>
|
||||
<div id="" class="page-body">
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">数据样品类型</h1>
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item :to="{path: '/'}">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item :to="{name: 'dataSampleType'}">字典管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>数据样品类型</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="filter-container">
|
||||
<div class="checkBtn">
|
||||
<el-button type="primary" size="medium" @click="batchImport">数据样品类型录入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table ref="tableData" v-loading="loading" stripe border :data="tableData" :header-cell-style="{ background: '#dddfe6',color: '#555960',textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" height="600px" @row-click="openModal">
|
||||
<el-table-column
|
||||
type="index"
|
||||
width="50"
|
||||
/>
|
||||
<el-table-column prop="nameZh" label="数据样品类型名称" />
|
||||
<el-table-column prop="nameEn" label="英文名称" />
|
||||
<el-table-column prop="alias" label="别名" />
|
||||
<el-table-column prop="description" label="描述" />
|
||||
<el-table-column prop="updateTime" label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
{{ time(scope.row.updateTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip class="item" effect="dark" content="修改" placement="top-end">
|
||||
<el-button id="mod" size="mini" type="warning" class="el-icon-edit" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="删除" placement="top-end">
|
||||
<el-button id="del" size="mini" type="danger" class="el-icon-delete" style="margin-left: 0%;" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination-box">
|
||||
<el-pagination
|
||||
background
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[15, 30, 50]"
|
||||
:page-size="pagesize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="count"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
<div class="modal">
|
||||
<el-dialog
|
||||
:title="userStatus? '添加数据样品类型' : '修改数据样品类型'"
|
||||
:visible.sync="showUserForm"
|
||||
width="30%"
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<el-form ref="form" :model="form" label-width="140px" :rules="rules">
|
||||
<el-form-item label="数据样品类型名称" prop="nameZh">
|
||||
<el-input v-model="form.nameZh" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="英文名称" prop="nameEn">
|
||||
<el-input v-model="form.nameEn" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="别名" prop="alias">
|
||||
<el-input v-model="form.alias" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数据样品类型描述" prop="description">
|
||||
<el-input v-model="form.description" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button
|
||||
v-loading="subLoading"
|
||||
style="width: 100px"
|
||||
type="primary"
|
||||
size="medium"
|
||||
@click="saveData"
|
||||
>确定</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
style="margin-left: 10px; width: 100px"
|
||||
type="info"
|
||||
plain
|
||||
@click="showUserForm = false;clearInput();resetForm();"
|
||||
>取消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDicList, deleteDoc, sampleAdd, sampleUpdate
|
||||
} from '@/api/dicManage'
|
||||
export default {
|
||||
name: 'DataSampleType',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
subLoading: false,
|
||||
// 新建
|
||||
userStatus: true,
|
||||
// 数据model
|
||||
recordEnabled: 0,
|
||||
showUserForm: false,
|
||||
delDialogVisible: false,
|
||||
currentPage: 1,
|
||||
pagesize: 15,
|
||||
count: 0,
|
||||
form: {
|
||||
nameZh: '',
|
||||
nameEn: '',
|
||||
alias: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
},
|
||||
rules: {
|
||||
nameZh: [
|
||||
{ required: true, message: '请输入数据样品类型名称', trigger: 'blur' }
|
||||
],
|
||||
nameEn: [
|
||||
{ required: true, message: '请输入英文名称', trigger: 'blur' }
|
||||
],
|
||||
alias: [
|
||||
{ required: true, message: '请输入别名', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
tableData: [
|
||||
// {
|
||||
// name: '侧扫',
|
||||
// enName: 'Sidescan',
|
||||
// alias: 'VD',
|
||||
// description: '学科数据类型',
|
||||
// updateTime: '2022.3.4 12: 20: 00'
|
||||
// },
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
batchImport() {
|
||||
this.showUserForm = true
|
||||
this.userStatus = true
|
||||
},
|
||||
time(val) {
|
||||
if (!val) {
|
||||
return ''
|
||||
}
|
||||
var date = new Date(val)
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
openModal(row, event, column) {
|
||||
// 判断操作内容
|
||||
var opType = column.target.id
|
||||
if (opType == 'del') {
|
||||
this.$confirm('确定删除选中的数据吗?此操作不可撤销!', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.deleteData(row.typeId)
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
} else if (opType == 'mod') {
|
||||
this.showUserForm = true
|
||||
this.userStatus = false
|
||||
this.form = JSON.parse(JSON.stringify(row))
|
||||
}
|
||||
},
|
||||
async deleteData(typeId) {
|
||||
this.loading = true
|
||||
const data = {
|
||||
type: 'sampleType',
|
||||
typeId
|
||||
}
|
||||
try {
|
||||
const res = await deleteDoc(data)
|
||||
if (res.code == 200) {
|
||||
this.init()
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
init() {
|
||||
this.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
// 初始页currentPage、初始每页数据数pagesize和数据data
|
||||
handleSizeChange: function(size) {
|
||||
this.pagesize = size
|
||||
this.getData()
|
||||
},
|
||||
handleCurrentChange: function(currentPage) {
|
||||
this.currentPage = currentPage
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
this.loading = true
|
||||
const data = {
|
||||
page: this.currentPage,
|
||||
size: this.pagesize,
|
||||
type: 'sampleType'
|
||||
}
|
||||
try {
|
||||
const res = await getDicList(data)
|
||||
if (res.code == 200) {
|
||||
if (res.data.content) {
|
||||
this.tableData = res.data.content
|
||||
this.count = Number(res.data.count)
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
saveData() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.userStatus) {
|
||||
this.addFunction()
|
||||
} else {
|
||||
this.updateFunction()
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
async addFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
nameZh: this.form.nameZh,
|
||||
nameEn: this.form.nameEn,
|
||||
alias: this.form.alias,
|
||||
description: this.form.description
|
||||
}
|
||||
try {
|
||||
const res = await sampleAdd(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '添加成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
async updateFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
nameZh: this.form.nameZh,
|
||||
nameEn: this.form.nameEn,
|
||||
alias: this.form.alias,
|
||||
description: this.form.description,
|
||||
typeId: this.form.typeId,
|
||||
id: this.form.id
|
||||
}
|
||||
try {
|
||||
const res = await sampleUpdate(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['form'].resetFields()
|
||||
},
|
||||
handleClose(done) { // 加一个点击遮罩和关闭按钮时的回调函数
|
||||
this.clearInput()
|
||||
this.resetForm()
|
||||
done()
|
||||
},
|
||||
clearInput() {
|
||||
this.form = {
|
||||
nameZh: '',
|
||||
nameEn: '',
|
||||
alias: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,349 @@
|
|||
<template>
|
||||
<div id="" class="page-body">
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">设备类型</h1>
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item :to="{path: '/'}">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item :to="{name: 'dataSampleType'}">字典管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>设备类型</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="filter-container">
|
||||
<div class="checkBtn">
|
||||
<el-button type="primary" size="medium" @click="batchImport">设备类型录入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table ref="tableData" v-loading="loading" stripe border :data="tableData" :header-cell-style="{ background: '#dddfe6',color: '#555960',textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" height="600px" @row-click="openModal">
|
||||
<el-table-column
|
||||
type="index"
|
||||
width="50"
|
||||
/>
|
||||
<el-table-column prop="nameZh" label="设备类型名称" />
|
||||
<el-table-column prop="nameEn" label="英文名称" />
|
||||
<el-table-column prop="alias" label="别名" />
|
||||
<el-table-column prop="description" label="描述" />
|
||||
<el-table-column prop="updateTime" label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
{{ time(scope.row.updateTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip class="item" effect="dark" content="修改" placement="top-end">
|
||||
<el-button id="mod" size="mini" type="warning" class="el-icon-edit" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="删除" placement="top-end">
|
||||
<el-button id="del" size="mini" type="danger" class="el-icon-delete" style="margin-left: 0%;" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination-box">
|
||||
<el-pagination
|
||||
background
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[15, 30, 50]"
|
||||
:page-size="pagesize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="count"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
<div class="modal">
|
||||
<el-dialog
|
||||
:title="userStatus? '添加设备类型' : '修改设备类型'"
|
||||
:visible.sync="showUserForm"
|
||||
width="30%"
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<el-form ref="form" :model="form" label-width="140px" :rules="rules">
|
||||
<el-form-item label="设备类型名称" prop="nameZh">
|
||||
<el-input v-model="form.nameZh" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="英文名称" prop="nameEn">
|
||||
<el-input v-model="form.nameEn" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="别名" prop="alias">
|
||||
<el-input v-model="form.alias" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数据样品类型描述" prop="description">
|
||||
<el-input v-model="form.description" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button
|
||||
v-loading="subLoading"
|
||||
style="width: 100px"
|
||||
type="primary"
|
||||
size="medium"
|
||||
@click="saveData"
|
||||
>确定</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
style="margin-left: 10px; width: 100px"
|
||||
type="info"
|
||||
plain
|
||||
@click="showUserForm = false;clearInput();resetForm();"
|
||||
>取消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDicList, deleteDoc, equAdd, equUpdate
|
||||
} from '@/api/dicManage'
|
||||
export default {
|
||||
name: 'DocType',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
subLoading: false,
|
||||
// 新建
|
||||
userStatus: true,
|
||||
// 数据model
|
||||
recordEnabled: 0,
|
||||
showUserForm: false,
|
||||
delDialogVisible: false,
|
||||
currentPage: 1,
|
||||
pagesize: 15,
|
||||
count: 0,
|
||||
form: {
|
||||
nameZh: '',
|
||||
nameEn: '',
|
||||
alias: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
},
|
||||
rules: {
|
||||
nameZh: [
|
||||
{ required: true, message: '请输入数据样品类型名称', trigger: 'blur' }
|
||||
],
|
||||
nameEn: [
|
||||
{ required: true, message: '请输入英文名称', trigger: 'blur' }
|
||||
],
|
||||
alias: [
|
||||
{ required: true, message: '请输入别名', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
tableData: [
|
||||
// {
|
||||
// name: '侧扫',
|
||||
// enName: 'Sidescan',
|
||||
// alias: 'VD',
|
||||
// describe: '学科数据类型',
|
||||
// updateTime: '2022.3.4 12: 20: 00'
|
||||
// },
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
batchImport() {
|
||||
this.showUserForm = true
|
||||
this.userStatus = true
|
||||
},
|
||||
time(val) {
|
||||
if (!val) {
|
||||
return ''
|
||||
}
|
||||
var date = new Date(val)
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
tableIndex(index) {
|
||||
return (this.currentPage - 1) * this.pagesize + index + 1
|
||||
},
|
||||
openModal(row, event, column) {
|
||||
// 判断操作内容
|
||||
var opType = column.target.id
|
||||
if (opType == 'del') {
|
||||
this.$confirm('确定删除选中的数据吗?此操作不可撤销!', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.deleteData(row.typeId)
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
} else if (opType == 'mod') {
|
||||
this.showUserForm = true
|
||||
this.userStatus = false
|
||||
this.form = JSON.parse(JSON.stringify(row))
|
||||
}
|
||||
},
|
||||
async deleteData(typeId) {
|
||||
this.loading = true
|
||||
const data = {
|
||||
type: 'equType',
|
||||
typeId
|
||||
}
|
||||
try {
|
||||
const res = await deleteDoc(data)
|
||||
if (res.code == 200) {
|
||||
this.init()
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
init() {
|
||||
this.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
// 初始页currentPage、初始每页数据数pagesize和数据data
|
||||
handleSizeChange: function(size) {
|
||||
this.pagesize = size
|
||||
this.getData()
|
||||
},
|
||||
handleCurrentChange: function(currentPage) {
|
||||
this.currentPage = currentPage
|
||||
this.getData()
|
||||
},
|
||||
fuzzyQueryFunction() {
|
||||
this.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
reset() {
|
||||
this.queryName = ''
|
||||
},
|
||||
async getData() {
|
||||
this.loading = true
|
||||
const data = {
|
||||
page: this.currentPage,
|
||||
size: this.pagesize,
|
||||
type: 'equType'
|
||||
}
|
||||
try {
|
||||
const res = await getDicList(data)
|
||||
if (res.code == 200) {
|
||||
if (res.data.content) {
|
||||
this.tableData = res.data.content
|
||||
this.count = Number(res.data.count)
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
saveData() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.userStatus) {
|
||||
this.addFunction()
|
||||
} else {
|
||||
this.updateFunction()
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
async addFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
nameZh: this.form.nameZh,
|
||||
nameEn: this.form.nameEn,
|
||||
alias: this.form.alias,
|
||||
description: this.form.description
|
||||
}
|
||||
try {
|
||||
const res = await equAdd(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '添加成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
async updateFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
nameZh: this.form.nameZh,
|
||||
nameEn: this.form.nameEn,
|
||||
alias: this.form.alias,
|
||||
description: this.form.description,
|
||||
typeId: this.form.typeId,
|
||||
id: this.form.id
|
||||
}
|
||||
try {
|
||||
const res = await equUpdate(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['form'].resetFields()
|
||||
},
|
||||
handleClose(done) { // 加一个点击遮罩和关闭按钮时的回调函数
|
||||
this.clearInput()
|
||||
this.resetForm()
|
||||
done()
|
||||
},
|
||||
clearInput() {
|
||||
this.form = {
|
||||
nameZh: '',
|
||||
nameEn: '',
|
||||
alias: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,339 @@
|
|||
<template>
|
||||
<div id="" class="page-body">
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">平台类型</h1>
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item :to="{path: '/'}">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item :to="{name: 'dataSampleType'}">字典管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>平台类型</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="filter-container">
|
||||
<div class="checkBtn">
|
||||
<el-button type="primary" size="medium" @click="batchImport">平台类型录入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table ref="tableData" v-loading="loading" stripe border :data="tableData" :header-cell-style="{ background: '#dddfe6',color: '#555960',textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" height="600px" @row-click="openModal">
|
||||
<el-table-column
|
||||
type="index"
|
||||
width="50"
|
||||
/>
|
||||
<el-table-column prop="nameZh" label="平台类型名称" />
|
||||
<el-table-column prop="nameEn" label="英文名称" />
|
||||
<el-table-column prop="alias" label="别名" />
|
||||
<el-table-column prop="description" label="描述" />
|
||||
<el-table-column prop="updateTime" label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
{{ time(scope.row.updateTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip class="item" effect="dark" content="修改" placement="top-end">
|
||||
<el-button id="mod" size="mini" type="warning" class="el-icon-edit" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="删除" placement="top-end">
|
||||
<el-button id="del" size="mini" type="danger" class="el-icon-delete" style="margin-left: 0%;" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination-box">
|
||||
<el-pagination
|
||||
background
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[15, 30, 50]"
|
||||
:page-size="pagesize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="count"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
<div class="modal">
|
||||
<el-dialog
|
||||
:title="userStatus? '添加平台类型' : '修改平台类型'"
|
||||
:visible.sync="showUserForm"
|
||||
width="30%"
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<el-form ref="form" :model="form" label-width="140px" :rules="rules">
|
||||
<el-form-item label="平台类型名称" prop="nameZh">
|
||||
<el-input v-model="form.nameZh" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="英文名称" prop="nameEn">
|
||||
<el-input v-model="form.nameEn" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="别名" prop="alias">
|
||||
<el-input v-model="form.alias" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="平台类型描述" prop="description">
|
||||
<el-input v-model="form.description" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button
|
||||
v-loading="subLoading"
|
||||
style="width: 100px"
|
||||
type="primary"
|
||||
size="medium"
|
||||
@click="saveData"
|
||||
>确定</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
style="margin-left: 10px; width: 100px"
|
||||
type="info"
|
||||
plain
|
||||
@click="showUserForm = false;clearInput();resetForm();"
|
||||
>取消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDicList, deleteDoc, platformAdd, platformUpdate
|
||||
} from '@/api/dicManage'
|
||||
export default {
|
||||
name: 'PlatformType',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
subLoading: false,
|
||||
// 新建
|
||||
userStatus: true,
|
||||
// 数据model
|
||||
recordEnabled: 0,
|
||||
showUserForm: false,
|
||||
delDialogVisible: false,
|
||||
currentPage: 1,
|
||||
pagesize: 15,
|
||||
count: 0,
|
||||
form: {
|
||||
nameZh: '',
|
||||
nameEn: '',
|
||||
alias: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
},
|
||||
rules: {
|
||||
nameZh: [
|
||||
{ required: true, message: '请输入平台类型名称', trigger: 'blur' }
|
||||
],
|
||||
nameEn: [
|
||||
{ required: true, message: '请输入英文名称', trigger: 'blur' }
|
||||
],
|
||||
alias: [
|
||||
{ required: true, message: '请输入别名', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
tableData: [
|
||||
// {
|
||||
// name: '侧扫',
|
||||
// enName: 'Sidescan',
|
||||
// alias: 'VD',
|
||||
// description: '学科数据类型',
|
||||
// updateTime: '2022.3.4 12: 20: 00'
|
||||
// },
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
batchImport() {
|
||||
this.showUserForm = true
|
||||
this.userStatus = true
|
||||
},
|
||||
time(val) {
|
||||
if (!val) {
|
||||
return ''
|
||||
}
|
||||
var date = new Date(val)
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
openModal(row, event, column) {
|
||||
// 判断操作内容
|
||||
var opType = column.target.id
|
||||
if (opType == 'del') {
|
||||
this.$confirm('确定删除选中的数据吗?此操作不可撤销!', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.deleteData(row.typeId)
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
} else if (opType == 'mod') {
|
||||
this.showUserForm = true
|
||||
this.userStatus = false
|
||||
this.form = JSON.parse(JSON.stringify(row))
|
||||
}
|
||||
},
|
||||
async deleteData(typeId) {
|
||||
this.loading = true
|
||||
const data = {
|
||||
type: 'platformType',
|
||||
typeId
|
||||
}
|
||||
try {
|
||||
const res = await deleteDoc(data)
|
||||
if (res.code == 200) {
|
||||
this.init()
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
init() {
|
||||
this.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
// 初始页currentPage、初始每页数据数pagesize和数据data
|
||||
handleSizeChange: function(size) {
|
||||
this.pagesize = size
|
||||
this.getData()
|
||||
},
|
||||
handleCurrentChange: function(currentPage) {
|
||||
this.currentPage = currentPage
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
this.loading = true
|
||||
const data = {
|
||||
page: this.currentPage,
|
||||
size: this.pagesize,
|
||||
type: 'platformType'
|
||||
}
|
||||
try {
|
||||
const res = await getDicList(data)
|
||||
if (res.code == 200) {
|
||||
if (res.data.content) {
|
||||
this.tableData = res.data.content
|
||||
this.count = Number(res.data.count)
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
saveData() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.userStatus) {
|
||||
this.addFunction()
|
||||
} else {
|
||||
this.updateFunction()
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
async addFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
nameZh: this.form.nameZh,
|
||||
nameEn: this.form.nameEn,
|
||||
alias: this.form.alias,
|
||||
description: this.form.description
|
||||
}
|
||||
try {
|
||||
const res = await platformAdd(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '添加成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
async updateFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
nameZh: this.form.nameZh,
|
||||
nameEn: this.form.nameEn,
|
||||
alias: this.form.alias,
|
||||
description: this.form.description,
|
||||
typeId: this.form.typeId,
|
||||
id: this.form.id
|
||||
}
|
||||
try {
|
||||
const res = await platformUpdate(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['form'].resetFields()
|
||||
},
|
||||
handleClose(done) { // 加一个点击遮罩和关闭按钮时的回调函数
|
||||
this.clearInput()
|
||||
this.resetForm()
|
||||
done()
|
||||
},
|
||||
clearInput() {
|
||||
this.form = {
|
||||
nameZh: '',
|
||||
nameEn: '',
|
||||
alias: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,309 @@
|
|||
<template>
|
||||
<div id="" class="page-body">
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">共享单位</h1>
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item :to="{path: '/'}">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item :to="{name: 'dataSampleType'}">字典管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>共享单位</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="filter-container">
|
||||
<div class="checkBtn">
|
||||
<el-button type="primary" size="medium" @click="batchImport">共享单位录入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table ref="tableData" v-loading="loading" stripe border :data="tableData" :header-cell-style="{ background: '#dddfe6',color: '#555960',textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" height="600px" @row-click="openModal">
|
||||
<el-table-column
|
||||
type="index"
|
||||
width="50"
|
||||
/>
|
||||
<el-table-column prop="orgName" label="单位名称" />
|
||||
<el-table-column prop="updateTime" label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
{{ time(scope.row.updateTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip class="item" effect="dark" content="修改" placement="top-end">
|
||||
<el-button id="mod" size="mini" type="warning" class="el-icon-edit" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="删除" placement="top-end">
|
||||
<el-button id="del" size="mini" type="danger" class="el-icon-delete" style="margin-left: 0%;" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination-box">
|
||||
<el-pagination
|
||||
background
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[15, 30, 50]"
|
||||
:page-size="pagesize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="count"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
<div class="modal">
|
||||
<el-dialog
|
||||
:title="userStatus? '添加共享单位' : '修改共享单位'"
|
||||
:visible.sync="showUserForm"
|
||||
width="30%"
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<el-form ref="form" :model="form" label-width="140px" :rules="rules">
|
||||
<el-form-item label="单位名称" prop="orgName">
|
||||
<el-input v-model="form.orgName" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button
|
||||
v-loading="subLoading"
|
||||
style="width: 100px"
|
||||
type="primary"
|
||||
size="medium"
|
||||
@click="saveData"
|
||||
>确定</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
style="margin-left: 10px; width: 100px"
|
||||
type="info"
|
||||
plain
|
||||
@click="showUserForm = false;clearInput();resetForm();"
|
||||
>取消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDicList, deleteDoc, shareAdd, shareUpdate
|
||||
} from '@/api/dicManage'
|
||||
export default {
|
||||
name: 'VisitorUnit',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
subLoading: false,
|
||||
// 新建
|
||||
userStatus: true,
|
||||
// 数据model
|
||||
recordEnabled: 0,
|
||||
showUserForm: false,
|
||||
delDialogVisible: false,
|
||||
currentPage: 1,
|
||||
pagesize: 15,
|
||||
count: 0,
|
||||
form: {
|
||||
orgName: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
},
|
||||
rules: {
|
||||
orgName: [
|
||||
{ required: true, message: '请输入单位名称', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
tableData: [
|
||||
// {
|
||||
// name: '侧扫',
|
||||
// enName: 'Sidescan',
|
||||
// latitude: 'VD',
|
||||
// description: '学科数据类型',
|
||||
// updateTime: '2022.3.4 12: 20: 00'
|
||||
// },
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
batchImport() {
|
||||
this.showUserForm = true
|
||||
this.userStatus = true
|
||||
},
|
||||
time(val) {
|
||||
if (!val) {
|
||||
return ''
|
||||
}
|
||||
var date = new Date(val)
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
openModal(row, event, column) {
|
||||
// 判断操作内容
|
||||
var opType = column.target.id
|
||||
if (opType == 'del') {
|
||||
this.$confirm('确定删除选中的数据吗?此操作不可撤销!', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.deleteData(row.typeId)
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
} else if (opType == 'mod') {
|
||||
this.showUserForm = true
|
||||
this.userStatus = false
|
||||
this.form = JSON.parse(JSON.stringify(row))
|
||||
}
|
||||
},
|
||||
async deleteData(typeId) {
|
||||
this.loading = true
|
||||
const data = {
|
||||
type: 'shareOrg',
|
||||
typeId
|
||||
}
|
||||
try {
|
||||
const res = await deleteDoc(data)
|
||||
if (res.code == 200) {
|
||||
this.init()
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
init() {
|
||||
this.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
// 初始页currentPage、初始每页数据数pagesize和数据data
|
||||
handleSizeChange: function(size) {
|
||||
this.pagesize = size
|
||||
this.getData()
|
||||
},
|
||||
handleCurrentChange: function(currentPage) {
|
||||
this.currentPage = currentPage
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
this.loading = true
|
||||
const data = {
|
||||
page: this.currentPage,
|
||||
size: this.pagesize,
|
||||
type: 'shareOrg'
|
||||
}
|
||||
try {
|
||||
const res = await getDicList(data)
|
||||
if (res.code == 200) {
|
||||
if (res.data.content) {
|
||||
this.tableData = res.data.content
|
||||
this.count = Number(res.data.count)
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
saveData() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.userStatus) {
|
||||
this.addFunction()
|
||||
} else {
|
||||
this.updateFunction()
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
async addFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
orgName: this.form.orgName,
|
||||
}
|
||||
try {
|
||||
const res = await shareAdd(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '添加成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
async updateFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
orgName: this.form.orgName,
|
||||
typeId: this.form.typeId,
|
||||
id: this.form.id
|
||||
}
|
||||
try {
|
||||
const res = await shareUpdate(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['form'].resetFields()
|
||||
},
|
||||
handleClose(done) { // 加一个点击遮罩和关闭按钮时的回调函数
|
||||
this.clearInput()
|
||||
this.resetForm()
|
||||
done()
|
||||
},
|
||||
clearInput() {
|
||||
this.form = {
|
||||
orgName: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,339 @@
|
|||
<template>
|
||||
<div id="" class="page-body">
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">参航单位</h1>
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item :to="{path: '/'}">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item :to="{name: 'dataSampleType'}">字典管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>参航单位</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="filter-container">
|
||||
<div class="checkBtn">
|
||||
<el-button type="primary" size="medium" @click="batchImport">参航单位录入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table ref="tableData" v-loading="loading" stripe border :data="tableData" :header-cell-style="{ background: '#dddfe6',color: '#555960',textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" height="600px" @row-click="openModal">
|
||||
<el-table-column
|
||||
type="index"
|
||||
width="50"
|
||||
/>
|
||||
<el-table-column prop="orgName" label="单位名称" />
|
||||
<el-table-column prop="longitude" label="经度" />
|
||||
<el-table-column prop="latitude" label="纬度" />
|
||||
<el-table-column prop="description" label="单位介绍" />
|
||||
<el-table-column prop="updateTime" label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
{{ time(scope.row.updateTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip class="item" effect="dark" content="修改" placement="top-end">
|
||||
<el-button id="mod" size="mini" type="warning" class="el-icon-edit" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="删除" placement="top-end">
|
||||
<el-button id="del" size="mini" type="danger" class="el-icon-delete" style="margin-left: 0%;" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination-box">
|
||||
<el-pagination
|
||||
background
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[15, 30, 50]"
|
||||
:page-size="pagesize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="count"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
<div class="modal">
|
||||
<el-dialog
|
||||
:title="userStatus? '添加参航单位' : '修改参航单位'"
|
||||
:visible.sync="showUserForm"
|
||||
width="30%"
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<el-form ref="form" :model="form" label-width="140px" :rules="rules">
|
||||
<el-form-item label="单位名称" prop="orgName">
|
||||
<el-input v-model="form.orgName" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单位介绍" prop="description">
|
||||
<el-input v-model="form.description" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" size="medium" auto-complete="off" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button
|
||||
v-loading="subLoading"
|
||||
style="width: 100px"
|
||||
type="primary"
|
||||
size="medium"
|
||||
@click="saveData"
|
||||
>确定</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
style="margin-left: 10px; width: 100px"
|
||||
type="info"
|
||||
plain
|
||||
@click="showUserForm = false;clearInput();resetForm();"
|
||||
>取消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDicList, deleteDoc, partAdd, partUpdate
|
||||
} from '@/api/dicManage'
|
||||
export default {
|
||||
name: 'VisitorUnit',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
subLoading: false,
|
||||
// 新建
|
||||
userStatus: true,
|
||||
// 数据model
|
||||
recordEnabled: 0,
|
||||
showUserForm: false,
|
||||
delDialogVisible: false,
|
||||
currentPage: 1,
|
||||
pagesize: 15,
|
||||
count: 0,
|
||||
form: {
|
||||
orgName: '',
|
||||
longitude: '',
|
||||
latitude: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
},
|
||||
rules: {
|
||||
orgName: [
|
||||
{ required: true, message: '请输入参航单位名称', trigger: 'blur' }
|
||||
],
|
||||
longitude: [
|
||||
{ required: true, message: '请输入经度', trigger: 'blur' }
|
||||
],
|
||||
latitude: [
|
||||
{ required: true, message: '请输入纬度', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
tableData: [
|
||||
// {
|
||||
// name: '侧扫',
|
||||
// enName: 'Sidescan',
|
||||
// latitude: 'VD',
|
||||
// description: '学科数据类型',
|
||||
// updateTime: '2022.3.4 12: 20: 00'
|
||||
// },
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
batchImport() {
|
||||
this.showUserForm = true
|
||||
this.userStatus = true
|
||||
},
|
||||
time(val) {
|
||||
if (!val) {
|
||||
return ''
|
||||
}
|
||||
var date = new Date(val)
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
openModal(row, event, column) {
|
||||
// 判断操作内容
|
||||
var opType = column.target.id
|
||||
if (opType == 'del') {
|
||||
this.$confirm('确定删除选中的数据吗?此操作不可撤销!', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.deleteData(row.typeId)
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
} else if (opType == 'mod') {
|
||||
this.showUserForm = true
|
||||
this.userStatus = false
|
||||
this.form = JSON.parse(JSON.stringify(row))
|
||||
}
|
||||
},
|
||||
async deleteData(typeId) {
|
||||
this.loading = true
|
||||
const data = {
|
||||
type: 'partOrg',
|
||||
typeId
|
||||
}
|
||||
try {
|
||||
const res = await deleteDoc(data)
|
||||
if (res.code == 200) {
|
||||
this.init()
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
init() {
|
||||
this.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
// 初始页currentPage、初始每页数据数pagesize和数据data
|
||||
handleSizeChange: function(size) {
|
||||
this.pagesize = size
|
||||
this.getData()
|
||||
},
|
||||
handleCurrentChange: function(currentPage) {
|
||||
this.currentPage = currentPage
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
this.loading = true
|
||||
const data = {
|
||||
page: this.currentPage,
|
||||
size: this.pagesize,
|
||||
type: 'partOrg'
|
||||
}
|
||||
try {
|
||||
const res = await getDicList(data)
|
||||
if (res.code == 200) {
|
||||
if (res.data.content) {
|
||||
this.tableData = res.data.content
|
||||
this.count = Number(res.data.count)
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
saveData() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.userStatus) {
|
||||
this.addFunction()
|
||||
} else {
|
||||
this.updateFunction()
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
async addFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
orgName: this.form.orgName,
|
||||
longitude: this.form.longitude,
|
||||
latitude: this.form.latitude,
|
||||
description: this.form.description
|
||||
}
|
||||
try {
|
||||
const res = await partAdd(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '添加成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
async updateFunction() {
|
||||
this.subLoading = true
|
||||
const data = {
|
||||
orgName: this.form.orgName,
|
||||
longitude: this.form.longitude,
|
||||
latitude: this.form.latitude,
|
||||
description: this.form.description,
|
||||
typeId: this.form.typeId,
|
||||
id: this.form.id
|
||||
}
|
||||
try {
|
||||
const res = await partUpdate(data)
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.resetForm()
|
||||
this.subLoading = false
|
||||
this.showUserForm = false
|
||||
this.init()
|
||||
} else {
|
||||
this.$message({
|
||||
message: res.message,
|
||||
type: 'warning'
|
||||
})
|
||||
this.subLoading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.subLoading = false
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['form'].resetFields()
|
||||
},
|
||||
handleClose(done) { // 加一个点击遮罩和关闭按钮时的回调函数
|
||||
this.clearInput()
|
||||
this.resetForm()
|
||||
done()
|
||||
},
|
||||
clearInput() {
|
||||
this.form = {
|
||||
orgName: '',
|
||||
longitude: '',
|
||||
latitude: '',
|
||||
description: '',
|
||||
typeId: '',
|
||||
id: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
<template>
|
||||
<div id="dmbox" class="page myPage">
|
||||
<div>
|
||||
<el-form ref="formPlat" label-width="120px" :model="addFrom">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="20">
|
||||
<el-form-item label="子库选择:" prop="name">
|
||||
<el-select v-model="addFrom.name" placeholder="" size="medium" multiple @change="handleChange">
|
||||
<el-option
|
||||
v-for="item in sublibraryList"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form></div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button
|
||||
style="width: 100px"
|
||||
type="primary"
|
||||
@click="submit()"
|
||||
>确定</el-button>
|
||||
<el-button
|
||||
style="margin-left: 10px; width: 100px"
|
||||
type="info"
|
||||
plain
|
||||
@click="handleConcel"
|
||||
>取消</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Pinyin from 'js-pinyin'
|
||||
import { getCommonDataList
|
||||
} from '@/api/remit'
|
||||
export default {
|
||||
props: {
|
||||
chooseData: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
addFrom: {
|
||||
name: []
|
||||
},
|
||||
sublibraryList: [
|
||||
{
|
||||
name: '地球物理子库'
|
||||
},
|
||||
{
|
||||
name: '生物子库'
|
||||
}
|
||||
],
|
||||
chooseNo: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
handleChange(item) {
|
||||
},
|
||||
async commonDataList() {
|
||||
try {
|
||||
const res = await getCommonDataList({ type: this.type })
|
||||
if (res.code == 200) {
|
||||
this.commonList = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
|
||||
},
|
||||
// 保存
|
||||
async submit() {
|
||||
this.$emit('handleConfirm', this.addFrom.name)
|
||||
},
|
||||
handleConcel() {
|
||||
this.$emit('handleClose')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
#dmbox .el-select{
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,145 @@
|
|||
<template>
|
||||
<div class="containerBox faq bgf7f8fb dataSearch">
|
||||
<div class="tableContainer">
|
||||
<div class="tableSearch">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
question:
|
||||
<el-input v-model="search" placeholder="Please enter content" suffix-icon="el-icon-search" />
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="10" align="right">
|
||||
<!-- <span class="btn" @click="reset">Reset</span>
|
||||
<span class="blueBtn btn" @click="init">Search</span> -->
|
||||
<el-button type="primary" icon="el-icon-search" @click="init">Search</el-button>
|
||||
<el-button icon="el-icon-refresh-right" @click="reset">Reset</el-button>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
<el-table v-loading="loading" :header-cell-style="{backgroundColor:'#edeff3',color:'#333'}" :data="tableData" border style="width: 100% ;" height="534">
|
||||
<el-table-column prop="question" label="question" width="400" :show-overflow-tooltip="true" />
|
||||
<el-table-column prop="answer" label="anser" />
|
||||
</el-table>
|
||||
<el-pagination
|
||||
class="mt20"
|
||||
background
|
||||
layout="total,sizes, prev, pager, next"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 30]"
|
||||
:page-size="listQuery.pageSize"
|
||||
:current-page.sync="listQuery.currentPage"
|
||||
@current-change="currentChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { faqConfigSearch
|
||||
} from '@/api/releaseConfig'
|
||||
import {
|
||||
validateSpecialChart
|
||||
} from '@/utils/validate' // get token from cookie
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: 'Faq',
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
loading:false,
|
||||
search: '',
|
||||
listQuery: {
|
||||
currentPage: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
total: 0,
|
||||
//当前行用户组名称
|
||||
editUserName: '',
|
||||
tableData: [
|
||||
// {
|
||||
// answer: "",
|
||||
// id: '',
|
||||
// question: "",
|
||||
// time: ""
|
||||
// }
|
||||
],
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
init() {
|
||||
this.listQuery.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
if(this.search.length && !validateSpecialChart(this.search)){
|
||||
this.$message({
|
||||
message: "Non-compliant!",
|
||||
type: "warning",
|
||||
})
|
||||
this.tableData=[];
|
||||
this.total=0;
|
||||
return;
|
||||
}
|
||||
this.loading = true
|
||||
let data={
|
||||
currentPage:this.listQuery.currentPage,
|
||||
pageSize:this.listQuery.pageSize,
|
||||
question:this.search.trim()
|
||||
}
|
||||
try {
|
||||
const res = await faqConfigSearch(data)
|
||||
if(res.code==200){
|
||||
if(res.data.faqConfigList){
|
||||
this.tableData=res.data.faqConfigList;
|
||||
this.total=res.data.count;
|
||||
}
|
||||
}
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
},
|
||||
addUser() {
|
||||
this.showUserForm = true
|
||||
this.userStatus = false
|
||||
},
|
||||
//编辑用户组
|
||||
handleDetail(row) {
|
||||
// this.editUserName=row.qq;
|
||||
// this.showUserForm = true
|
||||
// this.userStatus = true
|
||||
},
|
||||
//重置搜索框
|
||||
reset() {
|
||||
// this.listQuery.currentPage= 1;
|
||||
this.search = ''
|
||||
// this.init()
|
||||
},
|
||||
// 分页
|
||||
currentChange(item) {
|
||||
this.listQuery.currentPage = item
|
||||
this.getData()
|
||||
},
|
||||
handleSizeChange(item) {
|
||||
this.listQuery.pageSize = item
|
||||
this.getData()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dataSearch{
|
||||
padding:20px;
|
||||
}
|
||||
.tableSearch .el-input {
|
||||
width: 69%;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,71 @@
|
|||
<template>
|
||||
<div class="containerBox faq bgf7f8fb dataSearch notHomea">
|
||||
<div class="tableContainer">
|
||||
<el-table
|
||||
v-loading="relatedLinksLoading"
|
||||
:header-cell-style="{ backgroundColor: '#edeff3', color: '#333' }"
|
||||
:data="relatedLinksList"
|
||||
border
|
||||
style="width: 100%"
|
||||
height="534"
|
||||
>
|
||||
<el-table-column prop="name" label="name">
|
||||
<template slot-scope="scope">
|
||||
<a target="_blank" class="cursor" :href="scope.row.url">{{ scope.row.name }}</a>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="time" label="time" />
|
||||
</el-table>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { findRelatedLinks } from '@/api/home'
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: 'Links',
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
relatedLinksLoading:false,
|
||||
relatedLinksList:[]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
// this.getLinks()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
// 获取链接列表
|
||||
async getLinks() {
|
||||
this.relatedLinksLoading = true
|
||||
try {
|
||||
const res = await findRelatedLinks({})
|
||||
debugger
|
||||
if(res.code==200){
|
||||
this.relatedLinksList = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.relatedLinksLoading = false
|
||||
},
|
||||
handleDetail(row){
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dataSearch{
|
||||
padding:20px;
|
||||
}
|
||||
.tableSearch .el-input {
|
||||
width: 69%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,456 @@
|
|||
<template>
|
||||
<div id="city" class="page myPage">
|
||||
|
||||
<div style="background:#f6f4f5">
|
||||
<!-- <img src="../assets/img/Shop/search.png"> -->
|
||||
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="search-city-back">
|
||||
<div class="search-city">
|
||||
<el-input
|
||||
v-model="citySearch"
|
||||
type="text"
|
||||
placeholder="请输入名称"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-col>
|
||||
<el-col :span="7" :offset="5">
|
||||
<div class="tab1">
|
||||
<span :class="currentIndex==0?'choose':''" @click="changeType(0)">全部类型 </span>
|
||||
<span :class="currentIndex==1?'choose':''" @click="changeType(1)">常用类型</span>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<a v-show="citySearch" href="javascript:;" class="img-del" @click="citySearch=''" />
|
||||
|
||||
</div>
|
||||
<div class="ad_a">
|
||||
已选择:{{ chooseName }}<a v-if="chooseName" href="javascript:;" class="img-del" @click="chooseName=''" />
|
||||
</div>
|
||||
|
||||
<div id="city-content" class="city-content">
|
||||
<div id="showCityContent" />
|
||||
<div v-for="(item,index) in showCity" :key="index" class="letter-item">
|
||||
<div><a :id="item.key">{{ item.key }}</a></div>
|
||||
<div v-for="(i,index2) in item.list" :key="index2">
|
||||
<div
|
||||
class="item-buttom"
|
||||
@click="cityChoose(i)"
|
||||
>{{ i }}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<aside v-if="showCity" class="letter-aside">
|
||||
<ul>
|
||||
<li v-for="(item,index) in showCity" :key="index" @click="naver(item.key)">{{ item.key }} </li>
|
||||
</ul>
|
||||
</aside>
|
||||
<div id="tip">{{ tipString }}</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button
|
||||
style="width: 100px"
|
||||
type="primary"
|
||||
@click="submit()"
|
||||
>确定</el-button>
|
||||
<el-button
|
||||
style="margin-left: 10px; width: 100px"
|
||||
type="info"
|
||||
plain
|
||||
@click="handleConcel"
|
||||
>取消</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Pinyin from 'js-pinyin'
|
||||
import { getCommonDataList
|
||||
} from '@/api/remit'
|
||||
export default {
|
||||
props: {
|
||||
'config': {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
letterColor: '#f44f0f'
|
||||
}
|
||||
}
|
||||
},
|
||||
pageType: {
|
||||
type: Number,
|
||||
default: 1 // 1:全国城市列表
|
||||
},
|
||||
chooseData: {
|
||||
type: String,
|
||||
default: null
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: null
|
||||
},
|
||||
sourceData: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
[]
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogTableVisible: false,
|
||||
title: '样品数据类型',
|
||||
citys: ['北京', '阿拉善', '澳门', '驻马店', '南京', '武汉', '秦皇岛', '厦门', '洛阳', '南召', '南阳'],
|
||||
citys_a: [],
|
||||
showCity: null,
|
||||
tipString: null,
|
||||
letter: null,
|
||||
citySearch: '',
|
||||
sourcePageType: 1,
|
||||
chooseName: '',
|
||||
currentIndex: 0,
|
||||
commonList: []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
citySearch() {
|
||||
this.cityFilter()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.sourceData.length) {
|
||||
this.citys = this.sourceData
|
||||
}
|
||||
this.chooseName = this.chooseData
|
||||
this.citys_a = this.sortByFirstLetter(this.citys)
|
||||
this.showCity = JSON.parse(JSON.stringify(this.citys_a))
|
||||
this.commonDataList()
|
||||
},
|
||||
mounted() {
|
||||
this.into()
|
||||
},
|
||||
methods: {
|
||||
changeType(index) {
|
||||
this.currentIndex = Number(index)
|
||||
if (index == 0) {
|
||||
this.citys = JSON.parse(JSON.stringify(this.sourceData))
|
||||
} else {
|
||||
this.citys = JSON.parse(JSON.stringify(this.commonList))
|
||||
}
|
||||
this.citys_a = this.sortByFirstLetter(this.citys)
|
||||
this.showCity = JSON.parse(JSON.stringify(this.citys_a))
|
||||
},
|
||||
async commonDataList() {
|
||||
try {
|
||||
const res = await getCommonDataList({ type: this.type })
|
||||
if (res.code == 200) {
|
||||
this.commonList = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
|
||||
},
|
||||
// 保存
|
||||
async submit() {
|
||||
this.$emit('handleConfirm', this.chooseName)
|
||||
},
|
||||
handleConcel() {
|
||||
this.$emit('handleClose')
|
||||
},
|
||||
into() {
|
||||
this.sourcePageType = parseInt(this.$props.pageType)
|
||||
},
|
||||
// 侧边字母定位滚动到相应的位置
|
||||
naver: function(letter) {
|
||||
this.tipString = letter
|
||||
const obj = document.getElementById(letter)
|
||||
const tip = document.getElementById('tip')
|
||||
const city = document.getElementById('city-content')
|
||||
|
||||
tip.setAttribute('class', 'tipAppear')
|
||||
setTimeout(function() {
|
||||
tip.removeAttribute('class')
|
||||
}, 500)
|
||||
const oPos = obj.offsetTop
|
||||
return city.scrollTo(0, oPos - 125)
|
||||
},
|
||||
// 城市搜索
|
||||
cityFilter() {
|
||||
let nodata = true
|
||||
const obj2 = {
|
||||
key: '',
|
||||
list: []
|
||||
}
|
||||
if (this.citySearch) {
|
||||
// 遍历对象,选出符合条件的值
|
||||
const arrayNew = []
|
||||
for (const a in this.citys_a) {
|
||||
const obj = this.citys_a[a]
|
||||
const object1 = {
|
||||
key: obj.key,
|
||||
list: []
|
||||
}
|
||||
obj.list.map(item => {
|
||||
if (item.indexOf(this.citySearch) > -1) {
|
||||
debugger
|
||||
object1.list.push(item)
|
||||
}
|
||||
})
|
||||
if (object1.list.length) {
|
||||
debugger
|
||||
arrayNew.push(object1)
|
||||
}
|
||||
}
|
||||
if (arrayNew.length > 0) {
|
||||
nodata = false
|
||||
}
|
||||
this.showCity = arrayNew
|
||||
} else {
|
||||
this.showCity = JSON.parse(JSON.stringify(this.citys_a))
|
||||
nodata = false
|
||||
}
|
||||
if (nodata) {
|
||||
this.showCity = null
|
||||
const _showCityContent = document.getElementById('showCityContent')
|
||||
_showCityContent.innerText = '查询不到结果'
|
||||
_showCityContent.setAttribute('class', 'tipShow')
|
||||
} else {
|
||||
document.getElementById('showCityContent').innerText = ''
|
||||
}
|
||||
},
|
||||
// 城市选择
|
||||
cityChoose: function(name) {
|
||||
this.chooseName = name
|
||||
// this.$emit('chooseCity', { Code: code, Name: name })
|
||||
},
|
||||
sortByFirstLetter(origin) {
|
||||
// 将目标数据进行排序
|
||||
origin = origin.sort((pre, next) => Pinyin.getFullChars(pre).localeCompare(Pinyin.getFullChars(next)))
|
||||
const newArr = []
|
||||
origin.map(item => {
|
||||
// 取首字母
|
||||
const key = Pinyin.getFullChars(item).charAt(0)
|
||||
const index = newArr.findIndex(subItem => subItem.key === key)
|
||||
if (index < 0) {
|
||||
newArr.push({
|
||||
key: key,
|
||||
list: [item]
|
||||
})
|
||||
} else {
|
||||
newArr[index].list.push(item)
|
||||
}
|
||||
})
|
||||
return newArr
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
#city {
|
||||
position: relative;
|
||||
background: #ffffff;
|
||||
}
|
||||
#city{
|
||||
position: relative;
|
||||
.city-content {
|
||||
padding: 0px 0 0 0;
|
||||
height:400px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.letter-item{
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.letter-item > div:first-child {
|
||||
color: #999;
|
||||
background: #f6f4f5;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.letter-item > div {
|
||||
color: #333;
|
||||
line-height: 45px;
|
||||
font-size: 14px;
|
||||
padding: 0 30px 0 15px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.letter-item .item-buttom {
|
||||
border-bottom: 1px solid #e6e6e6;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.letter-aside {
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 14px;
|
||||
color:black;
|
||||
}
|
||||
|
||||
.letter-aside li{
|
||||
padding: 2px 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.letter-aside li:hover{
|
||||
color:rgb(255, 136, 0);
|
||||
}
|
||||
.letter-aside ul {
|
||||
background:rgba(255, 255, 255, 0.426);
|
||||
margin-right:20px;
|
||||
list-style: none;
|
||||
line-height: 1.4em;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#tip {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
border: 1px solid #333333;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
z-index: 10;
|
||||
text-align: center;
|
||||
line-height: 100px;
|
||||
font-size: 50px;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.tipAppear {
|
||||
animation: appearTip 1 linear 0.5s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes appearTip {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
80% {
|
||||
opacity: 0.5;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes appearTip {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
80% {
|
||||
opacity: 0.5;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.search-city-back {
|
||||
width: 100%;
|
||||
// position: fixed;
|
||||
background-color: #f6f4f5;
|
||||
max-width: 414px;
|
||||
margin-bottom:4px;
|
||||
padding:1px 1px;
|
||||
}
|
||||
|
||||
.search-city {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding: 0 15px;
|
||||
border-radius: 14px;
|
||||
margin: 12px 15px;
|
||||
background-color: #ffffff;
|
||||
input{
|
||||
background-color: #907f7f00;border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.search-city img {
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
}
|
||||
|
||||
.search-city input {
|
||||
width: 80%;
|
||||
// margin-left: 5px;
|
||||
line-height: 24px;
|
||||
border-radius: 5px;
|
||||
outline: none;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.tipShow {
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
font-size: 16px;
|
||||
color: #bbbbbb;
|
||||
}
|
||||
|
||||
.city-hide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.img-del {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
position: absolute;
|
||||
top: 19px;
|
||||
right: 30px;
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.img-del::before, .img-del::after {
|
||||
content: ' ';
|
||||
width: 0;
|
||||
height: 50%;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 7px;
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
|
||||
.img-del::before {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.img-del::after {
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
}
|
||||
.ad_a{
|
||||
padding:10px 20px;
|
||||
position: relative;
|
||||
}
|
||||
#city .ad_a .img-del{
|
||||
top:12px;
|
||||
right:100px;
|
||||
}
|
||||
.tab1{
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
}
|
||||
.tab1 span{
|
||||
cursor: pointer;
|
||||
margin-right:14px;
|
||||
}
|
||||
.tab1 span:hover,.tab1 .choose{
|
||||
color: rgb(51, 120, 231);
|
||||
}
|
||||
input{
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,208 @@
|
|||
<template>
|
||||
<div class="index">
|
||||
<div class="wp">
|
||||
<div class="concon">
|
||||
<div class="left">
|
||||
<p>
|
||||
面向数据样品贡献方需求,构建用户体验良好的数据样品目录信息平台。
|
||||
</p>
|
||||
<p>
|
||||
提供便捷安全的数据录入,统计分析和可视化检索工具,服务数据样品贡献者、资助机构和管理机构。
|
||||
</p>
|
||||
</div>
|
||||
<div class="login">
|
||||
<div class="login_img">
|
||||
<img src="../../static/images/login_logo.png" alt="">
|
||||
</div>
|
||||
<div class="shuru">
|
||||
<div class="shuru1">
|
||||
<img src="../../static/images/yonghu.png" alt="">
|
||||
<input v-model="name" type="text" placeholder="请输入用户名">
|
||||
</div>
|
||||
<div class="shuru1">
|
||||
<img src="../../static/images/mima.png" alt="">
|
||||
<input v-model="password" type="text" placeholder="请输入面膜">
|
||||
</div>
|
||||
<div class="shuru2">
|
||||
<img class="tt" src="../../static/images/tucode.png" alt="">
|
||||
<input v-model="code" type="text" placeholder="请输入验证码">
|
||||
<img class="tt2" src="../../static/images/tucode1.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="denglu">
|
||||
<el-button>重置</el-button>
|
||||
<el-button type="primary" @click="denglu">登录</el-button>
|
||||
</div>
|
||||
<div class="dibu">
|
||||
<p>没有账号?</p>
|
||||
<span>立即注册</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Login',
|
||||
data() {
|
||||
return {
|
||||
name: '',
|
||||
password: '',
|
||||
code: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
denglu() {
|
||||
this.$router.push({
|
||||
name: 'index'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.index {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background: url(../../static/images/loginBg.jpg) center no-repeat;
|
||||
background-size: cover;
|
||||
.wp {
|
||||
max-width: 1400px;
|
||||
}
|
||||
.concon {
|
||||
padding-top: 10%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
width: 50%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
p {
|
||||
font-size: 26px;
|
||||
color: #fff;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
.login {
|
||||
width: 540px;
|
||||
height: 640px;
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
box-sizing: border-box;
|
||||
padding: 45px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.login_img {
|
||||
margin-bottom: 30px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
.shuru {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.shuru1 {
|
||||
margin-bottom: 15px;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
border: 1px solid #eeeeee;
|
||||
border-radius: 5px;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: block;
|
||||
margin-right: 25px;
|
||||
}
|
||||
input {
|
||||
width: 90%;
|
||||
height: auto;
|
||||
border: none;
|
||||
background: none;
|
||||
outline: none;
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
.shuru2 {
|
||||
margin-bottom: 15px;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
border: 1px solid #eeeeee;
|
||||
border-radius: 5px;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 8px;
|
||||
.tt {
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: block;
|
||||
margin-right: 25px;
|
||||
}
|
||||
input {
|
||||
width: 65%;
|
||||
height: auto;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
font-size: 16px;
|
||||
}
|
||||
.tt2 {
|
||||
width: 115px;
|
||||
height: 45px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.denglu {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 40px;
|
||||
.el-button {
|
||||
width: 48%;
|
||||
height: 50px;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
.dibu {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: centere;
|
||||
justify-content: center;
|
||||
p {
|
||||
font-size: 16px;
|
||||
}
|
||||
span {
|
||||
font-size: 16px;
|
||||
color: #13a1f0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,331 @@
|
|||
<template>
|
||||
<div class="news">
|
||||
<div class="banner">
|
||||
<img src="../../static/images/bannerny.jpg" alt="">
|
||||
</div>
|
||||
<div class="con">
|
||||
<div class="wp">
|
||||
<div class="mbx">
|
||||
<el-breadcrumb separator-class="el-icon-arrow-right">
|
||||
<el-breadcrumb-item
|
||||
:to="{ path: '/' }"
|
||||
>新闻动态</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>数据动态</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="zhuti">
|
||||
<div class="left">
|
||||
<div class="left1" :class="show ? 'active' : ''">
|
||||
<img v-if="!show" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>业务动态</p>
|
||||
</div>
|
||||
<div class="left1" :class="show1 ? 'active' : ''">
|
||||
<img v-if="!show1" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>数据动态</p>
|
||||
</div>
|
||||
<div class="left1" :class="show2 ? 'active' : ''">
|
||||
<img v-if="!show2" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>业务动态</p>
|
||||
</div>
|
||||
|
||||
<!-- <el-menu
|
||||
default-active="2"
|
||||
class="el-menu-vertical-demo"
|
||||
@open="handleOpen"
|
||||
@close="handleClose"
|
||||
>
|
||||
<el-menu-item index="2">
|
||||
<i class="el-icon-menu"></i>
|
||||
<span slot="title">业务动态</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3">
|
||||
<i class="el-icon-document"></i>
|
||||
<span slot="title">新闻事件</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="4">
|
||||
<i class="el-icon-setting"></i>
|
||||
<span slot="title">通知公告</span>
|
||||
</el-menu-item>
|
||||
</el-menu> -->
|
||||
</div>
|
||||
<div class="list">
|
||||
<div v-for="(item, index) in list" :key="index" class="list1">
|
||||
<div class="img">
|
||||
<img :src="item.pic" alt="">
|
||||
</div>
|
||||
<div class="des">
|
||||
<p>{{ item.title }}</p>
|
||||
<span>{{ item.des }}</span>
|
||||
<i>{{ item.date }}</i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fenye">
|
||||
<el-pagination
|
||||
background
|
||||
layout=" prev, pager, next,total, sizes"
|
||||
:total="1000"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'News',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
show1: true,
|
||||
show2: false,
|
||||
list: [
|
||||
{
|
||||
pic: require('../../static/images/news/1.png'),
|
||||
title: '陈云思想方法学术报告会——邀请朱佳木教授讲解陈云的“十五字诀”',
|
||||
des: '2月15日,中国科学院深海科学与工程研究所举办学习陈云思想方法的学术报告会,邀请中华人民共和国国史学会会长国社会科学院“陈云与当代中国”佳木教授作了题为的报告。 ',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/2.png'),
|
||||
title:
|
||||
'首次中国-新西兰联合深渊深潜科考航次完成克马德克海沟第一航段科考任务',
|
||||
des: '2月15日,中国科学院深海科学与工程研究所举办学习陈云思想方法的学术报告会,邀请中华人民共和国国史学会会长国社会科学院“陈云与当代中国”佳木教授作了题为的报告。 ',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/3.png'),
|
||||
title:
|
||||
'“探索二号”船在海底成功布设配置兆瓦时级锂电系统的大深度原位科学实验站',
|
||||
des: '2月15日,中国科学院深海科学与工程研究所举办学习陈云思想方法的学术报告会,邀请中华人民共和国国史学会会长国社会科学院“陈云与当代中国”佳木教授作了题为的报告。 ',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/4.png'),
|
||||
title: '第八届(2023)中国科学数据大会诚邀参会',
|
||||
des: '科学数据是国家科技创新和发展的基础性战略资源,是科研创新中最基本、最活跃、影响面最宽的科技资源。国际科学理事会 (International Science 委员会(Committee on Data, CODATA) 中国全国委员会于每年组织召开中国科学数据大会',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/5.png'),
|
||||
title: '2021年度全球海洋变暖报告发布:海洋增暖“又双叒叕”破纪录',
|
||||
des: '1月11日,中国科学院海洋大科学中心共建单位大气物理研究所牵头,联合全球14个研究单位23位科学家组成的国际研究团队,在《ADVANCES IN AIENCES》(AAS)以Letters的形式发布了国际首份2021年海洋变暖报告。',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/6.png'),
|
||||
title: '大数据中心发布论文 “基于组件方式开发海洋大数据可视分析系统”',
|
||||
des: '现代海洋科学研究正逐步迈向大数据时代,对大量海洋数据分析所面临的主要挑战来自于海洋数据的多元化以及其时空关联性。大数据中心王彦俊、大数据国际期刊》发表论文“基于组件方式开发海洋大数据可视分析系统”',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/7.png'),
|
||||
title: '“全球海洋环境变化系列数据产品”入选国家“十三五”科技创新成就展',
|
||||
des: '10月21日至27日,国家“十三五”科技创新成就展在北京展览馆成功举办。展览以“创新驱动发展 迈向科技强国”为主题,共分总序、百年回望、重大专项、农业科技、社会发展等12个展区',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/8.png'),
|
||||
title: '获评“2020年度山东省大数据发展创新实验室十大创新成果奖”',
|
||||
des: '2021年9月10日,在中国(济南)国际信息技术博览会开幕式上,山东省大数据发展创新实验室十大创新成果正式发布。海洋大数据发展创新实验室报送的学与工程关键技术”入选十大创新成果。',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/9.png'),
|
||||
title:
|
||||
'《破译数字青岛建设中的“蓝色密码”》——青岛日报头版刊登我中心进展情况报告',
|
||||
des: '深海中有什么?海水是如何流动的?海洋变化何以影响着全球的天气和气候?海洋数字化如何支撑城市进阶发展?照亮浩瀚未知的海洋内部,破译神秘离不开持续不断的探索和研究,而海洋大数据就是这种探索和研究的坚强后盾。',
|
||||
date: '2023-02-26'
|
||||
},
|
||||
{
|
||||
pic: require('../../static/images/news/10.png'),
|
||||
title:
|
||||
'大数据中心发布《中国近海台风路径集合数据集(1945-2020)》 ——青岛日报刊登我中心发布信息',
|
||||
des: '8月4日,大数据中心发布《中国近海台风路径集合数据集(1945-2020)》,面向全社会公开共享,地址http://msdc.qdio.ac.cn/data/metadata-spec759994058625025。发布仅一个月,下载量达到973次。',
|
||||
date: '2023-02-26'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.news {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.con{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding-bottom: 80px;
|
||||
background: url(../../static/images/news/bg.png) center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.wp{
|
||||
max-width: 1600px;
|
||||
margin:-150px auto 0 auto;
|
||||
width:96%;
|
||||
height: auto;
|
||||
.mbx{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 55px;
|
||||
}
|
||||
.zhuti{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
width: 290px;
|
||||
height: 290px;
|
||||
box-sizing: border-box;
|
||||
padding: 25px;
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
.left1{
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
background: #f0f4fa;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
&.active{
|
||||
background: #13a1f0;
|
||||
p{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
background: #13a1f0;
|
||||
p{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
img{
|
||||
width: 13px;
|
||||
height: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
p{
|
||||
font-size: 18px;
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list{
|
||||
width: 80%;
|
||||
height: auto;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
padding: 25px;
|
||||
border-radius: 10px;
|
||||
.list1{
|
||||
margin-top: 30px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 30px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
cursor: pointer;
|
||||
&:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
.img{
|
||||
width: 224px;
|
||||
height: 126px;
|
||||
margin-right: 30px;
|
||||
overflow: hidden;
|
||||
border-radius: 5px;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
.des{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 85%;
|
||||
p{
|
||||
display: block;
|
||||
margin-bottom: 15px;
|
||||
font-size: 18px;
|
||||
color: #212121;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
span{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
color: #999;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
i{
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.fenye{
|
||||
margin-top: 40px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.news .el-breadcrumb__item{
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
float: none;
|
||||
}
|
||||
.news .el-breadcrumb__inner{
|
||||
font-size: 18px;
|
||||
color: #fff !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="navbar">
|
||||
<div class="right-menu">
|
||||
<div class="cu">软件版本:V1.20
|
||||
<span v-if="loginStatuss">欢迎!{{ $store.state.app.cu }}
|
||||
<i class="cursor" @click="loginOut">注销</i>
|
||||
</span>
|
||||
<span v-else class="cursor" @click="loginIn">登录/注册</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="quanxin">
|
||||
NoPermission
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
logoutCas
|
||||
} from '@/utils/logoutCas' // get token from cookie
|
||||
import {
|
||||
removeToken
|
||||
} from '@/utils/auth' // get token from cookie
|
||||
export default {
|
||||
name: 'NoPermission',
|
||||
data() {
|
||||
return {
|
||||
loginStatuss: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loginStatuss = this.$store.state.app.cu
|
||||
},
|
||||
methods: {
|
||||
loginIn() {
|
||||
if (window.sessionStorage.getItem('sign') === 'asos_service') {
|
||||
window.location.href = process.env.VUE_APP_CAS_LOGIN_BACK
|
||||
}
|
||||
},
|
||||
loginOut() {
|
||||
this.$confirm('是否确定注销?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
removeToken()
|
||||
this.loginStatuss = ''
|
||||
window.sessionStorage.setItem('cu', '')
|
||||
window.sessionStorage.setItem('userID', '')
|
||||
// window.location.href = process.env.VUE_APP_CAS_LOGOUT_URL_BACK
|
||||
logoutCas(process.env.VUE_APP_CAS_LOGOUT_URL_BACK, true)
|
||||
}).catch(() => {
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.cursor{
|
||||
cursor: pointer;
|
||||
}
|
||||
.user-dropdown {
|
||||
top:55px
|
||||
}
|
||||
.cu {
|
||||
// display:inline-block;
|
||||
font-size: 14px;
|
||||
line-height: 15px;
|
||||
position: absolute;
|
||||
right: 22px;
|
||||
top: 19px;
|
||||
.cursor{
|
||||
color:rgb(64, 158, 255);
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar {
|
||||
height: 50px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
|
||||
.right-menu {
|
||||
width:20%;
|
||||
float: right;
|
||||
height: 100%;
|
||||
line-height: 50px;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.right-menu-item {
|
||||
display: inline-block;
|
||||
padding: 0 8px;
|
||||
height: 100%;
|
||||
font-size: 18px;
|
||||
color: #5a5e66;
|
||||
vertical-align: text-bottom;
|
||||
|
||||
&.hover-effect {
|
||||
cursor: pointer;
|
||||
transition: background .3s;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, .025)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.quanxin{
|
||||
line-height: 120px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,385 @@
|
|||
<template>
|
||||
<div class="person">
|
||||
<div class="banner">
|
||||
<img src="../../static/images/bannerny.jpg" alt="">
|
||||
</div>
|
||||
<div class="con">
|
||||
<div class="wp">
|
||||
<div class="mbx">
|
||||
<el-breadcrumb separator-class="el-icon-arrow-right">
|
||||
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item :to="{ path: '/' }">个人中心</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>我的信息</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="zhuti">
|
||||
<div class="left">
|
||||
<div class="left1" :class="show ? 'active' : ''">
|
||||
<img v-if="!show" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>我的信息</p>
|
||||
</div>
|
||||
<div class="left1" :class="show1 ? 'active' : ''">
|
||||
<img v-if="!show1" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>我的收藏</p>
|
||||
</div>
|
||||
<div class="left1" :class="show2 ? 'active' : ''">
|
||||
<img v-if="!show2" src="../../static/images/arrow.png" alt="">
|
||||
<img v-else src="../../static/images/arrow_a.png" alt="">
|
||||
<p>我的订单</p>
|
||||
</div>
|
||||
|
||||
<!-- <el-menu
|
||||
default-active="2"
|
||||
class="el-menu-vertical-demo"
|
||||
@open="handleOpen"
|
||||
@close="handleClose"
|
||||
>
|
||||
<el-menu-item index="2">
|
||||
<i class="el-icon-menu"></i>
|
||||
<span slot="title">业务动态</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3">
|
||||
<i class="el-icon-document"></i>
|
||||
<span slot="title">新闻事件</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="4">
|
||||
<i class="el-icon-setting"></i>
|
||||
<span slot="title">通知公告</span>
|
||||
</el-menu-item>
|
||||
</el-menu> -->
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="title">
|
||||
<p>基本信息</p>
|
||||
</div>
|
||||
<div class="list_con">
|
||||
<div class="con_left">
|
||||
<div class="left_top">
|
||||
<img src="../../static/images/tx.png" alt="">
|
||||
<p>马小云</p>
|
||||
</div>
|
||||
<div class="list_mid">
|
||||
<div class="mid_1">
|
||||
<p>最后一次登录</p>
|
||||
<span>2023年2月10日 14:23:09</span>
|
||||
</div>
|
||||
<div class="mid_2">
|
||||
<p>最后一次订单</p>
|
||||
<span>2023年2月10日 14:23:09</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list_dibu">
|
||||
<div class="dibu_1">
|
||||
<img src="../../static/images/bianji.png" alt="">
|
||||
<p>修改资料</p>
|
||||
</div>
|
||||
<div class="dibu_1">
|
||||
<img src="../../static/images/mima2.png" alt="">
|
||||
<p>修改密码</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="con_right">
|
||||
<div class="right1">
|
||||
<p>注册时间</p>
|
||||
<span>2022年2月10日 13:23:30</span>
|
||||
</div>
|
||||
|
||||
<div class="right1">
|
||||
<p>所在单位</p>
|
||||
<span>中科院深海科学与工程研究所</span>
|
||||
</div>
|
||||
|
||||
<div class="right1">
|
||||
<p>联系方式</p>
|
||||
<span>+86 13590998987</span>
|
||||
</div>
|
||||
|
||||
<div class="right1">
|
||||
<p>身份</p>
|
||||
<span>样品管理员</span>
|
||||
</div>
|
||||
|
||||
<div class="right1">
|
||||
<p>邮箱</p>
|
||||
<span>sysadmin@idsse.ac.cn</span>
|
||||
</div>
|
||||
|
||||
<div class="right1">
|
||||
<p>备注</p>
|
||||
<span>系统自动生成用户注册</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'Person',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
show1: false,
|
||||
show2: false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.person .el-breadcrumb__item{
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
float: none;
|
||||
}
|
||||
.person .el-breadcrumb__inner{
|
||||
font-size: 18px;
|
||||
color: #fff !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.person {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.con{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding-bottom: 80px;
|
||||
background: url(../../static/images/news/bg.png) center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.wp{
|
||||
max-width: 1600px;
|
||||
margin:-150px auto 0 auto;
|
||||
width:96%;
|
||||
height: auto;
|
||||
.mbx{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 55px;
|
||||
}
|
||||
.zhuti{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
width: 290px;
|
||||
height: 290px;
|
||||
box-sizing: border-box;
|
||||
padding: 25px;
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
.left1{
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
background: #f0f4fa;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
&.active{
|
||||
background: #13a1f0;
|
||||
p{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
background: #13a1f0;
|
||||
p{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
&:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
img{
|
||||
width: auto;
|
||||
margin-right: 20px;
|
||||
}
|
||||
p{
|
||||
font-size: 18px;
|
||||
color: #212121;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list{
|
||||
width: 80%;
|
||||
height: auto;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
padding: 25px;
|
||||
padding-bottom: 70px;
|
||||
border-radius: 10px;
|
||||
.title{
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
border-left: 6px solid #212121;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
p{
|
||||
font-size: 26px;
|
||||
color: #212121;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
.list_con{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.con_left{
|
||||
width: 50%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-right: 1px solid #eef2f8;
|
||||
.left_top{
|
||||
margin-bottom: 60px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
img{
|
||||
margin-bottom: 15px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
p{
|
||||
font-size: 24px;
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
.list_mid{
|
||||
margin-bottom: 60px;
|
||||
width: 75%;
|
||||
height: 125px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #f0f4fa;
|
||||
.mid_1{
|
||||
width: 50%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-right: 1px solid #ccc;
|
||||
p{
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
line-height: 35px;
|
||||
text-align: center;
|
||||
}
|
||||
span{
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
.mid_2{
|
||||
width: 50%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
p{
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
line-height: 35px;
|
||||
}
|
||||
span{
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.list_dibu{
|
||||
width: 75%;
|
||||
height: 45px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.dibu_1{
|
||||
width: 48%;
|
||||
height: 45px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
img{
|
||||
width: auto;
|
||||
display: block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
p{
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.con_right{
|
||||
width: 50%;
|
||||
height: 446px;
|
||||
box-sizing: border-box;
|
||||
padding-left: 100px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
.right1{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
p{
|
||||
font-size: 16px;
|
||||
color: #999;
|
||||
line-height: 35px;
|
||||
}
|
||||
span{
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,196 @@
|
|||
<template>
|
||||
<div class="roundBorder proIntroduce">
|
||||
<div v-show="flag=='index'" class="introduceIndex">
|
||||
<div class="leftMenu">
|
||||
<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
|
||||
</div>
|
||||
<div class="content">
|
||||
<h3>Science Data Access</h3>
|
||||
<h4>The Version products are now ..................................</h4>
|
||||
<ul>
|
||||
<li v-for="(item,index) in list" :key="index" class="cursor" @click="handleClick(item.id)">
|
||||
{{ item.title }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<video-Catalog v-if="flag=='VideoCatalog'" :folder="folder" @handleBack="handleBack" />
|
||||
<!-- <Pro-Details v-show="flag=='details'" /> -->
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import VideoCatalog from '../DailyMovies/videoCatalog.vue'
|
||||
// import ProDetails from './proDetails.vue'
|
||||
import {
|
||||
time
|
||||
} from '@/utils/validate' // get token from cookie
|
||||
export default {
|
||||
name: 'ProIntroduce',
|
||||
components: {
|
||||
VideoCatalog
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
folder: '',
|
||||
flag: 'index',
|
||||
data: [
|
||||
{
|
||||
label: 'FMG',
|
||||
children: [
|
||||
{
|
||||
label: '1.5'
|
||||
},
|
||||
{
|
||||
label: '2'
|
||||
},
|
||||
{
|
||||
label: 'Q1'
|
||||
},
|
||||
{
|
||||
label: 'E'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
label: 'SDI',
|
||||
children: [
|
||||
{
|
||||
label: '1'
|
||||
},
|
||||
{
|
||||
label: '2.5'
|
||||
},
|
||||
{
|
||||
label: 'Q1'
|
||||
},
|
||||
{
|
||||
label: 'E'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
label: 'WST',
|
||||
children: [
|
||||
{
|
||||
label: '1'
|
||||
},
|
||||
{
|
||||
label: '2.5'
|
||||
},
|
||||
{
|
||||
label: 'Q1'
|
||||
},
|
||||
{
|
||||
label: 'E'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
label: 'SCIUV',
|
||||
children: [
|
||||
{
|
||||
label: '1'
|
||||
},
|
||||
{
|
||||
label: '2.5'
|
||||
},
|
||||
{
|
||||
label: 'Q1'
|
||||
},
|
||||
{
|
||||
label: 'E'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
label: 'SCIWL',
|
||||
children: [
|
||||
{
|
||||
label: '1'
|
||||
},
|
||||
{
|
||||
label: '3.5'
|
||||
},
|
||||
{
|
||||
label: 'Q1'
|
||||
},
|
||||
{
|
||||
label: 'E'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
label: 'HXI',
|
||||
children: [
|
||||
{
|
||||
label: '1'
|
||||
},
|
||||
{
|
||||
label: 'Q1'
|
||||
},
|
||||
{
|
||||
label: 'E'
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
list: [
|
||||
{
|
||||
title: 'FMG is ......',
|
||||
id: 'FMG'
|
||||
},
|
||||
{
|
||||
title: 'SDI is ......',
|
||||
id: 'SDI'
|
||||
},
|
||||
{
|
||||
title: 'WST is ......',
|
||||
id: 'WST'
|
||||
},
|
||||
{
|
||||
title: 'SCIUV is ......',
|
||||
id: 'SCIUV'
|
||||
},
|
||||
{
|
||||
title: 'SCIWL is ......',
|
||||
id: 'SCIWL'
|
||||
},
|
||||
{
|
||||
title: 'HXI is ......',
|
||||
id: 'HXI'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 获取最新动态列表
|
||||
// this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
if (this.bstDate) {
|
||||
this.ruleForm.startDate = time(this.bstDate[0])
|
||||
this.ruleForm.endDate = time(this.bstDate[1])
|
||||
} else {
|
||||
this.ruleForm.startDate = ''
|
||||
this.ruleForm.endDate = ''
|
||||
}
|
||||
},
|
||||
handleClick(data) {
|
||||
this.folder = data
|
||||
this.flag = 'VideoCatalog'
|
||||
},
|
||||
handleBack() {
|
||||
this.flag = 'index'
|
||||
},
|
||||
handleNodeClick(data) {
|
||||
window.open('https://www.nssdc.ac.cn/')
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,79 @@
|
|||
<template>
|
||||
<div class="details">
|
||||
<h4>Index of /eve/data_access/eve_data/products/level2</h4>
|
||||
<ul>
|
||||
|
||||
<li v-for="(item,index) in list" :key="index" class="cursor" @click="handleClick(item.id)">
|
||||
{{ item.title }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'ProDetails',
|
||||
components: {
|
||||
// VideoCatalog
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
list: [
|
||||
{
|
||||
title: '2021',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
title: '2021',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
title: '2021',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
title: '2021',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
title: '2021',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
title: '2021',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
title: '2021',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
title: '2021',
|
||||
id: 1
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 获取最新动态列表
|
||||
// this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
|
||||
},
|
||||
handleCatalog() {
|
||||
|
||||
},
|
||||
submitForm() {
|
||||
|
||||
},
|
||||
handleClick(data) {
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,551 @@
|
|||
<template>
|
||||
<div class="containerCount">
|
||||
<div class="showEach">
|
||||
<ul v-loading="parameterLoading" class="ovfd">
|
||||
<li>
|
||||
<h5>发布数据集数量</h5>
|
||||
<h4>{{ countList.getDataSetNumber }}</h4>
|
||||
<p>今日新增:{{ countList.todayDataSetNumber }}</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5>发布文件数量</h5>
|
||||
<h4>{{ countList.getFileInfoNumber }}</h4>
|
||||
<p>今日新增:{{ countList.todayFileInfoNumber }}</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5>发布文件体量</h5>
|
||||
<h4>{{ formatFileSize(countList.getPublishDataVolume) }}</h4>
|
||||
<p>今日新增:{{ countList.todayPublishDataVolume }}</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5>下载量</h5>
|
||||
<h4>{{ countList.getDownLoadCountOfDataSet }}</h4>
|
||||
<p>今日新增:{{ countList.todayDownLoadCountOfDataSet }}</p>
|
||||
</li>
|
||||
<li>
|
||||
<h5>访问量</h5>
|
||||
<h4>{{ countList.getVisitInfoNumber }}</h4>
|
||||
<p>今日新增:{{ countList.todayVisitInfoNumber }}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="con-content ovfd">
|
||||
<div class="ovfd">
|
||||
<div class="tabTurn">
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="下载量" name="downloads" />
|
||||
<el-tab-pane label="访问量" name="views" />
|
||||
</el-tabs>
|
||||
<!-- <ul>
|
||||
<li>Downloads</li>
|
||||
<li>Views</li>
|
||||
</ul> -->
|
||||
</div>
|
||||
<div class="dateBox">
|
||||
<div class="block">
|
||||
<span class="demonstration" />
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
type="daterange"
|
||||
range-separator="至"
|
||||
start-placeholder="StartDate"
|
||||
end-placeholder="EndDate"
|
||||
unlink-panels
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width:100%;height:aoto;">
|
||||
<div v-loading="topLoading" class="countRight">
|
||||
<div v-if="activeName=='downloads'">
|
||||
<p>下载总体量 {{ formatFileSize(downLoadSum) }} 下载总次数 {{ downloadCount }}</p>
|
||||
<!-- <p>下载排名(top 5)</p> -->
|
||||
</div>
|
||||
<div v-else>
|
||||
<p>访问总量 {{ visitCount }}</p>
|
||||
<!-- <p>访问排名(top 5)</p> -->
|
||||
</div>
|
||||
<!-- <ul>
|
||||
<li v-for="(item,index) in topList" :key="index" @click="handleDetail(item.datasetId)">
|
||||
<h3 class="turnLink">{{ item.dataNameCN }}</h3>
|
||||
<h4>{{ item.total }}</h4>
|
||||
</li>
|
||||
</ul> -->
|
||||
</div>
|
||||
<div class="countLeft">
|
||||
<div id="echartsDraw" style="width: 100%; height: 700px;" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
countTotal,
|
||||
statisticsByMonth,
|
||||
getTopData
|
||||
} from '@/api/releaseCount'
|
||||
import {
|
||||
getToken,
|
||||
getUser,
|
||||
getUserID
|
||||
} from '@/utils/auth' // get token from cookie
|
||||
export default {
|
||||
name: 'ReleaseCount',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topLoading: false,
|
||||
activeName: 'downloads',
|
||||
dateRange: null,
|
||||
parameterLoading: false,
|
||||
loading: false,
|
||||
startDate: null,
|
||||
endDate: null,
|
||||
downLoadInfoList: [],
|
||||
topList: [],
|
||||
countList: {
|
||||
getBurstEventNumber: 0,
|
||||
getDataSetNumber: 0,
|
||||
getFileInfoNumber: 0,
|
||||
getPublishDataVolume: 0,
|
||||
getTrigEventNumber: 0,
|
||||
getVisitInfoNumber: 0,
|
||||
getdownLoadCountOfDataSet: 0,
|
||||
todayDataSetNumber: 0,
|
||||
todayDownLoadCountOfDataSet: 0,
|
||||
todayFileInfoNumber: 0,
|
||||
todayPublishDataVolume: 0,
|
||||
todayVisitInfoNumber: 0
|
||||
},
|
||||
pickerOptions: {
|
||||
shortcuts: [{
|
||||
text: '最近一周',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}, {
|
||||
text: '最近一个月',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}, {
|
||||
text: '最近三个月',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}]
|
||||
},
|
||||
downLoadMonth: [],
|
||||
viewMonth: [],
|
||||
sizeList: [],
|
||||
downLoadSum: 0,
|
||||
downloadCount: 0,
|
||||
visitCount: 0
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dateRange(newValue) {
|
||||
if (newValue && newValue.length) {
|
||||
// debugger
|
||||
if (newValue[0] && typeof (newValue[0]) !== 'string') {
|
||||
this.startDate = this.time(newValue[0])
|
||||
}
|
||||
if (newValue[1] && typeof (newValue[1]) !== 'string') {
|
||||
this.endDate = this.time(newValue[1])
|
||||
}
|
||||
|
||||
this.handleClick()
|
||||
} else {
|
||||
this.startDate = null
|
||||
this.endDate = null
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.endDate = this.time(new Date(), 'lastMonth')
|
||||
this.startDate = this.time(new Date(), 'lastYear')
|
||||
this.dateRange = [this.startDate, this.endDate]
|
||||
console.log(this.startDate, this.endDate)
|
||||
this.handleClick()
|
||||
this.getCount()
|
||||
},
|
||||
methods: {
|
||||
formatFileSize(limit) {
|
||||
var size = ''
|
||||
if (!limit) {
|
||||
return '0B'
|
||||
}
|
||||
if (limit < 0.1 * 1024) { // 小于0.1KB,则转化成B
|
||||
size = limit.toFixed(2) + 'B'
|
||||
} else if (limit < 0.1 * 1024 * 1024) { // 小于0.1MB,则转化成KB
|
||||
size = (limit / 1024).toFixed(2) + 'KB'
|
||||
} else if (limit < 0.1 * 1024 * 1024 * 1024) { // 小于0.1GB,则转化成MB
|
||||
size = (limit / (1024 * 1024)).toFixed(2) + 'MB'
|
||||
} else { // 其他转化成GB
|
||||
size = (limit / (1024 * 1024 * 1024)).toFixed(2) + 'GB'
|
||||
}
|
||||
|
||||
var sizeStr = size + '' // 转成字符串
|
||||
var index = sizeStr.indexOf('.') // 获取小数点处的索引
|
||||
var dou = sizeStr.substr(index + 1, 2) // 获取小数点后两位的值
|
||||
// eslint-disable-next-line eqeqeq
|
||||
if (dou == '00') { // 判断后两位是否为00,如果是则删除00
|
||||
return sizeStr.substring(0, index) + sizeStr.substr(index + 3, 2)
|
||||
}
|
||||
return size
|
||||
},
|
||||
// 获取统计列表
|
||||
async getCount() {
|
||||
const _this = this
|
||||
this.parameterLoading = true
|
||||
const data = {
|
||||
webInfo: window.sessionStorage.getItem('webInfo')
|
||||
}
|
||||
try {
|
||||
const res = await countTotal(data)
|
||||
if (res.data) {
|
||||
_this.countList = JSON.parse(JSON.stringify(res.data))
|
||||
console.log(_this.countList)
|
||||
// this.countList.getDownLoadCountOfDataSet=res.data.getDownLoadCountOfDataSet
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.parameterLoading = false
|
||||
},
|
||||
async init(data) {
|
||||
this.topLoading = true
|
||||
try {
|
||||
const res = await getTopData(data)
|
||||
if (res.downLoadInfoList) {
|
||||
this.topList = res.downLoadInfoList
|
||||
this.downLoadSum = res.downLoadSum
|
||||
this.downloadCount = res.downloadCount
|
||||
} else if (res.visitInfoList) {
|
||||
this.topList = res.visitInfoList
|
||||
this.visitCount = res.visitCount
|
||||
// this.topList = []
|
||||
// this.downLoadSum = 0
|
||||
// this.downloadCount = 0
|
||||
}
|
||||
this.topLoading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.topLoading = false
|
||||
}
|
||||
},
|
||||
handleDetail(datasetId) {
|
||||
const jsid = getToken()
|
||||
const cu = getUser()
|
||||
const userID = getUserID()
|
||||
// this.$router.push({name:"baseDetail",query:{dataSetName:row.dataSetName,userID:window.sessionStorage.getItem("userID")}})
|
||||
window.open(process.env.VUE_APP_BASE_API_FRONT + '?jsessionid=' + jsid + '&cu=' + cu + '&userId=' + userID + '#/container/dataSetDetail' + '?datasetId=' + datasetId)
|
||||
},
|
||||
// 传入一个需要排序的数组
|
||||
MsgSort(obj) {
|
||||
obj.sort((a, b) => {
|
||||
const t1 = new Date(Date.parse(a.date.replace(/-/g, '/')))
|
||||
const t2 = new Date(Date.parse(b.date.replace(/-/g, '/')))
|
||||
return t1.getTime() - t2.getTime()
|
||||
})
|
||||
return obj
|
||||
},
|
||||
async handleClick() {
|
||||
this.loading = true
|
||||
const countList = []; const sizeList = []; const downLoadMonth = []; const viewMonth = []
|
||||
if (this.activeName === 'downloads') {
|
||||
const data = {
|
||||
startTime: this.startDate,
|
||||
endTime: this.endDate,
|
||||
webInfo: window.sessionStorage.getItem('webInfo'),
|
||||
statisticsFlag: 'downLoad'
|
||||
}
|
||||
this.init(data)
|
||||
try {
|
||||
const res = await statisticsByMonth(data)
|
||||
if (res) {
|
||||
const array = []
|
||||
let obj = {}; let arrary1 = []
|
||||
for (const a in res) {
|
||||
obj = {}
|
||||
obj.date = a
|
||||
obj.downSum = res[a].downSum
|
||||
obj.downloadCount = res[a].downloadCount
|
||||
array.push(obj)
|
||||
}
|
||||
arrary1 = this.MsgSort(array)
|
||||
arrary1.map(item => {
|
||||
downLoadMonth.push(item.date)
|
||||
countList.push(item.downloadCount)
|
||||
sizeList.push(item.downSum)
|
||||
})
|
||||
|
||||
// this.downLoadInfoList = res
|
||||
// res.data.map(item => {
|
||||
// downLoadMonth.push(item.time)
|
||||
// countList.push(item.count)
|
||||
// sizeList.push(item.size)
|
||||
// })
|
||||
|
||||
const myChart = this.$echarts.init(
|
||||
document.getElementById('echartsDraw')
|
||||
)
|
||||
const option = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
crossStyle: {
|
||||
color: '#999'
|
||||
}
|
||||
}
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
// dataView: { show: true, readOnly: false },
|
||||
// magicType: { show: true, type: ["line", "bar"] },
|
||||
// restore: { show: true },
|
||||
// saveAsImage: { show: true },
|
||||
}
|
||||
},
|
||||
// legend: {
|
||||
// data: ['蒸发量', '平均温度']
|
||||
// },
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: downLoadMonth,
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '下载趋势',
|
||||
min: 0,
|
||||
max: 250,
|
||||
interval: 50,
|
||||
axisLabel: {
|
||||
// formatter: "{value} ml",
|
||||
formatter: '{value}'
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name: 'MB',
|
||||
min: 0,
|
||||
max: 25,
|
||||
interval: 5,
|
||||
axisLabel: {
|
||||
// formatter: "{value} °C",
|
||||
formatter: '{value}'
|
||||
}
|
||||
}
|
||||
],
|
||||
dataZoom: [{
|
||||
show: true
|
||||
}],
|
||||
series: [
|
||||
{
|
||||
// name: "蒸发量",
|
||||
type: 'bar',
|
||||
data: countList
|
||||
},
|
||||
{
|
||||
// name: "平均温度",
|
||||
type: 'line',
|
||||
yAxisIndex: 1,
|
||||
data: sizeList
|
||||
}
|
||||
]
|
||||
}
|
||||
myChart.setOption(option, true)
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
} else {
|
||||
const data = {
|
||||
startTime: this.startDate,
|
||||
endTime: this.endDate,
|
||||
webInfo: window.sessionStorage.getItem('webInfo'),
|
||||
statisticsFlag: 'visit'
|
||||
}
|
||||
this.init(data)
|
||||
try {
|
||||
const res = await statisticsByMonth(data)
|
||||
if (res) {
|
||||
const array = []
|
||||
let obj = {}; let arrary1 = []
|
||||
for (const a in res) {
|
||||
obj = {}
|
||||
obj.date = a
|
||||
obj.visitCount = res[a].visitCount
|
||||
array.push(obj)
|
||||
}
|
||||
arrary1 = this.MsgSort(array)
|
||||
arrary1.map(item => {
|
||||
viewMonth.push(item.date)
|
||||
countList.push(item.visitCount)
|
||||
})
|
||||
const myChart = this.$echarts.init(
|
||||
document.getElementById('echartsDraw')
|
||||
)
|
||||
const option = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
crossStyle: {
|
||||
color: '#999'
|
||||
}
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: viewMonth
|
||||
},
|
||||
yAxis:
|
||||
[
|
||||
{
|
||||
type: 'value',
|
||||
name: '访问趋势',
|
||||
min: 0,
|
||||
max: 250,
|
||||
interval: 50,
|
||||
axisLabel: {
|
||||
// formatter: "{value} ml",
|
||||
formatter: '{value}'
|
||||
}
|
||||
}
|
||||
],
|
||||
dataZoom: [{
|
||||
show: true
|
||||
}],
|
||||
series: [
|
||||
{
|
||||
data: countList,
|
||||
type: 'line',
|
||||
smooth: true
|
||||
}
|
||||
]
|
||||
}
|
||||
myChart.setOption(option, true)
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
time(date, value) {
|
||||
var y, m
|
||||
// if(value=='lastMonth'){
|
||||
// m = date.getMonth()
|
||||
// }else{
|
||||
// m = date.getMonth() + 1;
|
||||
// }
|
||||
m = date.getMonth() + 1
|
||||
if (value === 'lastYear') {
|
||||
y = date.getFullYear() - 1
|
||||
} else {
|
||||
y = date.getFullYear()
|
||||
}
|
||||
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
getLastYearYestdy(date) {
|
||||
let datastr = ''
|
||||
var strYear = date.getFullYear() - 1
|
||||
var strDay = date.getDate()
|
||||
var strMonth = date.getMonth() + 1
|
||||
if (strMonth < 10) {
|
||||
strMonth = '0' + strMonth
|
||||
}
|
||||
if (strDay < 10) {
|
||||
strDay = '0' + strDay
|
||||
}
|
||||
datastr = strYear + '-' + strMonth + '-' + strDay
|
||||
return datastr
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.countLeft{
|
||||
/* float:left; */
|
||||
width:100%;
|
||||
overflow:hidden;
|
||||
}
|
||||
.countRight{
|
||||
/* float:right;
|
||||
width:30%; */
|
||||
width:100%;
|
||||
padding-right:5%;
|
||||
padding-top:2%;
|
||||
}
|
||||
.countRight p{
|
||||
/* padding-bottom:8%; */
|
||||
}
|
||||
.countRight li{
|
||||
height:40px;
|
||||
overflow: hidden;
|
||||
width:100%;
|
||||
|
||||
}
|
||||
.countRight h3{
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space: nowrap;
|
||||
float:left;
|
||||
width:70%;
|
||||
font-size:16px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.countRight h4{
|
||||
float:right;
|
||||
font-size:16px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.con-content .tabTurn {
|
||||
float: left;
|
||||
width: 60%;
|
||||
padding-right: 5%;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.con-content .dateBox {
|
||||
float: left;
|
||||
width: 32%;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.con-content {
|
||||
background: #fff;
|
||||
}
|
||||
</style>>
|
||||
|
||||
|
|
@ -0,0 +1,350 @@
|
|||
|
||||
<template>
|
||||
<!-- 发布配置 -->
|
||||
<div class="containerBox faq bgf7f8fb">
|
||||
<div class="tableContainer">
|
||||
<div class="tableSearch">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
问题:
|
||||
<el-input
|
||||
v-model="search"
|
||||
placeholder="请输入内容"
|
||||
suffix-icon="el-icon-search"
|
||||
/>
|
||||
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<el-button type="primary" @click="init">检索</el-button>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
</el-col>
|
||||
<el-col :span="5" style="float: right">
|
||||
<el-button
|
||||
type="primary"
|
||||
style="float: right"
|
||||
@click="addUser"
|
||||
><i class="el-icon-plus" /></el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:header-cell-style="{ backgroundColor: '#edeff3', color: '#333' }"
|
||||
:data="tableData"
|
||||
border
|
||||
height="534"
|
||||
>
|
||||
<el-table-column prop="question" label="问题" width="400" />
|
||||
<el-table-column prop="answer" label="答案" />
|
||||
<el-table-column label="操作" width="400">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-edit" @click="handleDetail(scope.row)" />
|
||||
<i class="el-icon-close" @click="deleteSetting(scope.row)" />
|
||||
<!-- <i class="el-icon-d-arrow-right"></i> -->
|
||||
<!-- <i class="el-icon-zoom-in" @click="handleDetail(scope.row)" /> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
class="mt20"
|
||||
background
|
||||
layout="total,sizes, prev, pager, next"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 30]"
|
||||
:page-size="listQuery.pageSize"
|
||||
:current-page.sync="listQuery.currentPage"
|
||||
@current-change="currentChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-if="dialogSetVisible"
|
||||
:close-on-click-modal="false"
|
||||
:title="userStatus ? '编辑' : '新建'"
|
||||
:visible.sync="dialogSetVisible"
|
||||
:height="300"
|
||||
:append-to-body="true"
|
||||
width="800px"
|
||||
>
|
||||
<el-form ref="rowObj" :model="rowObj" label-width="100px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="问题:" prop="question">
|
||||
<el-input v-model="rowObj.question" autocomplete="off" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="答案:" prop="answer">
|
||||
<el-input
|
||||
v-model="rowObj.answer"
|
||||
autocomplete="off"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
maxlength="500"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button
|
||||
@click="dialogSetVisible = false"
|
||||
>取 消</el-button>
|
||||
<el-button
|
||||
v-loading="buttonLoading"
|
||||
type="primary"
|
||||
@click="confirm('rowObj')"
|
||||
>确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { faqConfigSave, faqConfigSearch, faqConfigDelete, faqConfigEdit
|
||||
} from '@/api/releaseConfig'
|
||||
import {
|
||||
validateSpecialChart
|
||||
} from '@/utils/validate' // get token from cookie
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: 'FaqConfig',
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
loading:false,
|
||||
buttonLoading:false,
|
||||
search: '',
|
||||
//编辑状态 默认编辑
|
||||
userStatus:true,
|
||||
//编辑弹窗
|
||||
dialogSetVisible:false,
|
||||
listQuery: {
|
||||
currentPage: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
total: 0,
|
||||
//当前行用户组名称
|
||||
editUserName: '',
|
||||
tableData: [
|
||||
],
|
||||
page:1,
|
||||
rowObj:{
|
||||
},
|
||||
rules: {
|
||||
question: [
|
||||
{ required: true, message:'请输入问题', trigger:'blur' },
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
answer: [
|
||||
{ required: false, message:'请输入答案', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
init() {
|
||||
this.listQuery.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
if(this.search.length && !validateSpecialChart(this.search)){
|
||||
this.$message({
|
||||
message: "输入不合规!",
|
||||
type: "warning",
|
||||
})
|
||||
this.tableData=[];
|
||||
this.total=0;
|
||||
return;
|
||||
}
|
||||
this.loading = true
|
||||
let data={
|
||||
currentPage:this.listQuery.currentPage,
|
||||
pageSize:this.listQuery.pageSize,
|
||||
question:this.search
|
||||
}
|
||||
try {
|
||||
const res = await faqConfigSearch(data)
|
||||
if(res.code==200){
|
||||
if(res.data.faqConfigList){
|
||||
this.tableData=res.data.faqConfigList;
|
||||
this.total=res.data.count;
|
||||
}
|
||||
}
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
|
||||
},
|
||||
addUser() {
|
||||
this.dialogSetVisible = true
|
||||
this.userStatus = false
|
||||
this.rowObj={
|
||||
answer: "",
|
||||
id: '',
|
||||
question: "",
|
||||
time: ""
|
||||
}
|
||||
},
|
||||
//编辑用户组
|
||||
handleDetail(row) {
|
||||
this.rowObj=row;
|
||||
this.dialogSetVisible = true
|
||||
this.userStatus = true
|
||||
},
|
||||
//删除用户组
|
||||
deleteSetting(row) {
|
||||
this.$confirm('确认删除所选的吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then((res) => {
|
||||
this.deleteUserGroup(row)
|
||||
})
|
||||
},
|
||||
confirm(formName){
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
// this.rowObj.time=this.time(new Date())
|
||||
if(!this.userStatus){
|
||||
this.addSave()
|
||||
}else{
|
||||
this.editSave()
|
||||
}
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
// FAQ删除
|
||||
async deleteUserGroup(row){
|
||||
this.loading = true
|
||||
try {
|
||||
const res = await faqConfigDelete({id:row.id})
|
||||
if(res.code==200){
|
||||
this.$message({
|
||||
message: '删除成功!',
|
||||
type: 'success'
|
||||
});
|
||||
this.init()
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
|
||||
},
|
||||
// FAQ保存
|
||||
async addSave(){
|
||||
// let data={
|
||||
// currentPage:this.listQuery.currentPage,
|
||||
// pageSize:this.listQuery.pageSize,
|
||||
// Question:this.search
|
||||
// }
|
||||
this.buttonLoading = true
|
||||
let data={
|
||||
answer:this.rowObj.answer.trim(),
|
||||
question:this.rowObj.question.trim(),
|
||||
}
|
||||
try {
|
||||
const res = await faqConfigSave(data)
|
||||
if(res.code==200){
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: '新增成功!',
|
||||
type: 'success'
|
||||
});
|
||||
this.init()
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.buttonLoading = false
|
||||
|
||||
},
|
||||
//FAQ编辑保存
|
||||
async editSave(){
|
||||
this.buttonLoading = true
|
||||
let data={
|
||||
answer:this.rowObj.answer.trim(),
|
||||
question:this.rowObj.question.trim(),
|
||||
id:this.rowObj.id,
|
||||
}
|
||||
try {
|
||||
const res = await faqConfigEdit(data)
|
||||
if(res.code==200){
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
});
|
||||
this.init()
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.buttonLoading = false
|
||||
|
||||
},
|
||||
time(date) {
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
//重置搜索框
|
||||
reset() {
|
||||
this.search = ''
|
||||
// this.init()
|
||||
},
|
||||
// 分页
|
||||
currentChange(item) {
|
||||
this.listQuery.currentPage = item
|
||||
this.getData()
|
||||
},
|
||||
handleSizeChange(item) {
|
||||
this.listQuery.pageSize = item
|
||||
this.getData()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.containerBox {
|
||||
margin: 0;
|
||||
}
|
||||
/* .el-table i {
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
padding: 0 4%;
|
||||
}
|
||||
.el-select {
|
||||
display: block;
|
||||
} */
|
||||
</style>
|
||||
|
|
@ -0,0 +1,615 @@
|
|||
<template>
|
||||
<div class="containerBox faq bgf7f8fb">
|
||||
<div class="tableContainer">
|
||||
<div class="tableSearch">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
标题:
|
||||
<el-input
|
||||
v-model="search"
|
||||
placeholder="请输入内容"
|
||||
suffix-icon="el-icon-search"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="5" style="width: 20%">
|
||||
<el-button type="primary" @click="init">Search</el-button>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
</el-col>
|
||||
<el-col :span="5" style="float: right">
|
||||
<el-button
|
||||
type="primary"
|
||||
style="float: right"
|
||||
@click="addUser"
|
||||
><i class="el-icon-plus" /></el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:header-cell-style="{ backgroundColor: '#edeff3', color: '#333' }"
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%"
|
||||
height="534"
|
||||
>
|
||||
<el-table-column prop="pubTitle" label="发布动态标题" width="400" />
|
||||
<el-table-column prop="pubContent" label="发布动态内容" />
|
||||
<el-table-column label="操作" width="400">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-edit" @click="handleDetail(scope.row)" />
|
||||
<i class="el-icon-close" @click="deleteSetting(scope.row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
class="mt20"
|
||||
background
|
||||
layout="total,sizes, prev, pager, next"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 30]"
|
||||
:page-size="listQuery.pageSize"
|
||||
:current-page.sync="listQuery.currentPage"
|
||||
@current-change="currentChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-if="dialogSetVisible"
|
||||
:close-on-click-modal="false"
|
||||
:title="userStatus ? '编辑' : '新建'"
|
||||
:visible.sync="dialogSetVisible"
|
||||
:height="300"
|
||||
:append-to-body="true"
|
||||
width="800px"
|
||||
>
|
||||
<el-form ref="rowObj" v-loading="formLoading" :rules="rules" :model="rowData" label-width="24%">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="发布动态标题:" prop="pubTitle">
|
||||
<el-input v-model="rowData.pubTitle" autocomplete="off" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="发布动态内容:" prop="pubContent">
|
||||
<el-input
|
||||
v-model="rowData.pubContent"
|
||||
autocomplete="off"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
maxlength="500"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- <el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="图片/视频上传:">
|
||||
<div class="fileBox">
|
||||
<button class="fileButton">选择文件</button>
|
||||
<input
|
||||
type="file"
|
||||
class="file1"
|
||||
@change="inputChangeFile($event)"
|
||||
>
|
||||
</div>
|
||||
<ul class="fileList">
|
||||
<li>
|
||||
<h3 v-if="rowData.uploadFileStr">{{ rowData.uploadFileStr.fileName }}</h3>
|
||||
<h4 v-if="rowData.uploadFileStr" @click="deleteFile()">x</h4>
|
||||
</li>
|
||||
</ul>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
<!-- multiple -->
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="图片/视频上传:">
|
||||
<div class="fileBox">
|
||||
<button class="fileButton">选择文件</button>
|
||||
<input
|
||||
type="file"
|
||||
class="file1"
|
||||
@change="inputChangeDoc($event)"
|
||||
>
|
||||
</div>
|
||||
<ul class="fileList">
|
||||
<li v-for="(item, index) in rowData.uploadDoc" :key="index">
|
||||
<h3>{{ item.fileName }}</h3>
|
||||
<h4 @click="deleteDoc(index)">x</h4>
|
||||
</li>
|
||||
</ul>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button
|
||||
@click="dialogSetVisible = false"
|
||||
>取 消</el-button>
|
||||
<el-button
|
||||
v-loading="buttonLoading"
|
||||
type="primary"
|
||||
@click="confirm('rowObj')"
|
||||
>确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
pubDynamicSave,
|
||||
pubDynamicSearch,
|
||||
pubDynamicEdit,
|
||||
deletePubTrendsConfig,
|
||||
pubDynamicFileUpload,
|
||||
searchPubTrendsConfigFile,
|
||||
pubDynamicDelete
|
||||
} from '@/api/releaseConfig'
|
||||
import {
|
||||
validateSpecialChart
|
||||
} from '@/utils/validate' // get token from cookie
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: "softConfig",
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
dirName:"",
|
||||
temp: null,
|
||||
loading: false,
|
||||
buttonLoading: false,
|
||||
formLoading:false,
|
||||
paths: {
|
||||
m: [],
|
||||
mat: [],
|
||||
sky: {},
|
||||
ao: "",
|
||||
a: [],
|
||||
},
|
||||
uploadFileStr:null,
|
||||
uploadDoc: [],
|
||||
loading: false,
|
||||
search: "",
|
||||
//编辑状态 默认编辑
|
||||
userStatus: true,
|
||||
//编辑弹窗
|
||||
dialogSetVisible: false,
|
||||
listQuery: {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
},
|
||||
total: 0,
|
||||
//当前行用户组名称
|
||||
editUserName: "",
|
||||
tableData: [
|
||||
],
|
||||
rowData:{},
|
||||
rules: {
|
||||
pubTitle: [
|
||||
{ required: true, message:'请输入标题', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
pubContent: [
|
||||
{ required: false, message:'请输入内容', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
//上传文件 第一次上传dirName:"" 返回一个随机码是 往后都传这个随机码 dirName
|
||||
//flag:save/edit
|
||||
|
||||
//删除的时候调接口 入参为filePath
|
||||
inputChangeFile(event) {
|
||||
let obj = {};
|
||||
var file = event.target.files;
|
||||
obj.name = file[0].name;
|
||||
obj.file = file;
|
||||
// this.uploadFileStr.push(obj);
|
||||
let flag=this.userStatus?'edit':'save'
|
||||
const fd = new FormData()
|
||||
fd.append('file', file[0])
|
||||
fd.append('dirName', this.dirName)
|
||||
fd.append('flag', flag)
|
||||
this.fileUploads(fd,"file");
|
||||
// uploadMulFile(fileList);
|
||||
},
|
||||
inputChangeDoc(event) {
|
||||
debugger
|
||||
let obj = {};
|
||||
var file = event.target.files;
|
||||
if(file[0].type!='image/png' && file[0].type!="image/jpeg" && file[0].type!="video/mp4" ){
|
||||
this.$message({
|
||||
message: "请上传图片或者视频!",
|
||||
type: "warning",
|
||||
})
|
||||
return
|
||||
|
||||
}
|
||||
obj.name = file[0].name;
|
||||
obj.file = file;
|
||||
let flag=this.userStatus?'edit':'save'
|
||||
const fd = new FormData()
|
||||
fd.append('file', file[0])
|
||||
fd.append('dirName', this.dirName)
|
||||
fd.append('flag', flag)
|
||||
console.log(fd.get("file").size)
|
||||
console.log(fd.get("flag"))
|
||||
this.fileUploads(fd,"doc");
|
||||
// this.uploadDoc.push(obj);
|
||||
},
|
||||
init() {
|
||||
this.listQuery.currentPage = 1;
|
||||
this.getData();
|
||||
},
|
||||
async fileUploads(fd,value) {
|
||||
this.formLoading = true;
|
||||
try {
|
||||
const res = await pubDynamicFileUpload(fd);
|
||||
if(res.code==200){
|
||||
this.$message({
|
||||
message: '上传成功!',
|
||||
type: 'success'
|
||||
});
|
||||
if(value=="file"){
|
||||
this.rowData.uploadFileStr={}
|
||||
this.rowData.uploadFileStr.fileName=res.data.fileName;
|
||||
this.rowData.uploadFileStr.filePath=res.data.filePath;
|
||||
this.rowData.uploadFileStr.fileFlag="0"
|
||||
}else{
|
||||
let obj={}
|
||||
obj.fileName=res.data.fileName;
|
||||
obj.filePath=res.data.filePath;
|
||||
obj.fileFlag="1"
|
||||
this.rowData.uploadDoc.push(obj);
|
||||
}
|
||||
if(!this.dirName && !this.userStatus){
|
||||
this.dirName=res.data.dirName;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.formLoading = false;
|
||||
},
|
||||
async getData() {
|
||||
if(this.search.length && !validateSpecialChart(this.search)){
|
||||
this.$message({
|
||||
message: "输入不合规!",
|
||||
type: "warning",
|
||||
})
|
||||
this.tableData=[];
|
||||
this.total=0;
|
||||
return;
|
||||
}
|
||||
this.loading = true;
|
||||
let data = {
|
||||
currentPage: this.listQuery.currentPage,
|
||||
pageSize: this.listQuery.pageSize,
|
||||
pubTitle: this.search.trim(),
|
||||
};
|
||||
try {
|
||||
const res = await pubDynamicSearch(data);
|
||||
if (res.code == 200) {
|
||||
if (res.data.pubTrendsConfigList) {
|
||||
this.tableData = res.data.pubTrendsConfigList;
|
||||
this.total = res.data.count;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
handleRemove(file, fileList) {
|
||||
console.log(file, fileList);
|
||||
},
|
||||
handlePreview(file) {
|
||||
console.log(file);
|
||||
},
|
||||
handleExceed(files, fileList) {
|
||||
this.$message.warning(
|
||||
`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${
|
||||
files.length + fileList.length
|
||||
} 个文件`
|
||||
);
|
||||
},
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${file.name}?`);
|
||||
},
|
||||
//删除文件
|
||||
deleteFile(){
|
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.requestDelete("")
|
||||
}).catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
});
|
||||
});
|
||||
},
|
||||
async requestDelete(value){
|
||||
let _this=this;
|
||||
this.formLoading = true;
|
||||
let data;
|
||||
try {
|
||||
if(value===""){
|
||||
data={
|
||||
filePath:this.rowData.uploadFileStr.path
|
||||
}
|
||||
}else{
|
||||
data={
|
||||
filePath:this.rowData.uploadDoc[value].path
|
||||
}
|
||||
}
|
||||
const res = await pubDynamicDelete(data);
|
||||
if (res.code == 200) {
|
||||
if(value===""){
|
||||
_this.rowData.uploadFileStr=null
|
||||
}else{
|
||||
_this.rowData.uploadDoc.splice(value,1)
|
||||
}
|
||||
_this.$message({
|
||||
message: "删除成功!",
|
||||
type: "success",
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.formLoading = false;
|
||||
|
||||
},
|
||||
//删除doc
|
||||
deleteDoc(docIndex){
|
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.requestDelete(docIndex)
|
||||
}).catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
});
|
||||
});
|
||||
},
|
||||
addUser() {
|
||||
this.dirName=""
|
||||
this.rowData = {
|
||||
pubTitle: "",
|
||||
pubContent: "",
|
||||
// uploadFileStr:null,
|
||||
uploadDoc:[],
|
||||
};
|
||||
this.dialogSetVisible = true;
|
||||
this.userStatus = false;
|
||||
|
||||
},
|
||||
//编辑用户组
|
||||
async handleDetail(row) {
|
||||
this.formLoading = true;
|
||||
this.dirName=row.pubTitle;
|
||||
try {
|
||||
const res = await searchPubTrendsConfigFile({fkPubTrendsConfig:row.id});
|
||||
if (res.code == 200) {
|
||||
let array1=[],uploadDoc=[]
|
||||
if(res.data.length){
|
||||
debugger
|
||||
res.data=res.data.map(item=>{
|
||||
delete item.time
|
||||
return item
|
||||
})
|
||||
debugger
|
||||
// array1=res.data.filter(item=>item.fileFlag==0)
|
||||
uploadDoc=res.data.filter(item=>item.fileFlag==1)
|
||||
}else{
|
||||
array1=[]
|
||||
uploadDoc=[]
|
||||
}
|
||||
this.rowData=row;
|
||||
this.rowData.uploadDoc=uploadDoc
|
||||
// if(array1.length){
|
||||
// this.rowData.uploadFileStr=array1[0]
|
||||
// }else{
|
||||
// this.rowData.uploadFileStr=null
|
||||
// }
|
||||
console.log("this.rowData",this.rowData)
|
||||
this.dialogSetVisible = true;
|
||||
this.userStatus = true;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.formLoading = false;
|
||||
|
||||
},
|
||||
//删除用户组
|
||||
deleteSetting(row) {
|
||||
this.$confirm("确认删除所选的吗?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then((res) => {
|
||||
this.deleteUserGroup(row);
|
||||
});
|
||||
},
|
||||
//提交
|
||||
confirm(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
// let formdata = new FormData();
|
||||
// this.uploadFileStr.map(item=>{
|
||||
// formdata.append('file', item.file)
|
||||
// })
|
||||
// console.log(this.uploadFileStr)
|
||||
console.log("rowData",this.rowData)
|
||||
let pubTrendsConfigFileStr=JSON.parse(JSON.stringify(this.rowData.uploadDoc))
|
||||
// if(this.rowData.uploadFileStr){
|
||||
// softwareConfigFileStr.push(this.rowData.uploadFileStr)
|
||||
// }
|
||||
let data={
|
||||
pubTrendsConfigFileStr:JSON.stringify(pubTrendsConfigFileStr),
|
||||
pubTitle:this.rowData.pubTitle.trim(),
|
||||
pubContent:this.rowData.pubContent.trim(),
|
||||
}
|
||||
console.log("data",data)
|
||||
if (!this.userStatus) {
|
||||
this.addSave(data);
|
||||
} else {
|
||||
this.editSave(data);
|
||||
}
|
||||
} else {
|
||||
console.log("error submit!!");
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 软件删除
|
||||
async deleteUserGroup(row) {
|
||||
this.loading = true;
|
||||
try {
|
||||
const res = await deletePubTrendsConfig({ id: row.id });
|
||||
if (res.code == 200) {
|
||||
this.$message({
|
||||
message: "删除成功!",
|
||||
type: "success",
|
||||
});
|
||||
this.init();
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
async addSave(data) {
|
||||
data.dirName=this.dirName
|
||||
this.buttonLoading = true;
|
||||
try {
|
||||
const res = await pubDynamicSave(data);
|
||||
if (res.code == 200) {
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: "新增成功!",
|
||||
type: "success",
|
||||
});
|
||||
this.init();
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.buttonLoading = false;
|
||||
},
|
||||
//软件编辑保存
|
||||
async editSave(data) {
|
||||
data.id=this.rowData.id
|
||||
this.buttonLoading = true;
|
||||
try {
|
||||
const res = await pubDynamicEdit(data);
|
||||
if (res.code == 200) {
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: "修改成功!",
|
||||
type: "success",
|
||||
});
|
||||
this.init();
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.buttonLoading = false;
|
||||
},
|
||||
//重置搜索框
|
||||
reset() {
|
||||
// this.listQuery.currentPage = 1;
|
||||
this.search = "";
|
||||
// this.init()
|
||||
},
|
||||
// 分页
|
||||
currentChange(item) {
|
||||
this.listQuery.currentPage = item;
|
||||
this.getData();
|
||||
},
|
||||
handleSizeChange(item) {
|
||||
this.listQuery.pageSize = item;
|
||||
this.getData();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="sss" scoped>
|
||||
.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
.fileList {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
overflow-y: scroll;
|
||||
border: 1px solid rgb(155, 155, 155);
|
||||
margin: 10px 0;
|
||||
}
|
||||
.fileList li {
|
||||
padding-left: 10px;
|
||||
}
|
||||
.fileList h3 {
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space: nowrap;
|
||||
float: left;
|
||||
width: 70%;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fileList h4 {
|
||||
float: right;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
padding-right:10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* .el-table i {
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
padding: 0 4%;
|
||||
}
|
||||
.el-select {
|
||||
display: block;
|
||||
} */
|
||||
.fileBox {
|
||||
display: inline-block;
|
||||
}
|
||||
.fileName {
|
||||
width: 150px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
padding: 0px 5px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
border: 1px solid #eee;
|
||||
vertical-align: top;
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,67 @@
|
|||
<template>
|
||||
<div class="configBox">
|
||||
<div class="tableSearch">
|
||||
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
|
||||
<el-tab-pane label="FAQ配置" name="FAQ" />
|
||||
<el-tab-pane label="URL配置" name="URL" />
|
||||
<el-tab-pane label="软件工具配置" name="Software" />
|
||||
<el-tab-pane label="发布动态配置" name="pubDynamic" />
|
||||
</el-tabs>
|
||||
</div>
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'ReleaseConfig',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
activeName: 'FAQ'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
switch (this.$route.name) {
|
||||
case 'faqConfig':
|
||||
this.activeName = 'FAQ'
|
||||
break
|
||||
case 'urlConfig':
|
||||
this.activeName = 'URL'
|
||||
break
|
||||
case 'softConfig':
|
||||
this.activeName = 'Software'
|
||||
break
|
||||
case 'pubDynamic':
|
||||
this.activeName = 'pubDynamic'
|
||||
break
|
||||
}
|
||||
},
|
||||
handleClick() {
|
||||
console.log(this.activeName)
|
||||
// debugger
|
||||
switch (this.activeName) {
|
||||
case 'FAQ':
|
||||
this.$router.push({ path: 'faqConfig' })
|
||||
break
|
||||
case 'URL':
|
||||
this.$router.push({ path: 'urlConfig' })
|
||||
break
|
||||
case 'Software':
|
||||
this.$router.push({ path: 'softConfig' })
|
||||
break
|
||||
case 'pubDynamic':
|
||||
this.$router.push({ path: 'pubDynamic' })
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,700 @@
|
|||
<template>
|
||||
<div class="containerBox faq bgf7f8fb">
|
||||
<div class="tableContainer">
|
||||
<div class="tableSearch">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
软件名称:
|
||||
<el-input
|
||||
v-model="search"
|
||||
placeholder="请输入内容"
|
||||
suffix-icon="el-icon-search"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="5" style="width: 20%">
|
||||
<el-button type="primary" @click="init">检索</el-button>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
</el-col>
|
||||
<el-col :span="5" style="float: right">
|
||||
<el-button
|
||||
type="primary"
|
||||
style="float: right"
|
||||
@click="addUser"
|
||||
><i class="el-icon-plus" /></el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:header-cell-style="{ backgroundColor: '#edeff3', color: '#333' }"
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%"
|
||||
height="534"
|
||||
>
|
||||
<el-table-column prop="name" label="软件名称" width="400" />
|
||||
<el-table-column prop="version" label="版本号" />
|
||||
<el-table-column prop="description" label="描述信息" width="400" />
|
||||
<el-table-column label="操作" width="400">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-edit" @click="handleDetail(scope.row)" />
|
||||
<i class="el-icon-close" @click="deleteSetting(scope.row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
class="mt20"
|
||||
background
|
||||
layout="total,sizes, prev, pager, next"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 30]"
|
||||
:page-size="listQuery.pageSize"
|
||||
:current-page.sync="listQuery.currentPage"
|
||||
@current-change="currentChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-if="dialogSetVisible"
|
||||
:close-on-click-modal="false"
|
||||
:title="userStatus ? '编辑' : '新建'"
|
||||
:visible.sync="dialogSetVisible"
|
||||
:height="300"
|
||||
:append-to-body="true"
|
||||
width="800px"
|
||||
>
|
||||
<el-form ref="rowObj" v-loading="formLoading" :rules="rules" :model="rowData" label-width="24%">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="软件名称:" prop="name">
|
||||
<el-input v-model="rowData.name" autocomplete="off" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="版本号:" prop="version">
|
||||
<el-input v-model="rowData.version" autocomplete="off" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="描述信息:" prop="description">
|
||||
<el-input
|
||||
v-model="rowData.description"
|
||||
autocomplete="off"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
maxlength="500"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<!-- multiple -->
|
||||
<el-col :span="24">
|
||||
<el-form-item label="软件上传:">
|
||||
<div class="fileBox">
|
||||
<!-- <div class="fileName"></div> -->
|
||||
<button class="fileButton">选择文件</button>
|
||||
<input
|
||||
type="file"
|
||||
class="file1"
|
||||
@change="inputChangeFile($event)"
|
||||
>
|
||||
</div>
|
||||
<!-- <input type="file" name="file" multiple @change="inputChangeFile($event)" value="哈哈哈" /> -->
|
||||
<ul class="fileList">
|
||||
<li>
|
||||
<h3 v-if="rowData.uploadFileStr">{{ rowData.uploadFileStr.fileName }}</h3>
|
||||
<h4 v-if="rowData.uploadFileStr" @click="deleteFile()">x</h4>
|
||||
</li>
|
||||
</ul>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="说明文档上传:">
|
||||
<div class="fileBox">
|
||||
<!-- <div class="fileName"></div> -->
|
||||
<button class="fileButton">选择文件</button>
|
||||
<input
|
||||
type="file"
|
||||
class="file1"
|
||||
@change="inputChangeDoc($event)"
|
||||
>
|
||||
</div>
|
||||
<!-- <input type="file" name="file" multiple @change="inputChangeFile($event)" value="哈哈哈" /> -->
|
||||
<ul class="fileList">
|
||||
<li v-for="(item, index) in rowData.uploadDoc" :key="index">
|
||||
<h3>{{ item.fileName }}</h3>
|
||||
<h4 @click="deleteDoc(index)">x</h4>
|
||||
</li>
|
||||
</ul>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button
|
||||
@click="dialogSetVisible = false"
|
||||
>取 消</el-button>
|
||||
<el-button
|
||||
v-loading="buttonLoading"
|
||||
type="primary"
|
||||
@click="confirm('rowObj')"
|
||||
>确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
softwareConfigSave,
|
||||
softwareConfigSearch,
|
||||
softwareConfigEdit,
|
||||
softwareConfigDelete,
|
||||
fileUpload,
|
||||
softwareEditSearch,
|
||||
requestDelete
|
||||
} from '@/api/releaseConfig'
|
||||
import {
|
||||
validateSpecialChart
|
||||
} from '@/utils/validate' // get token from cookie
|
||||
|
||||
// 多个文件一个一个读
|
||||
// function uploadMulFile(uploadFile) {
|
||||
// var fileLength = 0
|
||||
// var reader = new FileReader()
|
||||
|
||||
// // const fd = new FormData()
|
||||
// // fd.append('file', item.file)
|
||||
// // debugger
|
||||
// if (uploadFile[fileLength].type.match('image.*')) {
|
||||
// reader.readAsDataURL(uploadFile[fileLength])
|
||||
// } else {
|
||||
// reader.readAsText(uploadFile[fileLength], 'UTF-8')
|
||||
// }
|
||||
// // reader.readAsText(uploadFile[fileLength],"UTF-8");
|
||||
// reader.onabort = function(e) {
|
||||
// console.log('文件读取异常' + uploadFile[fileLength].name)
|
||||
// }
|
||||
// reader.onerror = function(e) {
|
||||
// console.log('文件读取出现错误' + uploadFile[fileLength].name)
|
||||
// }
|
||||
// reader.onload = function(e) {
|
||||
// if (e.target.result) {
|
||||
// // debugger
|
||||
// console.log(
|
||||
// '完成' +
|
||||
// uploadFile[fileLength].name +
|
||||
// ' 路径为:' +
|
||||
// uploadFile[fileLength].webkitRelativePath
|
||||
// )
|
||||
// // console.log(e.target.result);//这是结果
|
||||
// fileLength++
|
||||
// if (fileLength < uploadFile.length) {
|
||||
// if (uploadFile[fileLength].type.match('image.*')) {
|
||||
// reader.readAsDataURL(uploadFile[fileLength]) // 读图片
|
||||
// } else {
|
||||
// reader.readAsText(uploadFile[fileLength], 'UTF-8') // 读文本
|
||||
// }
|
||||
// } else {
|
||||
// // do something
|
||||
// console.log('本地文件已经全部读取完毕' + typeof this.paths)
|
||||
// console.log(JSON.stringify(this.paths))
|
||||
// // console.log(JSON.parse(this.paths));
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// 导出为json文件
|
||||
|
||||
// var button = document.getElementById("exportFile");
|
||||
|
||||
// button.addEventListener("click", saveHandler, false);
|
||||
|
||||
// function saveHandler() {
|
||||
|
||||
// let data = {
|
||||
|
||||
// name: "hanmeimei",
|
||||
|
||||
// age: 88
|
||||
|
||||
// }
|
||||
|
||||
// var content = JSON.stringify(data);
|
||||
|
||||
// var blob = new Blob([content], {
|
||||
// type: "text/plain;charset=utf-8"
|
||||
// });
|
||||
|
||||
// saveAs(blob, "save.json");
|
||||
|
||||
// }
|
||||
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: "softConfig",
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
dirName:"",
|
||||
temp: null,
|
||||
loading: false,
|
||||
buttonLoading: false,
|
||||
formLoading:false,
|
||||
paths: {
|
||||
m: [],
|
||||
mat: [],
|
||||
sky: {},
|
||||
ao: "",
|
||||
a: [],
|
||||
},
|
||||
uploadFileStr:null,
|
||||
uploadDoc: [],
|
||||
loading: false,
|
||||
search: "",
|
||||
//编辑状态 默认编辑
|
||||
userStatus: true,
|
||||
//编辑弹窗
|
||||
dialogSetVisible: false,
|
||||
listQuery: {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
},
|
||||
total: 0,
|
||||
//当前行用户组名称
|
||||
editUserName: "",
|
||||
tableData: [
|
||||
],
|
||||
rowData:{},
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message:'请输入软件名称', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
version: [
|
||||
{ required: false, message:'请输入版本号', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
description: [
|
||||
{ required: false, message:'请输入描述信息', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
//上传文件 第一次上传dirName:"" 返回一个随机码是 往后都传这个随机码 dirName
|
||||
//flag:save/edit
|
||||
|
||||
//删除的时候调接口 入参为filePath
|
||||
inputChangeFile(event) {
|
||||
let obj = {};
|
||||
var file = event.target.files;
|
||||
obj.name = file[0].name;
|
||||
obj.file = file;
|
||||
// this.uploadFileStr.push(obj);
|
||||
let flag=this.userStatus?'edit':'save'
|
||||
const fd = new FormData()
|
||||
fd.append('file', file[0])
|
||||
fd.append('dirName', this.dirName)
|
||||
fd.append('flag', flag)
|
||||
this.fileUploads(fd,"file");
|
||||
// uploadMulFile(fileList);
|
||||
},
|
||||
inputChangeDoc(event) {
|
||||
let obj = {};
|
||||
var file = event.target.files;
|
||||
obj.name = file[0].name;
|
||||
obj.file = file;
|
||||
let flag=this.userStatus?'edit':'save'
|
||||
const fd = new FormData()
|
||||
fd.append('file', file[0])
|
||||
fd.append('dirName', this.dirName)
|
||||
fd.append('flag', flag)
|
||||
console.log(fd.get("file").size)
|
||||
console.log(fd.get("flag"))
|
||||
this.fileUploads(fd,"doc");
|
||||
// this.uploadDoc.push(obj);
|
||||
},
|
||||
init() {
|
||||
this.listQuery.currentPage = 1;
|
||||
this.getData();
|
||||
},
|
||||
async fileUploads(fd,value) {
|
||||
this.formLoading = true;
|
||||
try {
|
||||
const res = await fileUpload(fd);
|
||||
if(res.code==200){
|
||||
this.$message({
|
||||
message: '上传成功!',
|
||||
type: 'success'
|
||||
});
|
||||
if(value=="file"){
|
||||
this.rowData.uploadFileStr={}
|
||||
this.rowData.uploadFileStr.fileName=res.data.fileName;
|
||||
this.rowData.uploadFileStr.filePath=res.data.filePath;
|
||||
this.rowData.uploadFileStr.fileFlag="0"
|
||||
}else{
|
||||
let obj={}
|
||||
obj.fileName=res.data.fileName;
|
||||
obj.filePath=res.data.filePath;
|
||||
obj.fileFlag="1"
|
||||
this.rowData.uploadDoc.push(obj);
|
||||
}
|
||||
if(!this.dirName && !this.userStatus){
|
||||
this.dirName=res.data.dirName;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.formLoading = false;
|
||||
},
|
||||
async getData() {
|
||||
if(this.search.length && !validateSpecialChart(this.search)){
|
||||
this.$message({
|
||||
message: "输入不合规!",
|
||||
type: "warning",
|
||||
})
|
||||
this.tableData=[];
|
||||
this.total=0;
|
||||
return;
|
||||
}
|
||||
this.loading = true;
|
||||
let data = {
|
||||
currentPage: this.listQuery.currentPage,
|
||||
pageSize: this.listQuery.pageSize,
|
||||
name: this.search.trim(),
|
||||
};
|
||||
try {
|
||||
const res = await softwareConfigSearch(data);
|
||||
if (res.code == 200) {
|
||||
if (res.data.softwareConfigList) {
|
||||
this.tableData = res.data.softwareConfigList;
|
||||
this.total = res.data.count;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
handleRemove(file, fileList) {
|
||||
console.log(file, fileList);
|
||||
},
|
||||
handlePreview(file) {
|
||||
console.log(file);
|
||||
},
|
||||
handleExceed(files, fileList) {
|
||||
this.$message.warning(
|
||||
`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${
|
||||
files.length + fileList.length
|
||||
} 个文件`
|
||||
);
|
||||
},
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${file.name}?`);
|
||||
},
|
||||
//删除文件
|
||||
deleteFile(){
|
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.requestDelete("")
|
||||
}).catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
});
|
||||
});
|
||||
},
|
||||
async requestDelete(value){
|
||||
let _this=this;
|
||||
this.formLoading = true;
|
||||
let data;
|
||||
try {
|
||||
if(value===""){
|
||||
data={
|
||||
filePath:this.rowData.uploadFileStr.path
|
||||
}
|
||||
}else{
|
||||
data={
|
||||
filePath:this.rowData.uploadDoc[value].path
|
||||
}
|
||||
}
|
||||
const res = await requestDelete(data);
|
||||
if (res.code == 200) {
|
||||
if(value===""){
|
||||
_this.rowData.uploadFileStr=null
|
||||
}else{
|
||||
_this.rowData.uploadDoc.splice(value,1)
|
||||
}
|
||||
_this.$message({
|
||||
message: "删除成功!",
|
||||
type: "success",
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.formLoading = false;
|
||||
|
||||
},
|
||||
//删除doc
|
||||
deleteDoc(docIndex){
|
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.requestDelete(docIndex)
|
||||
}).catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
});
|
||||
});
|
||||
},
|
||||
addUser() {
|
||||
this.dirName=""
|
||||
this.rowData = {
|
||||
name: "",
|
||||
version: "",
|
||||
description: "",
|
||||
uploadFileStr:null,
|
||||
uploadDoc:[],
|
||||
};
|
||||
this.dialogSetVisible = true;
|
||||
this.userStatus = false;
|
||||
|
||||
},
|
||||
//编辑用户组
|
||||
async handleDetail(row) {
|
||||
this.formLoading = true;
|
||||
this.dirName=row.name;
|
||||
try {
|
||||
const res = await softwareEditSearch({fkSoftwareConfig:row.id});
|
||||
if (res.code == 200) {
|
||||
let array1=[],uploadDoc=[]
|
||||
if(res.data.length){
|
||||
debugger
|
||||
res.data=res.data.map(item=>{
|
||||
delete item.time
|
||||
return item
|
||||
})
|
||||
debugger
|
||||
array1=res.data.filter(item=>item.fileFlag==0)
|
||||
uploadDoc=res.data.filter(item=>item.fileFlag==1)
|
||||
}else{
|
||||
array1=[]
|
||||
uploadDoc=[]
|
||||
}
|
||||
this.rowData=row;
|
||||
this.rowData.uploadDoc=uploadDoc
|
||||
if(array1.length){
|
||||
this.rowData.uploadFileStr=array1[0]
|
||||
}else{
|
||||
this.rowData.uploadFileStr=null
|
||||
}
|
||||
console.log("this.rowData",this.rowData)
|
||||
this.dialogSetVisible = true;
|
||||
this.userStatus = true;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.formLoading = false;
|
||||
|
||||
},
|
||||
//删除用户组
|
||||
deleteSetting(row) {
|
||||
this.$confirm("确认删除所选的吗?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then((res) => {
|
||||
this.deleteUserGroup(row);
|
||||
});
|
||||
},
|
||||
//提交
|
||||
confirm(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
// let formdata = new FormData();
|
||||
// this.uploadFileStr.map(item=>{
|
||||
// formdata.append('file', item.file)
|
||||
// })
|
||||
// console.log(this.uploadFileStr)
|
||||
console.log("rowData",this.rowData)
|
||||
let softwareConfigFileStr=JSON.parse(JSON.stringify(this.rowData.uploadDoc))
|
||||
if(this.rowData.uploadFileStr){
|
||||
softwareConfigFileStr.push(this.rowData.uploadFileStr)
|
||||
}
|
||||
let data={
|
||||
softwareConfigFileStr:JSON.stringify(softwareConfigFileStr),
|
||||
name:this.rowData.name.trim(),
|
||||
version:this.rowData.version.trim(),
|
||||
description:this.rowData.description.trim(),
|
||||
}
|
||||
console.log("data",data)
|
||||
if (!this.userStatus) {
|
||||
this.addSave(data);
|
||||
} else {
|
||||
this.editSave(data);
|
||||
}
|
||||
} else {
|
||||
console.log("error submit!!");
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 软件删除
|
||||
async deleteUserGroup(row) {
|
||||
this.loading = true;
|
||||
try {
|
||||
const res = await softwareConfigDelete({ id: row.id });
|
||||
if (res.code == 200) {
|
||||
this.$message({
|
||||
message: "删除成功!",
|
||||
type: "success",
|
||||
});
|
||||
this.init();
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
async addSave(data) {
|
||||
data.dirName=this.dirName
|
||||
this.buttonLoading = true;
|
||||
try {
|
||||
const res = await softwareConfigSave(data);
|
||||
if (res.code == 200) {
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: "新增成功!",
|
||||
type: "success",
|
||||
});
|
||||
this.init();
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.buttonLoading = false;
|
||||
},
|
||||
//软件编辑保存
|
||||
async editSave(data) {
|
||||
data.id=this.rowData.id
|
||||
this.buttonLoading = true;
|
||||
try {
|
||||
const res = await softwareConfigEdit(data);
|
||||
if (res.code == 200) {
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: "修改成功!",
|
||||
type: "success",
|
||||
});
|
||||
this.init();
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
this.buttonLoading = false;
|
||||
},
|
||||
//重置搜索框
|
||||
reset() {
|
||||
// this.listQuery.currentPage = 1;
|
||||
this.search = "";
|
||||
// this.init()
|
||||
},
|
||||
// 分页
|
||||
currentChange(item) {
|
||||
this.listQuery.currentPage = item;
|
||||
this.getData();
|
||||
},
|
||||
handleSizeChange(item) {
|
||||
this.listQuery.pageSize = item;
|
||||
this.getData();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
.fileList {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
overflow-y: scroll;
|
||||
border: 1px solid rgb(155, 155, 155);
|
||||
margin: 10px 0;
|
||||
}
|
||||
.fileList li {
|
||||
padding-left: 10px;
|
||||
}
|
||||
.fileList h3 {
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space: nowrap;
|
||||
float: left;
|
||||
width: 70%;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fileList h4 {
|
||||
float: right;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
padding-right:10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* .el-table i {
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
padding: 0 4%;
|
||||
}
|
||||
.el-select {
|
||||
display: block;
|
||||
} */
|
||||
.fileBox {
|
||||
display: inline-block;
|
||||
}
|
||||
.fileName {
|
||||
width: 150px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
padding: 0px 5px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
border: 1px solid #eee;
|
||||
vertical-align: top;
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,326 @@
|
|||
<template>
|
||||
<div class="containerBox faq bgf7f8fb">
|
||||
<div class="tableContainer">
|
||||
<!-- <svg-icon icon-class="eye"></svg-icon> -->
|
||||
<div class="tableSearch">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
名称:
|
||||
<el-input v-model="search" placeholder="请输入内容" suffix-icon="el-icon-search" />
|
||||
</el-col>
|
||||
<el-col :span="5" style="width:20%;">
|
||||
<el-button type="primary" @click="init">检索</el-button>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
</el-col>
|
||||
<el-col :span="5" style="float:right;">
|
||||
<el-button type="primary" style="float:right;" @click="addUser"><i class="el-icon-plus" /></el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-table v-loading="loading" :header-cell-style="{backgroundColor:'#edeff3',color:'#333'}" :data="tableData" border style="width: 100% ;" height="534">
|
||||
<el-table-column prop="url" label="Url地址" width="400" />
|
||||
<el-table-column prop="name" label="Url名称" />
|
||||
<el-table-column label="操作" width="400">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-edit" @click="handleDetail(scope.row)" />
|
||||
<i class="el-icon-close" @click="deleteSetting(scope.row)" />
|
||||
<!-- <i class="el-icon-d-arrow-right" ></i> -->
|
||||
<!-- <i class="el-icon-zoom-in" @click="handleDetail(scope.row)" /> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
class="mt20"
|
||||
background
|
||||
layout="total,sizes, prev, pager, next"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 30]"
|
||||
:page-size="listQuery.pageSize"
|
||||
:current-page.sync="listQuery.currentPage"
|
||||
@current-change="currentChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-if="dialogSetVisible"
|
||||
:close-on-click-modal="false"
|
||||
:title="userStatus ? '编辑' : '新建'"
|
||||
:visible.sync="dialogSetVisible"
|
||||
:height="300"
|
||||
:append-to-body="true"
|
||||
width="800px"
|
||||
>
|
||||
<el-form ref="rowObj" :rules="rules" :model="rowObj" label-width="100px">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="Url地址:" prop="url">
|
||||
<el-input v-model="rowObj.url" autocomplete="off" maxlength="500" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="Url名称:" prop="name">
|
||||
<el-input v-model="rowObj.name" autocomplete="off" maxlength="500" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogSetVisible = false">取 消</el-button>
|
||||
<el-button v-loading="buttonLoading" type="primary" @click="confirm('rowObj')">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { urlConfigSave, urlConfigSearch, urlConfigEdit, urlConfigDelete
|
||||
} from '@/api/releaseConfig'
|
||||
import {
|
||||
validateSpecialChart
|
||||
} from '@/utils/validate' // get token from cookie
|
||||
export default {
|
||||
/* eslint-disable */
|
||||
name: 'UrlConfig',
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
loading:false,
|
||||
buttonLoading:false,
|
||||
search: '',
|
||||
//编辑状态 默认编辑
|
||||
userStatus:true,
|
||||
//编辑弹窗
|
||||
dialogSetVisible:false,
|
||||
listQuery: {
|
||||
currentPage: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
total: 0,
|
||||
//当前行用户组名称
|
||||
editUserName: '',
|
||||
tableData: [
|
||||
{
|
||||
},
|
||||
],
|
||||
rowObj:{
|
||||
},
|
||||
rules: {
|
||||
url: [
|
||||
{ required: false, message:'请输入Url地址', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
name: [
|
||||
{ required: true, message:'请输入Url名称', trigger:'blur',},
|
||||
// { pattern: /^([\u4e00-\u9fa5]+|[ a-zA-Z0-9]+)$/im, message: '输入不合规', trigger: 'blur'},
|
||||
//{ pattern: /^(?!\s+).*(?<!\s)$/im, message: '首尾不能为空格', trigger: 'blur' }
|
||||
],
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
init() {
|
||||
this.listQuery.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
if(this.search.length && !validateSpecialChart(this.search)){
|
||||
this.$message({
|
||||
message: "输入不合规!",
|
||||
type: "warning",
|
||||
})
|
||||
this.tableData=[];
|
||||
this.total=0;
|
||||
return;
|
||||
}
|
||||
this.loading = true
|
||||
let data={
|
||||
currentPage:this.listQuery.currentPage,
|
||||
pageSize:this.listQuery.pageSize,
|
||||
name:this.search.trim()
|
||||
}
|
||||
try {
|
||||
const res = await urlConfigSearch(data)
|
||||
if(res.code==200){
|
||||
if(res.data.urlConfigList){
|
||||
this.total=res.data.count;
|
||||
this.tableData=res.data.urlConfigList;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
|
||||
},
|
||||
addUser() {
|
||||
this.dialogSetVisible = true
|
||||
this.userStatus = false
|
||||
this.rowObj={
|
||||
time:null,
|
||||
id:'',
|
||||
url: '',
|
||||
name: ''
|
||||
},
|
||||
this.$nextTick(() => {
|
||||
this.$refs['rowObj'].resetFields();
|
||||
})
|
||||
},
|
||||
//编辑用户组
|
||||
handleDetail(row) {
|
||||
this.rowObj=row;
|
||||
this.dialogSetVisible = true
|
||||
this.userStatus = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['rowObj'].resetFields();
|
||||
})
|
||||
},
|
||||
//删除用户组
|
||||
deleteSetting(row) {
|
||||
this.$confirm('确认删除所选的吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then((res) => {
|
||||
this.deleteUserGroup(row)
|
||||
})
|
||||
},
|
||||
confirm(formName){
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
// this.rowObj.time=this.time(new Date())
|
||||
if(!this.userStatus){
|
||||
this.addSave()
|
||||
}else{
|
||||
this.editSave()
|
||||
}
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// url 删除
|
||||
async deleteUserGroup(row){
|
||||
this.loading = true
|
||||
try {
|
||||
const res = await urlConfigDelete({id:row.id})
|
||||
if(res.code==200){
|
||||
this.$message({
|
||||
message: '删除成功!',
|
||||
type: 'success'
|
||||
});
|
||||
this.init()
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
|
||||
},
|
||||
async addSave(){
|
||||
// let data={
|
||||
// currentPage:this.listQuery.currentPage,
|
||||
// pageSize:this.listQuery.pageSize,
|
||||
// Question:this.search
|
||||
// }
|
||||
this.buttonLoading = true
|
||||
let data={
|
||||
url:this.rowObj.url.trim(),
|
||||
name:this.rowObj.name.trim()
|
||||
}
|
||||
try {
|
||||
const res = await urlConfigSave(data)
|
||||
if(res.code==200){
|
||||
this.$refs.rowObj.resetFields();
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: '新增成功!',
|
||||
type: 'success'
|
||||
});
|
||||
this.init()
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.buttonLoading = false
|
||||
|
||||
},
|
||||
//url 编辑保存
|
||||
async editSave(){
|
||||
this.buttonLoading = true
|
||||
let data={
|
||||
url:this.rowObj.url.trim(),
|
||||
name:this.rowObj.name.trim(),
|
||||
id:this.rowObj.id
|
||||
}
|
||||
try {
|
||||
const res = await urlConfigEdit(data)
|
||||
if(res.code==200){
|
||||
this.dialogSetVisible = false;
|
||||
this.$message({
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
});
|
||||
this.init()
|
||||
}
|
||||
// this.total=res.userGroupCount;
|
||||
// this.tableData=res.userGroupList;
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.buttonLoading = false
|
||||
|
||||
},
|
||||
time(date) {
|
||||
var y = date.getFullYear()
|
||||
var m = date.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = date.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = date.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = date.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = date.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
|
||||
},
|
||||
//重置搜索框
|
||||
reset() {
|
||||
// this.listQuery.currentPage= 1;
|
||||
this.search = ''
|
||||
// this.init()
|
||||
},
|
||||
// 分页
|
||||
currentChange(item) {
|
||||
this.listQuery.currentPage = item
|
||||
this.getData()
|
||||
},
|
||||
handleSizeChange(item) {
|
||||
this.listQuery.pageSize = item
|
||||
this.getData()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
/* .el-table i {
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
padding: 0 4%;
|
||||
}
|
||||
.el-select {
|
||||
display: block;
|
||||
} */
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,373 @@
|
|||
<template>
|
||||
<div class="page-body">
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">数据样品信息汇交</h1>
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item :to="{path: '/'}">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item :to="{name: 'voyageDelivery'}">数据汇交</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>数据样品信息汇交</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="filter-container">
|
||||
<div class="filter-item">
|
||||
<span class="label">数据样品编号</span>
|
||||
<el-input
|
||||
v-model="search.sampleNumber"
|
||||
auto-complete="off"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<el-button type="primary" size="medium" @click="init">检索</el-button>
|
||||
</div>
|
||||
<div class="checkBtn">
|
||||
<div class="fileBox1">
|
||||
<el-button type="primary" size="medium" class="fileButton">批量导入</el-button>
|
||||
<input
|
||||
ref="importfile"
|
||||
type="file"
|
||||
class="file1"
|
||||
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
|
||||
@change="batchImport"
|
||||
>
|
||||
</div>
|
||||
<el-button type="primary" size="medium" @click="batchExport">批量导出</el-button>
|
||||
<el-button type="success" size="medium" @click="sampleEntry">数据样品信息录入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table v-loading="loading" stripe border :data="tableData" :header-cell-style="{ background: '#dddfe6',color: '#555960',textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" height="600px" @selection-change="handleSelectionChange" @row-click="confirmModal">
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55"
|
||||
/>
|
||||
<el-table-column prop="sampleNumber" label="数据样品编号" />
|
||||
<el-table-column prop="voyageName" label="航次名称" />
|
||||
<el-table-column prop="platformType" label="平台类型" />
|
||||
<!-- <el-table-column prop="status" label="计划状态" /> -->
|
||||
<el-table-column prop="submariner" label="潜次号" />
|
||||
<el-table-column prop="equipmentType" label="设备类型" />
|
||||
<el-table-column prop="jobType" label="作业类型" />
|
||||
<el-table-column prop="sampleType" label="数据样品类型" />
|
||||
<el-table-column label="操作" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip class="item" effect="dark" content="查看" placement="top-end">
|
||||
<el-button id="view" size="mini" type="primary" class="el-icon-view" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="编辑" placement="top-end">
|
||||
<el-button id="edit" size="mini" type="warning" class="el-icon-edit" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="删除" placement="top-end">
|
||||
<el-button id="delete" size="mini" type="danger" class="el-icon-delete" />
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="DM" placement="top-end">
|
||||
<el-button id="DM" size="mini" type="warning" class="el-icon-receiving" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
background
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[15, 30, 50]"
|
||||
:page-size="pagesize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="count"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
<el-dialog
|
||||
title="操作数据样品信息到相关子库"
|
||||
:visible.sync="dmDialogShow"
|
||||
:close-on-click-modal="false"
|
||||
height="500px"
|
||||
:append-to-body="true"
|
||||
width="600px"
|
||||
>
|
||||
<dm-dialog v-if="dmDialogShow" :choose-data="chooseData" @handleClose="closeDMForm" @handleConfirm="confirmDMForm" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getSampleList, deleteSampleList, sampleUpload, sampleExport
|
||||
} from '@/api/remit'
|
||||
import DmDialog from './dmDialog.vue'
|
||||
import {
|
||||
validateSpecialChart
|
||||
} from '@/utils/validate' // get token from cookie
|
||||
export default {
|
||||
name: 'SampleRemitt',
|
||||
components: { DmDialog },
|
||||
props: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
namelist: [
|
||||
{
|
||||
name: 'TS-14'
|
||||
},
|
||||
{
|
||||
name: 'TS2-18'
|
||||
}
|
||||
],
|
||||
search: {
|
||||
sampleNumber: ''
|
||||
},
|
||||
multipleSelection: [],
|
||||
tableData: [
|
||||
// {
|
||||
// no: 'SY510-TXS-YS-01',
|
||||
// name: 'TS-14',
|
||||
// platformType: '载人潜水器',
|
||||
// cino: '3444',
|
||||
// docType: '机械手',
|
||||
// workType: '站位作业',
|
||||
// sampleType: '岩石'
|
||||
// },
|
||||
// {
|
||||
// no: 'SY510-TXS-YS-02',
|
||||
// name: 'TS2-18',
|
||||
// platformType: '载人潜水器',
|
||||
// cino: '233',
|
||||
// docType: '机械手',
|
||||
// workType: '站位作业',
|
||||
// sampleType: '岩石'
|
||||
// },
|
||||
// {
|
||||
// no: 'SY510-TXS-YS-03',
|
||||
// name: 'TS-2-1',
|
||||
// platformType: '载人潜水器',
|
||||
// cino: '233444',
|
||||
// docType: '机械手',
|
||||
// workType: '站位作业',
|
||||
// sampleType: '岩石'
|
||||
// }
|
||||
|
||||
],
|
||||
currentPage: 1,
|
||||
pagesize: 15,
|
||||
count: 0,
|
||||
dmDialogShow: false,
|
||||
chooseData: ''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
confirmDMForm(val) {
|
||||
this.dmDialogShow = false
|
||||
},
|
||||
closeDMForm() {
|
||||
this.dmDialogShow = false
|
||||
},
|
||||
dimensionChange() {
|
||||
|
||||
},
|
||||
init() {
|
||||
this.currentPage = 1
|
||||
this.getData()
|
||||
},
|
||||
async getData() {
|
||||
if (this.search.sampleNumber.length && !validateSpecialChart(this.search.sampleNumber)) {
|
||||
this.$message({
|
||||
message: '输入不合规',
|
||||
type: 'warning'
|
||||
})
|
||||
this.tableData = []
|
||||
this.count = 0
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
const data = {
|
||||
page: this.currentPage,
|
||||
size: this.pagesize,
|
||||
sampleNumber: this.search.sampleNumber.trim()
|
||||
}
|
||||
try {
|
||||
const res = await getSampleList(data)
|
||||
if (res.code == 200) {
|
||||
if (res.data.content) {
|
||||
this.tableData = res.data.content
|
||||
this.count = Number(res.data.count)
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
this.loading = false
|
||||
},
|
||||
// 批量导入
|
||||
batchImport(event) {
|
||||
const typeList = ['xlsx']
|
||||
let flag = true
|
||||
for (let i = 0; i < this.$refs.importfile.files.length; i++) {
|
||||
const arr = this.$refs.importfile.files[i].name.split('.')
|
||||
if (typeList.indexOf(arr[arr.length - 1]) == -1) {
|
||||
flag = false
|
||||
this.$message({
|
||||
message: '仅支持上传excel文件',
|
||||
type: 'warning'
|
||||
})
|
||||
this.$refs.importfile.value = ''
|
||||
return
|
||||
}
|
||||
}
|
||||
if (flag) {
|
||||
for (let i = 0; i < this.$refs.importfile.files.length; i++) {
|
||||
const file = this.$refs.importfile.files[i]
|
||||
const fd = new FormData()
|
||||
fd.append('file', file)
|
||||
this.voyageFileUploads(fd)
|
||||
}
|
||||
}
|
||||
this.$refs.importfile.value = ''
|
||||
},
|
||||
async voyageFileUploads(fd) {
|
||||
this.loading = true
|
||||
try {
|
||||
const res = await sampleUpload(fd)
|
||||
this.init()
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
// 批量导出
|
||||
async batchExport() {
|
||||
if (this.multipleSelection.length) {
|
||||
this.loading = true
|
||||
const data = {
|
||||
ids: ''
|
||||
}
|
||||
const arr = []
|
||||
this.multipleSelection.map(item => {
|
||||
arr.push(item.id)
|
||||
})
|
||||
data.ids = arr.join(',')
|
||||
try {
|
||||
const res = await sampleExport(data)
|
||||
if (res) {
|
||||
const filename = '数据样本信息汇交.xlsx'
|
||||
if (typeof window.chrome !== 'undefined') {
|
||||
// Chrome version
|
||||
// const url = window.URL.createObjectURL(new Blob([res]))
|
||||
const link = document.createElement('a')
|
||||
link.href = window.URL.createObjectURL(new Blob([res]))
|
||||
link.download = filename
|
||||
link.click()
|
||||
} else if (typeof window.navigator.msSaveBlob !== 'undefined') {
|
||||
// IE version
|
||||
const blob = new Blob([new Blob([res])], { type: 'application/force-download' })
|
||||
window.navigator.msSaveBlob(blob, filename)
|
||||
} else {
|
||||
// Firefox version
|
||||
const file = new File([new Blob([res])], filename, { type: 'application/force-download' })
|
||||
window.open(URL.createObjectURL(file))
|
||||
}
|
||||
this.loading = false
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'warning',
|
||||
message: '请勾选数据'
|
||||
})
|
||||
}
|
||||
},
|
||||
sampleEntry() {
|
||||
this.$router.push({ name: 'sampleEntry' })
|
||||
},
|
||||
confirmModal(row, event, column) {
|
||||
var opType = column.target.id
|
||||
if (opType == 'view') {
|
||||
this.$router.push({ name: 'sampleEntry', query: { platformId: row.platformId, equipmentId: row.equipmentId, status: 'view' }})
|
||||
} else if (opType == 'edit') {
|
||||
this.$router.push({ name: 'sampleEntry', query: { platformId: row.platformId, equipmentId: row.equipmentId, status: 'edit' }})
|
||||
} else if (opType == 'delete') {
|
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.sampleDelete(row.sampleId)
|
||||
}).catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
})
|
||||
})
|
||||
} else if (opType == 'DM') {
|
||||
this.dmDialogShow = true
|
||||
this.chooseData = row
|
||||
}
|
||||
},
|
||||
async sampleDelete(sampleId) {
|
||||
const _this = this
|
||||
this.loading = true
|
||||
const data = { sampleId }
|
||||
try {
|
||||
const res = await deleteSampleList(data)
|
||||
if (res.code == 200) {
|
||||
_this.$message({
|
||||
message: '删除成功!',
|
||||
type: 'success'
|
||||
})
|
||||
_this.init()
|
||||
}
|
||||
this.loading = false
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val
|
||||
},
|
||||
handleSizeChange: function(size) {
|
||||
this.pagesize = size
|
||||
this.getData()
|
||||
},
|
||||
handleCurrentChange: function(currentPage) {
|
||||
this.currentPage = currentPage
|
||||
this.getData()
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.fileBox1{
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
.fileButton {
|
||||
display: inline-block;
|
||||
// width: 150px;
|
||||
// height: 34px;
|
||||
// line-height: 34px;
|
||||
// background: #ffa837;
|
||||
// outline: none;
|
||||
// border:none;
|
||||
// text-align: center;
|
||||
// color: #fff;
|
||||
// vertical-align: top;
|
||||
// border-radius: 5px;
|
||||
}
|
||||
.file1 {
|
||||
cursor: pointer;
|
||||
width: 99px;
|
||||
height: 37px;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
opacity: 0;
|
||||
filter: Alpha(opacity=0); /*透明度兼容IE8*/
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue