Commit 4b2f612b authored by 余苗苗's avatar 余苗苗

set merge

parent acb0de8c
{
"presets": [
["env", {
"modules": false,
"targets": {
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
}
}],
"stage-2"
],
"plugins": ["transform-vue-jsx", "transform-runtime"]
}
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
.DS_Store
node_modules/
/dist/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
// 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": {}
}
}
# bandmanager
> 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
```
For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
.login{
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-image: url(./../static/images/1200.png);
background-size:100% 100%;
}
.login .login-header{
height: 64px;
background: #ffffff;
line-height: 64px;
position: absolute;top: 0;
left: 0;right: 0;
}
.login .login-header .login-title{
font-size:28px;
font-weight:400;
color: #333333;
}
.login .login-header .login-title:nth-child(1){
margin-left: 16%;margin-right: 10px;
}
.login .login-header .login-title:nth-child(2){
position: relative;
padding-left: 15px
}
.login .login-header .login-title:nth-child(2):before{
position: absolute;
content: '';
left: 0;
top: 5px;
bottom: 0;
width: 2px;
background: #ececec;
}
.login-content .login-box{
width: 400px;
height: 500px;
border: 20px solid #AAD2F2;
position: absolute;
top: 20%;
/*margin-top: -250px;*/
right: 20%;
background: #ffffff;
box-sizing: border-box;
}
.login-content .login-box{
padding: 0 40px;
}
.login-content .login-box h2{
font-size: 24px;
color: #333333;
margin-top: 60px;
}
.login-content .login-box p{
font-size: 18px;
color: #666666;
margin: 10px 0;
}
.login-content .login-box .code{
width: 84px;
height: 40px;
margin: auto;
border-radius: 5px;
background-image: url(./../static/images/login-code.png);
background-size: 100% 100%;
}
.login-content .login-box .change-text{
color: #5B76D1;
font-size: 14px;
height: 40px;
line-height: 40px;
text-align: center;
}
.login .login-content img{
width: 100%
}
.login .form-bt{
margin-top: 20px;
}
.login .form-bt button{
width: 100%
}
.login .el-form-item{
margin-bottom: 10px !important;
}
.login .el-form-item__error{
display: none;
}
.login .login-footer{
font-size: 12px;
height: 64px;
line-height: 64px;
text-align: center;
position: absolute;
left: 0;
right: 0;
bottom: 0;
background:#ffffff;
}
.login-box:hover{
box-shadow:0px 0px 13px 0px rgba(59, 47, 216, 0.98);
}
\ No newline at end of file
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录</title>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./account.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_awxmw28nttf.css">
</head>
<body>
<div id="login" class="login">
<div class="login-header">
<span class="login-title">扳手工单中心后台管理系统</span>
<span class="login-title">欢迎登录</span>
</div>
<div class="login-content">
<!-- <img src="./../static/images/login-bj.png" alt="" > -->
<div class="login-box">
<el-form :model="form" :rules="rules" ref="form1" label-width="0" class="inputword" >
<h2>登陆账号</h2>
<p>账号:</p>
<el-form-item prop="name" style=" " >
<el-input v-model='form.name' placeholder='请输入用户账号'></el-input>
</el-form-item>
<p>密码:</p>
<el-form-item prop="password" style=" " >
<el-input v-model='form.password' type="password" placeholder='请输入密码'></el-input>
</el-form-item>
<p>验证码:</p>
<el-row :gutter="0">
<el-col :span='12' >
<el-form-item prop="code" style=" " >
<el-input v-model='form.code' placeholder='请输入验证码'></el-input>
</el-form-item>
</el-col>
<el-col :span='8' >
<div class="code"></div>
</el-col>
<el-col :span='4' >
<div class="change-text cursor">换一组</div>
</el-col>
</el-row>
</el-form>
<div class="form-bt">
<el-button type="primary" class="firstbackgroud_blue firstborder_blue" @click="saveFun('form1')">登录</el-button>
</div>
</div>
</div>
<div class="login-footer">
CopyRight @ 扳手工单中心 2019 - 2020
</div>
</div>
</body>
<!-- 先引入 Vue -->
<script src="./../static/js/vue.js"></script>
<script src="./../static/js/jquery.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
new Vue({
el: '#login',
data: function() {
return {
form:{
name:'',password:'',code:''
},
rules:{
name:[{required: true, message: '请输入用户账号', trigger: 'blur' }],
password:[{required: true, message: '请输入密码', trigger: 'blur' }],
code:[{required: true, message: '请输入验证码', trigger: 'blur' }],
}
}
},
methods:{
saveFun(formName){
const self = this;
self.$refs[formName].validate((valid) => {
if (valid) {
//提交表单
window.location.href = '../main/index.html'
} else {
return false;
}
});
},
}
})
</script>
</html>
\ No newline at end of file
'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'
))
})
})
'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)
}
}
'use strict'
const path = require('path')
const config = require('../config')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const packageConfig = require('../package.json')
exports.assetsPath = function (_path) {
const assetsSubDirectory = process.env.NODE_ENV === 'production'
? config.build.assetsSubDirectory
: config.dev.assetsSubDirectory
return path.posix.join(assetsSubDirectory, _path)
}
exports.cssLoaders = function (options) {
options = options || {}
const cssLoader = {
loader: 'css-loader',
options: {
sourceMap: options.sourceMap
}
}
const postcssLoader = {
loader: 'postcss-loader',
options: {
sourceMap: options.sourceMap
}
}
// generate loader string to be used with extract text plugin
function generateLoaders (loader, loaderOptions) {
const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
if (loader) {
loaders.push({
loader: loader + '-loader',
options: Object.assign({}, loaderOptions, {
sourceMap: options.sourceMap
})
})
}
// Extract CSS when that option is specified
// (which is the case during production build)
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader'
})
} else {
return ['vue-style-loader'].concat(loaders)
}
}
// https://vue-loader.vuejs.org/en/configurations/extract-css.html
return {
css: generateLoaders(),
postcss: generateLoaders(),
less: generateLoaders('less'),
sass: generateLoaders('sass', { indentedSyntax: true }),
scss: generateLoaders('sass'),
stylus: generateLoaders('stylus'),
styl: generateLoaders('stylus')
}
}
// Generate loaders for standalone style files (outside of .vue)
exports.styleLoaders = function (options) {
const output = []
const loaders = exports.cssLoaders(options)
for (const extension in loaders) {
const loader = loaders[extension]
output.push({
test: new RegExp('\\.' + extension + '$'),
use: loader
})
}
return output
}
exports.createNotifierCallback = () => {
const notifier = require('node-notifier')
return (severity, errors) => {
if (severity !== 'error') return
const error = errors[0]
const filename = error.file && error.file.split('!').pop()
notifier.notify({
title: packageConfig.name,
message: severity + ': ' + error.name,
subtitle: filename || '',
icon: path.join(__dirname, 'logo.png')
})
}
}
'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'
}
}
'use strict'
const path = require('path')
const utils = require('./utils')
const config = require('../config')
const vueLoaderConfig = require('./vue-loader.conf')
function resolve (dir) {
return path.join(__dirname, '..', dir)
}
module.exports = {
context: path.resolve(__dirname, '../'),
entry: {
app: './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'),
}
},
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')]
},
{
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'
}
}
'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)
}
})
})
'use strict'
const path = require('path')
const utils = require('./utils')
const webpack = require('webpack')
const config = require('../config')
const merge = require('webpack-merge')
const baseWebpackConfig = require('./webpack.base.conf')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const env = require('../config/prod.env')
const webpackConfig = merge(baseWebpackConfig, {
module: {
rules: utils.styleLoaders({
sourceMap: config.build.productionSourceMap,
extract: true,
usePostCSS: true
})
},
devtool: config.build.productionSourceMap ? config.build.devtool : false,
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
plugins: [
// http://vuejs.github.io/vue-loader/en/workflow/production.html
new webpack.DefinePlugin({
'process.env': env
}),
new UglifyJsPlugin({
uglifyOptions: {
compress: {
warnings: false
}
},
sourceMap: config.build.productionSourceMap,
parallel: true
}),
// extract css into its own file
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].[contenthash].css'),
// Setting the following option to `false` will not extract CSS from codesplit chunks.
// Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
// It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
// increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
allChunks: true,
}),
// Compress extracted CSS. We are using this plugin so that possible
// duplicated CSS from different components can be deduped.
new OptimizeCSSPlugin({
cssProcessorOptions: config.build.productionSourceMap
? { safe: true, map: { inline: false } }
: { safe: true }
}),
// generate dist index.html with correct asset hash for caching.
// you can customize output by editing /index.html
// see https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
filename: config.build.index,
template: 'index.html',
inject: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
// more options:
// https://github.com/kangax/html-minifier#options-quick-reference
},
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
chunksSortMode: 'dependency'
}),
// keep module.id stable when vendor modules does not change
new webpack.HashedModuleIdsPlugin(),
// enable scope hoisting
new webpack.optimize.ModuleConcatenationPlugin(),
// split vendor js into its own file
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks (module) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
)
}
}),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
minChunks: Infinity
}),
// This instance extracts shared chunks from code splitted chunks and bundles them
// in a separate chunk, similar to the vendor chunk
// see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
new webpack.optimize.CommonsChunkPlugin({
name: 'app',
async: 'vendor-async',
children: true,
minChunks: 3
}),
// copy custom static assets
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, '../static'),
to: config.build.assetsSubDirectory,
ignore: ['.*']
}
])
]
})
if (config.build.productionGzip) {
const CompressionWebpackPlugin = require('compression-webpack-plugin')
webpackConfig.plugins.push(
new CompressionWebpackPlugin({
asset: '[path].gz[query]',
algorithm: 'gzip',
test: new RegExp(
'\\.(' +
config.build.productionGzipExtensions.join('|') +
')$'
),
threshold: 10240,
minRatio: 0.8
})
)
}
if (config.build.bundleAnalyzerReport) {
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
webpackConfig.plugins.push(new BundleAnalyzerPlugin())
}
module.exports = webpackConfig
'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {
NODE_ENV: '"development"'
})
'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: {},
// 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
}
}
'use strict'
module.exports = {
NODE_ENV: '"production"'
}
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<link rel="stylesheet" href="./../static/css/main.css"> <link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./../static/css/animate.css"> <link rel="stylesheet" href="./../static/css/animate.css">
<link rel="stylesheet" href="./cooperate.css"> <link rel="stylesheet" href="./cooperate.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_uybvbn4h3b.css"> <link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_awxmw28nttf.css">
</head> </head>
<body> <body>
<div id="app" > <div id="app" >
......
...@@ -188,7 +188,6 @@ var addOperate={ ...@@ -188,7 +188,6 @@ var addOperate={
} }
}, },
created(){ created(){
this.resizeTop = (document.documentElement.clientHeight/2 -319)+'px';
if(this.modalData.type=='creat'){ if(this.modalData.type=='creat'){
this.dialog.title = '新增授权点'; this.dialog.title = '新增授权点';
this.isCreat = true; this.isCreat = true;
...@@ -197,6 +196,7 @@ var addOperate={ ...@@ -197,6 +196,7 @@ var addOperate={
this.isCreat = false; this.isCreat = false;
this.getinfo() this.getinfo()
} }
this.resizeTop = (document.documentElement.clientHeight/2 -319)+'px';
//屏幕缩放时大小适应 //屏幕缩放时大小适应
const that = this; const that = this;
window.onresize = function temp() { window.onresize = function temp() {
......
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>bandmanager</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
This diff is collapsed.
// 公告弹窗
var Vtitle={
template: `
<el-dialog :title="dialog.title" width='444px' :visible.sync="dialog.show" custom-class='deliver-dialog' @close="handleClose" :append-to-body="true" :show-close='true'>
<div class="dialog-content">
<div class="title">
【升级】5月25日,全网网络升级公告
</div>
<div class="title-content">
<p>
【中华门窗网】3月26日—3月28日,素有“全屋高端定制平台”之称的2019中国建博会(上海)在上海虹桥·国家会展中心隆重启幕。本次展会由中贸展与红星美凯龙联合举办,首创“展”“店”结合的崭新办展模式。作为战略合作媒体,
</p>
<p>
中华建材网携手旗下垂直门户重磅推出“商”定虹桥 “盟”约建博”主题报道。报道从品牌招商政策、加盟帮扶、产品亮点出发,为您全方位展示品牌加盟优势。
</p>
</div>
</div>
</el-dialog>`,
props: {
modalData: Object
},
data(){
return{
dialog:{
show:true,title:'公告',tab:'1',
},
form:{
address:'',options:[]
}
}
},
created(){
},
methods:{
handleClose() {
this.$emit('close')
},
},
}
\ No newline at end of file
.main{
width: 1400px;
margin: auto;
overflow: auto;
}
.main .main-top{
height: 38px;
line-height: 38px;
background: #ffffff;
padding: 0 20px;
}
.main .main-top .main-topLeft i{
font-size: 14px;
}
.main .main-top .main-topRight i{
font-size: 16px;
}
.main .main-top .main-topRight {
text-align: right;
}
.main .main-top .tips1{
font-size: 20px;
color: #666666;
margin-right: 30px
}
.main .main-top .tips2{
font-size: 14px;
color: #354052;
margin-right: 20px;
margin-left: 6px;
}
.main .main-top .tips3{
font-size: 14px;
color: #8F97A4;
margin-left: 6px;
}
.main .main-content{
/*background: #ffffff;*/
position: absolute;
top: 50px;
width: 1400px;
margin: auto;
bottom: 0;
display:flex;/*设为伸缩容器*/
flex-flow:row;/*伸缩项目单行排列*/
}
.main .main-content .main-content-left{
width: 950px;
}
.main .main-content .main-content-left .main-info{
width: 100%;
height:276px;
box-shadow:0px 0px 13px 0px rgba(87,118,217,0.2);
border-radius:4px;
background: #ffffff;
}
.main .main-content .main-info-title{
height: 76px;
line-height: 76px;
margin: 0 10px;
border-bottom: 1px solid #ececec;
}
.main .main-content .main-info-title p{
font-size: 24px;
color: #333333;
margin-left: 20px;
font-weight: 500;
}
.main .main-content .main-content-left .main-card{
height: 200px;
}
.main .main-content .main-content-left .main-card p{
font-size: 16px;
color: #666666;
margin-left: 20px;
margin-top: 20px;
}
.main .main-content .main-content-left .main-card div{
font-size: 30px;
color: #333333;
text-align: center;
height: 150px;
line-height: 150px;
}
.main .main-content .main-content-left .main-card:nth-child(1){
border-right: 1px solid #ececec;
border-bottom: 6px solid #5A77D2
}
.main .main-content .main-content-left .main-card:nth-child(2){
border-right: 1px solid #ececec;
border-bottom: 6px solid #71C255
}
.main .main-content .main-content-left .main-card:nth-child(3){
border-right: 1px solid #ececec;
border-bottom: 6px solid #FDECCC
}
.main .main-content .main-content-left .main-card:nth-child(4){
border-bottom: 6px solid #50B5FC;
}
.main .main-content .main-content-left .main-chart{
height:491px;
background:#ffffff;
box-shadow:0px 0px 13px 0px rgba(87,118,217,0.2);
border-radius:4px;
margin-top: 20px;
position: relative;
}
.main .main-content .main-content-right .main-news{
height:413px;
background:#ffffff;
box-shadow:0px 0px 13px 0px rgba(87,118,217,0.2);
border-radius:4px;
}
.main .main-content .main-content-right .main-news .news-content{
padding: 20px;
}
.main .main-content .main-content-right .main-news .news-content p{
font-size:14px;
font-weight:400;
color:#8F97A4;
width: 375px;
line-height: 2; overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
cursor: pointer;
}
.main .main-content .main-content-right .main-code{
height:354px;
background:#ffffff;
box-shadow:0px 0px 13px 0px rgba(87,118,217,0.2);
border-radius:4px;
margin-top: 20px;
}
.main .main-content .main-content-right .main-code .wecht{
text-align: center;
padding-top: 45px;
}
.main .main-content .main-content-right .main-code .wecht p{
font-size: 12px;
color: #8F97A4;
margin-top: 10px;
}
.main .main-content .main-content-right{
flex: 1;
margin-left: 30px;
}
.main .main-content .el-radio-button__orig-radio:checked+.el-radio-button__inner{
background-color: #5874d8;
border-color: #5874d8;
}
.main .mr-20{
margin-right: 20px;
}
.main .chart_title1{
font-size: 20px;
color: #666666;
position: absolute;
left: 30%;
bottom: 10%;
}
.main .chart_title2{
font-size: 20px;
color: #666666;
position: absolute;
right: 20%;
bottom: 10%;
}
/*******公告弹框start************/
.deliver-dialog{
height: 492px;
}
.deliver-dialog .el-dialog__header{
background: #ffffff ;
padding-left: 30px;
}
.deliver-dialog .el-dialog__header .el-dialog__title{
color: #5B76D1 ;
font-size:24px;
font-family:PingFangSC-Medium;
font-weight:500;
line-height:35px
}
.deliver-dialog .el-dialog__header .el-dialog__headerbtn i{
color: #8F97A4 ;
font-size: 24px;
}
.deliver-dialog .el-dialog__body{
padding: 30px 21px;
}
.deliver-dialog .deliver-dialog-title{
font-size:14px;
font-family:PingFangSC-Medium;
font-weight:500;
color:rgba(143,151,164,1);
line-height:35px;
}
.deliver-dialog .title{
border-bottom: 1px solid #ececec;
padding-bottom: 10px;
}
.deliver-dialog .title-content{
padding: 20px;
color: #8F97A4;
line-height: 1.6;
}
.deliver-dialog .title-content p{
text-indent: 20px;
}
\ No newline at end of file
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<link rel="stylesheet" href="./../static/css/main.css"> <link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./../static/css/animate.css"> <link rel="stylesheet" href="./../static/css/animate.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_uybvbn4h3b.css"> <link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_awxmw28nttf.css">
</head> </head>
<body> <body>
<div id="app"> <div id="app">
......
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./../static/css/animate.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_uybvbn4h3b.css">
</head>
<body>
<div id="app">
<common-header :modal-data="active_header"></common-header>
<div class="content">
</div>
</div>
</body>
<!-- 先引入 Vue -->
<script src="./../static/js/vue.js"></script>
<script src="./../static/js/jquery.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="./../static/js/common.js"></script>
<script>
new Vue({
el: '#app',
components: {commonHeader},
data: function() {
return {
activeIndex:'1',tabindex:'1',active_header:'./../main/index.html',
}
},
methods:{
}
})
</script>
</html>
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<link rel="stylesheet" href="./../static/css/main.css"> <link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./order.css"> <link rel="stylesheet" href="./order.css">
<link rel="stylesheet" href="./../static/css/animate.css"> <link rel="stylesheet" href="./../static/css/animate.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_uybvbn4h3b.css"> <link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_awxmw28nttf.css">
</head> </head>
<body> <body>
<div id="app"> <div id="app">
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<link rel="stylesheet" href="./../static/css/main.css"> <link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./order.css"> <link rel="stylesheet" href="./order.css">
<link rel="stylesheet" href="./../static/css/animate.css"> <link rel="stylesheet" href="./../static/css/animate.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_uybvbn4h3b.css"> <link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_awxmw28nttf.css">
</head> </head>
<body> <body>
<div id="app"> <div id="app">
...@@ -138,7 +138,7 @@ ...@@ -138,7 +138,7 @@
components: {commonHeader,beCompleting,beRighting,VRefuse,settlePrice,hasDone,Deliver}, components: {commonHeader,beCompleting,beRighting,VRefuse,settlePrice,hasDone,Deliver},
data: function() { data: function() {
return { return {
activeIndex:'9',tabindex:'9',modal:null,active_header:'./../order/index.html', activeIndex:'9',tabindex:'9',active_header:'./../order/index.html',
menus:[ menus:[
{name:'待派单',value:'1',icon:'iconfenpei',number:10}, {name:'待派单',value:'1',icon:'iconfenpei',number:10},
{name:'未分配',value:'2',icon:'iconmulufenpei',number:10}, {name:'未分配',value:'2',icon:'iconmulufenpei',number:10},
......
...@@ -130,8 +130,8 @@ var beCompleting={ ...@@ -130,8 +130,8 @@ var beCompleting={
} }
}, },
created(){ created(){
this.resizeTop = (document.documentElement.clientHeight/2 -319)+'px';
this.dialog.title = '工单(GLDQ0019211237)--待完工'; this.dialog.title = '工单(GLDQ0019211237)--待完工';
this.resizeTop = (document.documentElement.clientHeight/2 -319)+'px';
//屏幕缩放时大小适应 //屏幕缩放时大小适应
const that = this; const that = this;
window.onresize = function temp() { window.onresize = function temp() {
......
...@@ -181,8 +181,8 @@ var beRighting={ ...@@ -181,8 +181,8 @@ var beRighting={
} }
}, },
created(){ created(){
this.resizeTop = (document.documentElement.clientHeight/2 -319)+'px';
this.dialog.title = '工单(GLDQ0019211237)--待确权' ; this.dialog.title = '工单(GLDQ0019211237)--待确权' ;
this.resizeTop = (document.documentElement.clientHeight/2 -319)+'px';
//屏幕缩放时大小适应 //屏幕缩放时大小适应
const that = this; const that = this;
window.onresize = function temp() { window.onresize = function temp() {
......
...@@ -333,10 +333,17 @@ ...@@ -333,10 +333,17 @@
position: absolute;right: 20px; position: absolute;right: 20px;
top:60px;z-index: 3000; top:60px;z-index: 3000;
} }
.order-detail .edict-icon i{ .order-detail .edict-icon i:nth-child(1){
font-size: 24px; font-size: 24px;
color: #5874D8; color: #5874D8;
cursor: pointer; cursor: pointer;
vertical-align:bottom;
margin-right: 5px;
}
.order-detail .edict-icon i:nth-child(2){
font-size: 22px;
color: #5874D8;
cursor: pointer;
} }
/**********************反馈start*************************/ /**********************反馈start*************************/
.order-detail .order-detail-response{ .order-detail .order-detail-response{
...@@ -535,6 +542,13 @@ ...@@ -535,6 +542,13 @@
margin: auto; margin: auto;
} }
.order .el-radio__label{
padding-left: 0 !important;
text-align: center !important;
}
.order .el-radio--mini.is-bordered{
padding: 6px 10px 0 10px !important;
}
.add-order-left{ .add-order-left{
width: 198px; width: 198px;
height: 100%; height: 100%;
......
This diff is collapsed.
{
"name": "bandmanager",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "ymm",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
"dependencies": {
"axios": "^0.18.0",
"element-ui": "^2.8.2",
"qs": "^6.7.0",
"vue": "^2.5.2",
"vue-router": "^3.0.1"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-jsx": "^6.18.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",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.0",
"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",
"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",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^0.5.8",
"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"
]
}
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<link rel="stylesheet" href="./../static/css/main.css"> <link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./../static/css/animate.css"> <link rel="stylesheet" href="./../static/css/animate.css">
<link rel="stylesheet" href="./set.css"> <link rel="stylesheet" href="./set.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_uybvbn4h3b.css"> <link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_awxmw28nttf.css">
</head> </head>
<body> <body>
<div id="app"> <div id="app">
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<link rel="stylesheet" href="./../static/css/main.css"> <link rel="stylesheet" href="./../static/css/main.css">
<link rel="stylesheet" href="./../static/css/animate.css"> <link rel="stylesheet" href="./../static/css/animate.css">
<link rel="stylesheet" href="./settlement.css"> <link rel="stylesheet" href="./settlement.css">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_uybvbn4h3b.css"> <link rel="stylesheet" href="https://at.alicdn.com/t/font_1195086_awxmw28nttf.css">
</head> </head>
<body> <body>
<div id="app" > <div id="app" >
......
<template>
<div id="app">
<router-view/>
</div>
</template>
<script>
export default {
name: 'App'
}
</script>
<style>
@import "./assets/css/main.css";
@import "./assets/css/animate.css";
#app{
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
overflow: auto;
}
</style>
export const base_url = ''
\ No newline at end of file
import router from '../router';
import axios from 'axios'
import {base_url} from './base.js'
import qs from 'qs'
import { Message } from 'element-ui';
const axiosAjax = axios.create({
baseURL:base_url,
timeout:30000,
headers:{
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8',
'Cache-Control':'no-cache'
},
});
axiosAjax.interceptors.request.use(
);
axiosAjax.interceptors.response.use(
);
var ajaxFun = (option)=> {
return new Promise( (resolve, reject)=> {
axiosAjax(option).then((response) => {
resolve(response);
}).catch((error) => {
reject(error);
});
})
}
export default ajaxFun
\ No newline at end of file
This diff is collapsed.
*{
margin:0;
padding:0;
font-size: 14px;
}
html,body,#app,.wrapper{
width:100%;
height:100%;
overflow: hidden;
background: #F5F5F5;
position: relative;
}
body{
font-family: "microsoft yahei" !important;
}
a{
text-decoration: none
}
button,.el-button{
font-family: "microsoft yahei" !important;
}
.cursor{
cursor: pointer;
}
.text_center{
text-align: center;
}
.primary_btcolor{
background: #5874D8;
border: #5874D8;
}
.el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #5874D8;
}
.background-blue{
background: #5874D8;
}
.text-white{
color: #ffffff;
}
.el-dialog__wrapper{
overflow: hidden !important;
}
.el-dialog__body{
padding:30px 0 !important;
}
.el-dialog__header{
background: #6C8BF8 !important;
}
.el-dialog__header .el-dialog__title, .el-dialog__header .el-dialog__headerbtn i{
color: #ffffff !important;
}
\ No newline at end of file
import Vue from 'vue'
import App from './App'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css';
import router from './router'
Vue.use(ElementUI)
Vue.config.productionTip = false
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
const router = new Router ({
routes: [
{
path: '/',
redirect: '/login'
},
{
path: '/login',
name: 'login',
component: () => import(/* webpackChunkName: "login" */ '@/views/accounts/Login.vue')
},
{
path:'/index',
component: resolve => require(['../views/root/Home.vue'], resolve),
children:[
{
path: '/main',
name: 'main',
component: () => import(/* webpackChunkName: "main" */ '@/views/main/Index.vue')
},
{
path: '/cooperate',
name: 'cooperate',
component: () => import(/* webpackChunkName: "cooperate" */ '@/views/cooperate/Index.vue')
},
{
path: '/message',
name: 'message',
component: () => import(/* webpackChunkName: "message" */ '@/views/message/Index.vue')
},
{
path: '/orders',
name: 'orders',
component: () => import(/* webpackChunkName: "orders" */ '@/views/orders/Index.vue'),
},
{
path: '/addOrder',
name: 'addOrder',
component: () => import(/* webpackChunkName: "addOrder" */ '@/views/orders/AddOrder.vue')
},
{
path: '/set',
name: 'set',
component: () => import(/* webpackChunkName: "set" */ '@/views/set/Index.vue')
},
{
path: '/settlement',
name: 'settlement',
component: () => import(/* webpackChunkName: "settlement" */ '@/views/settlement/Index.vue')
},
]
}
]
})
/***********路由拦截**************************************/
// router.beforeEach((to, from, next) => {
// });
export default router;
\ No newline at end of file
<template>
<div>
login
</div>
</template>
<template>
<div class="cooperate-right">
<div class="all-cooperate-serch">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options2'></el-option>
</el-select>
<el-select class="seach-select" v-model="search.area" @change='' placeholder="选择区域">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
</el-select>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='输入名称、联系人或区域'></el-input>
<el-button type='primary' class='button-color'>搜索</el-button>
<el-button type='primary' class='button-color addbutton' @click=''>新增授权点</el-button>
</div>
<div class="cooperate-content">
<el-table :data="tableData" style="width: 100%" @row-click='checkData'>
<el-table-column prop="date" label="授权点" ></el-table-column>
<el-table-column label="负责人" >
<template slot-scope="scope" >
<span class='cursor' style=' color: #5B76D1; '>
{{scope.row.name }}
</span>
<span style=' color: #999;'>{{scope.row.phone}}</span>
</template>
</el-table-column>
<el-table-column prop="address" label="合作区域"> </el-table-column>
<el-table-column prop="type" label="合作品类"> </el-table-column>
<el-table-column label="合作状态" width='80px'>
<template slot-scope="scope" >
<div class='text_center'>
<i class='el-icon-success' v-if='scope.row.status==1' style='color:#6FC152;font-size:16px;'></i>
<i class='el-icon-success' v-else style='color:#F05050;font-size:16px'></i>
</div>
</template>
</el-table-column>
</el-table>
</div>
<div class="cooperate-bottom">
<el-pagination @current-change="handleCurrentChange" background :current-page="table.current_page" layout="total, prev, pager, next" :page-size="15" :pager-count="table.page_count" :total="table.total">
</el-pagination>
</div>
<component :is="modal" @close="closeChild" :modalData="modalData"></component>
</div>
</template>
<script>
import Detail from './dialog/Detail.vue'
export default {
data(){
return{
modal:null,modalData:{},
search:{
type:'',area:'',options1:[],options2:[],name:''
},
table:{
current_page:1,page_count:7,total:50,
},
tableData:[
{
date: '精诚维修',
name: '张无极',
phone:'13800009999',
address: '上海市',
type:'空调 冰洗',
status:1
},
{
date: '精诚维修',
name: '张无极',
phone:'13800009999',
address: '上海市',
type:'空调 冰洗',
status:0
},
{
date: '精诚维修',
name: '张无极',
phone:'13800009999',
address: '上海市',
type:'空调 冰洗',
status:1
},
{
date: '精诚维修',
name: '张无极',
phone:'13800009999',
address: '上海市',
type:'空调 冰洗',
status:0
},
]
}
},
wacth:{
},
methods:{
handleCurrentChange(page) {
},
checkData(row,event, column){
this.modalData = row;
this.modal = Detail;
},
closeChild(){
this.modal = null;
}
}
}
</script>
<style>
.cooperate-right{
float: right;
width: 1180px;
height: 100%;
position: relative;
background: #ffffff;
}
.cooperate-right .all-cooperate-serch{
background: #ffffff;
padding: 10px;
position: relative;
}
.all-cooperate-serch:after{
position: absolute;
content: '';
left: 20px;
right: 20px;
bottom: 0;
height:1px;
background: #ececec;
}
.cooperate-right .all-cooperate-serch .seach-select .el-input__inner,.cooperate-right .all-cooperate-serch .seach-select .el-input{
width: 120px !important;
background: #F1F3F9;
border: none;
}
.cooperate-right .all-cooperate-serch .seach-input .el-input__inner,.cooperate-right .all-cooperate-serch .seach-input {
width: 298px;
}
.button-color{
background: #5874D8;
}
.button-icon{
background: rgba(88,116,216,0.1) ; padding: 10px 8px;
border-radius: 4px;
}
.addbutton{float: right;}
.cooperate-right .cooperate-bottom{
position: absolute;
left: 0;
right: 0;
text-align: center;
bottom: 15px;
}
.cooperate-right .cooperate-content{
position: absolute;
left: 0;
right:0;
top: 60px;
bottom: 50px;
overflow: auto;
padding: 15px;
}
.cooperate-right .cooperate-content table th{
background: #EEF1FC;
color: #666;
}
.cooperate-right .cooperate-content table td{
font-size: 12px;
}
</style>
\ No newline at end of file
<template>
<div class="cooperate">
<div class='cooperate-left'>
<div class="cooperate-title">合作资源</div>
<el-menu :default-active="activeIndex" :unique-opened="false" @select="handleSelect" background-color="#ffffff" text-color="#666" class='cooperate-menu'>
<el-menu-item :index="item.value" :key='index' v-for='(item,index) in menus' >
<i :class="item.icon"></i>
{{item.name}}
</el-menu-item>
</el-menu>
</div>
<component :is="modal" ></component>
</div>
</template>
<script>
import VAll from './All.vue'
export default {
data(){
return{
activeIndex:'3',tabindex:'3',modal:VAll,
menus:[
{name:'正常',value:'1',icon:'el-icon-upload2'},
{name:'停用',value:'2',icon:'el-icon-sort'},
{name:'全部',value:'3',icon:'el-icon-date'},
],
}
},
wacth:{
},
methods:{
handleSelect(key, keyPath) {
this.tabindex = key;
switch(Number(key)){
case 3:
this.modal = VAll
break;
default:
this.modal = null
break;
}
},
handleCurrentChange(page) {
},
}
}
</script>
<style>
.cooperate{
width: 1400px;
height: 100%;
margin: auto;
}
.cooperate-left{
width: 198px;
height: 100%;
background: #ffffff;
float: left;
}
.cooperate-left .cooperate-title{
color: #5874D8;
text-align: center;
font-size: 18px;
height: 64px;
line-height: 64px;
border-bottom: 1px solid #ececec;
}
.cooperate-menu .el-menu-item.is-active{
background-color: rgba(88,116,216,0.1) !important;
position: relative;
}
.cooperate-menu .el-menu-item.is-active:before{
content: '';
position: absolute;
width: 3px;
height: 20px;
left: 0;
top: 20px;
background: #50B5FC
}
</style>
\ No newline at end of file
<template>
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='cooperate-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<div class="dialog-content">
<div class="edict-icon">
<i class="el-icon-edit-outline"></i>
<i class="el-icon-delete"></i>
</div>
<el-tabs v-model="dialog.tab" type="card" @tab-click="handleClick">
<el-tab-pane label="详情" name="1" >
<h2>基本信息</h2>
<div class='cooperate-detail-tab'>
<p>名 称: <span> 精诚维修</span></p>
<p>负 责 人:<span>张三(13800001111)</span></p>
<p>状 态:<span>正常(已开通接口 )</span></p>
<p>地 址:<span>深圳市精诚家电维修有限公司</span> </p>
</div>
<h2>结算信息</h2>
<div class='cooperate-detail-tab'>
<p>周期: <span> 日结</span></p>
<p>结算方式:<span>银行卡(13800001111)</span></p>
<p>收款信息:<span>张三 中国建设银行宝安支行 6222212132881212</span></p>
</div>
<h2>认证信息</h2>
<div class='cooperate-detail-tab' style="border:none">
<p>认证方式: <span>企业认证</span></p>
<p>认证信息:<span>深圳市精诚家电维修有限公司 0102198902010215</span></p>
<p>认证图片:
<img src="../../../assets/images/dog.jpeg" alt="" width="60px" height="60px" style="vertical-align: text-top;">
</p>
</div>
</el-tab-pane>
<el-tab-pane label="范围" name="2">
<h2>服务区域</h2>
<div class='cooperate-detail-tab' style="padding:20px;line-height:3">
<span class='tag' v-for='(item,index) in 9' :key='index'>
<i class='el-icon-location'></i>广东-深圳
</span>
</div>
<h2>服务品类</h2>
<div class='cooperate-detail-tab' style="padding:20px;line-height:3;border:none">
<span class='tag' v-for='(item,index) in 2' :key='index'>
空调
</span>
</div>
</el-tab-pane>
<el-tab-pane label="授权码" name="3">
<h2>授权信息</h2>
<div class='cooperate-detail-tab' style="border:none">
<p>授权ID:<span>31E8792IWE73</span></p>
<p>授权密钥:<span>31E8792IWE7331E8792IWE7331E8792IWE73</span></p>
<p>接单方式一:<span>API对接</span></p>
<p>接单方式二:<span>小程序</span></p>
</div>
<div class="wechat"></div>
<div class="wechatTip">扫一扫,登录小程序</div>
</el-tab-pane>
</el-tabs>
</div>
</el-dialog>
</template>
<script>
export default{
props: {
//父组件调用时传进来的参数
modalData: Object
},
data(){
return{
detail:{ },
dialog:{
show:true,title:'授权点--精诚维修',tab:'1',
},
}
},
methods:{
handleClose() {
this.$emit('close')
},
handleClick(){
},
}
}
</script>
<style>
/********************详情start*******************/
.cooperate-detail{
width: 720px;
height: 630px;
}
.dialog-content{
position: relative;
}
.dialog-content .edict-icon{
position: absolute;right: 20px;
top:0;
}
.dialog-content .edict-icon i{
font-size: 24px;
color: #5874D8;
cursor: pointer;
}
.dialog-content .edict-icon i:nth-child(1){
margin-right: 15px;
}
.el-dialog__wrapper{
overflow: hidden !important;
}
.cooperate-detail h2{
padding-left: 15px;
position: relative;
margin-left: 20px;
}
.cooperate-detail h2:before{
position: absolute;
content: '';
left: 0;
top: 0;
width: 5px;
height: 20px;
background: #50B5FC;
}
.cooperate-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
}
.cooperate-detail .el-dialog__body{
padding:30px 0;
}
.cooperate-detail .el-dialog__header{
background: #6C8BF8;
}
.cooperate-detail .el-dialog__header .el-dialog__title,.cooperate-detail .el-dialog__header .el-dialog__headerbtn i{
color: #ffffff;
font-size: 16px;
}
.cooperate-detail .cooperate-detail-tab{
margin-top: 5px;
line-height: 2.5;
border-bottom: 1px solid #ececec;
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
}
.cooperate-detail .cooperate-detail-tab p{
color: #999;
font-size: 12px;
}
.cooperate-detail .cooperate-detail-tab span{
color: #333;
font-size: 12px;
}
.cooperate-detail-steps {
height: 300px;
margin-top: 10px;
padding-left: 20px;
}
.cooperate-detail-steps .el-step.is-vertical .el-step__title{
font-size: 14px;
}
.cooperate-detail .cooperate-request-box{
position: relative;
height: 530px;
}
.cooperate-detail .cooperate-detail-request{
background: #ececec;
position: absolute;bottom: 0;
left:0;
right: 0;
height: 54px;
}
.cooperate-detail .cooperate-detail-request .plus{
border: 1px solid #333;
width: 30px;
height: 30px;
margin-top: 10px;
margin-left: 20px;
float: left;
border-radius: 5px;
}
.cooperate-detail .cooperate-detail-request .plus i{
font-size: 29px;
}
.cooperate-detail .cooperate-detail-request .cooperate-input-area .seach-input .el-input__inner,.cooperate-detail .cooperate-detail-request .cooperate-input-area {
width: 540px;
margin-top: 6px;
margin-left: 20px;
}
.cooperate-detail .seach-input .el-input__inner,.cooperate-detail .seach-input {
width: 200px;
height: 25px;
}
.cooperate-detail .seach-area .el-input__inner,.cooperate-detail .seach-area {
width: 430px;
width: 490px;
height: 28px;
margin-right: 20px;
}
/*******************************范围start******************************/
.cooperate-detail-tab .tag{
background: #F1F3F8;
padding: 5px 14px;
border-radius: 3px;
margin-right: 20px;
color:#999999 !important;
}
.cooperate-detail-tab .tag i{
color: #3B4B84;
font-size: 14px;
}
/*******************************授权start******************************/
.el-tabs .wechat{
width: 180px;
height: 180px;
background: #ececec;
margin: auto;
margin-top: 50px;
}
.el-tabs .wechatTip{
text-align: center;
margin-top: 10px;
font-size: 12px;
color: #999;
}
</style>
<template>
<div>
main
</div>
</template>
\ No newline at end of file
<template>
<div>
message
</div>
</template>
\ No newline at end of file
<template>
<div class="add-order">
<div class='add-order-left'>
<div class="add-order-title">工单中心</div>
<el-menu :default-active="activeIndex" :unique-opened="false" @select="handleSelect" background-color="#ffffff" text-color="#666" class='add-order-menu'>
<el-menu-item :index="item.value" :key='index' v-for='(item,index) in menus' >
<i :class="item.icon"></i>
{{item.name}}
</el-menu-item>
</el-menu>
</div>
<div class="add-order-right">
<component :is="modal" ></component>
</div>
</div>
</template>
<script>
import Addone from './add/AddOne.vue'
import Onekey from './add/OneKey.vue'
import ExportAll from './add/ExportAll.vue'
import ExportTM from './add/ExportTM.vue'
import ExportJD from './add/ExportJD.vue'
export default {
data(){
return{
activeIndex:'1',tabindex:'1',modal:Addone,
menus:[
{name:'逐条新建',value:'1',icon:'el-icon-upload2'},
{name:'智能新建',value:'2',icon:'el-icon-sort'},
{name:'批量导出',value:'3',icon:'el-icon-date'},
{name:'天猫导出',value:'4',icon:'el-icon-warning'},
{name:'京东导出',value:'5',icon:'el-icon-upload'},
],
}
},
methods:{
handleSelect(key, keyPath) {
this.tabindex = key;
switch(Number(key)){
case 1:
this.modal = Addone
break;
case 2:
this.modal = Onekey
break;
case 3:
this.modal = ExportAll
break;
case 4:
this.modal = ExportTM
break;
case 5:
this.modal = ExportJD
break;
default:
break;
}
},
}
}
</script>
<style>
.add-order{
width: 1400px;
height: 100%;
margin: auto;
}
.add-order-left{
width: 198px;
height: 100%;
background: #ffffff;
float: left;
}
.add-order-left .add-order-title{
color: #5874D8;
text-align: center;
font-size: 18px;
height: 64px;
line-height: 64px;
border-bottom: 1px solid #ececec;
}
.add-order-menu .el-menu-item.is-active{
background-color: rgba(88,116,216,0.1) !important;
position: relative;
}
.add-order-menu .el-menu-item.is-active:before{
content: '';
position: absolute;
width: 3px;
height: 20px;
left: 0;
top: 20px;
background: #50B5FC
}
.add-order-right{
float: right;
width: 1180px;
height: 100%;
position: relative;
}
</style>
\ No newline at end of file
<template>
<div class="all-order">
<div class="all-order-serch">
<el-select class="seach-select" v-model="search.time" @change='' placeholder="创建时间">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
</el-select>
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options2'></el-option>
</el-select>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='请输入项目名、合作商名查询'></el-input>
<el-button type='primary' class='button-color'>搜索</el-button>
<span class='button-icon'><i class='el-icon-d-caret'></i></span>
<span class='button-icon'><i class='el-icon-d-caret'></i></span>
<el-button type='primary' class='button-color addbutton' @click='$router.push({name:"addOrder"})'>新建工单</el-button>
</div>
<div class="all-orders-box">
<div class="all-order-content">
<div class="all-order-box" v-for='(item,index) in tableData' :key='index' @click='checkDetail(item)'>
<div class="all-box-top">
<span class='type'>保内</span>
美的洗衣机--清理
<div class="all-box-topright">
<i class='el-icon-share' @click.stop=''></i>
<i class='el-icon-star-on' @click.stop=''></i>
<i class='el-icon-news' @click.stop=''></i>
</div>
</div>
<div class="all-box-bottom">
<el-row>
<el-col :span="8">
<div class="all-box-mess1">
<p>张先生 15676758907</p>
<span>广东 深圳 福田 深南大道1102号招商大厦1102房</span>
</div>
</el-col>
<el-col :span="8">
<div class="all-box-mess2">
<p>
机型:
<span>KFR-35GW/NhEaB1W(2台)</span>
</p>
<p>授权点:<span>精诚美好生活维修</span></p>
</div>
</el-col>
<el-col :span="6">
<div class="all-box-mess3">
<p>
创建时间:<span>05-06 11:09</span>
</p>
<p>
已 创 建:<span>23时18分</span>
</p>
</div>
</el-col>
<el-col :span="2">
<span class='all-box-status'>{{item.statusText}}</span>
</el-col>
</el-row>
</div>
</div>
</div>
</div>
<div class="table_bottm">
<el-pagination @current-change="handleCurrentChange" background :current-page="table.current_page" layout="total, prev, pager, next" :page-size="15" :pager-count="table.page_count" :total="table.total">
</el-pagination>
</div>
<component :is="modal" @close="closeChild" :modalData="modalData"></component>
</div>
</template>
<script>
import Detail from './dialog/Detail.vue'
export default{
data(){
return{
search:{
type:'',time:'',options1:[],options2:[],name:''
},
tableData:[
{id:'1',statusText:'待派单'},
{id:'2',statusText:'待分配'},
{id:'3',statusText:'待完工'},
{id:'4',statusText:'待确权'},
{id:'5',statusText:'已完成'},
{id:'6',statusText:'已退回'}
],
table:{
current_page:1,page_count:7,total:50,
},
modal:null,modalData:{},
}
},
methods:{
handleCurrentChange(page) {
},
closeChild(){
this.modal = null
},
checkDetail(item){
console.log(4444)
this.modalData = item;
this.modal = Detail;
}
}
}
</script>
<style>
.all-order .all-order-serch{
background: #ffffff;
padding: 10px;
}
.all-order .all-order-serch .seach-select{
}
.all-order .all-order-serch .seach-select .el-input__inner,.all-order .all-order-serch .seach-select .el-input{
width: 120px !important;
background: #F1F3F9;
border: none;
}
.all-order .all-order-serch .seach-input .el-input__inner,.all-order .all-order-serch .seach-input {
width: 298px;
}
.button-color{
background: #5874D8;
}
.button-icon{
background: rgba(88,116,216,0.1) ; padding: 10px 8px;
border-radius: 4px;
}
.button-icon i {
font-size: 22px;color: #5874D8;
vertical-align:middle;
}
.addbutton{float: right;}
.all-orders-box{
position: absolute;
left: 0;
right: 0;
bottom: 50px;
top: 64px;
overflow: auto;
}
.all-order-content{
width: 1180px;
/*height: 100%;*/
position: relative;
}
.all-order-box{
width: 100%;
background: #EEF1FB;
height: 104px;
margin-top: 10px;
box-shadow: 3px 0px 5px 0px rgba(43,67,153,0.2);
}
.all-box-top{
height: 42px;
line-height: 42px;
}
.all-box-top .type{
background: #486DED;
color: #ffffff;
padding: 3px 6px;
margin-right: 10px;
}
.all-box-topright{
float: right;
}
.all-box-topright i {
color: #5874D8;margin-right: 20px;
font-size: 20px;
}
.all-box-bottom{
background: #ffffff;
height: 62px;
}
.all-box-bottom .all-box-mess1,.all-box-bottom .all-box-mess2,.all-box-bottom .all-box-mess3{
height: 62px;
line-height: 1.5;
padding-left: 20px;
}
.all-box-bottom .all-box-mess1,.all-box-bottom .all-box-mess2{
border-right: 1px solid #ececec;
}
.all-box-bottom .all-box-mess1 p{
color: #5874D8;padding-top: 8px;
}
.all-box-bottom .all-box-mess1 span{
font-size: 12px;
}
.all-box-bottom .all-box-mess2,.all-box-bottom .all-box-mess3{
line-height: 1.8;
}
.all-box-bottom .all-box-mess2 p,.all-box-bottom .all-box-mess3 p{
color: #999;
font-size: 12px;
}
.all-box-bottom .all-box-mess2 p:nth-child(1),.all-box-bottom .all-box-mess3 p:nth-child(1){
padding-top: 8px;
}
.all-box-bottom .all-box-mess2 p span,.all-box-bottom .all-box-mess3 p span{
color: #333;
font-size: 12px;
}
.all-box-bottom .all-box-status{
text-align: right;
line-height: 62px;
padding-right:20px;
cursor: pointer;
font-size:16px;
font-family:PingFangSC-Regular;
font-weight:400;
}
.table_bottm{
text-align: center;
padding-top: 20px;
position: absolute;
bottom: 15px;
left: 0;
right: 0;
}
</style>
\ No newline at end of file
<template>
<div class="order">
<div class='order-left'>
<div class="order-title">工单中心</div>
<el-menu :default-active="activeIndex" :unique-opened="false" @select="handleSelect" background-color="#ffffff" text-color="#666" class='order-menu'>
<el-menu-item :index="item.value" :key='index' v-for='(item,index) in menus' >
<i :class="item.icon"></i>
{{item.name}}
</el-menu-item>
</el-menu>
</div>
<div class="order-right">
<component :is="modal" ></component>
</div>
</div>
</template>
<script>
import VAll from './AllOrder.vue'
export default {
data(){
return{
activeIndex:'9',tabindex:'9',modal:VAll,
menus:[
{name:'待派单',value:'1',icon:'el-icon-upload2'},
{name:'未分配',value:'2',icon:'el-icon-sort'},
{name:'未预约',value:'3',icon:'el-icon-date'},
{name:'未完工',value:'4',icon:'el-icon-warning'},
{name:'超约未完工',value:'5',icon:'el-icon-upload'},
{name:'未确认',value:'6',icon:'el-icon-question'},
{name:'已退回',value:'7',icon:'el-icon-news'},
{name:'取消工单',value:'8',icon:'el-icon-close'},
{name:'所有工单',value:'9',icon:'el-icon-tickets'},
],
}
},
wacth:{
},
methods:{
handleSelect(key, keyPath) {
this.tabindex = key;
},
handleSelect(key, keyPath) {
this.tabindex = key;
switch(Number(key)){
case 9:
this.modal = VAll
break;
default:
this.modal = null
break;
}
},
}
}
</script>
<style>
.order{
width: 1400px;
height: 100%;
margin: auto;
}
.order-left{
width: 198px;
height: 100%;
background: #ffffff;
float: left;
}
.order-left .order-title{
color: #5874D8;
text-align: center;
font-size: 18px;
height: 64px;
line-height: 64px;
border-bottom: 1px solid #ececec;
}
.order-menu .el-menu-item.is-active{
background-color: rgba(88,116,216,0.1) !important;
position: relative;
}
.order-menu .el-menu-item.is-active:before{
content: '';
position: absolute;
width: 3px;
height: 20px;
left: 0;
top: 20px;
background: #50B5FC
}
.order-right{
/* float: right;
width: 1180px;*/
float: right;
width: 1180px;
height: 100%;
position: relative;
}
</style>
\ No newline at end of file
<template>
<div>
<div class="add-order-rightTitle">
新建工单
<el-button type="primary" plain size='mini' style='float:right;margin-top:20px' @click='reback()'>返回</el-button>
</div>
<div class="add-order-content">
<el-form :model="addData.form" :rules="addData.rules" ref="form1" label-width="100px" class="inputword" >
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item prop="tel" label='用户电话:' style=" " >
<el-input v-model='addData.form.tel' placeholder='请输入电话号码'></el-input>
</el-form-item>
</el-col>
<el-col :span='14' >
<el-input v-model='addData.form.phone' placeholder='备用电话'></el-input>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item prop="name" label='用户姓名:' style=" " >
<el-input v-model='addData.form.name' placeholder='请输入用户姓名'></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item prop="address" label='地址:' style=" " >
<el-input v-model='addData.form.address' placeholder='请选择地址'></el-input>
</el-form-item>
</el-col>
<el-col :span='14' >
<el-input v-model='addData.form.local' placeholder='详细地址'></el-input>
</el-col>
</el-row>
<el-form-item prop="type" label='服务类型:' style=" " >
<el-radio v-model="addData.form.type" label="1" border size="medium">安装</el-radio>
<el-radio v-model="addData.form.type" label="2" border size="medium">维修</el-radio>
<el-radio v-model="addData.form.type" label="3" border size="medium">检查</el-radio>
</el-form-item>
<el-form-item prop="date" label='质 保 期:' style=" " >
<el-radio v-model="addData.form.date" label="1" border size="medium">保内</el-radio>
<el-radio v-model="addData.form.date" label="2" border size="medium">保外</el-radio>
</el-form-item>
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item prop="product_type" label='产品型号:' style=" " >
<el-select v-model="addData.form.product_type" placeholder="请选择">
<el-option v-for="item in addData.form.options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item prop="num" label='数量:' style=" " >
<el-input v-model='addData.form.num' placeholder='请输入数量' type='number'></el-input>
</el-form-item>
</el-col>
</el-row>
<el-form-item label='描述:' style=" " >
<el-input v-model='addData.form.remark' type='textarea'></el-input>
</el-form-item>
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item label='快速派单:' style=" " >
<el-input v-model='addData.form.auth' placeholder='请输入授权点' ></el-input>
</el-form-item>
</el-col>
</el-row>
<el-button class='save' @click='saveFun("form1")'>保存</el-button>
</el-form>
</div>
</div>
</template>
<script>
export default {
data(){
return{
addData:{
form:{
tel:'',phone:'',name:'',address:'',local:'',type:'',date:'',product_type:'',options:[],num:'',remark:'',auth:''
},
rules:{
tel:[{required: true, message: '请输入电话号码', trigger: 'blur' }],
name:[{required: true, message: '请输入用户姓名', trigger: 'blur' }],
address:[{required: true, message: '请选择地址', trigger: 'blur' }],
type:[{required: true, message: '请选择类型', trigger: 'blur' }],
date:[{required: true, message: '请选择质保期', trigger: 'blur' }],
product_type:[{required: true, message: '请选择产品型号', trigger: 'blur' }],
num:[{required: true, message: '请输入数量', trigger: 'blur' }],
}
}
}
},
methods:{
saveFun(formName){
const self = this;
self.$refs[formName].validate((valid) => {
if (valid) {
} else {
return false;
}
});
},
reback(){
this.$router.back(-1)
}
}
}
</script>
<style>
.add-order-right .add-order-rightTitle{
height: 64px;
line-height: 64px;
position: relative;
padding-left: 20px;
color: #5B76D1;
font-weight:500;
font-size: 20px;
}
.add-order-right .add-order-rightTitle:before{
position: absolute;
content: '';
left: 0;
top: 20px;
width: 6px;
height: 24px;
background: #50B4FC;
}
.add-order-right .add-order-content{
background: #ffffff;
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 64px;
padding: 20px;
overflow: auto;
}
.add-order-right .add-order-content form{
width: 800px;
}
.add-order-right .add-order-content form .el-radio__input{
display: none;
}
.add-order-right .add-order-content form .el-radio{
margin-right: 0;
}
.add-order-right .add-order-content form .save{
background: #5774D8;
color: #ffffff;
width: 115px;
margin-left: 100px;
margin-top: 20px;
}
</style>
\ No newline at end of file
<template>
<div>
export all
</div>
</template>
\ No newline at end of file
<template>
<div>
export JD
</div>
</template>
\ No newline at end of file
<template>
<div>
export TM
</div>
</template>
\ No newline at end of file
<template>
<div>
<div class="add-order-rightTitle">
新建工单
<el-button type="primary" plain size='mini' style='float:right;margin-top:20px' @click='reback()'>返回</el-button>
</div>
<div class="add-order-content">
<div class="title">
文本框内可输入<span>用户信息</span>、<span>产品信息</span>等;<br>
(信息之间用空格或换行,系统会自动匹配并完成工单创建.)
</div>
<el-input class='textarea' type="textarea" :autosize="{ minRows: 10, maxRows: 26}" placeholder="" v-model="inputValue"></el-input>
<el-button type="primary" size='mini' style=' '>确定</el-button>
</div>
</div>
</template>
<script>
export default{
data(){
return{
inputValue:''
}
},
methods:{
reback(){
this.$router.back(-1)
}
}
}
</script>
<style>
.add-order-right .add-order-content .title{
font-size: 12px;
font-family: PingFangSC-Medium;
font-weight: 500;
color: #8F97A4;
}
.add-order-right .add-order-content .title span{
color: #5B76D1;
}
.add-order-right .add-order-content .textarea{
margin-top: 20px;
}
.add-order-right .add-order-content button{
margin-top: 20px;background: rgb(87, 116, 216);width: 90px;
}
</style>
\ No newline at end of file
This diff is collapsed.
<template>
<div class="header">
<div class="header-content">
<div class="header-logo">
<img src="@/assets/images/dog.jpeg" alt="" width="42px" height="42px">
<p class='header-title'>Hi!隔壁老王</p>
</div>
<div class="header-side">
<el-menu mode="horizontal" :router="true" :unique-opened="true" :default-active="onRoutes" background-color="#708DF1" text-color="#ffffff" active-text-color="#708DF1" class='mian_side'>
<el-menu-item :index="item.value" :key='index' v-for='(item,index) in menus' >
<i :class="item.icon"></i>{{item.name}}
</el-menu-item>
</el-menu>
</div>
</div>
</div>
</template>
<script>
export default {
data(){
return{
onRoutes:'',
menus:[
{name:'首页',value:'/main',icon:'el-icon-menu'},
{name:'工单',value:'/orders',icon:'el-icon-tickets'},
{name:'结算',value:'/settlement',icon:'el-icon-printer'},
{name:'合作',value:'/cooperate',icon:'el-icon-refresh'},
{name:'消息',value:'/message',icon:'el-icon-service'},
{name:'设置',value:'/set',icon:'el-icon-setting'},
],
}
},
watch:{
$route:function(){
if(this.$route.name=='addOrder'){
// this.
}
}
},
mounted(){
this.onRoutes = this.$route.path;
}
}
</script>
<style>
.header{
height:60px;
background:rgba(112,141,241,1);
}
.header-content{
width: 1400px;
height: 100%;
margin: auto;
}
.header-logo{
width: 198px;height: 100%;background:rgba(72,109,237,1);float: left;
}
.header-logo img{
margin-top: 10px;
margin-left: 10px;
border-radius: 50%;
float: left;
}
.header-title{
height: 100%;
color: rgba(255,255,255,1);
float: left;
line-height: 60px;
margin-left: 10px;
}
.header-side{
float: right;
height: 100%;
line-height: 60px;
}
.header .header-side .mian_side{
height: 40px;
overflow: hidden;
margin-top: 20px;
border-bottom: none;
}
.header .header-side .mian_side .el-menu-item{
line-height: 3;
height: 40px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
color: #ffffff;
}
.header .header-side .mian_side .el-menu-item i{
color: #ffffff
}
.header .header-side .mian_side .el-menu-item.is-active{
border-bottom: 2px solid #F5F5F5;
color: #708DF1;
background-color: #F5F5F5 !important;
border-bottom-color: #F5F5F5 !important;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.header .header-side .mian_side .el-menu-item.is-active i{
color: #708DF1
}
</style>
\ No newline at end of file
<template>
<div>
<v-header></v-header>
<div class="content">
<router-view ></router-view>
</div>
</div>
</template>
<script>
import VHeader from './Header.vue'
export default{
components:{
VHeader
},
data(){
return{
}
}
}
</script>
<style>
.content{
/*background: #ffffff;*/
/*width: 1400px;*/
margin: auto;
position: absolute;
top: 80px;
bottom: 15px;
left: 0;
right: 0;
/*overflow: auto;*/
}
</style>
\ No newline at end of file
<template>
<div class="settle">
<div class='settle-left'>
<div class="settle-title">系统设置</div>
<el-menu :default-active="activeIndex" :unique-opened="false" @select="handleSelect" background-color="#ffffff" text-color="#666" class='settle-menu'>
<el-menu-item :index="item.value" :key='index' v-for='(item,index) in menus' >
<i :class="item.icon"></i>
{{item.name}}
</el-menu-item>
</el-menu>
</div>
<component :is="modal" ></component>
</div>
</template>
<script>
import Server from './Server.vue'
import Product from './Product.vue'
import Protect from './Protect.vue'
export default {
data(){
return{
activeIndex:'1',tabindex:'1',modal:Product,
menus:[
{name:'产品维护',value:'1',icon:'el-icon-upload2'},
{name:'服务维护',value:'2',icon:'el-icon-upload2'},
{name:'包内结算',value:'3',icon:'el-icon-sort'},
],
}
},
wacth:{
},
methods:{
handleSelect(key, keyPath) {
this.tabindex = key;
switch(Number(key)){
case 1:
this.modal = Product
break;
case 2:
this.modal = Server
break;
case 3:
this.modal = Protect
break;
default:
this.modal = null
break;
}
},
handleCurrentChange(page) {
},
}
}
</script>
<style>
.settle{
width: 1400px;
height: 100%;
margin: auto;
}
.settle-left{
width: 198px;
height: 100%;
background: #ffffff;
float: left;
}
.settle-left .settle-title{
color: #5874D8;
text-align: center;
font-size: 18px;
height: 64px;
line-height: 64px;
border-bottom: 1px solid #ececec;
}
.settle-menu .el-menu-item.is-active{
background-color: rgba(88,116,216,0.1) !important;
position: relative;
}
.settle-menu .el-menu-item.is-active:before{
content: '';
position: absolute;
width: 3px;
height: 20px;
left: 0;
top: 20px;
background: #50B5FC
}
</style>
\ No newline at end of file
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
<template>
<el-dialog width="420px" :title="dialog.title" custom-class='addcate animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="品牌名称:">
<el-input v-model='form.name'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
</div>
</el-dialog>
</template>
<script>
export default{
props: {
//父组件调用时传进来的参数
modalData: Object
},
data(){
return{
uploadApi:'',
dialog:{
show:true,title:'',type:1
},
form:{
name:'',
cate:''
}
}
},
created(){
// this.dialog.title = this.modalData.title;
// this.form.name = this.modalData.name;
// this.dialog.show = this.modalData.show;
if(this.modalData.type=='creat'){
this.dialog.title = '新增品牌'
}
},
methods:{
handleClose() {
this.$emit('close')
},
}
}
</script>
<style>
.addcate form{
width: 300px;
}
.addcate .button-box{
text-align: center;
}
.addcate .button-box button{
width: 100px;
}
.addcate .el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
color: #394A88;
}
</style>
\ No newline at end of file
<template>
<el-dialog width="420px" :title="dialog.title" custom-class='addcate animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="产品品类:">
{{form.name}}
</el-form-item>
<el-form-item label="产品规格:">
<el-input v-model='form.cate'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' v-if='!isCreat'>删除</el-button>
</div>
</el-dialog>
</template>
<script>
export default{
props: {
//父组件调用时传进来的参数
modalData: Object
},
data(){
return{
uploadApi:'',isCreat:true,
dialog:{
show:true,title:'',type:1
},
form:{
name:'',
cate:''
}
}
},
created(){
this.form.name = this.modalData.name;
if(this.modalData.type=='creat'){
this.dialog.title = '新增规格';
this.isCreat = true;
}else{
this.dialog.title = '编辑规格';
this.isCreat = false;
this.getinfo()
}
},
methods:{
getinfo(){
this.form.cate = this.modalData.cate;
},
handleClose() {
this.$emit('close')
},
}
}
</script>
<style>
.addcate form{
width: 300px;
}
.addcate .button-box{
text-align: center;
}
.addcate .button-box button{
width: 100px;
}
</style>
\ No newline at end of file
<template>
<el-dialog width="420px" :title="dialog.title" custom-class='addcate' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="规格分类:">
{{form.name}}
</el-form-item>
<el-form-item label="归属品牌:">
<el-select v-model="form.card" placeholder="请选择">
<el-option label="海尔" value="海尔"></el-option>
<el-option label="美的" value="美的"></el-option>
</el-select>
</el-form-item>
<el-form-item label="输入型号:">
<el-input v-model='form.cate'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' v-if='!isCreat'>删除</el-button>
</div>
</el-dialog>
</template>
<script>
export default{
props: {
//父组件调用时传进来的参数
modalData: Object
},
data(){
return{
uploadApi:'',isCreat:true,
dialog:{
show:true,title:'',type:1
},
form:{
name:'',
card:'',
cate:''
}
}
},
created(){
this.form.name = this.modalData.name;
if(this.modalData.type=='creat'){
this.dialog.title = '新增型号';
this.isCreat = true;
}else{
this.dialog.title = '编辑型号';
this.isCreat = false;
this.getinfo()
}
},
methods:{
getinfo(){
this.form.name = this.modalData.name;
this.form.card = this.modalData.card;
this.form.cate = this.modalData.cate;
},
handleClose() {
this.$emit('close')
},
}
}
</script>
<style>
.addcate form{
width: 300px;
}
.addcate .button-box{
text-align: center;
}
.addcate .button-box button{
width: 100px;
}
</style>
\ No newline at end of file
<template>
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='order-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-tabs v-model="dialog.tab" type="card" @tab-click="handleClick">
<el-tab-pane label="品类" name="1">
<div class='order-detail-tab' style="padding:20px;line-height:3">
<el-radio v-model="choose_type" v-for='(item,index) in products' :key='index' :label="item.id" @change='clickType(item)' border size="medium">{{item.name}}</el-radio>
<span class='tag cursor' @click='addType()'>
<i class='el-icon-plus'></i>
</span>
</div>
<template v-if='choose_type!==""'>
<el-tabs type="card">
<el-tab-pane :label="'【' +choose_typeName+'】下的产品规格'" >
<div class='order-detail-tab' style="padding:20px;line-height:3;">
<el-radio v-model="choose_cate" v-for='(item,index) in cates' :key='index' :label="item.id" @change='clickCate(item)' border size="medium">{{item.name}}</el-radio>
<span class='tag cursor' @click='addType()'>
<i class='el-icon-plus'></i>
</span>
</div>
</el-tab-pane>
</el-tabs>
</template>
<template v-if='choose_cate!==""'>
<el-tabs type="card">
<el-tab-pane :label="'【' +choose_cateName+'】下的产品型号'" >
<div class='order-detail-tab' style="padding:20px;line-height:3;">
<el-radio v-model="choose_model" v-for='(item,index) in models' :key='index' :label="item.id" border size="medium">{{item.name}}</el-radio>
<span class='tag cursor' @click='addModel()'>
<i class='el-icon-plus'></i>
</span>
</div>
</el-tab-pane>
</el-tabs>
</template>
</el-tab-pane>
</el-tabs>
<component :is="modal" @close="closeChild" :modalData="innerData"></component>
</el-dialog>
</template>
<script>
import AddType from './AddType.vue'
import AddCate from './AddCate.vue'
import AddModel from './AddModel.vue'
export default{
props: {
//父组件调用时传进来的参数
modalData: Object
},
data(){
return{
detail:{ },
modal:null,innerData:{},
products:[
{id:1,name:'空调'},
{id:2,name:'洗衣机'},
{id:3,name:'电视机'},
],
choose_type:1,
choose_typeName:'空调',
cates:[
{id:1,name:'50L以上'},
{id:2,name:'50L以下'},
],
choose_cate:'',
choose_cateName:'',
models:[
{id:1,name:'KFWROO'},
{id:2,name:'KFUUWROO'},
],
choose_model:'',
dialog:{
show:true,title:'新增产品信息',tab:'1',
},
innerDialog1:{
show:false,title:'',type:1
}
}
},
methods:{
handleClose() {
this.$emit('close')
},
handleClick(){
},
addType(){
this.innerData = {type:'creat'};
this.modal = AddType;
},
addCate(){
this.innerData = {type:'creat',name:this.choose_typeName};
this.modal = AddCate;
},
addModel(){
this.innerData = {title:'新增类型',name:this.choose_cateName,show:true};
this.modal = AddModel;
},
closeChild(){
this.modal = null;
},
clickType(item){
this.choose_typeName = item.name ;
},
clickCate(item){
this.choose_cateName =item.name;
}
}
}
</script>
<style>
.order-detail{
width: 720px;
height: 670px;
}
.order-detail h2{
padding-left: 20px;
}
.order-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
}
.order-detail .order-detail-tab{
margin-top: 5px;
line-height: 2;
/*border-bottom: 1px solid #ececec;*/
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
}
.order-detail .el-radio__input{
display: none;
}
.order-detail .el-radio{
/*margin-right: 0;*/
/*background: #F1F3F8;*/
padding: 7px 15px 9px 3px;
border-radius: 3px;
margin-right: 20px;
color: #999999 !important;
height: 30px;
}
/*******************************范围start******************************/
.order-detail-tab .tag{
/*background: #F1F3F8;*/
padding: 5px 24px;
border-radius: 3px;
margin-right: 20px;
color:#999999 !important;
border:1px solid #ececec;
}
.order-detail-tab .tag i{
color: #3B4B84;
font-size: 14px;
}
</style>
This diff is collapsed.
This diff is collapsed.
<template>
<el-dialog width="420px" title="编辑" custom-class='addcate animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="名称:">
<el-input v-model='form.name'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' >删除</el-button>
</div>
</el-dialog>
</template>
<script>
export default{
props: {
//父组件调用时传进来的参数
modalData: Object
},
data(){
return{
uploadApi:'',
dialog:{
show:true,title:'',type:1
},
form:{
name:'大修',
cate:''
}
}
},
created(){
// this.dialog.title = this.modalData.title;
// this.form.name = this.modalData.name;
// this.dialog.show = this.modalData.show;
},
methods:{
handleClose() {
this.$emit('close')
},
}
}
</script>
<style>
.addcate form{
width: 300px;
}
.addcate .button-box{
text-align: center;
}
.addcate .button-box button{
width: 100px;
}
.addcate .el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
color: #394A88;
}
</style>
\ No newline at end of file
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment