提交

.gitignore

@@ -0,0 +1 @@
+node_modules

README.md

@@ -1,21 +1,21 @@
-# test
-
-> 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).
+# test
+
+> 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).

build/build.js

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

build/check-versions.js

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

build/utils.js

@@ -1,102 +1,103 @@
-'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')
-    })
-  }
-}
+'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,
+      modules:true  //添加
+    }
+  }
+
+  // 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')
+    })
+  }
+}

build/vue-loader.conf.js

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

build/webpack.base.conf.js

@@ -1,85 +1,85 @@
-'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
-  },
-  devServer: {
-    disableHostCheck: true,
-  },
-  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 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
+  },
+  devServer: {
+    disableHostCheck: true,
+  },
+  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'
+  }
+}

build/webpack.dev.conf.js

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

build/webpack.prod.conf.js

@@ -1,173 +1,173 @@
-'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 PrerenderSpaPlugin = require('prerender-spa-plugin')
-const Renderer = PrerenderSpaPlugin.PuppeteerRenderer
-
-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: ['.*']
-      }
-    ]),
-    //在vue-cli生成的文件的基础上，只有下面这个才是我们要配置的
-    // new PrerenderSpaPlugin({
-    //   // 生成文件的路径，也可以与webpakc打包的一致。
-    //   // 下面这句话非常重要！！！
-    //   // 这个目录只能有一级，如果目录层次大于一级，在生成的时候不会有任何错误提示，在预渲染的时候只会卡着不动。
-    //   staticDir: path.join(__dirname, '../dist'),
-    //
-    //   // 对应自己的路由文件，比如index有参数，就需要写成 /index/param1。
-    //   routes: ['/home','/sellList','/merchantsList','/login','/source','/mine'],
-    //
-    //   // 这个很重要，如果没有配置这段，也不会进行预编译
-    //   renderer: new Renderer({
-    //     inject: {
-    //       foo: 'bar'
-    //     },
-    //     headless: false,
-    //     // 在 main.js 中 document.dispatchEvent(new Event('render-event'))，两者的事件名称要对应上。
-    //     renderAfterDocumentEvent: 'render-event'
-    //   })
-    // })
-  ]
-})
-
-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 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 PrerenderSpaPlugin = require('prerender-spa-plugin')
+const Renderer = PrerenderSpaPlugin.PuppeteerRenderer
+
+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: ['.*']
+      }
+    ]),
+    //在vue-cli生成的文件的基础上，只有下面这个才是我们要配置的
+    // new PrerenderSpaPlugin({
+    //   // 生成文件的路径，也可以与webpakc打包的一致。
+    //   // 下面这句话非常重要！！！
+    //   // 这个目录只能有一级，如果目录层次大于一级，在生成的时候不会有任何错误提示，在预渲染的时候只会卡着不动。
+    //   staticDir: path.join(__dirname, '../dist'),
+    //
+    //   // 对应自己的路由文件，比如index有参数，就需要写成 /index/param1。
+    //   routes: ['/home','/sellList','/merchantsList','/login','/source','/mine'],
+    //
+    //   // 这个很重要，如果没有配置这段，也不会进行预编译
+    //   renderer: new Renderer({
+    //     inject: {
+    //       foo: 'bar'
+    //     },
+    //     headless: false,
+    //     // 在 main.js 中 document.dispatchEvent(new Event('render-event'))，两者的事件名称要对应上。
+    //     renderAfterDocumentEvent: 'render-event'
+    //   })
+    // })
+  ]
+})
+
+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

config/dev.env.js

@@ -1,7 +1,7 @@
-'use strict'
-const merge = require('webpack-merge')
-const prodEnv = require('./prod.env')
-
-module.exports = merge(prodEnv, {
-  NODE_ENV: '"development"'
-})
+'use strict'
+const merge = require('webpack-merge')
+const prodEnv = require('./prod.env')
+
+module.exports = merge(prodEnv, {
+  NODE_ENV: '"development"'
+})

config/index.js

@@ -1,69 +1,69 @@
-'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
-    host: '192.168.1.97', // can be overwritten by process.env.HOSTd
-    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'
+// 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
+    host: '192.168.1.69', // can be overwritten by process.env.HOSTd
+    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
+  }
+}

config/prod.env.js

@@ -1,4 +1,4 @@
-'use strict'
-module.exports = {
-  NODE_ENV: '"production"'
-}
+'use strict'
+module.exports = {
+  NODE_ENV: '"production"'
+}

index.html

@@ -1,38 +1,38 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="format-detection" content="telephone=no"/>
-    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/>
-    <title>优铺中国商办联卖联租平台（CBMLS）</title>
-    <meta name="keywords" content="商铺出售、商铺出租、写字楼出售、写字楼出租、中国商办联卖联租平台、优铺、CBMLS"/>
-    <meta name="description" content="优铺中国商办联卖联租平台（CBMLS）为您提供商铺出售、商铺出租、写字楼出售、写字楼出租信息及商业地产资讯，更多商铺、写字楼租售信息及资讯尽在手机中国商办联卖联租平台（CBMLS）。">
-    <link rel="stylesheet" href="./static/css/base.css">
-    <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css"/>
-    <link rel="stylesheet" href="./static/css/swiper.css">
-    <script src="./static/js/font.js"></script>
-    <script src="./static/js/common.js"></script>
-    <script src="./static/js/jquery.min.js"></script>
-    <script src="./static/js/swiper.min.js"></script>
-    <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
-    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
-    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.9&key=de863a32c51d618297c8b2d0851e7503&plugin=AMap.CitySearch"></script>
-    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=OxAEbfrVXXqWUSC4nP8mYi3bTKRBcP6u"></script>
-    <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
-    <script src="https://s96.cnzz.com/z_stat.php?id=1275228279&web_id=1275228279" language="JavaScript"></script>
-    <script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1275228279'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s96.cnzz.com/z_stat.php%3Fid%3D1275228279' type='text/javascript'%3E%3C/script%3E"));</script>
-    <script>
-      var _hmt = _hmt || [];
-      (function() {
-        var hm = document.createElement("script");
-        hm.src = "https://hm.baidu.com/hm.js?07e3e6809e991c9241bfb13a8ed5a977";
-        var s = document.getElementsByTagName("script")[0];
-        s.parentNode.insertBefore(hm, s);
-      })();
-    </script>
-  </head>
-  <body>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="format-detection" content="telephone=no"/>
+    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/>
+    <title>优铺中国商办联卖联租平台（CBMLS）</title>
+    <meta name="keywords" content="商铺出售、商铺出租、写字楼出售、写字楼出租、中国商办联卖联租平台、优铺、CBMLS"/>
+    <meta name="description" content="优铺中国商办联卖联租平台（CBMLS）为您提供商铺出售、商铺出租、写字楼出售、写字楼出租信息及商业地产资讯，更多商铺、写字楼租售信息及资讯尽在手机中国商办联卖联租平台（CBMLS）。">
+    <link rel="stylesheet" href="./static/css/base.css">
+    <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css"/>
+    <link rel="stylesheet" href="./static/css/swiper.css">
+    <script src="./static/js/font.js"></script>
+    <script src="./static/js/common.js"></script>
+    <script src="./static/js/jquery.min.js"></script>
+    <script src="./static/js/swiper.min.js"></script>
+    <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
+    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
+    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.9&key=de863a32c51d618297c8b2d0851e7503&plugin=AMap.CitySearch"></script>
+    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=OxAEbfrVXXqWUSC4nP8mYi3bTKRBcP6u"></script>
+    <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
+    <script src="https://s96.cnzz.com/z_stat.php?id=1275228279&web_id=1275228279" language="JavaScript"></script>
+    <script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1275228279'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s96.cnzz.com/z_stat.php%3Fid%3D1275228279' type='text/javascript'%3E%3C/script%3E"));</script>
+    <script>
+      var _hmt = _hmt || [];
+      (function() {
+        var hm = document.createElement("script");
+        hm.src = "https://hm.baidu.com/hm.js?07e3e6809e991c9241bfb13a8ed5a977";
+        var s = document.getElementsByTagName("script")[0];
+        s.parentNode.insertBefore(hm, s);
+      })();
+    </script>
+  </head>
+  <body>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

package.json

@@ -1,71 +1,72 @@
-{
-  "name": "test",
-  "version": "1.0.0",
-  "description": "A Vue.js project",
-  "author": "text",
-  "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",
-    "mint-ui": "^2.2.13",
-    "vue": "^2.5.2",
-    "vue-axios": "^2.1.3",
-    "vue-router": "^3.0.1",
-    "vuex": "^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-polyfill": "^6.26.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.11",
-    "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",
-    "node-sass": "^4.9.3",
-    "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",
-    "prerender-spa-plugin": "^3.3.0",
-    "qrcode": "^1.2.2",
-    "rimraf": "^2.6.0",
-    "sass-loader": "^7.1.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.1.2",
-    "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"
-  ]
-}
+{
+  "name": "test",
+  "version": "1.0.0",
+  "description": "A Vue.js project",
+  "author": "text",
+  "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",
+    "mint-ui": "^2.2.13",
+    "vue": "^2.5.2",
+    "vue-axios": "^2.1.3",
+    "vue-router": "^3.0.1",
+    "vuex": "^3.0.1",
+    "webpack-dev-server": "^2.9.6"
+  },
+  "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-polyfill": "^6.26.0",
+    "babel-preset-env": "^1.3.2",
+    "babel-preset-stage-2": "^6.22.0",
+    "chalk": "^2.0.1",
+    "cli": "^1.0.1",
+    "copy-webpack-plugin": "^4.0.1",
+    "css-loader": "^0.28.11",
+    "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",
+    "node-sass": "^4.9.3",
+    "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",
+    "prerender-spa-plugin": "^3.3.0",
+    "qrcode": "^1.2.2",
+    "rimraf": "^2.6.0",
+    "sass-loader": "^7.1.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.1.2",
+    "vue-template-compiler": "^2.5.2",
+    "webpack": "^3.12.0",
+    "webpack-bundle-analyzer": "^2.9.0",
+    "webpack-merge": "^4.1.0"
+  },
+  "engines": {
+    "node": ">= 6.0.0",
+    "npm": ">= 3.0.0"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not ie <= 8"
+  ]
+}

src/App.vue

@@ -1,40 +1,40 @@
-<template>
-  <div id="app">
-    <keep-alive>
-      <router-view v-if="$route.meta.keepAlive"></router-view>
-    </keep-alive>
-    <router-view v-if="!$route.meta.keepAlive"></router-view>
-  </div>
-</template>
-
-<script>
-  import axios from 'axios';
-  export default {
-    name: 'App',
-    created(){
-      var url ="http://" +  window.location.host;
-      axios({
-        url: this.changeData() + '/show/getOpenedCitiesList',
-        method: "post",
-      }).then(res => {
-        // console.log(res)
-        res.data.data.forEach(function (item,index) {
-          if(item.m_url == url){
-            sessionStorage.provinceId = item.province_id;
-            sessionStorage.cityId =  item.city_id;
-            sessionStorage.cityName = item.city_name;
-          }
-        })
-      }).catch(err => {
-        console.log(err)
-      });
-    }
-  }
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-  #app{
-    width: 7.5rem;
-    margin: 0 auto;
-  }
-</style>
+<template>
+  <div id="app">
+    <keep-alive>
+      <router-view v-if="$route.meta.keepAlive"></router-view>
+    </keep-alive>
+    <router-view v-if="!$route.meta.keepAlive"></router-view>
+  </div>
+</template>
+
+<script>
+  import axios from 'axios';
+  export default {
+    name: 'App',
+    created(){
+      var url ="http://" +  window.location.host;
+      axios({
+        url: this.changeData() + '/show/getOpenedCitiesList',
+        method: "post",
+      }).then(res => {
+        // console.log(res)
+        res.data.data.forEach(function (item,index) {
+          if(item.m_url == url){
+            sessionStorage.provinceId = item.province_id;
+            sessionStorage.cityId =  item.city_id;
+            sessionStorage.cityName = item.city_name;
+          }
+        })
+      }).catch(err => {
+        console.log(err)
+      });
+    }
+  }
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+  #app{
+    width: 7.5rem;
+    margin: 0 auto;
+  }
+</style>

src/components/brand/brand.vue

@@ -1,90 +1,90 @@
-<template>
-<div class="brandWrap">
-    <div class="brandTop">
-        <img src="../../../static/images/common/whiteBack.png" class="whiteBack" @click="goHome();">
-        <h2>品牌加盟</h2>
-    </div>
-    <ul class="brandUl">
-        <li @click="goZybrand();">
-            <img src="../../../static/images/brand/zy.png">
-        </li>
-        <li @click="goJmbrand()">
-            <img src="../../../static/images/brand/jm.png">
-        </li>
-    </ul>
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'work',
-    data () {
-        return {
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        goHome(){
-            this.$router.push({path:"/home"});
-        },
-        goZybrand(){
-            this.$router.push({path:"/zybrand"});
-        },
-        goJmbrand(){
-            this.$router.push({path:"/jmbrand"});
-        } 
-    },
-    mounted() {       
-
-    }
-}
-</script>
-
-<style scoped lang="scss"  type="text/scss">
-.brandWrap{
-    height: 100vh;
-    background: #fff;
-    position: relative;
-}
-.brandTop{
-    width: 7.5rem;
-    height: 6.68rem;
-    background: url("../../../static/images/brand/brandBg.png") no-repeat;
-    background-size: 7.5rem 6.68rem;
-    h2{
-        font-size: .36rem;
-        font-family: PingFangSC-Medium,PingFangSC;
-        font-weight: 500;
-        color: #fff;
-        line-height: 1.2rem;
-        text-align: center;
-    }
-    .whiteBack{
-        width: .22rem;
-        height: .34rem;
-        position: absolute;
-        left: .3rem;
-        top: .4rem;
-        -webkit-tap-highlight-color: rgba(0,0,0,0);
-    }
-}
-.brandUl{
-    margin-top: -2rem;
-    li{
-        width: 6.92rem;
-        height: 3.6rem;
-        margin: 0 auto;
-        margin-top: .4rem;
-        -webkit-tap-highlight-color: rgba(0,0,0,0);
-        img{
-            width: 6.92rem;
-            height: 3.6rem;
-        }
-    }
-}
-</style>
+<template>
+<div class="brandWrap">
+    <div class="brandTop">
+        <img src="../../../static/images/common/whiteBack.png" class="whiteBack" @click="goHome();">
+        <h2>品牌加盟</h2>
+    </div>
+    <ul class="brandUl">
+        <li @click="goZybrand();">
+            <img src="../../../static/images/brand/zy.png">
+        </li>
+        <li @click="goJmbrand()">
+            <img src="../../../static/images/brand/jm.png">
+        </li>
+    </ul>
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'work',
+    data () {
+        return {
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        goHome(){
+            this.$router.push({path:"/home"});
+        },
+        goZybrand(){
+            this.$router.push({path:"/zybrand"});
+        },
+        goJmbrand(){
+            this.$router.push({path:"/jmbrand"});
+        } 
+    },
+    mounted() {       
+
+    }
+}
+</script>
+
+<style scoped lang="scss"  type="text/scss">
+.brandWrap{
+    height: 100vh;
+    background: #fff;
+    position: relative;
+}
+.brandTop{
+    width: 7.5rem;
+    height: 6.68rem;
+    background: url("../../../static/images/brand/brandBg.png") no-repeat;
+    background-size: 7.5rem 6.68rem;
+    h2{
+        font-size: .36rem;
+        font-family: PingFangSC-Medium,PingFangSC;
+        font-weight: 500;
+        color: #fff;
+        line-height: 1.2rem;
+        text-align: center;
+    }
+    .whiteBack{
+        width: .22rem;
+        height: .34rem;
+        position: absolute;
+        left: .3rem;
+        top: .4rem;
+        -webkit-tap-highlight-color: rgba(0,0,0,0);
+    }
+}
+.brandUl{
+    margin-top: -2rem;
+    li{
+        width: 6.92rem;
+        height: 3.6rem;
+        margin: 0 auto;
+        margin-top: .4rem;
+        -webkit-tap-highlight-color: rgba(0,0,0,0);
+        img{
+            width: 6.92rem;
+            height: 3.6rem;
+        }
+    }
+}
+</style>

src/components/brand/brandsearch.vue

@@ -1,409 +1,409 @@
-<template>
-<div class="searchWrap">
-    <div class="navSearch">
-        <div class="sou">
-            <form action="" class="">
-                <input class="keyword" placeholder="请输入品牌名称" @focus="shiqu()" v-model="sousuo">
-                <b @click="sou()" v-show="close"></b>
-            </form>
-        </div>
-        <div class="cancle">
-            <span @click="back()">取消</span>
-        </div>
-    </div>
-
-    <div class="brandlist" v-show="noData===1">
-        <div class="detail" ref="wrapper">
-            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
-                <ul>
-                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
-                        <div class="lisyImg">
-                            <img :src="item.imgs" :onerror="defaultImg">
-                        </div>
-                        <div class="listBox">
-                            <p><span>品牌名称：</span>{{item.brandName}}</p>
-                            <p><span>品牌业态：</span>{{item.brandType}}</p>
-                            <p><span>拓展区域：</span>{{item.region}}</p>
-                            <h6 v-if="item.position != ''">{{item.position}}</h6>
-                        </div>
-                    </li>
-                </ul>
-                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
-            </mt-loadmore>
-        </div>
-    </div>
-
-    <div class="noData" v-show="noData===2">
-        <div class="img"></div>
-        <p>您搜索的内容不存在</p>
-    </div>
-
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Indicator } from 'mint-ui';
-export default {
-    name: 'search',
-    data () {
-        return {
-            close: false,
-            sousuo: "",
-            listArr: [],
-            noData: "",
-            pageNum: 1,
-            pageSize: 10,
-            shopIndex: 1,
-            allLoaded: false,
-            more: false,
-            rentType: "",
-            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        }
-    },
-    mounted(){
-        this.rentType =  getUrlId("type");
-        var that = this;
-        $(".keyword").on('keypress',function(e) {
-            var keycode = e.keyCode;
-            if(keycode=='13') {
-                e.preventDefault();
-                //请求搜索接口
-                that.bianhua()
-            }
-        })
-
-    },
-    computed:{
-
-    },
-    methods:{
-        shiqu(){
-            this.close = true;
-        },
-        back(){
-            this.$router.go(-1);
-        },
-
-        goDetail(id){
-            if(this.rentType == "1"){
-                this.$router.push({path:"/zydetail",query:{id: id}});
-            }else if(this.rentType == "2"){
-                this.$router.push({path:"/jmdetail",query:{id: id}});
-            }
-        },
-
-        sou(){
-            this.sousuo = "";
-            this.close = false;
-        },
-
-        bianhua(){
-            // 条件列表
-            let _this = this;
-            let url = this.changeData() + '/brand/getBrandList';
-            var data = {
-                brandName: this.sousuo, //string  否   关键字
-                brandNature: this.rentType, //品牌类型 1-直营 2-加盟
-                pageSize: this.pageSize, //每页展示条数
-                pageNum: this.pageNum, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                Indicator.open({
-                    text: '',
-                    spinnerType: 'fading-circle'
-                });
-                setTimeout(function () {
-                    Indicator.close();
-                },1000);
-
-                this.listArr = data.data.brandList; //列表
-
-                if(this.listArr.length==0){
-                    this.noData = 2;
-                }else{
-                    this.noData = 1;
-                }
-
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        //下拉刷新
-        loadTop(){
-            var _this = this;
-            this.shopIndex = 1;
-            var data = {
-                brandName: this.sousuo, //string  否   关键字
-                brandNature: this.rentType, //品牌类型 1-直营 2-加盟
-                pageSize: this.pageSize, //每页展示条数
-                pageNum: "1", //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-            }
-            setTimeout(function () {
-                _this.$http.post(_this.changeData() + '/brand/getBrandList', qs.stringify(data)).then(function (data) {
-                    _this.listArr = data.data.brandList; //列表
-                    _this.$refs.loadmore.onTopLoaded();
-                }.bind(_this)).catch(function (err) {
-                    console.log("商店列表页面错误：", err)
-                })
-            }, 2000);
-        },
-
-        //上拉加载
-        loadBottom() {
-            var _this = this;
-            this.shopIndex++;
-            var data = {
-                brandName: this.sousuo, //string  否   关键字
-                brandNature: this.rentType, //品牌类型 1-直营 2-加盟
-                pageSize: this.pageSize, //每页展示条数
-                pageNum: this.shopIndex, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-            }
-            _this.$http.post(_this.changeData() + '/brand/getBrandList',qs.stringify(data)).then(function(res){
-                _this.listArr = _this.listArr.concat(res.data.brandList);
-                if(res.data.list == ''){
-                    this.allLoaded = true;
-                }
-                _this.$refs.loadmore.onBottomLoaded();
-            }.bind(_this)).catch(function(err){
-                console.log("商店列表页面错误：",err);
-            })
-        },
-
-        handleBottomChange(){
-            var _this = this;
-            if(this.allLoaded == true){
-                this.more = true;
-                setTimeout(function () {
-                    _this.more = false;
-                },2000)
-            }
-        },
-    },
-    created() {
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-.searchWrap{
-    width: 7.5rem;
-    height: 13.34rem;
-    overflow: scroll;
-    margin: 0 auto;
-    background: #fff;
-    position: relative;
-    .navSearch{
-        width: 7.5rem;
-        height: .9rem;
-        line-height: .9rem;
-        border-bottom: 0.01rem solid #eaeaea;
-        background: #fff;
-        position: fixed;
-        top: 0px;
-        left: auto;
-        .cancle{
-            width: 1rem;
-            float: left;
-            text-align: center;
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            span{
-                font-size: .26rem;
-                color: #111;
-            }
-        }
-        .sou{
-            width: 6.1rem;
-            float: left;
-            margin-left: .3rem;
-            input[type=search]::-webkit-input-placeholder{
-                line-height: .34rem;
-            }
-            input[type=search]::-webkit-search-cancel-button{
-                -webkit-appearance: none;
-            }
-            b{
-                position: absolute;
-                top: .33rem;
-                right: 1.3rem;
-                width: .26rem;
-                height: .26rem;
-                line-height: .26rem;
-                background: url("../../../static/images/common/close.png") no-repeat;
-                background-size: .26rem .26rem;
-            }
-            input{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                width: 5.8rem;
-                height: 0.6rem;
-                border-radius: 0.1rem;
-                background: #f0f1f3;
-                padding-left: .3rem;
-            }
-        }
-    }
-    .noData{
-        padding-top: 2.8rem;
-        text-align: center;
-        .img{
-            width: 1.6rem;
-            height: 1.6rem;
-            margin: 0 auto;
-            background: url("../../../static/images/common/noData.png") no-repeat;
-            background-size: 1.6rem 1.6rem;
-            margin-bottom: .4rem;
-        }
-        p{
-            font-size: .3rem;
-            color: #898989;
-        }
-    }
-}
-
-/*列表*/
-.brandlist{
-    width: 7.5rem;
-    margin-top: .88rem;
-    background: #fff;
-    z-index: 9;
-    .detail{
-        ul{
-            li{
-                width: 7.2rem;
-                height: 2.1rem;
-                background: #fff;
-                padding-top: .3rem;
-                /*margin: 0 auto;*/
-                margin-left: .3rem;
-                .lisyImg{
-                    width: 2.4rem;
-                    height: 1.8rem;
-                    float: left;
-                    margin-right: .2rem;
-                    img{
-                        width: 2.4rem;
-                        height: 1.8rem;
-                        border-radius: 8px;
-                    }
-                }
-                .listBox{
-                    width: 4.6rem;
-                    height: 2.1rem;
-                    border-bottom: 1px solid #eee;
-                    float: left;
-                    overflow: hidden;
-                    p{
-                        width: 4.3rem;
-                        height: .4rem;
-                        font-size: .28rem;
-                        font-family: PingFangSC-Regular,PingFangSC;
-                        font-weight: 400;
-                        color: #222;
-                        line-height: .4rem;
-                        margin-bottom: .06rem;
-                        overflow: hidden;
-                        text-overflow: ellipsis;
-                        white-space: nowrap;
-                        span{
-                            color: #999;
-                        }
-                    }
-                    h6{
-                        height: .32rem;
-                        line-height: .32rem;
-                        padding: 0 .1rem;
-                        background: #edf4ff;
-                        display: inline-block;
-                        margin-right: .1rem;
-                        font-size: .22rem;
-                        font-family: PingFangSC-Medium,PingFangSC;
-                        font-weight: 500;
-                        color: #67b0ff;
-                        line-height: .32rem;
-                        margin-top: .08rem;
-                    }
-                }
-            }
-        }
-    }
-    .noMore{
-        width: 7.5rem;
-        line-height: .8rem;
-        font-size: .3rem;
-        text-align: center;
-    }
-}
-/*无数据*/
-/*.noData{
-    padding-top: 1.5rem;
-    width: 7.5rem;
-    height: 90vh;
-    .noOrderTop{
-        height: .9rem;
-        text-align: center;
-        background: #fff;
-        border-bottom: 0.02rem solid #eee;
-        position: relative;
-        h3{
-            width: 75%;
-            line-height: 1rem;
-            font-size: 0.36rem;
-            color: #333;
-            float: left;
-            text-align: center;
-        }
-        i{
-            display: inline-block;
-            width: 13%;
-            height: 1rem;
-            line-height: 1rem;
-            float: left;
-            img{
-                width: 0.4rem;
-                height: 0.4rem;
-            }
-        }
-    }
-    dl{
-        width: 7.5rem;
-        text-align: center;
-        dt{
-            margin-top: 1.4rem;
-            img{
-                width: 3rem;
-                height: 3rem;
-            }
-        }
-        p{
-            font-size: .28rem;
-            color: #898989;
-            margin-top: .38rem;
-            margin-bottom: .5rem;
-        }
-        dd{
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            span{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                display: inline-block;
-                width: 3rem;
-                height: .89rem;
-                background: #47abff;
-                line-height: .89rem;
-                color: #fff;
-                font-size: .34rem;
-                border-radius: 5px;
-            }
-        }
-    }
-}*/
-</style>
+<template>
+<div class="searchWrap">
+    <div class="navSearch">
+        <div class="sou">
+            <form action="" class="">
+                <input class="keyword" placeholder="请输入品牌名称" @focus="shiqu()" v-model="sousuo">
+                <b @click="sou()" v-show="close"></b>
+            </form>
+        </div>
+        <div class="cancle">
+            <span @click="back()">取消</span>
+        </div>
+    </div>
+
+    <div class="brandlist" v-show="noData===1">
+        <div class="detail" ref="wrapper">
+            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
+                <ul>
+                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
+                        <div class="lisyImg">
+                            <img :src="item.imgs" :onerror="defaultImg">
+                        </div>
+                        <div class="listBox">
+                            <p><span>品牌名称：</span>{{item.brandName}}</p>
+                            <p><span>品牌业态：</span>{{item.brandType}}</p>
+                            <p><span>拓展区域：</span>{{item.region}}</p>
+                            <h6 v-if="item.position != ''">{{item.position}}</h6>
+                        </div>
+                    </li>
+                </ul>
+                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
+            </mt-loadmore>
+        </div>
+    </div>
+
+    <div class="noData" v-show="noData===2">
+        <div class="img"></div>
+        <p>您搜索的内容不存在</p>
+    </div>
+
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Indicator } from 'mint-ui';
+export default {
+    name: 'search',
+    data () {
+        return {
+            close: false,
+            sousuo: "",
+            listArr: [],
+            noData: "",
+            pageNum: 1,
+            pageSize: 10,
+            shopIndex: 1,
+            allLoaded: false,
+            more: false,
+            rentType: "",
+            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        }
+    },
+    mounted(){
+        this.rentType =  getUrlId("type");
+        var that = this;
+        $(".keyword").on('keypress',function(e) {
+            var keycode = e.keyCode;
+            if(keycode=='13') {
+                e.preventDefault();
+                //请求搜索接口
+                that.bianhua()
+            }
+        })
+
+    },
+    computed:{
+
+    },
+    methods:{
+        shiqu(){
+            this.close = true;
+        },
+        back(){
+            this.$router.go(-1);
+        },
+
+        goDetail(id){
+            if(this.rentType == "1"){
+                this.$router.push({path:"/zydetail",query:{id: id}});
+            }else if(this.rentType == "2"){
+                this.$router.push({path:"/jmdetail",query:{id: id}});
+            }
+        },
+
+        sou(){
+            this.sousuo = "";
+            this.close = false;
+        },
+
+        bianhua(){
+            // 条件列表
+            let _this = this;
+            let url = this.changeData() + '/brand/getBrandList';
+            var data = {
+                brandName: this.sousuo, //string  否   关键字
+                brandNature: this.rentType, //品牌类型 1-直营 2-加盟
+                pageSize: this.pageSize, //每页展示条数
+                pageNum: this.pageNum, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                Indicator.open({
+                    text: '',
+                    spinnerType: 'fading-circle'
+                });
+                setTimeout(function () {
+                    Indicator.close();
+                },1000);
+
+                this.listArr = data.data.brandList; //列表
+
+                if(this.listArr.length==0){
+                    this.noData = 2;
+                }else{
+                    this.noData = 1;
+                }
+
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        //下拉刷新
+        loadTop(){
+            var _this = this;
+            this.shopIndex = 1;
+            var data = {
+                brandName: this.sousuo, //string  否   关键字
+                brandNature: this.rentType, //品牌类型 1-直营 2-加盟
+                pageSize: this.pageSize, //每页展示条数
+                pageNum: "1", //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+            }
+            setTimeout(function () {
+                _this.$http.post(_this.changeData() + '/brand/getBrandList', qs.stringify(data)).then(function (data) {
+                    _this.listArr = data.data.brandList; //列表
+                    _this.$refs.loadmore.onTopLoaded();
+                }.bind(_this)).catch(function (err) {
+                    console.log("商店列表页面错误：", err)
+                })
+            }, 2000);
+        },
+
+        //上拉加载
+        loadBottom() {
+            var _this = this;
+            this.shopIndex++;
+            var data = {
+                brandName: this.sousuo, //string  否   关键字
+                brandNature: this.rentType, //品牌类型 1-直营 2-加盟
+                pageSize: this.pageSize, //每页展示条数
+                pageNum: this.shopIndex, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+            }
+            _this.$http.post(_this.changeData() + '/brand/getBrandList',qs.stringify(data)).then(function(res){
+                _this.listArr = _this.listArr.concat(res.data.brandList);
+                if(res.data.list == ''){
+                    this.allLoaded = true;
+                }
+                _this.$refs.loadmore.onBottomLoaded();
+            }.bind(_this)).catch(function(err){
+                console.log("商店列表页面错误：",err);
+            })
+        },
+
+        handleBottomChange(){
+            var _this = this;
+            if(this.allLoaded == true){
+                this.more = true;
+                setTimeout(function () {
+                    _this.more = false;
+                },2000)
+            }
+        },
+    },
+    created() {
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+.searchWrap{
+    width: 7.5rem;
+    height: 13.34rem;
+    overflow: scroll;
+    margin: 0 auto;
+    background: #fff;
+    position: relative;
+    .navSearch{
+        width: 7.5rem;
+        height: .9rem;
+        line-height: .9rem;
+        border-bottom: 0.01rem solid #eaeaea;
+        background: #fff;
+        position: fixed;
+        top: 0px;
+        left: auto;
+        .cancle{
+            width: 1rem;
+            float: left;
+            text-align: center;
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            span{
+                font-size: .26rem;
+                color: #111;
+            }
+        }
+        .sou{
+            width: 6.1rem;
+            float: left;
+            margin-left: .3rem;
+            input[type=search]::-webkit-input-placeholder{
+                line-height: .34rem;
+            }
+            input[type=search]::-webkit-search-cancel-button{
+                -webkit-appearance: none;
+            }
+            b{
+                position: absolute;
+                top: .33rem;
+                right: 1.3rem;
+                width: .26rem;
+                height: .26rem;
+                line-height: .26rem;
+                background: url("../../../static/images/common/close.png") no-repeat;
+                background-size: .26rem .26rem;
+            }
+            input{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                width: 5.8rem;
+                height: 0.6rem;
+                border-radius: 0.1rem;
+                background: #f0f1f3;
+                padding-left: .3rem;
+            }
+        }
+    }
+    .noData{
+        padding-top: 2.8rem;
+        text-align: center;
+        .img{
+            width: 1.6rem;
+            height: 1.6rem;
+            margin: 0 auto;
+            background: url("../../../static/images/common/noData.png") no-repeat;
+            background-size: 1.6rem 1.6rem;
+            margin-bottom: .4rem;
+        }
+        p{
+            font-size: .3rem;
+            color: #898989;
+        }
+    }
+}
+
+/*列表*/
+.brandlist{
+    width: 7.5rem;
+    margin-top: .88rem;
+    background: #fff;
+    z-index: 9;
+    .detail{
+        ul{
+            li{
+                width: 7.2rem;
+                height: 2.1rem;
+                background: #fff;
+                padding-top: .3rem;
+                /*margin: 0 auto;*/
+                margin-left: .3rem;
+                .lisyImg{
+                    width: 2.4rem;
+                    height: 1.8rem;
+                    float: left;
+                    margin-right: .2rem;
+                    img{
+                        width: 2.4rem;
+                        height: 1.8rem;
+                        border-radius: 8px;
+                    }
+                }
+                .listBox{
+                    width: 4.6rem;
+                    height: 2.1rem;
+                    border-bottom: 1px solid #eee;
+                    float: left;
+                    overflow: hidden;
+                    p{
+                        width: 4.3rem;
+                        height: .4rem;
+                        font-size: .28rem;
+                        font-family: PingFangSC-Regular,PingFangSC;
+                        font-weight: 400;
+                        color: #222;
+                        line-height: .4rem;
+                        margin-bottom: .06rem;
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        white-space: nowrap;
+                        span{
+                            color: #999;
+                        }
+                    }
+                    h6{
+                        height: .32rem;
+                        line-height: .32rem;
+                        padding: 0 .1rem;
+                        background: #edf4ff;
+                        display: inline-block;
+                        margin-right: .1rem;
+                        font-size: .22rem;
+                        font-family: PingFangSC-Medium,PingFangSC;
+                        font-weight: 500;
+                        color: #67b0ff;
+                        line-height: .32rem;
+                        margin-top: .08rem;
+                    }
+                }
+            }
+        }
+    }
+    .noMore{
+        width: 7.5rem;
+        line-height: .8rem;
+        font-size: .3rem;
+        text-align: center;
+    }
+}
+/*无数据*/
+/*.noData{
+    padding-top: 1.5rem;
+    width: 7.5rem;
+    height: 90vh;
+    .noOrderTop{
+        height: .9rem;
+        text-align: center;
+        background: #fff;
+        border-bottom: 0.02rem solid #eee;
+        position: relative;
+        h3{
+            width: 75%;
+            line-height: 1rem;
+            font-size: 0.36rem;
+            color: #333;
+            float: left;
+            text-align: center;
+        }
+        i{
+            display: inline-block;
+            width: 13%;
+            height: 1rem;
+            line-height: 1rem;
+            float: left;
+            img{
+                width: 0.4rem;
+                height: 0.4rem;
+            }
+        }
+    }
+    dl{
+        width: 7.5rem;
+        text-align: center;
+        dt{
+            margin-top: 1.4rem;
+            img{
+                width: 3rem;
+                height: 3rem;
+            }
+        }
+        p{
+            font-size: .28rem;
+            color: #898989;
+            margin-top: .38rem;
+            margin-bottom: .5rem;
+        }
+        dd{
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            span{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                display: inline-block;
+                width: 3rem;
+                height: .89rem;
+                background: #47abff;
+                line-height: .89rem;
+                color: #fff;
+                font-size: .34rem;
+                border-radius: 5px;
+            }
+        }
+    }
+}*/
+</style>

src/components/code/developmentTeam.vue

@@ -1,76 +1,76 @@
-<template>
-<div class="developmentTeam">
-    <div class="developmentTeamTop">
-    </div>
-    <div class="code">
-        <canvas id="canvas1"></canvas>
-    </div>
-</div>
-</template>
-
-<script>
-import QRCode from 'qrcode'
-export default {
-    name: "",
-    data() {
-        return {
-          QueryDetail: "http://"+window.location.host + "/login",
-          referrerId: "",
-          referrerIdH5:"",
-          cityId:""
-        }
-    },
-    mounted(){
-        this.referrerIdH5 =  getUrlId("userId");
-        this.cityId =  getUrlId("cityId");
-
-        if(this.referrerIdH5){
-            this.useqrcodeH5();
-        }
-    },
-    methods: {
-        useqrcodeH5(){//生成的二维码内容，可以添加变量
-            this.QueryDetail = this.QueryDetail+"?userId="+this.referrerIdH5+"&cityId="+this.cityId;
-            var canvas = document.getElementById('canvas1')
-            QRCode.toCanvas(canvas, this.QueryDetail, function (error) {
-                if (error) console.error(error)
-                // console.log('success!');
-            })
-        },
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-.developmentTeam{
-    width: 7.5rem;
-    height: 100vh;
-    background: #fff;
-}
-.developmentTeamTop{
-    width: 7.5rem;
-    height: 4.68rem;
-    background: url(../../../static/images/code/teamTop.png) no-repeat;
-    -webkit-background-size: 7.5rem 4.68rem;
-    background-size: 7.5rem 4.68rem;
-    h2{
-        font-size: .34rem;
-        font-family: PingFang SC;
-        font-weight: 500;
-        color: #fff;
-        line-height: 18px;
-        text-align: center;
-        padding-top: .68rem;
-    }
-}
-.code{
-    width: 7.5rem;
-    text-align: center;
-    #canvas1{
-        width: 4rem!important;
-        height: 4rem!important;
-        margin: .74rem auto;
-        border: .02rem solid #333;
-    }
-}
-</style>
+<template>
+<div class="developmentTeam">
+    <div class="developmentTeamTop">
+    </div>
+    <div class="code">
+        <canvas id="canvas1"></canvas>
+    </div>
+</div>
+</template>
+
+<script>
+import QRCode from 'qrcode'
+export default {
+    name: "",
+    data() {
+        return {
+          QueryDetail: "http://"+window.location.host + "/login",
+          referrerId: "",
+          referrerIdH5:"",
+          cityId:""
+        }
+    },
+    mounted(){
+        this.referrerIdH5 =  getUrlId("userId");
+        this.cityId =  getUrlId("cityId");
+
+        if(this.referrerIdH5){
+            this.useqrcodeH5();
+        }
+    },
+    methods: {
+        useqrcodeH5(){//生成的二维码内容，可以添加变量
+            this.QueryDetail = this.QueryDetail+"?userId="+this.referrerIdH5+"&cityId="+this.cityId;
+            var canvas = document.getElementById('canvas1')
+            QRCode.toCanvas(canvas, this.QueryDetail, function (error) {
+                if (error) console.error(error)
+                // console.log('success!');
+            })
+        },
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+.developmentTeam{
+    width: 7.5rem;
+    height: 100vh;
+    background: #fff;
+}
+.developmentTeamTop{
+    width: 7.5rem;
+    height: 4.68rem;
+    background: url(../../../static/images/code/teamTop.png) no-repeat;
+    -webkit-background-size: 7.5rem 4.68rem;
+    background-size: 7.5rem 4.68rem;
+    h2{
+        font-size: .34rem;
+        font-family: PingFang SC;
+        font-weight: 500;
+        color: #fff;
+        line-height: 18px;
+        text-align: center;
+        padding-top: .68rem;
+    }
+}
+.code{
+    width: 7.5rem;
+    text-align: center;
+    #canvas1{
+        width: 4rem!important;
+        height: 4rem!important;
+        margin: .74rem auto;
+        border: .02rem solid #333;
+    }
+}
+</style>

src/components/code/developmentTeamH5.vue

@@ -1,145 +1,145 @@
-<template>
-<div class="developmentTeam">
-    <div class="developmentTeamTop">
-        <h2>发展团队</h2>
-    </div>
-    <div class="code">
-        <canvas id="canvas1"></canvas>
-    </div>
-</div>
-</template>
-
-<script>
-import QRCode from 'qrcode'
-export default {
-    name: "",
-    data() {
-        return {
-          QueryDetail: "http://"+window.location.host + "/login",
-          referrerId: "",
-          userId:"",
-          cityId:""
-        }
-    },
-    mounted(){
-        this.userId =  getUrlId("userId");
-        this.cityId =  getUrlId("cityId");
-
-        if(this.userId){
-            this.useqrcodeH5();
-        }
-
-        this.fenxiangFun();
-    },
-    beforeRouteEnter (to, from, next) {
-        var u = navigator.userAgent;
-        var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-        // XXX: 修复iOS版微信HTML5 History兼容性问题
-        if (isiOS && to.path !== location.pathname) {
-          // 此处不可使用location.replace
-          location.assign(to.fullPath)
-        } else {
-          next()
-        }
-    },
-    methods: {
-        useqrcodeH5(){//生成的二维码内容，可以添加变量
-            this.QueryDetail = this.QueryDetail+"?userId="+this.userId+"&cityId="+this.cityId;
-            var canvas = document.getElementById('canvas1')
-            QRCode.toCanvas(canvas, this.QueryDetail, function (error) {
-                if (error) console.error(error)
-                // console.log('success!');
-            })
-        },
-
-         fenxiangFun(){//分享
-            var loginUrl = window.location.href.replace('/developmentTeamH5', "/login?referrerId="+this.referrerId+"&teamId="+this.teamId+"&cityId="+this.cityId)
-            this.$http({
-              url:this.changeData() + '/member/weChatShare',
-              method: "post",
-              params: {
-                url : window.location.href.split('#')[0]
-              }
-            }).then(function(res){
-              console.log(res)
-              wx.config({
-                //debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
-                appId: res.data.appId, // 必填，公众号的唯一标识
-                timestamp: res.data.timestamp, // 必填，生成签名的时间戳
-                nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
-                signature: res.data.signature,// 必填，签名
-                jsApiList: ["onMenuShareAppMessage","onMenuShareTimeline"] // 必填，需要使用的JS接口列表
-              });
-
-              wx.ready(function(){
-                // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
-                //分享给朋友
-                wx.onMenuShareAppMessage({
-                  title: "我要发展团队", // 分享标题
-                  desc: '中国商办联卖联租平台-CBMLS', // 分享描述
-                  link: loginUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
-                  imgUrl: "https://up-static.oss-cn-beijing.aliyuncs.com/Config/11539667606_.pic.jpg", // 分享图标
-                  type: '', // 分享类型,music、video或link，不填默认为link
-                  dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
-                  success: function () {
-                    // 用户点击了分享后执行的回调函数
-                  }
-                });
-
-                //分享到朋友圈
-                wx.onMenuShareTimeline({
-                  title: "我要发展团队", // 分享标题
-                  link: loginUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
-                  imgUrl: "https://up-static.oss-cn-beijing.aliyuncs.com/Config/11539667606_.pic.jpg", // 分享图标
-                  success: function () {
-                    // 用户点击了分享后执行的回调函数
-                  }
-                });
-              });
-              wx.error(function(res){
-                // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
-              });
-            }.bind(this)).catch(function(err){
-              console.log("商店详情页面错误：",err)
-            });
-          },
-
-
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-.developmentTeam{
-    width: 7.5rem;
-    height: 100vh;
-    background: #fff;
-}
-.developmentTeamTop{
-    width: 7.5rem;
-    height: 4.68rem;
-    background: url(../../../static/images/code/teamTop.png) no-repeat;
-    -webkit-background-size: 7.5rem 4.68rem;
-    background-size: 7.5rem 4.68rem;
-    h2{
-        font-size: .34rem;
-        font-family: PingFang SC;
-        font-weight: 500;
-        color: #fff;
-        line-height: 18px;
-        text-align: center;
-        padding-top: .68rem;
-    }
-}
-.code{
-    width: 7.5rem;
-    text-align: center;
-    #canvas1{
-        width: 4rem!important;
-        height: 4rem!important;
-        margin: .74rem auto;
-        border: .02rem solid #333;
-    }
-}
-</style>
+<template>
+<div class="developmentTeam">
+    <div class="developmentTeamTop">
+        <h2>发展团队</h2>
+    </div>
+    <div class="code">
+        <canvas id="canvas1"></canvas>
+    </div>
+</div>
+</template>
+
+<script>
+import QRCode from 'qrcode'
+export default {
+    name: "",
+    data() {
+        return {
+          QueryDetail: "http://"+window.location.host + "/login",
+          referrerId: "",
+          userId:"",
+          cityId:""
+        }
+    },
+    mounted(){
+        this.userId =  getUrlId("userId");
+        this.cityId =  getUrlId("cityId");
+
+        if(this.userId){
+            this.useqrcodeH5();
+        }
+
+        this.fenxiangFun();
+    },
+    beforeRouteEnter (to, from, next) {
+        var u = navigator.userAgent;
+        var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+        // XXX: 修复iOS版微信HTML5 History兼容性问题
+        if (isiOS && to.path !== location.pathname) {
+          // 此处不可使用location.replace
+          location.assign(to.fullPath)
+        } else {
+          next()
+        }
+    },
+    methods: {
+        useqrcodeH5(){//生成的二维码内容，可以添加变量
+            this.QueryDetail = this.QueryDetail+"?userId="+this.userId+"&cityId="+this.cityId;
+            var canvas = document.getElementById('canvas1')
+            QRCode.toCanvas(canvas, this.QueryDetail, function (error) {
+                if (error) console.error(error)
+                // console.log('success!');
+            })
+        },
+
+         fenxiangFun(){//分享
+            var loginUrl = window.location.href.replace('/developmentTeamH5', "/login?referrerId="+this.referrerId+"&teamId="+this.teamId+"&cityId="+this.cityId)
+            this.$http({
+              url:this.changeData() + '/member/weChatShare',
+              method: "post",
+              params: {
+                url : window.location.href.split('#')[0]
+              }
+            }).then(function(res){
+              console.log(res)
+              wx.config({
+                //debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
+                appId: res.data.appId, // 必填，公众号的唯一标识
+                timestamp: res.data.timestamp, // 必填，生成签名的时间戳
+                nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
+                signature: res.data.signature,// 必填，签名
+                jsApiList: ["onMenuShareAppMessage","onMenuShareTimeline"] // 必填，需要使用的JS接口列表
+              });
+
+              wx.ready(function(){
+                // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
+                //分享给朋友
+                wx.onMenuShareAppMessage({
+                  title: "我要发展团队", // 分享标题
+                  desc: '中国商办联卖联租平台-CBMLS', // 分享描述
+                  link: loginUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
+                  imgUrl: "https://up-static.oss-cn-beijing.aliyuncs.com/Config/11539667606_.pic.jpg", // 分享图标
+                  type: '', // 分享类型,music、video或link，不填默认为link
+                  dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
+                  success: function () {
+                    // 用户点击了分享后执行的回调函数
+                  }
+                });
+
+                //分享到朋友圈
+                wx.onMenuShareTimeline({
+                  title: "我要发展团队", // 分享标题
+                  link: loginUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
+                  imgUrl: "https://up-static.oss-cn-beijing.aliyuncs.com/Config/11539667606_.pic.jpg", // 分享图标
+                  success: function () {
+                    // 用户点击了分享后执行的回调函数
+                  }
+                });
+              });
+              wx.error(function(res){
+                // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
+              });
+            }.bind(this)).catch(function(err){
+              console.log("商店详情页面错误：",err)
+            });
+          },
+
+
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+.developmentTeam{
+    width: 7.5rem;
+    height: 100vh;
+    background: #fff;
+}
+.developmentTeamTop{
+    width: 7.5rem;
+    height: 4.68rem;
+    background: url(../../../static/images/code/teamTop.png) no-repeat;
+    -webkit-background-size: 7.5rem 4.68rem;
+    background-size: 7.5rem 4.68rem;
+    h2{
+        font-size: .34rem;
+        font-family: PingFang SC;
+        font-weight: 500;
+        color: #fff;
+        line-height: 18px;
+        text-align: center;
+        padding-top: .68rem;
+    }
+}
+.code{
+    width: 7.5rem;
+    text-align: center;
+    #canvas1{
+        width: 4rem!important;
+        height: 4rem!important;
+        margin: .74rem auto;
+        border: .02rem solid #333;
+    }
+}
+</style>

src/components/entrust/entrust.vue

@@ -1,34 +1,34 @@
-<template>
-<div class="entrust">
-在线委托
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'entrust',
-    data () {
-        return {
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-
-        
-    },
-    mounted() {       
-
-    }
-}
-</script>
-
-<style scoped lang="scss"  type="text/scss">
-
-</style>
-
-
+<template>
+<div class="entrust">
+在线委托
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'entrust',
+    data () {
+        return {
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+
+        
+    },
+    mounted() {       
+
+    }
+}
+</script>
+
+<style scoped lang="scss"  type="text/scss">
+
+</style>
+
+

src/components/login/login.vue

@@ -1,374 +1,374 @@
-<template>
-<div class="login">
-    <div class="loginTop">
-        <h2>加入优铺CBMLS</h2>
-    </div>
-    <div class="loginMain">
-
-        <dl>
-            <dt>用户名</dt>
-            <dd><input type="text" placeholder="请输入用户姓名" v-model="userName"></dd>
-        </dl>
-        <dl>
-            <dt>手机号</dt>
-            <dd><input type="tel" placeholder="请输入您的手机号码" v-model="phoneVal" maxlength="11"></dd>
-        </dl>
-        <dl>
-            <dt>验证码</dt>
-            <dd><input type="tel" v-model="securityCode" placeholder="请输入验证码" maxlength="6">
-            <button type="button" :disabled="disabled" @click="sendcode" class="btns" :class="{'codeColor':chengaColor}">{{btntxt}}</button></dd>
-        </dl>
-        <h5>
-            已阅读并同意
-            <a href="/userAgreement">《中国商办联卖联租平台用户协议》</a>
-        </h5>
-
-    </div>
-
-    <div class="popupWrap" v-if="showPopup">
-        <div class="popupBox">
-            <h2>加入成功</h2>
-            <p>下载APP与更多经纪人一起共享资</p>
-            <p>源、合作分佣</p>
-            <div @click="popupFun()">我知道了</div>
-        </div>
-    </div>
-
-
-    <div class="loginBtn" @click="loginBtn()">同意协议并加入</div>
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { MessageBox } from 'mint-ui';
-import { Toast } from 'mint-ui';
-const countdown = 60;
-export default {
-    name: 'aboutUP',
-    data () {
-        return {
-            sessionCityId: "110100",  // 全局城市Id
-            sessionProvinceId: "110000", // 全局省Id
-            phoneVal: '', // 手机号码
-            securityCode: '', // 验证码
-            disabled: false,
-            time:0,
-            btntxt:"获取验证码",
-            chengaColor: false,
-            formMess:{
-                email:this.email,
-                phone:this.phone
-            },
-
-            teamId: '',
-            goUrl: "", // 跳转URL
-
-            userName: "", //用户名
-
-            parentId: "", //上级Id
-            cityId: "", //城市Id
-
-            showPopup: false
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        //获取验证码
-        sendcode() {
-            let _this = this
-            if(this.chengaColor == true){
-                // this.time=60;
-                // this.disabled=true;
-                // this.timer();
-                // 接口调用
-                let url =  _this.changeData() + '/sendsms'
-                axios(url,{
-                    method: 'post',
-                    params: {
-                        phoneNumber: _this.phoneVal,
-                        type: 0
-                    }
-                }).then(data => {
-                    // console.log(data);
-                    if(data.data.code == "101"){
-                        this.time=60;
-                        this.disabled=true;
-                        this.timer();
-                    }else if(data.data.code == "102"){
-                        Toast({
-                            message: '已经注册经纪人，不可重复注册',
-                            duration: 3000
-                        });
-                    }else{
-                        Toast({
-                            message: '系统错误，请稍后再试',
-                            duration: 3000
-                        });
-                    }
-                }).catch(err => {
-                    console.log(err)
-                });
-            }
-        },
-        // 倒计时
-        timer() {
-            if (this.time > 0) {
-                this.time--;
-                this.btntxt= "重新获取(" + this.time + ")";
-                setTimeout(this.timer, 1000);
-            } else{
-                this.time=0;
-                this.btntxt="获取验证码";
-                this.disabled=false;
-            }
-        },
-
-        // 点击登录按钮
-        loginBtn() {
-            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
-            let _this = this;
-            if(this.phoneVal==''){
-                Toast({
-                    message: '请输入手机号',
-                    duration: 3000
-                });
-            }else if(!reg.test(this.phoneVal)){
-                Toast({
-                    message: '请输入正确的手机号',
-                    duration: 3000
-                });
-            }else if(this.securityCode == ""){
-                Toast({
-                    message: '请输入验证码',
-                    duration: 3000
-                });
-            }else{
-                let url = this.changeData() + '/invitationRegister'
-                let str = _this.phoneVal;
-                let num = str.replace(/[^0-9]/ig,"");
-                var data = {
-                    account: this.phoneVal,
-                    parentId: this.parentId,
-                    cityId: this.cityId || 110100,
-                    name: this.userName,
-                    validCode: this.securityCode
-                }
-                axios(url,{
-                    method: 'post',
-                    params: data
-                }).then(data => {
-                    // console.log(data);
-                    // console.log(data.data.code);
-                    if(data.data.code == "101"){
-
-                        this.showPopup = true;
-
-                        // Toast({
-                        //     message: '注册成功',
-                        //     duration: 3000
-                        // });
-                                              
-                    }else{
-                        Toast({
-                            message: data.data.message,
-                            duration: 3000
-                        });
-                    }
-                }).catch(err => {
-                    console.log(err)
-                });
-            }
-        },
-
-        popupFun(){
-            this.showPopup = false;
-            window.location.reload();
-        }
-    },
-    created() {
-
-        this.parentId =  getUrlId("userId");
-        this.cityId =  getUrlId("cityId");
-    },
-    watch: {
-        phoneVal(){
-            if(this.phoneVal.length == 11){
-                this.chengaColor = true;
-            }else{
-                this.chengaColor = false;
-            }
-            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
-
-            if(!reg.test(this.phoneVal)){
-                this.chengaColor = false;
-            }else{
-                this.chengaColor = true;
-            }
-        }
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-
-input::-webkit-input-placeholder{
-    color:#999;
-}
-input::-moz-placeholder{
-    color:#999;
-}
-input:-moz-placeholder{
-    color:#999;
-}
-input:-ms-input-placeholder{
-    color:#999;
-}
-
-.loginTop{
-    width: 7.5rem;
-    height: .86rem;
-    background: #fff;
-    border-bottom: .02rem solid #eee;
-    h2{
-        text-align: center;
-        line-height: .86rem;
-        font-size: .34rem;
-        font-family: PingFang SC;
-        font-weight: bold;
-        color: #222;
-    }
-}
-.loginMain{
-    width: 6.9rem;
-    height: 4.8rem;
-    margin: 0 auto;
-    background: #fff;
-    padding: 0 .3rem;
-    dl{
-        width: 6.9rem;
-        height: 1.2rem;
-        border-bottom: .02rem solid #f9f9f9;
-        line-height: 1.2rem;
-        dt{
-            width: 1rem;
-            font-size: .32rem;
-            font-family: PingFang SC;
-            font-weight: bold;
-            color: #222;
-            float: left;  
-        }
-        dd{
-            width: 5rem;
-            float: left;
-            margin-left: .9rem;
-            position: relative;
-            input{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                height: .4rem;
-                font-size: .32rem;
-                font-family: PingFang SC;
-                font-weight: 400;
-                color: #333;
-            }
-            .btns{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                width: 2.1rem;
-                height: .6rem;
-                border: .01rem solid #999;
-                font-size: 0.28rem;
-                color: #999;
-                border-radius:8px;
-                background: rgba(0,0,0,0);
-                position: absolute;
-                right: 0;
-                top: .3rem;
-            }
-        }
-    }
-    h5{
-        font-size: .28rem;
-        font-family: PingFang SC;
-        font-weight: 500;
-        color: #666;
-        line-height: 1.2rem;
-        a{
-            color: #2f7af7;
-        }
-    }
-}
-.codeColor{
-    color: #2f7af7!important;
-    border: .01rem solid #2f7af7!important;
-}
-.loginBtn{
-    width: 6.9rem;
-    height: .98rem;
-    display: block;
-    margin: 0.2rem auto;
-    background: #2f7af7;
-    border-radius: 4px;
-    font-size: 0.34rem;
-    line-height: 0.88rem;
-    color: #fff;
-    border-radius: 8px;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    text-align: center;
-    line-height: .98rem;
-    margin-top: .6rem;
-}
-/* 弹窗 */
-.popupWrap{
-    width: 100%;
-    height: 100%;
-    background: rgba(0,0,0,0.5);
-    position: fixed;
-    left: 0;
-    top: 0;
-    .popupBox{
-        width: 4.6rem;
-        height: 3rem;
-        padding: .6rem .7rem;
-        background: #fff;
-        position: absolute;
-        left: 50%;
-        top: 30%;
-        margin-left: -3rem;
-        border-radius: 4px;
-        h2{
-            font-size: .36rem;
-            color: #2f7af7;
-            margin-bottom: .3rem;
-            text-align: center;
-            font-family:PingFangSC;
-            font-weight:500;
-        }
-        p{
-            font-size: .3rem;
-            color: #222;
-            line-height: .48rem;
-            text-align: justify;
-            font-family:PingFangSC;
-            font-weight:500;
-        }
-        div{
-            width: 2.6rem;
-            height: .76rem;
-            border: 1px solid #2f7af7;
-            border-radius: 38px;
-            font-size: 14px;
-            font-family: PingFangSC;
-            font-weight: 500;
-            text-align: center;
-            color: #2f7af7;
-            line-height: .76rem;
-            margin: .5rem auto 0;
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-        }
-    }
-}
-
+<template>
+<div class="login">
+    <div class="loginTop">
+        <h2>加入优铺CBMLS</h2>
+    </div>
+    <div class="loginMain">
+
+        <dl>
+            <dt>用户名</dt>
+            <dd><input type="text" placeholder="请输入用户姓名" v-model="userName"></dd>
+        </dl>
+        <dl>
+            <dt>手机号</dt>
+            <dd><input type="tel" placeholder="请输入您的手机号码" v-model="phoneVal" maxlength="11"></dd>
+        </dl>
+        <dl>
+            <dt>验证码</dt>
+            <dd><input type="tel" v-model="securityCode" placeholder="请输入验证码" maxlength="6">
+            <button type="button" :disabled="disabled" @click="sendcode" class="btns" :class="{'codeColor':chengaColor}">{{btntxt}}</button></dd>
+        </dl>
+        <h5>
+            已阅读并同意
+            <a href="/userAgreement">《中国商办联卖联租平台用户协议》</a>
+        </h5>
+
+    </div>
+
+    <div class="popupWrap" v-if="showPopup">
+        <div class="popupBox">
+            <h2>加入成功</h2>
+            <p>下载APP与更多经纪人一起共享资</p>
+            <p>源、合作分佣</p>
+            <div @click="popupFun()">我知道了</div>
+        </div>
+    </div>
+
+
+    <div class="loginBtn" @click="loginBtn()">同意协议并加入</div>
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { MessageBox } from 'mint-ui';
+import { Toast } from 'mint-ui';
+const countdown = 60;
+export default {
+    name: 'aboutUP',
+    data () {
+        return {
+            sessionCityId: "110100",  // 全局城市Id
+            sessionProvinceId: "110000", // 全局省Id
+            phoneVal: '', // 手机号码
+            securityCode: '', // 验证码
+            disabled: false,
+            time:0,
+            btntxt:"获取验证码",
+            chengaColor: false,
+            formMess:{
+                email:this.email,
+                phone:this.phone
+            },
+
+            teamId: '',
+            goUrl: "", // 跳转URL
+
+            userName: "", //用户名
+
+            parentId: "", //上级Id
+            cityId: "", //城市Id
+
+            showPopup: false
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        //获取验证码
+        sendcode() {
+            let _this = this
+            if(this.chengaColor == true){
+                // this.time=60;
+                // this.disabled=true;
+                // this.timer();
+                // 接口调用
+                let url =  _this.changeData() + '/sendsms'
+                axios(url,{
+                    method: 'post',
+                    params: {
+                        phoneNumber: _this.phoneVal,
+                        type: 0
+                    }
+                }).then(data => {
+                    // console.log(data);
+                    if(data.data.code == "101"){
+                        this.time=60;
+                        this.disabled=true;
+                        this.timer();
+                    }else if(data.data.code == "102"){
+                        Toast({
+                            message: '已经注册经纪人，不可重复注册',
+                            duration: 3000
+                        });
+                    }else{
+                        Toast({
+                            message: '系统错误，请稍后再试',
+                            duration: 3000
+                        });
+                    }
+                }).catch(err => {
+                    console.log(err)
+                });
+            }
+        },
+        // 倒计时
+        timer() {
+            if (this.time > 0) {
+                this.time--;
+                this.btntxt= "重新获取(" + this.time + ")";
+                setTimeout(this.timer, 1000);
+            } else{
+                this.time=0;
+                this.btntxt="获取验证码";
+                this.disabled=false;
+            }
+        },
+
+        // 点击登录按钮
+        loginBtn() {
+            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
+            let _this = this;
+            if(this.phoneVal==''){
+                Toast({
+                    message: '请输入手机号',
+                    duration: 3000
+                });
+            }else if(!reg.test(this.phoneVal)){
+                Toast({
+                    message: '请输入正确的手机号',
+                    duration: 3000
+                });
+            }else if(this.securityCode == ""){
+                Toast({
+                    message: '请输入验证码',
+                    duration: 3000
+                });
+            }else{
+                let url = this.changeData() + '/invitationRegister'
+                let str = _this.phoneVal;
+                let num = str.replace(/[^0-9]/ig,"");
+                var data = {
+                    account: this.phoneVal,
+                    parentId: this.parentId,
+                    cityId: this.cityId || 110100,
+                    name: this.userName,
+                    validCode: this.securityCode
+                }
+                axios(url,{
+                    method: 'post',
+                    params: data
+                }).then(data => {
+                    // console.log(data);
+                    // console.log(data.data.code);
+                    if(data.data.code == "101"){
+
+                        this.showPopup = true;
+
+                        // Toast({
+                        //     message: '注册成功',
+                        //     duration: 3000
+                        // });
+                                              
+                    }else{
+                        Toast({
+                            message: data.data.message,
+                            duration: 3000
+                        });
+                    }
+                }).catch(err => {
+                    console.log(err)
+                });
+            }
+        },
+
+        popupFun(){
+            this.showPopup = false;
+            window.location.reload();
+        }
+    },
+    created() {
+
+        this.parentId =  getUrlId("userId");
+        this.cityId =  getUrlId("cityId");
+    },
+    watch: {
+        phoneVal(){
+            if(this.phoneVal.length == 11){
+                this.chengaColor = true;
+            }else{
+                this.chengaColor = false;
+            }
+            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
+
+            if(!reg.test(this.phoneVal)){
+                this.chengaColor = false;
+            }else{
+                this.chengaColor = true;
+            }
+        }
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+
+input::-webkit-input-placeholder{
+    color:#999;
+}
+input::-moz-placeholder{
+    color:#999;
+}
+input:-moz-placeholder{
+    color:#999;
+}
+input:-ms-input-placeholder{
+    color:#999;
+}
+
+.loginTop{
+    width: 7.5rem;
+    height: .86rem;
+    background: #fff;
+    border-bottom: .02rem solid #eee;
+    h2{
+        text-align: center;
+        line-height: .86rem;
+        font-size: .34rem;
+        font-family: PingFang SC;
+        font-weight: bold;
+        color: #222;
+    }
+}
+.loginMain{
+    width: 6.9rem;
+    height: 4.8rem;
+    margin: 0 auto;
+    background: #fff;
+    padding: 0 .3rem;
+    dl{
+        width: 6.9rem;
+        height: 1.2rem;
+        border-bottom: .02rem solid #f9f9f9;
+        line-height: 1.2rem;
+        dt{
+            width: 1rem;
+            font-size: .32rem;
+            font-family: PingFang SC;
+            font-weight: bold;
+            color: #222;
+            float: left;  
+        }
+        dd{
+            width: 5rem;
+            float: left;
+            margin-left: .9rem;
+            position: relative;
+            input{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                height: .4rem;
+                font-size: .32rem;
+                font-family: PingFang SC;
+                font-weight: 400;
+                color: #333;
+            }
+            .btns{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                width: 2.1rem;
+                height: .6rem;
+                border: .01rem solid #999;
+                font-size: 0.28rem;
+                color: #999;
+                border-radius:8px;
+                background: rgba(0,0,0,0);
+                position: absolute;
+                right: 0;
+                top: .3rem;
+            }
+        }
+    }
+    h5{
+        font-size: .28rem;
+        font-family: PingFang SC;
+        font-weight: 500;
+        color: #666;
+        line-height: 1.2rem;
+        a{
+            color: #2f7af7;
+        }
+    }
+}
+.codeColor{
+    color: #2f7af7!important;
+    border: .01rem solid #2f7af7!important;
+}
+.loginBtn{
+    width: 6.9rem;
+    height: .98rem;
+    display: block;
+    margin: 0.2rem auto;
+    background: #2f7af7;
+    border-radius: 4px;
+    font-size: 0.34rem;
+    line-height: 0.88rem;
+    color: #fff;
+    border-radius: 8px;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    text-align: center;
+    line-height: .98rem;
+    margin-top: .6rem;
+}
+/* 弹窗 */
+.popupWrap{
+    width: 100%;
+    height: 100%;
+    background: rgba(0,0,0,0.5);
+    position: fixed;
+    left: 0;
+    top: 0;
+    .popupBox{
+        width: 4.6rem;
+        height: 3rem;
+        padding: .6rem .7rem;
+        background: #fff;
+        position: absolute;
+        left: 50%;
+        top: 30%;
+        margin-left: -3rem;
+        border-radius: 4px;
+        h2{
+            font-size: .36rem;
+            color: #2f7af7;
+            margin-bottom: .3rem;
+            text-align: center;
+            font-family:PingFangSC;
+            font-weight:500;
+        }
+        p{
+            font-size: .3rem;
+            color: #222;
+            line-height: .48rem;
+            text-align: justify;
+            font-family:PingFangSC;
+            font-weight:500;
+        }
+        div{
+            width: 2.6rem;
+            height: .76rem;
+            border: 1px solid #2f7af7;
+            border-radius: 38px;
+            font-size: 14px;
+            font-family: PingFangSC;
+            font-weight: 500;
+            text-align: center;
+            color: #2f7af7;
+            line-height: .76rem;
+            margin: .5rem auto 0;
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+        }
+    }
+}
+
 </style>

src/components/login/userLogin.vue

@@ -1,327 +1,327 @@
-<template>
-<div class="userLogin">
-    <div class="loginTop">
-        <i>
-            <img src="../../../static/images/common/back.png" @click="goUrl();">
-        </i>
-        <h2>登录</h2>
-    </div>
-    <div class="loginMain">
-        <h3>欢迎登录</h3>
-        <h3 style="margin-bottom: .2rem;">中国商办联卖联租平台</h3>
-        <dl>
-            <dd><input type="tel" placeholder="请输入您的手机号码" v-model="phoneVal" maxlength="11"><button type="button" :disabled="disabled" @click="sendcode" class="btns" :class="{'codeColor':chengaColor}">{{btntxt}}</button></dd>
-        </dl>
-        <dl>
-            <dd class="dd2"><input type="tel" v-model="securityCode" placeholder="请输入验证码" maxlength="6"></dd>
-        </dl>
-        <h5>
-            已阅读并同意
-            <a href="/userAgreement">《中国商办联卖联租平台用户协议》</a>
-        </h5>
-    </div>
-
-    <div class="loginBtn" @click="loginBtn()">同意协议并加入</div>
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { MessageBox } from 'mint-ui';
-import { Toast } from 'mint-ui';
-const countdown = 60;
-export default {
-    name: 'aboutUP',
-    data () {
-        return {
-            sessionCityId: "110100",  // 全局城市Id
-            sessionProvinceId: "110000", // 全局省Id
-            phoneVal: '', // 手机号码
-            securityCode: '', // 验证码
-            disabled: false,
-            time:0,
-            btntxt:"获取验证码",
-            chengaColor: false,
-            formMess:{
-                email:this.email,
-                phone:this.phone
-            },
-
-            teamId: '',
-
-            userName: "", //用户名
-
-            parentId: "", //上级Id
-            cityId: "", //城市Id
-
-            urlType: "",
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        goUrl(){
-            if(this.urlType == "message"){
-                this.$router.go(-2);
-            }else{
-                this.$router.go(-1);
-            }
-        },
-        //获取验证码
-        sendcode() {
-            let _this = this
-            if(this.chengaColor == true){
-                // 接口调用
-                let url =  _this.changeData() + '/sendsms'
-                axios(url,{
-                    method: 'post',
-                    params: {
-                        phoneNumber: _this.phoneVal,
-                        type: 2
-                    }
-                }).then(data => {
-                    // console.log(data);
-                    if(data.data.code == "101"){
-                        this.time=60;
-                        this.disabled=true;
-                        this.timer();
-                    }else{
-                        Toast({
-                            message: '系统错误，请稍后再试',
-                            duration: 3000
-                        });
-                    }
-                }).catch(err => {
-                    console.log(err)
-                });
-            }
-        },
-        // 倒计时
-        timer() {
-            if (this.time > 0) {
-                this.time--;
-                this.btntxt= "重新获取(" + this.time + ")";
-                setTimeout(this.timer, 1000);
-            } else{
-                this.time=0;
-                this.btntxt="获取验证码";
-                this.disabled=false;
-            }
-        },
-
-        // 点击登录按钮
-        loginBtn() {
-            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
-            let _this = this;
-            if(this.phoneVal==''){
-                Toast({
-                    message: '请输入手机号',
-                    duration: 3000
-                });
-            }else if(!reg.test(this.phoneVal)){
-                Toast({
-                    message: '请输入正确的手机号',
-                    duration: 3000
-                });
-            }else if(this.securityCode == ""){
-                Toast({
-                    message: '请输入验证码',
-                    duration: 3000
-                });
-            }else{
-                let url = this.changeData() + '/loginCode'
-                let str = _this.phoneVal;
-                let num = str.replace(/[^0-9]/ig,"");
-                var data = {
-                    account: this.phoneVal, //手机号码
-                    validCode: this.securityCode, //验证码
-                    cityId: sessionStorage.cityId || 110100, //城市id
-                }
-                axios(url,{
-                    method: 'post',
-                    params: data
-                }).then(data => {
-                    // console.log(data);
-                    if(data.data.code == "101"){
-                        Toast({
-                            message: '登录成功',
-                            duration: 3000
-                        });
-                        window.localStorage.setItem("token",data.data.token);
-                        window.localStorage.setItem("userId",data.data.data.id);    
-                        this.$router.go(-1);              
-                    }else{
-                        Toast({
-                            message: data.data.message,
-                            duration: 3000
-                        });
-                    }
-                }).catch(err => {
-                    console.log(err)
-                });
-            }
-        },
-    },
-    mounted() {
-        this.urlType = getUrlId("urlType");        　　
-    },
-    created() {
-
-    },
-    watch: {
-        phoneVal(){
-            if(this.phoneVal.length == 11){
-                this.chengaColor = true;
-            }else{
-                this.chengaColor = false;
-            }
-            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
-
-            if(!reg.test(this.phoneVal)){
-                this.chengaColor = false;
-            }else{
-                this.chengaColor = true;
-            }
-        }
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-
-input::-webkit-input-placeholder{
-    color:#999;
-}
-input::-moz-placeholder{
-    color:#999;
-}
-input:-moz-placeholder{
-    color:#999;
-}
-input:-ms-input-placeholder{
-    color:#999;
-}
-.userLogin{
-    width: 7.5rem;
-    height: 100vh;
-    background: #fff;
-}
-.loginTop{
-    width: 7.5rem;
-    height: .86rem;
-    background: #fff;
-    border-bottom: .02rem solid #eee;
-    i{
-        float: left;
-        width: .18rem;
-        height: .32rem;
-        margin-left: .48rem;
-        position: relative;
-        top: .26rem;
-        img{
-            width: .18rem;
-            height: .32rem;
-        }
-    }
-    h2{
-        font-size: .34rem;
-        font-family: PingFangSC-Medium,PingFangSC;
-        font-weight: 500;
-        color: #222;
-        line-height: .88rem;
-        width: 6.5rem;
-        float: left;
-        text-align: center;
-    }
-
-}
-.loginMain{
-    width: 6.7rem;
-    height: 4.8rem;
-    margin: 0 auto;
-    background: #fff;
-    padding: .6rem .4rem .3rem .4rem;
-    h3{
-        font-size: .44rem;
-        font-family: PingFang SC;
-        font-weight: 500;
-        color: #222;
-        line-height: .6rem;
-    }
-    dl{
-        width: 6.7rem;
-        height: 1.2rem;
-        border-bottom: .02rem solid #e7e7e7;
-        line-height: 1.2rem;
-        position: relative;
-        dt{
-            width: 1rem;
-            font-size: .32rem;
-            font-family: PingFang SC;
-            font-weight: bold;
-            color: #222;
-            float: left;  
-        }
-        dd{
-            width: 4.8rem;
-            float: left;
-            input{
-                width: 4.8rem;
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                height: .4rem;
-                font-size: .32rem;
-                font-family: PingFang SC;
-                font-weight: 400;
-                color: #333;
-            }
-            .btns{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                font-size: 0.3rem;
-                color: #666;
-                border-radius:8px;
-                background: rgba(0,0,0,0);
-                position: absolute;
-                right: 0;
-                top: .45rem;
-            }
-        }
-        .dd2{
-            width: 6.7rem;
-            input{
-                width: 6.7rem;
-            }
-
-        }
-    }
-    h5{
-        font-size: .28rem;
-        font-family: PingFang SC;
-        font-weight: 500;
-        color: #666;
-        line-height: 1.2rem;
-        a{
-            color: #2f7af7;
-        }
-    }
-}
-.codeColor{
-    color: #2f7af7!important;
-}
-.loginBtn{
-    width: 6.4rem;
-    height: .98rem;
-    display: block;
-    margin: 0 auto;
-    background: #2f7af7;
-    border-radius: 45px;
-    font-size: 0.34rem;
-    line-height: 0.88rem;
-    color: #fff;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    text-align: center;
-    line-height: .98rem;
-}
-
+<template>
+<div class="userLogin">
+    <div class="loginTop">
+        <i>
+            <img src="../../../static/images/common/back.png" @click="goUrl();">
+        </i>
+        <h2>登录</h2>
+    </div>
+    <div class="loginMain">
+        <h3>欢迎登录</h3>
+        <h3 style="margin-bottom: .2rem;">中国商办联卖联租平台</h3>
+        <dl>
+            <dd><input type="tel" placeholder="请输入您的手机号码" v-model="phoneVal" maxlength="11"><button type="button" :disabled="disabled" @click="sendcode" class="btns" :class="{'codeColor':chengaColor}">{{btntxt}}</button></dd>
+        </dl>
+        <dl>
+            <dd class="dd2"><input type="tel" v-model="securityCode" placeholder="请输入验证码" maxlength="6"></dd>
+        </dl>
+        <h5>
+            已阅读并同意
+            <a href="/userAgreement">《中国商办联卖联租平台用户协议》</a>
+        </h5>
+    </div>
+
+    <div class="loginBtn" @click="loginBtn()">同意协议并加入</div>
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { MessageBox } from 'mint-ui';
+import { Toast } from 'mint-ui';
+const countdown = 60;
+export default {
+    name: 'aboutUP',
+    data () {
+        return {
+            sessionCityId: "110100",  // 全局城市Id
+            sessionProvinceId: "110000", // 全局省Id
+            phoneVal: '', // 手机号码
+            securityCode: '', // 验证码
+            disabled: false,
+            time:0,
+            btntxt:"获取验证码",
+            chengaColor: false,
+            formMess:{
+                email:this.email,
+                phone:this.phone
+            },
+
+            teamId: '',
+
+            userName: "", //用户名
+
+            parentId: "", //上级Id
+            cityId: "", //城市Id
+
+            urlType: "",
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        goUrl(){
+            if(this.urlType == "message"){
+                this.$router.go(-2);
+            }else{
+                this.$router.go(-1);
+            }
+        },
+        //获取验证码
+        sendcode() {
+            let _this = this
+            if(this.chengaColor == true){
+                // 接口调用
+                let url =  _this.changeData() + '/sendsms'
+                axios(url,{
+                    method: 'post',
+                    params: {
+                        phoneNumber: _this.phoneVal,
+                        type: 2
+                    }
+                }).then(data => {
+                    // console.log(data);
+                    if(data.data.code == "101"){
+                        this.time=60;
+                        this.disabled=true;
+                        this.timer();
+                    }else{
+                        Toast({
+                            message: '系统错误，请稍后再试',
+                            duration: 3000
+                        });
+                    }
+                }).catch(err => {
+                    console.log(err)
+                });
+            }
+        },
+        // 倒计时
+        timer() {
+            if (this.time > 0) {
+                this.time--;
+                this.btntxt= "重新获取(" + this.time + ")";
+                setTimeout(this.timer, 1000);
+            } else{
+                this.time=0;
+                this.btntxt="获取验证码";
+                this.disabled=false;
+            }
+        },
+
+        // 点击登录按钮
+        loginBtn() {
+            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
+            let _this = this;
+            if(this.phoneVal==''){
+                Toast({
+                    message: '请输入手机号',
+                    duration: 3000
+                });
+            }else if(!reg.test(this.phoneVal)){
+                Toast({
+                    message: '请输入正确的手机号',
+                    duration: 3000
+                });
+            }else if(this.securityCode == ""){
+                Toast({
+                    message: '请输入验证码',
+                    duration: 3000
+                });
+            }else{
+                let url = this.changeData() + '/loginCode'
+                let str = _this.phoneVal;
+                let num = str.replace(/[^0-9]/ig,"");
+                var data = {
+                    account: this.phoneVal, //手机号码
+                    validCode: this.securityCode, //验证码
+                    cityId: sessionStorage.cityId || 110100, //城市id
+                }
+                axios(url,{
+                    method: 'post',
+                    params: data
+                }).then(data => {
+                    // console.log(data);
+                    if(data.data.code == "101"){
+                        Toast({
+                            message: '登录成功',
+                            duration: 3000
+                        });
+                        window.localStorage.setItem("token",data.data.token);
+                        window.localStorage.setItem("userId",data.data.data.id);    
+                        this.$router.go(-1);              
+                    }else{
+                        Toast({
+                            message: data.data.message,
+                            duration: 3000
+                        });
+                    }
+                }).catch(err => {
+                    console.log(err)
+                });
+            }
+        },
+    },
+    mounted() {
+        this.urlType = getUrlId("urlType");        　　
+    },
+    created() {
+
+    },
+    watch: {
+        phoneVal(){
+            if(this.phoneVal.length == 11){
+                this.chengaColor = true;
+            }else{
+                this.chengaColor = false;
+            }
+            let reg = /^[1][3,4,5,7,8][0-9]{9}$/;
+
+            if(!reg.test(this.phoneVal)){
+                this.chengaColor = false;
+            }else{
+                this.chengaColor = true;
+            }
+        }
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+
+input::-webkit-input-placeholder{
+    color:#999;
+}
+input::-moz-placeholder{
+    color:#999;
+}
+input:-moz-placeholder{
+    color:#999;
+}
+input:-ms-input-placeholder{
+    color:#999;
+}
+.userLogin{
+    width: 7.5rem;
+    height: 100vh;
+    background: #fff;
+}
+.loginTop{
+    width: 7.5rem;
+    height: .86rem;
+    background: #fff;
+    border-bottom: .02rem solid #eee;
+    i{
+        float: left;
+        width: .18rem;
+        height: .32rem;
+        margin-left: .48rem;
+        position: relative;
+        top: .26rem;
+        img{
+            width: .18rem;
+            height: .32rem;
+        }
+    }
+    h2{
+        font-size: .34rem;
+        font-family: PingFangSC-Medium,PingFangSC;
+        font-weight: 500;
+        color: #222;
+        line-height: .88rem;
+        width: 6.5rem;
+        float: left;
+        text-align: center;
+    }
+
+}
+.loginMain{
+    width: 6.7rem;
+    height: 4.8rem;
+    margin: 0 auto;
+    background: #fff;
+    padding: .6rem .4rem .3rem .4rem;
+    h3{
+        font-size: .44rem;
+        font-family: PingFang SC;
+        font-weight: 500;
+        color: #222;
+        line-height: .6rem;
+    }
+    dl{
+        width: 6.7rem;
+        height: 1.2rem;
+        border-bottom: .02rem solid #e7e7e7;
+        line-height: 1.2rem;
+        position: relative;
+        dt{
+            width: 1rem;
+            font-size: .32rem;
+            font-family: PingFang SC;
+            font-weight: bold;
+            color: #222;
+            float: left;  
+        }
+        dd{
+            width: 4.8rem;
+            float: left;
+            input{
+                width: 4.8rem;
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                height: .4rem;
+                font-size: .32rem;
+                font-family: PingFang SC;
+                font-weight: 400;
+                color: #333;
+            }
+            .btns{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                font-size: 0.3rem;
+                color: #666;
+                border-radius:8px;
+                background: rgba(0,0,0,0);
+                position: absolute;
+                right: 0;
+                top: .45rem;
+            }
+        }
+        .dd2{
+            width: 6.7rem;
+            input{
+                width: 6.7rem;
+            }
+
+        }
+    }
+    h5{
+        font-size: .28rem;
+        font-family: PingFang SC;
+        font-weight: 500;
+        color: #666;
+        line-height: 1.2rem;
+        a{
+            color: #2f7af7;
+        }
+    }
+}
+.codeColor{
+    color: #2f7af7!important;
+}
+.loginBtn{
+    width: 6.4rem;
+    height: .98rem;
+    display: block;
+    margin: 0 auto;
+    background: #2f7af7;
+    border-radius: 45px;
+    font-size: 0.34rem;
+    line-height: 0.88rem;
+    color: #fff;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    text-align: center;
+    line-height: .98rem;
+}
+
 </style>

src/components/message/message.vue

@@ -1,117 +1,117 @@
-<template>
- <div class="message">
-    <div class="nav">我的消息</div>
-    <div class="noData">
-        <dl>
-            <dt>
-                <img src="../../../static/images/common/noData.png">
-            </dt>
-            <p>暂无消息</p>
-        </dl>
-    </div>
-</div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'message',
-    data () {
-        return {
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-
-    },
-    mounted() {
-
-    }
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-.message{
-    width: 7.5rem;
-    height: 100vh;
-    background: #fff;
-}
-.nav{
-    width: 7.5rem;
-    height: 0.88rem;
-    background: white;
-    position: relative;
-    text-align: center;
-    font-size: .34rem;
-    font-weight:bold;
-    line-height: 0.88rem;
-    color: #363636;
-    border-bottom: .01rem solid #e5e5e5;
-}
-/*无数据*/
-.noData{
-    padding-top: 1rem;
-    width: 7.5rem;
-    height: 90vh;
-    .noOrderTop{
-        height: .9rem;
-        text-align: center;
-        background: #fff;
-        border-bottom: 0.02rem solid #eee;
-        position: relative;
-        h3{
-            width: 75%;
-            line-height: 1rem;
-            font-size: 0.36rem;
-            color: #333;
-            float: left;
-            text-align: center;
-        }
-        i{
-            display: inline-block;
-            width: 13%;
-            height: 1rem;
-            line-height: 1rem;
-            float: left;
-            img{
-                width: 0.4rem;
-                height: 0.4rem;
-            }
-        }
-    }
-    dl{
-        width: 7.5rem;
-        text-align: center;
-        dt{
-            margin-top: 1.4rem;
-            img{
-                width: 3rem;
-                height: 3rem;
-            }
-        }
-        p{
-            font-size: .28rem;
-            color: #898989;
-            margin-top: .38rem;
-            margin-bottom: .5rem;
-        }
-        dd{
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            span{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                display: inline-block;
-                width: 3rem;
-                height: .89rem;
-                background: #47abff;
-                line-height: .89rem;
-                color: #fff;
-                font-size: .34rem;
-                border-radius: 5px;
-            }
-        }
-    }
-}
-</style>
-
+<template>
+ <div class="message">
+    <div class="nav">我的消息</div>
+    <div class="noData">
+        <dl>
+            <dt>
+                <img src="../../../static/images/common/noData.png">
+            </dt>
+            <p>暂无消息</p>
+        </dl>
+    </div>
+</div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'message',
+    data () {
+        return {
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+
+    },
+    mounted() {
+
+    }
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+.message{
+    width: 7.5rem;
+    height: 100vh;
+    background: #fff;
+}
+.nav{
+    width: 7.5rem;
+    height: 0.88rem;
+    background: white;
+    position: relative;
+    text-align: center;
+    font-size: .34rem;
+    font-weight:bold;
+    line-height: 0.88rem;
+    color: #363636;
+    border-bottom: .01rem solid #e5e5e5;
+}
+/*无数据*/
+.noData{
+    padding-top: 1rem;
+    width: 7.5rem;
+    height: 90vh;
+    .noOrderTop{
+        height: .9rem;
+        text-align: center;
+        background: #fff;
+        border-bottom: 0.02rem solid #eee;
+        position: relative;
+        h3{
+            width: 75%;
+            line-height: 1rem;
+            font-size: 0.36rem;
+            color: #333;
+            float: left;
+            text-align: center;
+        }
+        i{
+            display: inline-block;
+            width: 13%;
+            height: 1rem;
+            line-height: 1rem;
+            float: left;
+            img{
+                width: 0.4rem;
+                height: 0.4rem;
+            }
+        }
+    }
+    dl{
+        width: 7.5rem;
+        text-align: center;
+        dt{
+            margin-top: 1.4rem;
+            img{
+                width: 3rem;
+                height: 3rem;
+            }
+        }
+        p{
+            font-size: .28rem;
+            color: #898989;
+            margin-top: .38rem;
+            margin-bottom: .5rem;
+        }
+        dd{
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            span{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                display: inline-block;
+                width: 3rem;
+                height: .89rem;
+                background: #47abff;
+                line-height: .89rem;
+                color: #fff;
+                font-size: .34rem;
+                border-radius: 5px;
+            }
+        }
+    }
+}
+</style>
+

src/components/mine/consultation.vue

@@ -1,105 +1,105 @@
-<template>
-    <div class="set">
-        <div class="commonNav">
-            <i>
-                <img src="../../../static/images/common/back.png" @click="goMine();">
-            </i>
-            <h2>问题咨询</h2>
-        </div>
-        <dl>
-            <dt>
-                <img src="../../../static/images/mine/consultationBg.png">
-            </dt>
-            <dd>400-888-993999</dd>
-            <p>有问题可拨打</p>
-        </dl>
-    </div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'userAgreement',
-    data () {
-        return {
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        goMine(){
-            this.$router.push({path:"/mine"});
-        }
-
-        
-    },
-    mounted() {
-
-    }
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-.set{
-    width: 7.5rem;
-    height: 100vh;
-    background: #fff;
-}
-.commonNav{
-    width: 7.5rem;
-    height: .88rem;
-    background: #f6f6f6;
-    i{
-        float: left;
-        width: .18rem;
-        height: .32rem;
-        margin-left: .48rem;
-        position: relative;
-        top: .26rem;
-        img{
-            width: .18rem;
-            height: .32rem;
-        }
-    }
-    h2{
-        font-size: .34rem;
-        font-family: PingFangSC-Medium,PingFangSC;
-        font-weight: 500;
-        color: #222;
-        line-height: .88rem;
-        width: 6.5rem;
-        float: left;
-        text-align: center;
-    }
-}
-dl{
-    text-align: center;
-    dt{
-        width: 1.5rem;
-        height: 1.5rem;
-        margin: 2.4rem auto 0;
-        img{
-            width: 1.5rem;
-            height: 1.5rem;
-        }
-    }
-    dd{
-        font-size: .4rem;
-        font-family: PingFangSC-Medium,PingFangSC;
-        font-weight: 500;
-        color: #222;
-        line-height: .56rem;
-        margin: .24rem 0 .16rem;
-    }
-    p{
-        font-size: .3rem;
-        font-family: PingFangSC-Regular,PingFangSC;
-        font-weight: 400;
-        color: #999;
-        line-height: .42rem;
-    }
-}
-</style>
-
-
+<template>
+    <div class="set">
+        <div class="commonNav">
+            <i>
+                <img src="../../../static/images/common/back.png" @click="goMine();">
+            </i>
+            <h2>问题咨询</h2>
+        </div>
+        <dl>
+            <dt>
+                <img src="../../../static/images/mine/consultationBg.png">
+            </dt>
+            <dd>400-888-993999</dd>
+            <p>有问题可拨打</p>
+        </dl>
+    </div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'userAgreement',
+    data () {
+        return {
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        goMine(){
+            this.$router.push({path:"/mine"});
+        }
+
+        
+    },
+    mounted() {
+
+    }
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+.set{
+    width: 7.5rem;
+    height: 100vh;
+    background: #fff;
+}
+.commonNav{
+    width: 7.5rem;
+    height: .88rem;
+    background: #f6f6f6;
+    i{
+        float: left;
+        width: .18rem;
+        height: .32rem;
+        margin-left: .48rem;
+        position: relative;
+        top: .26rem;
+        img{
+            width: .18rem;
+            height: .32rem;
+        }
+    }
+    h2{
+        font-size: .34rem;
+        font-family: PingFangSC-Medium,PingFangSC;
+        font-weight: 500;
+        color: #222;
+        line-height: .88rem;
+        width: 6.5rem;
+        float: left;
+        text-align: center;
+    }
+}
+dl{
+    text-align: center;
+    dt{
+        width: 1.5rem;
+        height: 1.5rem;
+        margin: 2.4rem auto 0;
+        img{
+            width: 1.5rem;
+            height: 1.5rem;
+        }
+    }
+    dd{
+        font-size: .4rem;
+        font-family: PingFangSC-Medium,PingFangSC;
+        font-weight: 500;
+        color: #222;
+        line-height: .56rem;
+        margin: .24rem 0 .16rem;
+    }
+    p{
+        font-size: .3rem;
+        font-family: PingFangSC-Regular,PingFangSC;
+        font-weight: 400;
+        color: #999;
+        line-height: .42rem;
+    }
+}
+</style>
+
+

src/components/mine/mine.vue

@@ -1,168 +1,168 @@
-<template>
-    <div class="mine">
-        <div class="mineTop">
-            <dl>
-                <dt>
-                    <h2 @click="goLogin();" v-if="isLogin == undefined">登录/注册</h2>
-                    <h2 v-else>{{userTel}}</h2>
-                    <h4>中国商办联卖联租平台</h4>
-                </dt>
-                <dd>
-                    <img src="../../../static/images/mine/headImg.png">
-                </dd>
-            </dl>
-        </div>
-        <div class="mineList">
-            <dl @click="goAboutUp();">
-                <dt><img src="../../../static/images/mine/img4.png"></dt>
-                <dd>关于优铺</dd>
-                <i><img src="../../../static/images/mine/more.png"></i>
-            </dl>
-            <dl @click="goConsultation();">
-                <dt><img src="../../../static/images/mine/img5.png"></dt>
-                <dd>问题咨询</dd>
-                <i><img src="../../../static/images/mine/more.png"></i>
-            </dl>
-            <dl @click="goSet();">
-                <dt><img src="../../../static/images/mine/img6.png"></dt>
-                <dd>系统设置</dd>
-                <i><img src="../../../static/images/mine/more.png"></i>
-            </dl>
-        </div>
-
-    </div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'userAgreement',
-    data () {
-        return {
-            isLogin: "",
-            userTel: "",
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        goAboutUp(){
-            this.$router.push({path:"/aboutUp"});
-        },
-        goConsultation(){
-            this.$router.push({path:"/consultation"});
-        },
-        goSet(){
-            this.$router.push({path:"/set"});
-        },
-        goLogin(){
-            this.$router.push({path:"/userLogin"});
-        },
-
-        // 获取用户信息
-        userInfo(){
-            let url = this.changeData() + '/myCreate/auth/getUserInfo'
-            axios(url,{
-                method: 'post',
-            }).then(data => {
-                this.userTel = data.data.data.account;
-            }).catch(err => {
-                console.log(err)
-            });
-        },        
-    },
-    mounted() {
-        // 是否登录
-        this.isLogin = localStorage.token;
-        if(this.isLogin){
-            // 获取用户信息
-            this.userInfo();
-        }
-    }
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-.mine{
-    width: 7.5rem;
-    height: 100vh;
-    background: #fff;
-}
-.mineTop{
-    width: 7.5rem;
-    height: 3.2rem;
-    background: url('../../../static/images/mine/mineBg.png');
-    background-size: 7.5rem 3.2rem;
-    dl{
-        padding: 1rem .58rem 0 .5rem;
-        dt{
-            float: left;
-            h2{
-                font-size: .52rem;
-                font-family: PingFangSC-Medium,PingFangSC;
-                font-weight: 500;
-                color: #fff;
-                line-height: .74rem;
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-            }
-            h4{
-                font-size: .28rem;
-                font-family: PingFangSC-Regular,PingFangSC;
-                font-weight: 400;
-                color: #fff;
-                line-height: .4rem;
-                margin-top: .06rem;
-            }
-        }
-        dd{
-            float: right;
-            img{
-                width: 1.14rem;
-                height: 1.14rem;
-            }
-
-        }
-    }
-}
-.mineList{
-    width: 7.5rem;
-    dl{
-        width: 7rem;
-        margin-left: .5rem;
-        height: .4rem;
-        padding: .44rem 0 .36rem;
-        border-bottom: 1px solid #eee;
-        -webkit-tap-highlight-color: rgba(0,0,0,0);
-        dt{
-            width: .4rem;
-            height: .4rem;
-            float: left;
-            margin-right: .28rem;
-            img{
-                width: .4rem;
-                height: .4rem;
-            }
-        }
-        dd{
-            float: left;
-            font-size: .3rem;
-            font-family: PingFangSC-Regular,PingFangSC;
-            font-weight: 400;
-            color: #222;
-            line-height: .42rem;
-        }
-        i{
-            width: .14rem;
-            height: .24rem;
-            float: right;
-            margin-right: .5rem;
-            img{
-                width: .14rem;
-                height: .24rem;
-            }
-        }
-    }
-}
-</style>
-
-
+<template>
+    <div class="mine">
+        <div class="mineTop">
+            <dl>
+                <dt>
+                    <h2 @click="goLogin();" v-if="isLogin == undefined">登录/注册</h2>
+                    <h2 v-else>{{userTel}}</h2>
+                    <h4>中国商办联卖联租平台</h4>
+                </dt>
+                <dd>
+                    <img src="../../../static/images/mine/headImg.png">
+                </dd>
+            </dl>
+        </div>
+        <div class="mineList">
+            <dl @click="goAboutUp();">
+                <dt><img src="../../../static/images/mine/img4.png"></dt>
+                <dd>关于优铺</dd>
+                <i><img src="../../../static/images/mine/more.png"></i>
+            </dl>
+            <dl @click="goConsultation();">
+                <dt><img src="../../../static/images/mine/img5.png"></dt>
+                <dd>问题咨询</dd>
+                <i><img src="../../../static/images/mine/more.png"></i>
+            </dl>
+            <dl @click="goSet();">
+                <dt><img src="../../../static/images/mine/img6.png"></dt>
+                <dd>系统设置</dd>
+                <i><img src="../../../static/images/mine/more.png"></i>
+            </dl>
+        </div>
+
+    </div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'userAgreement',
+    data () {
+        return {
+            isLogin: "",
+            userTel: "",
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        goAboutUp(){
+            this.$router.push({path:"/aboutUp"});
+        },
+        goConsultation(){
+            this.$router.push({path:"/consultation"});
+        },
+        goSet(){
+            this.$router.push({path:"/set"});
+        },
+        goLogin(){
+            this.$router.push({path:"/userLogin"});
+        },
+
+        // 获取用户信息
+        userInfo(){
+            let url = this.changeData() + '/myCreate/auth/getUserInfo'
+            axios(url,{
+                method: 'post',
+            }).then(data => {
+                this.userTel = data.data.data.account;
+            }).catch(err => {
+                console.log(err)
+            });
+        },        
+    },
+    mounted() {
+        // 是否登录
+        this.isLogin = localStorage.token;
+        if(this.isLogin){
+            // 获取用户信息
+            this.userInfo();
+        }
+    }
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+.mine{
+    width: 7.5rem;
+    height: 100vh;
+    background: #fff;
+}
+.mineTop{
+    width: 7.5rem;
+    height: 3.2rem;
+    background: url('../../../static/images/mine/mineBg.png');
+    background-size: 7.5rem 3.2rem;
+    dl{
+        padding: 1rem .58rem 0 .5rem;
+        dt{
+            float: left;
+            h2{
+                font-size: .52rem;
+                font-family: PingFangSC-Medium,PingFangSC;
+                font-weight: 500;
+                color: #fff;
+                line-height: .74rem;
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+            }
+            h4{
+                font-size: .28rem;
+                font-family: PingFangSC-Regular,PingFangSC;
+                font-weight: 400;
+                color: #fff;
+                line-height: .4rem;
+                margin-top: .06rem;
+            }
+        }
+        dd{
+            float: right;
+            img{
+                width: 1.14rem;
+                height: 1.14rem;
+            }
+
+        }
+    }
+}
+.mineList{
+    width: 7.5rem;
+    dl{
+        width: 7rem;
+        margin-left: .5rem;
+        height: .4rem;
+        padding: .44rem 0 .36rem;
+        border-bottom: 1px solid #eee;
+        -webkit-tap-highlight-color: rgba(0,0,0,0);
+        dt{
+            width: .4rem;
+            height: .4rem;
+            float: left;
+            margin-right: .28rem;
+            img{
+                width: .4rem;
+                height: .4rem;
+            }
+        }
+        dd{
+            float: left;
+            font-size: .3rem;
+            font-family: PingFangSC-Regular,PingFangSC;
+            font-weight: 400;
+            color: #222;
+            line-height: .42rem;
+        }
+        i{
+            width: .14rem;
+            height: .24rem;
+            float: right;
+            margin-right: .5rem;
+            img{
+                width: .14rem;
+                height: .24rem;
+            }
+        }
+    }
+}
+</style>
+
+

src/components/mine/set.vue

@@ -1,151 +1,151 @@
-<template>
-    <div class="consultation">
-        <div class="commonNav">
-            <i>
-                <img src="../../../static/images/common/back.png" @click="goMine();">
-            </i>
-            <h2>系统设置</h2>
-        </div>
-        <div class="consultationList">
-            <dl>
-                <dt>当前版本</dt>
-                <dd>1.2.0</dd>
-            </dl>
-        </div>
-        <div class="logout" v-if="isLogin != undefined" @click="quitBtn()">退出登录</div>
-    </div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Toast } from 'mint-ui';
-export default {
-    name: 'userAgreement',
-    data () {
-        return {
-            isLogin: "",
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        goMine(){
-            this.$router.push({path:"/mine"});
-        },
-        // 获取用户信息
-        userInfo(){
-            let url = this.changeData() + '/myCreate/auth/getUserInfo'
-            axios(url,{
-                method: 'post',
-            }).then(data => {
-                
-                this.userTel = data.data.data.account;
-                // console.log(this.userTel);
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-        // 退出登录
-        quitBtn(){
-            localStorage.clear(); 
-            Toast({
-                message: "退出成功",
-                duration: 3000
-            });
-            this.$router.push({path:"/mine"});
-        },
-    },
-    mounted() {
-        // 是否登录
-        this.isLogin = localStorage.token;
-        console.log(this.isLogin);
-        if(this.isLogin){
-            // 获取用户信息
-            this.userInfo();
-        }
-
-    }
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-.consultation{
-    width: 7.5rem;
-    height: 100vh;
-    background: #fff;
-}
-.commonNav{
-    width: 7.5rem;
-    height: .88rem;
-    background: #f6f6f6;
-    i{
-        float: left;
-        width: .18rem;
-        height: .32rem;
-        margin-left: .48rem;
-        position: relative;
-        top: .26rem;
-        img{
-            width: .18rem;
-            height: .32rem;
-        }
-    }
-    h2{
-        font-size: .34rem;
-        font-family: PingFangSC-Medium,PingFangSC;
-        font-weight: 500;
-        color: #222;
-        line-height: .88rem;
-        width: 6.5rem;
-        float: left;
-        text-align: center;
-    }
-}
-.consultationList{
-    width: 7.5rem;
-    dl{
-        width: 7rem;
-        margin-left: .5rem;
-        height: .4rem;
-        padding: .44rem 0 .36rem;
-        border-bottom: 1px solid #eee;
-        -webkit-tap-highlight-color: rgba(0,0,0,0);
-        dt{
-            float: left;
-            font-size: .3rem;
-            font-family: PingFangSC-Regular,PingFangSC;
-            font-weight: 400;
-            color: #222;
-            line-height: .42rem;
-        }
-        dd{
-            float: right;
-            font-size: .28rem;
-            font-family: PingFangSC-Regular,PingFangSC;
-            font-weight: 400;
-            color: #999;
-            line-height: .42rem;
-            margin-right: .5rem
-        }
-    }
-}
-.logout{
-    width: 6.9rem;
-    height: .98rem;
-    border-radius: 4px;
-    border: 1px solid #888;
-    position: fixed;
-    left: .3rem;
-    bottom: .4rem;
-    font-size: .32rem;
-    font-family: PingFangSC-Regular,PingFangSC;
-    font-weight: 400;
-    color: #999;
-    line-height: .98rem;
-    text-align: center;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-}
-</style>
-
-
+<template>
+    <div class="consultation">
+        <div class="commonNav">
+            <i>
+                <img src="../../../static/images/common/back.png" @click="goMine();">
+            </i>
+            <h2>系统设置</h2>
+        </div>
+        <div class="consultationList">
+            <dl>
+                <dt>当前版本</dt>
+                <dd>1.2.0</dd>
+            </dl>
+        </div>
+        <div class="logout" v-if="isLogin != undefined" @click="quitBtn()">退出登录</div>
+    </div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Toast } from 'mint-ui';
+export default {
+    name: 'userAgreement',
+    data () {
+        return {
+            isLogin: "",
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        goMine(){
+            this.$router.push({path:"/mine"});
+        },
+        // 获取用户信息
+        userInfo(){
+            let url = this.changeData() + '/myCreate/auth/getUserInfo'
+            axios(url,{
+                method: 'post',
+            }).then(data => {
+                
+                this.userTel = data.data.data.account;
+                // console.log(this.userTel);
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+        // 退出登录
+        quitBtn(){
+            localStorage.clear(); 
+            Toast({
+                message: "退出成功",
+                duration: 3000
+            });
+            this.$router.push({path:"/mine"});
+        },
+    },
+    mounted() {
+        // 是否登录
+        this.isLogin = localStorage.token;
+        console.log(this.isLogin);
+        if(this.isLogin){
+            // 获取用户信息
+            this.userInfo();
+        }
+
+    }
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+.consultation{
+    width: 7.5rem;
+    height: 100vh;
+    background: #fff;
+}
+.commonNav{
+    width: 7.5rem;
+    height: .88rem;
+    background: #f6f6f6;
+    i{
+        float: left;
+        width: .18rem;
+        height: .32rem;
+        margin-left: .48rem;
+        position: relative;
+        top: .26rem;
+        img{
+            width: .18rem;
+            height: .32rem;
+        }
+    }
+    h2{
+        font-size: .34rem;
+        font-family: PingFangSC-Medium,PingFangSC;
+        font-weight: 500;
+        color: #222;
+        line-height: .88rem;
+        width: 6.5rem;
+        float: left;
+        text-align: center;
+    }
+}
+.consultationList{
+    width: 7.5rem;
+    dl{
+        width: 7rem;
+        margin-left: .5rem;
+        height: .4rem;
+        padding: .44rem 0 .36rem;
+        border-bottom: 1px solid #eee;
+        -webkit-tap-highlight-color: rgba(0,0,0,0);
+        dt{
+            float: left;
+            font-size: .3rem;
+            font-family: PingFangSC-Regular,PingFangSC;
+            font-weight: 400;
+            color: #222;
+            line-height: .42rem;
+        }
+        dd{
+            float: right;
+            font-size: .28rem;
+            font-family: PingFangSC-Regular,PingFangSC;
+            font-weight: 400;
+            color: #999;
+            line-height: .42rem;
+            margin-right: .5rem
+        }
+    }
+}
+.logout{
+    width: 6.9rem;
+    height: .98rem;
+    border-radius: 4px;
+    border: 1px solid #888;
+    position: fixed;
+    left: .3rem;
+    bottom: .4rem;
+    font-size: .32rem;
+    font-family: PingFangSC-Regular,PingFangSC;
+    font-weight: 400;
+    color: #999;
+    line-height: .98rem;
+    text-align: center;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+</style>
+
+

src/components/navBar.vue

@@ -1,227 +1,227 @@
-<template>
-<div class="navBar">
-    <div class="nav-class">
-        <dl class="dl1">
-            <router-link to='/home' active-class="active1">
-                <dt>
-                    <i class='icon1'></i>
-                </dt>
-                <dd>首页</dd>
-            </router-link>
-        </dl>
-        <dl class="dl2" @click="showPopup=true;">
-            <dt>
-                <i class='icon2'></i>
-            </dt>
-            <dd>工作管理</dd>
-        </dl>
-        <dl class="dl3" @click="isMessage();">
-            <!-- <span> -->
-                <router-link to='/message' active-class="active3">
-                    <dt>
-                        <i class='icon3'></i>
-                    </dt>
-                    <dd>消息</dd>
-                </router-link>
-            <!-- </span> -->
-        </dl>
-        <dl class="dl4">
-            <router-link to='/mine' active-class="active4">
-                <dt>
-                    <i class='icon4'></i>
-                </dt>
-                <dd>我的</dd>
-            </router-link>
-        </dl>
-    </div>
-    <div class="popupWrap" v-if="showPopup">
-        <div class="popupBox">
-            <p>该功能只限优铺APP使用</p>
-            <ul>
-                <li class="li1" @click="showPopup=false">取消</li>
-                <li><a href="https://a.app.qq.com/o/simple.jsp?pkgname=com.up.upcbmls">去下载</a></li>
-            </ul>
-        </div>
-    </div>
-    <router-view></router-view>
-</div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'navBar',
-    data () {
-        return {
-           showPopup: false,
-        }
-    },
-    components:{
-
-    },
-    watch: {
-        
-    },
-    methods:{
-        isMessage(){
-            if(localStorage.token){
-                this.$router.push({path:"/message"});             
-            }else{
-                this.$router.push({path:"/userlogin",query:{"urlType":"message"}});  
-            }    
-        },
-        // downloadApp(){
-        //     this.showPopup = true;
-        // }
-    },
-    mounted() {
-        　
-    },
-    created(){   
-            
-    }
-}
-</script>
-
-<style lang="scss" scoped>
-.nav{
-    width: 100%;
-}
-.nav-class{
-    width: 7.5rem;
-    height: 1.2rem;
-    background-color: #fff;
-    position: fixed;
-    bottom: 0px;
-    color: #898989;
-    font-size: 0.2rem;
-    box-shadow:2px 0px 12px rgba(132,166,195,0.14);
-    z-index: 100;
-    dl{
-        width: 25%;
-        height: 1rem;
-        padding-top: .16rem;
-        float: left;
-        text-align: center;
-        a{
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            display: inline-block;
-            width: 100%;
-            height: 100%;
-            color: #999;
-        }
-        dt{
-            text-align: center;
-            i{
-                display: inline-block;
-                height: .38rem;
-                width: .42rem;
-                margin: 0 auto;
-            }
-        }
-        dd{
-            font-size: .2rem;
-            line-height: .2rem;
-            font-weight: 500;
-        }
-    }
-}
-
-.icon1{
-    background: url(../../static/images/common/icon1.png) no-repeat;
-    background-size: .4rem .36rem;
-}
-.icon2{
-    background: url(../../static/images/common/icon3.png) no-repeat;
-    background-size: .38rem .38rem;
-}
-.icon3{
-    background: url(../../static/images/common/icon5.png) no-repeat;
-    background-size: .42rem .36rem;
-}
-.icon4{
-    background: url(../../static/images/common/icon7.png) no-repeat;
-    background-size: .38rem .38rem;
-}
-
-.active1 dd{color: #2f7af7;}
-.active1 .icon1{
-    background: url(../../static/images/common/icon2.png)no-repeat;
-    background-size: .4rem .36rem;
-}
-.active2 dd{color: #2f7af7;}
-.active2 .icon2{
-    background: url(../../static/images/common/icon4.png)no-repeat;
-    background-size: .38rem .38rem;
-}
-.active3 dd{color: #2f7af7;}
-.active3 .icon3{
-    background: url(../../static/images/common/icon6.png)no-repeat;
-    background-size: .42rem .36rem;
-}
-.active4 dd{color: #2f7af7;}
-.active4 .icon4{
-    background: url(../../static/images/common/icon8.png)no-repeat;
-    background-size: .38rem .38rem;
-}
-
-/* 弹窗 */
-.popupWrap{
-    width: 100%;
-    height: 100%;
-    background: rgba(0,0,0,0.5);
-    position: fixed;
-    left: 0;
-    top: 0;
-    z-index: 9999;
-    .popupBox{
-        width: 5.2rem;
-        height: 2.4rem;
-        background: #fff;
-        position: absolute;
-        left: 50%;
-        top: 30%;
-        margin-left: -2.5rem;
-        border-radius: 16px;
-        p{
-            text-align: center;
-            font-size: .38rem;
-            color: #222;
-            line-height: .52rem;
-            text-align: justify;
-            font-family: PingFangSC;
-            font-weight: 500;
-            text-align: center;
-            padding-top: .38rem;
-        }
-        ul{
-            width: 100%;
-            height: 1.1rem;
-            position: absolute;
-            left: 0;
-            bottom: 0;
-            border-top: 1px solid #f5f5f5;
-            li{
-                width: 50%;
-                float: left;
-                text-align: center;
-                line-height: 1.1rem;
-                a{
-                    font-size: .32rem;
-                    font-family: PingFangSC-Medium,PingFangSC;
-                    font-weight: 500;
-                    color: #2f7af7;
-                }
-            }
-            .li1{
-                font-size: .32rem;
-                font-family: PingFangSC-Medium,PingFangSC;
-                font-weight: 500;
-                color: #222;
-                border-right: 1px solid #f5f5f5;
-                box-sizing: border-box;
-            }
-        }
-    }
-}
-</style>
+<template>
+<div class="navBar">
+    <div class="nav-class">
+        <dl class="dl1">
+            <router-link to='/home' active-class="active1">
+                <dt>
+                    <i class='icon1'></i>
+                </dt>
+                <dd>首页</dd>
+            </router-link>
+        </dl>
+        <dl class="dl2" @click="showPopup=true;">
+            <dt>
+                <i class='icon2'></i>
+            </dt>
+            <dd>工作管理</dd>
+        </dl>
+        <dl class="dl3" @click="isMessage();">
+            <!-- <span> -->
+                <router-link to='/message' active-class="active3">
+                    <dt>
+                        <i class='icon3'></i>
+                    </dt>
+                    <dd>消息</dd>
+                </router-link>
+            <!-- </span> -->
+        </dl>
+        <dl class="dl4">
+            <router-link to='/mine' active-class="active4">
+                <dt>
+                    <i class='icon4'></i>
+                </dt>
+                <dd>我的</dd>
+            </router-link>
+        </dl>
+    </div>
+    <div class="popupWrap" v-if="showPopup">
+        <div class="popupBox">
+            <p>该功能只限优铺APP使用</p>
+            <ul>
+                <li class="li1" @click="showPopup=false">取消</li>
+                <li><a href="https://a.app.qq.com/o/simple.jsp?pkgname=com.up.upcbmls">去下载</a></li>
+            </ul>
+        </div>
+    </div>
+    <router-view></router-view>
+</div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'navBar',
+    data () {
+        return {
+           showPopup: false,
+        }
+    },
+    components:{
+
+    },
+    watch: {
+        
+    },
+    methods:{
+        isMessage(){
+            if(localStorage.token){
+                this.$router.push({path:"/message"});             
+            }else{
+                this.$router.push({path:"/userlogin",query:{"urlType":"message"}});  
+            }    
+        },
+        // downloadApp(){
+        //     this.showPopup = true;
+        // }
+    },
+    mounted() {
+        　
+    },
+    created(){   
+            
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.nav{
+    width: 100%;
+}
+.nav-class{
+    width: 7.5rem;
+    height: 1.2rem;
+    background-color: #fff;
+    position: fixed;
+    bottom: 0px;
+    color: #898989;
+    font-size: 0.2rem;
+    box-shadow:2px 0px 12px rgba(132,166,195,0.14);
+    z-index: 100;
+    dl{
+        width: 25%;
+        height: 1rem;
+        padding-top: .16rem;
+        float: left;
+        text-align: center;
+        a{
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            display: inline-block;
+            width: 100%;
+            height: 100%;
+            color: #999;
+        }
+        dt{
+            text-align: center;
+            i{
+                display: inline-block;
+                height: .38rem;
+                width: .42rem;
+                margin: 0 auto;
+            }
+        }
+        dd{
+            font-size: .2rem;
+            line-height: .2rem;
+            font-weight: 500;
+        }
+    }
+}
+
+.icon1{
+    background: url(../../static/images/common/icon1.png) no-repeat;
+    background-size: .4rem .36rem;
+}
+.icon2{
+    background: url(../../static/images/common/icon3.png) no-repeat;
+    background-size: .38rem .38rem;
+}
+.icon3{
+    background: url(../../static/images/common/icon5.png) no-repeat;
+    background-size: .42rem .36rem;
+}
+.icon4{
+    background: url(../../static/images/common/icon7.png) no-repeat;
+    background-size: .38rem .38rem;
+}
+
+.active1 dd{color: #2f7af7;}
+.active1 .icon1{
+    background: url(../../static/images/common/icon2.png)no-repeat;
+    background-size: .4rem .36rem;
+}
+.active2 dd{color: #2f7af7;}
+.active2 .icon2{
+    background: url(../../static/images/common/icon4.png)no-repeat;
+    background-size: .38rem .38rem;
+}
+.active3 dd{color: #2f7af7;}
+.active3 .icon3{
+    background: url(../../static/images/common/icon6.png)no-repeat;
+    background-size: .42rem .36rem;
+}
+.active4 dd{color: #2f7af7;}
+.active4 .icon4{
+    background: url(../../static/images/common/icon8.png)no-repeat;
+    background-size: .38rem .38rem;
+}
+
+/* 弹窗 */
+.popupWrap{
+    width: 100%;
+    height: 100%;
+    background: rgba(0,0,0,0.5);
+    position: fixed;
+    left: 0;
+    top: 0;
+    z-index: 9999;
+    .popupBox{
+        width: 5.2rem;
+        height: 2.4rem;
+        background: #fff;
+        position: absolute;
+        left: 50%;
+        top: 30%;
+        margin-left: -2.5rem;
+        border-radius: 16px;
+        p{
+            text-align: center;
+            font-size: .38rem;
+            color: #222;
+            line-height: .52rem;
+            text-align: justify;
+            font-family: PingFangSC;
+            font-weight: 500;
+            text-align: center;
+            padding-top: .38rem;
+        }
+        ul{
+            width: 100%;
+            height: 1.1rem;
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            border-top: 1px solid #f5f5f5;
+            li{
+                width: 50%;
+                float: left;
+                text-align: center;
+                line-height: 1.1rem;
+                a{
+                    font-size: .32rem;
+                    font-family: PingFangSC-Medium,PingFangSC;
+                    font-weight: 500;
+                    color: #2f7af7;
+                }
+            }
+            .li1{
+                font-size: .32rem;
+                font-family: PingFangSC-Medium,PingFangSC;
+                font-weight: 500;
+                color: #222;
+                border-right: 1px solid #f5f5f5;
+                box-sizing: border-box;
+            }
+        }
+    }
+}
+</style>

src/components/news/news.vue

@@ -1,186 +1,186 @@
-<template>
- <div class="user">
-    <div class="commonNav">
-        <i @click="goHome();">
-            <img src="../../../static/images/common/back.png">
-        </i>
-        <h2>资讯详情</h2>
-    </div>
-    <div class="userman">
-       <div class="renobox">
-            <p>{{title}}</p>
-            <ul>
-                <li>{{createTime}}</li>
-                <li><img src="../../../static/images/common/chakan.png" alt="">{{views}}</li>
-            </ul>
-       </div>
-    </div>
-    <div class="locaman" style="margin-top:.2rem" v-html="content"></div>
-</div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'userAgreement',
-    data () {
-        return {
-           city_id:"",  //城市id
-           content:"",  //内容
-           createTime:"",  //时间
-           roseid:"",  //文章id
-           title:"",  //头部介绍
-           url:"",  
-           views:"",  //查看次数
-           titleId: "",
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        // 条件列表
-        listData() {
-            let _this = this;
-            let url = this.changeData() + '/show/findArticeDetail'
-            var data = {
-                titleId: this.titleId
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                console.log(data);
-                if(data.data.code == "101"){
-                    this.city_id=data.data.article.city_id;
-                    this.content=data.data.article.content;
-                    this.createTime=data.data.article.createTime;
-                    this.roseid=data.data.article.id;
-                    this.title=data.data.article.title;
-                    this.url=data.data.article.url;
-                    this.views=data.data.article.views;                         
-                }else{
-                    Toast({
-                        message: data.data.message,
-                        duration: 3000
-                    });
-                }
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-        goHome(){
-            this.$router.push({path:"/home"});
-        }
-    },
-    mounted() {
-        this.titleId =  getUrlId("titleId");
-        var move =  getUrlId("move");
-        if(move == 'ios'){
-            $(".userman").css({"padding-top":".88rem"});
-        }
-        this.listData();
-    },
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-.commonNav{
-    width: 7.5rem;
-    height: .88rem;
-    background: #fff;
-    border-bottom:.01rem solid #e5e5e5; 
-    i{
-        float: left;
-        width: .18rem;
-        height: .32rem;
-        margin-left: .3rem;
-        position: relative;
-        top: .26rem;
-        img{
-            width: .18rem;
-            height: .32rem;
-        }
-    }
-    h2{
-        font-size: .34rem;
-        font-family: PingFangSC-Medium,PingFangSC;
-        font-weight: 500;
-        color: #222;
-        line-height: .88rem;
-        width: 6.5rem;
-        float: left;
-        text-align: center;
-    }
-}
-.userman{
-    width:6.9rem;
-    float:left;
-    background:#fff;
-    margin:0 auto;
-    text-align:justify;
-    color:#363636;
-    padding:0.3rem 0.3rem;
-    .renobox{
-        width:100%;
-        font-size:.28rem;
-        font-family:PingFangSC;
-        p{
-            width:100%;
-            font-size:.34rem;
-            font-family:PingFangSC-Medium,PingFangSC;
-            font-weight:500;
-            color:rgba(34,34,34,1);
-            line-height:.52rem;
-        }
-        ul{
-            width:100%;
-            margin-top:.2rem;
-            li{
-                float:left;
-                list-style:none;
-                font-size:.28rem;
-                font-weight:400;
-                color:rgba(153,153,153,1);
-                font-family:PingFangSC-Regular,PingFangSC;
-                line-height:.4rem;
-                position:relative;
-                img{
-                    width:.32rem;
-                    height:.24rem;
-                    position:absolute;
-                    left:-.4rem;
-                    top:.07rem;
-                }
-            }
-            li:last-child{
-                float:right;
-            }
-        }
-    }
-}
-.locaman{
-    width:6.9rem;
-    float:left;
-    background:#fff;
-    margin:0 auto;
-    text-align:justify;
-    color:#363636;
-    padding:0.3rem;
-    font-size:.3rem;
-    font-family:PingFangSC-Regular,PingFangSC;
-    font-weight:400;
-    color:rgba(34,34,34,1);
-    line-height:.48rem;
-    overflow: hidden;
-    img{
-        width:100%;
-        height:3.6rem;
-        margin:.3rem 0 .3rem 0;
-    }
-}
-</style>
-<style type="text/css">
-.locaman img{
-    max-width: 6.9rem;
-}
+<template>
+ <div class="user">
+    <div class="commonNav">
+        <i @click="goHome();">
+            <img src="../../../static/images/common/back.png">
+        </i>
+        <h2>资讯详情</h2>
+    </div>
+    <div class="userman">
+       <div class="renobox">
+            <p>{{title}}</p>
+            <ul>
+                <li>{{createTime}}</li>
+                <li><img src="../../../static/images/common/chakan.png" alt="">{{views}}</li>
+            </ul>
+       </div>
+    </div>
+    <div class="locaman" style="margin-top:.2rem" v-html="content"></div>
+</div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'userAgreement',
+    data () {
+        return {
+           city_id:"",  //城市id
+           content:"",  //内容
+           createTime:"",  //时间
+           roseid:"",  //文章id
+           title:"",  //头部介绍
+           url:"",  
+           views:"",  //查看次数
+           titleId: "",
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        // 条件列表
+        listData() {
+            let _this = this;
+            let url = this.changeData() + '/show/findArticeDetail'
+            var data = {
+                titleId: this.titleId
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                console.log(data);
+                if(data.data.code == "101"){
+                    this.city_id=data.data.article.city_id;
+                    this.content=data.data.article.content;
+                    this.createTime=data.data.article.createTime;
+                    this.roseid=data.data.article.id;
+                    this.title=data.data.article.title;
+                    this.url=data.data.article.url;
+                    this.views=data.data.article.views;                         
+                }else{
+                    Toast({
+                        message: data.data.message,
+                        duration: 3000
+                    });
+                }
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+        goHome(){
+            this.$router.push({path:"/home"});
+        }
+    },
+    mounted() {
+        this.titleId =  getUrlId("titleId");
+        var move =  getUrlId("move");
+        if(move == 'ios'){
+            $(".userman").css({"padding-top":".88rem"});
+        }
+        this.listData();
+    },
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+.commonNav{
+    width: 7.5rem;
+    height: .88rem;
+    background: #fff;
+    border-bottom:.01rem solid #e5e5e5; 
+    i{
+        float: left;
+        width: .18rem;
+        height: .32rem;
+        margin-left: .3rem;
+        position: relative;
+        top: .26rem;
+        img{
+            width: .18rem;
+            height: .32rem;
+        }
+    }
+    h2{
+        font-size: .34rem;
+        font-family: PingFangSC-Medium,PingFangSC;
+        font-weight: 500;
+        color: #222;
+        line-height: .88rem;
+        width: 6.5rem;
+        float: left;
+        text-align: center;
+    }
+}
+.userman{
+    width:6.9rem;
+    float:left;
+    background:#fff;
+    margin:0 auto;
+    text-align:justify;
+    color:#363636;
+    padding:0.3rem 0.3rem;
+    .renobox{
+        width:100%;
+        font-size:.28rem;
+        font-family:PingFangSC;
+        p{
+            width:100%;
+            font-size:.34rem;
+            font-family:PingFangSC-Medium,PingFangSC;
+            font-weight:500;
+            color:rgba(34,34,34,1);
+            line-height:.52rem;
+        }
+        ul{
+            width:100%;
+            margin-top:.2rem;
+            li{
+                float:left;
+                list-style:none;
+                font-size:.28rem;
+                font-weight:400;
+                color:rgba(153,153,153,1);
+                font-family:PingFangSC-Regular,PingFangSC;
+                line-height:.4rem;
+                position:relative;
+                img{
+                    width:.32rem;
+                    height:.24rem;
+                    position:absolute;
+                    left:-.4rem;
+                    top:.07rem;
+                }
+            }
+            li:last-child{
+                float:right;
+            }
+        }
+    }
+}
+.locaman{
+    width:6.9rem;
+    float:left;
+    background:#fff;
+    margin:0 auto;
+    text-align:justify;
+    color:#363636;
+    padding:0.3rem;
+    font-size:.3rem;
+    font-family:PingFangSC-Regular,PingFangSC;
+    font-weight:400;
+    color:rgba(34,34,34,1);
+    line-height:.48rem;
+    overflow: hidden;
+    img{
+        width:100%;
+        height:3.6rem;
+        margin:.3rem 0 .3rem 0;
+    }
+}
+</style>
+<style type="text/css">
+.locaman img{
+    max-width: 6.9rem;
+}
 </style>

src/components/news/newsDel.vue

@@ -1,180 +1,180 @@
-<template>
- <div class="user">
-  <!-- <div class="nav">
-    <a href="login"><img class="navBack pull-left" src="../../static/images/common/newBack.png" alt=""></a>
-  </div> -->
-        <div class="userman">
-           <div class="renobox">
-                <p>{{title}}</p>
-                <ul>
-                    <li>{{createTime}}</li>
-                    <li><img src="../../../static/images/common/chakan.png" alt="">{{views}}</li>
-                </ul>
-           </div>
-        </div>
-        <div class="locaman" style="margin-top:.2rem" v-html="content"></div>
-    </div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'userAgreement',
-    data () {
-        return {
-           city_id:"",  //城市id
-           content:"",  //内容
-           createTime:"",  //时间
-           roseid:"",  //文章id
-           title:"",  //头部介绍
-           url:"",  
-           views:"",  //查看次数
-           titleId: "",
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-        // 条件列表
-        listData() {
-            let _this = this;
-            let url = this.changeData() + '/show/findArticeDetail'
-            var data = {
-                titleId: this.titleId
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                console.log(data);
-                if(data.data.code == "101"){
-                    this.city_id=data.data.article.city_id;
-                    this.content=data.data.article.content;
-                    this.createTime=data.data.article.createTime;
-                    this.roseid=data.data.article.id;
-                    this.title=data.data.article.title;
-                    this.url=data.data.article.url;
-                    this.views=data.data.article.views;
-                    // Toast({
-                    //     message: '注册成功',
-                    //     duration: 3000
-                    // });                          
-                }else{
-                    Toast({
-                        message: data.data.message,
-                        duration: 3000
-                    });
-                }
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-    },
-    mounted() {
-        this.titleId =  getUrlId("titleId");
-        var move =  getUrlId("move");
-        if(move == 'ios'){
-            $(".userman").css({"padding-top":".88rem"});
-        }
-        this.listData();
-    },
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-.nav{
-    width:7.5rem;
-    height:0.88rem;
-    background:white;
-    position:relative;
-    text-align:center;
-    font-size:.34rem;
-    font-weight:bold;
-    line-height:0.88rem;
-    color:#363636;
-    border-bottom:.01rem solid #e5e5e5;
-    a{
-      width:.2rem;
-      height:.37rem;
-      top:.25rem;
-      position:absolute;
-      left:.25rem;
-       img{
-        width:100%;
-        height:100%;
-        float:left;
-        }
-    }
-    }
-.userman{
-    width:6.9rem;
-    float:left;
-    background:#fff;
-    margin:0 auto;
-    text-align:justify;
-    color:#363636;
-    padding:0.3rem 0.3rem;
-    .renobox{
-        width:100%;
-        font-size:.28rem;
-        font-family:PingFangSC;
-        p{
-            width:100%;
-            font-size:.34rem;
-            font-family:PingFangSC-Medium,PingFangSC;
-            font-weight:500;
-            color:rgba(34,34,34,1);
-            line-height:.52rem;
-        }
-        ul{
-            width:100%;
-            margin-top:.2rem;
-            li{
-                float:left;
-                list-style:none;
-                font-size:.28rem;
-                font-weight:400;
-                color:rgba(153,153,153,1);
-                font-family:PingFangSC-Regular,PingFangSC;
-                line-height:.4rem;
-                position:relative;
-                img{
-                    width:.32rem;
-                    height:.24rem;
-                    position:absolute;
-                    left:-.4rem;
-                    top:.07rem;
-                }
-            }
-            li:last-child{
-                float:right;
-            }
-        }
-    }
-}
-.locaman{
-    width:6.9rem;
-    float:left;
-    background:#fff;
-    margin:0 auto;
-    text-align:justify;
-    color:#363636;
-    padding: .3rem;
-    font-size: .3rem;
-    font-family:PingFangSC-Regular,PingFangSC;
-    font-weight:400;
-    color:rgba(34,34,34,1);
-    line-height:.48rem;
-    overflow: hidden;
-    img{
-        width:100%;
-        height:3.6rem;
-        margin:.3rem 0 .3rem 0;
-    }
-}
-</style>
-<style type="text/css">
-.locaman img{
-    max-width: 6.9rem;
-}
+<template>
+ <div class="user">
+  <!-- <div class="nav">
+    <a href="login"><img class="navBack pull-left" src="../../static/images/common/newBack.png" alt=""></a>
+  </div> -->
+        <div class="userman">
+           <div class="renobox">
+                <p>{{title}}</p>
+                <ul>
+                    <li>{{createTime}}</li>
+                    <li><img src="../../../static/images/common/chakan.png" alt="">{{views}}</li>
+                </ul>
+           </div>
+        </div>
+        <div class="locaman" style="margin-top:.2rem" v-html="content"></div>
+    </div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'userAgreement',
+    data () {
+        return {
+           city_id:"",  //城市id
+           content:"",  //内容
+           createTime:"",  //时间
+           roseid:"",  //文章id
+           title:"",  //头部介绍
+           url:"",  
+           views:"",  //查看次数
+           titleId: "",
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+        // 条件列表
+        listData() {
+            let _this = this;
+            let url = this.changeData() + '/show/findArticeDetail'
+            var data = {
+                titleId: this.titleId
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                console.log(data);
+                if(data.data.code == "101"){
+                    this.city_id=data.data.article.city_id;
+                    this.content=data.data.article.content;
+                    this.createTime=data.data.article.createTime;
+                    this.roseid=data.data.article.id;
+                    this.title=data.data.article.title;
+                    this.url=data.data.article.url;
+                    this.views=data.data.article.views;
+                    // Toast({
+                    //     message: '注册成功',
+                    //     duration: 3000
+                    // });                          
+                }else{
+                    Toast({
+                        message: data.data.message,
+                        duration: 3000
+                    });
+                }
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+    },
+    mounted() {
+        this.titleId =  getUrlId("titleId");
+        var move =  getUrlId("move");
+        if(move == 'ios'){
+            $(".userman").css({"padding-top":".88rem"});
+        }
+        this.listData();
+    },
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+.nav{
+    width:7.5rem;
+    height:0.88rem;
+    background:white;
+    position:relative;
+    text-align:center;
+    font-size:.34rem;
+    font-weight:bold;
+    line-height:0.88rem;
+    color:#363636;
+    border-bottom:.01rem solid #e5e5e5;
+    a{
+      width:.2rem;
+      height:.37rem;
+      top:.25rem;
+      position:absolute;
+      left:.25rem;
+       img{
+        width:100%;
+        height:100%;
+        float:left;
+        }
+    }
+    }
+.userman{
+    width:6.9rem;
+    float:left;
+    background:#fff;
+    margin:0 auto;
+    text-align:justify;
+    color:#363636;
+    padding:0.3rem 0.3rem;
+    .renobox{
+        width:100%;
+        font-size:.28rem;
+        font-family:PingFangSC;
+        p{
+            width:100%;
+            font-size:.34rem;
+            font-family:PingFangSC-Medium,PingFangSC;
+            font-weight:500;
+            color:rgba(34,34,34,1);
+            line-height:.52rem;
+        }
+        ul{
+            width:100%;
+            margin-top:.2rem;
+            li{
+                float:left;
+                list-style:none;
+                font-size:.28rem;
+                font-weight:400;
+                color:rgba(153,153,153,1);
+                font-family:PingFangSC-Regular,PingFangSC;
+                line-height:.4rem;
+                position:relative;
+                img{
+                    width:.32rem;
+                    height:.24rem;
+                    position:absolute;
+                    left:-.4rem;
+                    top:.07rem;
+                }
+            }
+            li:last-child{
+                float:right;
+            }
+        }
+    }
+}
+.locaman{
+    width:6.9rem;
+    float:left;
+    background:#fff;
+    margin:0 auto;
+    text-align:justify;
+    color:#363636;
+    padding: .3rem;
+    font-size: .3rem;
+    font-family:PingFangSC-Regular,PingFangSC;
+    font-weight:400;
+    color:rgba(34,34,34,1);
+    line-height:.48rem;
+    overflow: hidden;
+    img{
+        width:100%;
+        height:3.6rem;
+        margin:.3rem 0 .3rem 0;
+    }
+}
+</style>
+<style type="text/css">
+.locaman img{
+    max-width: 6.9rem;
+}
 </style>

src/components/qiugou/qiugou.vue

@@ -1,34 +1,34 @@
-<template>
-<div class="qiugou">
-求购列表
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'qiugou',
-    data () {
-        return {
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-
-        
-    },
-    mounted() {       
-
-    }
-}
-</script>
-
-<style scoped lang="scss"  type="text/scss">
-
-</style>
-
-
+<template>
+<div class="qiugou">
+求购列表
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'qiugou',
+    data () {
+        return {
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+
+        
+    },
+    mounted() {       
+
+    }
+}
+</script>
+
+<style scoped lang="scss"  type="text/scss">
+
+</style>
+
+

src/components/qiuzu/qiuzu.vue

@@ -1,34 +1,34 @@
-<template>
-<div class="qiuzu">
-求租列表
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'work',
-    data () {
-        return {
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-
-        
-    },
-    mounted() {       
-
-    }
-}
-</script>
-
-<style scoped lang="scss"  type="text/scss">
-
-</style>
-
-
+<template>
+<div class="qiuzu">
+求租列表1
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'work',
+    data () {
+        return {
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+
+        
+    },
+    mounted() {       
+
+    }
+}
+</script>
+
+<style scoped lang="scss"  type="text/scss">
+
+</style>
+
+

src/components/shop/loupandetail.vue

@@ -1,385 +1,385 @@
-<template>
-<div class="shopdetail">
-    <!-- 头部导航 -->
-    <div class="jiantou-title" v-show="tabTitle===1">
-        <span @click="goShop();"></span>{{basic.name}}
-    </div>
-    <!-- 轮播图 -->
-    <div class="banner">
-        <div class="backImgWrap" @click="goShop();">
-            <img src="../../../static/images/common/whiteBack.png" class="backImg">
-        </div>
-        <div class="wrap">
-            <ul class="txt">
-                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
-                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
-            </ul>
-            <div class="swiper-container swiper-container1 swiper-container-horizontal">
-                <div class="swiper-wrapper">
-                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
-                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
-                    </div>
-                </div>
-                <div class="swiper-pagination"></div>
-            </div>
-        </div>
-    </div>
-    <!-- 大轮播图 -->
-    <div class="bannerBig" @click="tab2()">
-        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
-        <div class="swiper-container swiper-container2 swiper-container-horizontal">
-            <div class="swiper-wrapper">
-                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
-            </div>
-            <div class="swiper-pagination"></div>
-        </div>
-    </div>
-    <!-- 商铺详情介绍 -->
-    <div class="detailBoxWrap">
-        <div class="topBox">
-            <h2>{{basic.name}}</h2>
-            <div class="labelWrap">
-                <ul>
-                    <li v-for="(item,index) in labelList">{{item}}</li>
-                </ul>
-            </div>
-            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
-            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
-            <div class="priceWrap clearfix" v-if="basic.rent_type == 3">
-                <dl>
-                    <dt>{{basic.monthly_rent}}{{basic.monthly_rent_u}}</dt>
-                    <dd>月租金</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.daily_rent}}{{basic.daily_rent_u}}</dt>
-                    <dd>日租金</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
-                    <dd>建筑面积</dd>
-                </dl>
-            </div>
-            <div class="priceWrap clearfix" v-else>
-                <dl style="width: 50%;">
-                    <dt>{{basic.ave_price}}{{basic.ave_price_u}}</dt>
-                    <dd>销售均价</dd>
-                </dl>
-                <dl style="width: 50%;">
-                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
-                    <dd>建筑面积</dd>
-                </dl>
-            </div>
-        </div>
-        <div class="mainBox">
-            <dl class="dlTitle clearfix">
-                <dt>位置：</dt>
-                <dd>{{basic.real_address}}</dd>
-            </dl>
-            <div class="mainList clearfix">
-                <div class="divL fl">
-                    <dl class="clearfix">
-                        <dt>类型：</dt>
-                        <dd>{{basic.type}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>楼层：</dt>
-                        <dd>{{basic.floor_current}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>可注册：</dt>
-                        <dd>{{basic.register}}</dd>
-                    </dl>
-                </div>
-
-                <div class="divR fl">
-                    <dl class="clearfix">
-                        <dt>装修：</dt>
-                        <dd>{{basic.decorate}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>工位数：</dt>
-                        <dd>{{basic.station}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>可注册：</dt>
-                        <dd>{{basic.register}}</dd>
-                    </dl>
-                </div>
-            </div>
-            <dl class="dlType clearfix">
-                <dt>开发商：</dt>
-                <dd>{{basic.developer}}</dd>
-            </dl>
-        </div>
-    </div>
-    <!-- 铺源动态 -->
-    <div class="shopDynamic">
-        <span class="fl">铺源动态</span>
-        <div class="scrollWrap fl">
-            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
-                <li v-for="item in dynamicList">{{item}}</li>  
-            </ul>
-            <ul class="scroll-content" v-else>
-                <li>暂无</li>
-            </ul>
-        </div>
-    </div>
-    <!-- 商铺描述 -->
-    <div class="shopDescribe">
-        <span>商铺描述</span>
-        <span class="span3">{{basic.introduce}}</span>
-    </div>
-    <!-- 查看经纪人 -->
-    <div class="telephoneWrap">
-        <dl>
-            <dt>
-                <img src="../../../static/images/shop/head.png">
-            </dt>
-            <dd>
-                <p>{{agentEntiy.name}}</p>
-                <h5>{{agentEntiy.company}}</h5>
-            </dd>
-        </dl>
-        <div class="telephone" @click="telephone();">
-            <i>
-                <img src="../../../static/images/shop/tel.png">
-            </i>
-            <span>电话</span>
-        </div>
-    </div>
-    <!-- 推荐列表 -->
-    <div class="recommendListWrap">
-        <h2>为你推荐</h2>
-        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
-            <dt>
-                <img :src="item.imgs" :onerror="defaultImg">
-            </dt>
-            <dd>
-                <h3>{{item.title}}</h3>
-                <h5>{{item.name}}</h5>
-                <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
-                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                <p><span>合作佣金：</span>{{item.commission}}</p>
-            </dd>
-        </dl>
-    </div>
-
-</div>
-</template>
-
-<script>
-  import axios from 'axios';
-  import qs from 'qs';
-  export default {
-    data(){
-      return{
-        shopId: "",
-        basic: {},
-        lbtArr: [], //轮播图
-        imgTotal: 0,
-        num1: 1,
-        num2: 1,
-        sliderIndex: "",
-        activeIndex: "",
-        tabTitle: 0,
-
-        labelList: [], //标签
-        supportingList: [], //配套设施
-        dynamicList: [], //铺源动态
-
-        recommendedList: [], //推荐列表
-
-        agentEntiy: {}, //经纪人信息
-        telephoneVal: "", //经纪人电话
-
-        dynamicIndex: 0,
-
-        typeUrl: "",
-
-        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
-
-      }
-    },
-    computed: {
-        // 
-        top() {
-            return - this.dynamicIndex * 1.04 + 'rem';
-        }
-
-    },
-    watch:{
-
-    },
-    mounted(){
-        this.shopId = this.$route.query.id;
-
-        this.typeUrl = getUrlId("type");
-
-        //初始化
-        this.detailData();
-
-        //滚动事件
-        var _this = this;
-        window.onscroll = function(){
-            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
-            if(scrollTop >= 80){
-                _this.tabTitle = 1;
-                $(".tel-msg").hide();
-            }else{
-                _this.tabTitle = 0;
-            }
-        },
-
-        setInterval(_ => {
-            if(this.dynamicIndex < this.dynamicList.length) {
-                this.dynamicIndex += 1;
-            } else {
-                this.dynamicIndex = 0;
-            }
-        }, 1000);
-
-    },
-    updated(){
-        // this.fenxiangFun();
-        let _this = this;
-        setTimeout(function () {
-           _this.showBanner();
-        },500);
-    },
-    // beforeRouteEnter (to, from, next) {
-    //     var u = navigator.userAgent;
-    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
-    //     if (isiOS && to.path !== location.pathname) {
-    //         // 此处不可使用location.replace
-    //         location.assign(to.fullPath)
-    //     } else {
-    //         next()
-    //     }
-    // },
-    methods:{
-
-        goShop(){
-            if(this.typeUrl == "1"){
-                this.$router.go(-1);
-            }else if(this.typeUrl == "2"){
-                this.$router.push({path:"/home"});
-            }else{
-                this.$router.push({path:"/loupan"});
-            }
-        },
-
-        // 为您推荐
-        go(id){
-            window.location.href = "http://"+window.location.host+"/loupandetail?"+"id="+id+"&type=1";
-            window.scrollTo('0','0');
-        },
-
-        // 详情列表
-        detailData() {
-            let _this = this;
-            let url = this.changeData() + '/office/appOfficeDetail'
-            var data = {
-                projectId: this.shopId,  //项目ID（shopId或officeId）
-                // loginUserId: localStorage.userId
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.basic = data.data.basic;
-                this.lbtArr = data.data.basic.imgs;
-                this.imgTotal = data.data.basic.imgs.length;
-                this.labelList = data.data.basic.label; 
-                this.supportingList = data.data.supportingList;
-                this.dynamicList = data.data.basic.dynamicList; //铺源动态
-                this.recommendedList = data.data.basic.recommendedList; //推荐列表
-                this.agentEntiy = data.data.agentEntiy; //经纪人信息
-                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
-                // console.log(this.basic);
-                // console.log(this.recommendedList);
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        tab1(){
-            $(".bannerBig").show();
-            var that = this;
-
-            if(that.sliderIndex == 0){
-                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
-            }
-            
-            var swiper2 = new Swiper('.swiper-container2', {
-                initialSlide : that.sliderIndex,
-                on: {
-                    slideChangeTransitionEnd: function(){
-                       that.sliderIndex = this.activeIndex;
-                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        tab2(){
-            this.num2 = 1;
-            $(".bannerBig").hide();
-        },
-
-        showBanner(){
-            var that = this;
-            var swiper1 = new Swiper('.swiper-container1', {
-                on: {
-                    slideChangeTransitionEnd: function(){
-                        that.sliderIndex = this.activeIndex;
-                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        telephone(){
-            window.location.href = 'tel:'+this.telephoneVal;
-        }
-
-    },
-    watch: {
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-@import "../../../static/css/shopDetail.scss";
-</style>
-
-<style>
-.layui-m-layer-tel .layui-m-layercont{
-    padding: 35px 30px;
-}
-.layui-m-layer-tel h2{
-    font-size: .32rem;
-    color: #333;
-    margin-bottom: .3rem;
-}
-.layui-m-layer-tel p{
-    font-size: .36rem;
-    color: #e8584f;
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
-    color: #898989;
-    background: #f7f8fa;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
-    color: #fff;
-    background: #64AAFF;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    border-radius: 0 0 5px 0;
-}
+<template>
+<div class="shopdetail">
+    <!-- 头部导航 -->
+    <div class="jiantou-title" v-show="tabTitle===1">
+        <span @click="goShop();"></span>{{basic.name}}
+    </div>
+    <!-- 轮播图 -->
+    <div class="banner">
+        <div class="backImgWrap" @click="goShop();">
+            <img src="../../../static/images/common/whiteBack.png" class="backImg">
+        </div>
+        <div class="wrap">
+            <ul class="txt">
+                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
+                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
+            </ul>
+            <div class="swiper-container swiper-container1 swiper-container-horizontal">
+                <div class="swiper-wrapper">
+                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
+                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
+                    </div>
+                </div>
+                <div class="swiper-pagination"></div>
+            </div>
+        </div>
+    </div>
+    <!-- 大轮播图 -->
+    <div class="bannerBig" @click="tab2()">
+        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
+        <div class="swiper-container swiper-container2 swiper-container-horizontal">
+            <div class="swiper-wrapper">
+                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
+            </div>
+            <div class="swiper-pagination"></div>
+        </div>
+    </div>
+    <!-- 商铺详情介绍 -->
+    <div class="detailBoxWrap">
+        <div class="topBox">
+            <h2>{{basic.name}}</h2>
+            <div class="labelWrap">
+                <ul>
+                    <li v-for="(item,index) in labelList">{{item}}</li>
+                </ul>
+            </div>
+            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
+            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
+            <div class="priceWrap clearfix" v-if="basic.rent_type == 3">
+                <dl>
+                    <dt>{{basic.monthly_rent}}{{basic.monthly_rent_u}}</dt>
+                    <dd>月租金</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.daily_rent}}{{basic.daily_rent_u}}</dt>
+                    <dd>日租金</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
+                    <dd>建筑面积</dd>
+                </dl>
+            </div>
+            <div class="priceWrap clearfix" v-else>
+                <dl style="width: 50%;">
+                    <dt>{{basic.ave_price}}{{basic.ave_price_u}}</dt>
+                    <dd>销售均价</dd>
+                </dl>
+                <dl style="width: 50%;">
+                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
+                    <dd>建筑面积</dd>
+                </dl>
+            </div>
+        </div>
+        <div class="mainBox">
+            <dl class="dlTitle clearfix">
+                <dt>位置：</dt>
+                <dd>{{basic.real_address}}</dd>
+            </dl>
+            <div class="mainList clearfix">
+                <div class="divL fl">
+                    <dl class="clearfix">
+                        <dt>类型：</dt>
+                        <dd>{{basic.type}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>楼层：</dt>
+                        <dd>{{basic.floor_current}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>可注册：</dt>
+                        <dd>{{basic.register}}</dd>
+                    </dl>
+                </div>
+
+                <div class="divR fl">
+                    <dl class="clearfix">
+                        <dt>装修：</dt>
+                        <dd>{{basic.decorate}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>工位数：</dt>
+                        <dd>{{basic.station}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>可注册：</dt>
+                        <dd>{{basic.register}}</dd>
+                    </dl>
+                </div>
+            </div>
+            <dl class="dlType clearfix">
+                <dt>开发商：</dt>
+                <dd>{{basic.developer}}</dd>
+            </dl>
+        </div>
+    </div>
+    <!-- 铺源动态 -->
+    <div class="shopDynamic">
+        <span class="fl">铺源动态</span>
+        <div class="scrollWrap fl">
+            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
+                <li v-for="item in dynamicList">{{item}}</li>  
+            </ul>
+            <ul class="scroll-content" v-else>
+                <li>暂无</li>
+            </ul>
+        </div>
+    </div>
+    <!-- 商铺描述 -->
+    <div class="shopDescribe">
+        <span>商铺描述</span>
+        <span class="span3">{{basic.introduce}}</span>
+    </div>
+    <!-- 查看经纪人 -->
+    <div class="telephoneWrap">
+        <dl>
+            <dt>
+                <img src="../../../static/images/shop/head.png">
+            </dt>
+            <dd>
+                <p>{{agentEntiy.name}}</p>
+                <h5>{{agentEntiy.company}}</h5>
+            </dd>
+        </dl>
+        <div class="telephone" @click="telephone();">
+            <i>
+                <img src="../../../static/images/shop/tel.png">
+            </i>
+            <span>电话</span>
+        </div>
+    </div>
+    <!-- 推荐列表 -->
+    <div class="recommendListWrap">
+        <h2>为你推荐</h2>
+        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
+            <dt>
+                <img :src="item.imgs" :onerror="defaultImg">
+            </dt>
+            <dd>
+                <h3>{{item.title}}</h3>
+                <h5>{{item.name}}</h5>
+                <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
+                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                <p><span>合作佣金：</span>{{item.commission}}</p>
+            </dd>
+        </dl>
+    </div>
+
+</div>
+</template>
+
+<script>
+  import axios from 'axios';
+  import qs from 'qs';
+  export default {
+    data(){
+      return{
+        shopId: "",
+        basic: {},
+        lbtArr: [], //轮播图
+        imgTotal: 0,
+        num1: 1,
+        num2: 1,
+        sliderIndex: "",
+        activeIndex: "",
+        tabTitle: 0,
+
+        labelList: [], //标签
+        supportingList: [], //配套设施
+        dynamicList: [], //铺源动态
+
+        recommendedList: [], //推荐列表
+
+        agentEntiy: {}, //经纪人信息
+        telephoneVal: "", //经纪人电话
+
+        dynamicIndex: 0,
+
+        typeUrl: "",
+
+        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
+
+      }
+    },
+    computed: {
+        // 
+        top() {
+            return - this.dynamicIndex * 1.04 + 'rem';
+        }
+
+    },
+    watch:{
+
+    },
+    mounted(){
+        this.shopId = this.$route.query.id;
+
+        this.typeUrl = getUrlId("type");
+
+        //初始化
+        this.detailData();
+
+        //滚动事件
+        var _this = this;
+        window.onscroll = function(){
+            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+            if(scrollTop >= 80){
+                _this.tabTitle = 1;
+                $(".tel-msg").hide();
+            }else{
+                _this.tabTitle = 0;
+            }
+        },
+
+        setInterval(_ => {
+            if(this.dynamicIndex < this.dynamicList.length) {
+                this.dynamicIndex += 1;
+            } else {
+                this.dynamicIndex = 0;
+            }
+        }, 1000);
+
+    },
+    updated(){
+        // this.fenxiangFun();
+        let _this = this;
+        setTimeout(function () {
+           _this.showBanner();
+        },500);
+    },
+    // beforeRouteEnter (to, from, next) {
+    //     var u = navigator.userAgent;
+    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
+    //     if (isiOS && to.path !== location.pathname) {
+    //         // 此处不可使用location.replace
+    //         location.assign(to.fullPath)
+    //     } else {
+    //         next()
+    //     }
+    // },
+    methods:{
+
+        goShop(){
+            if(this.typeUrl == "1"){
+                this.$router.go(-1);
+            }else if(this.typeUrl == "2"){
+                this.$router.push({path:"/home"});
+            }else{
+                this.$router.push({path:"/loupan"});
+            }
+        },
+
+        // 为您推荐
+        go(id){
+            window.location.href = "http://"+window.location.host+"/loupandetail?"+"id="+id+"&type=1";
+            window.scrollTo('0','0');
+        },
+
+        // 详情列表
+        detailData() {
+            let _this = this;
+            let url = this.changeData() + '/office/appOfficeDetail'
+            var data = {
+                projectId: this.shopId,  //项目ID（shopId或officeId）
+                // loginUserId: localStorage.userId
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.basic = data.data.basic;
+                this.lbtArr = data.data.basic.imgs;
+                this.imgTotal = data.data.basic.imgs.length;
+                this.labelList = data.data.basic.label; 
+                this.supportingList = data.data.supportingList;
+                this.dynamicList = data.data.basic.dynamicList; //铺源动态
+                this.recommendedList = data.data.basic.recommendedList; //推荐列表
+                this.agentEntiy = data.data.agentEntiy; //经纪人信息
+                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
+                // console.log(this.basic);
+                // console.log(this.recommendedList);
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        tab1(){
+            $(".bannerBig").show();
+            var that = this;
+
+            if(that.sliderIndex == 0){
+                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
+            }
+            
+            var swiper2 = new Swiper('.swiper-container2', {
+                initialSlide : that.sliderIndex,
+                on: {
+                    slideChangeTransitionEnd: function(){
+                       that.sliderIndex = this.activeIndex;
+                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        tab2(){
+            this.num2 = 1;
+            $(".bannerBig").hide();
+        },
+
+        showBanner(){
+            var that = this;
+            var swiper1 = new Swiper('.swiper-container1', {
+                on: {
+                    slideChangeTransitionEnd: function(){
+                        that.sliderIndex = this.activeIndex;
+                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        telephone(){
+            window.location.href = 'tel:'+this.telephoneVal;
+        }
+
+    },
+    watch: {
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+@import "../../../static/css/shopDetail.scss";
+</style>
+
+<style>
+.layui-m-layer-tel .layui-m-layercont{
+    padding: 35px 30px;
+}
+.layui-m-layer-tel h2{
+    font-size: .32rem;
+    color: #333;
+    margin-bottom: .3rem;
+}
+.layui-m-layer-tel p{
+    font-size: .36rem;
+    color: #e8584f;
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
+    color: #898989;
+    background: #f7f8fa;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
+    color: #fff;
+    background: #64AAFF;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    border-radius: 0 0 5px 0;
+}
 </style>

src/components/shop/newshopdetail.vue

@@ -1,359 +1,359 @@
-<template>
-<div class="shopdetail">
-    <!-- 头部导航 -->
-    <div class="jiantou-title" v-show="tabTitle===1">
-        <span @click="goShop();"></span>{{basic.name}}
-    </div>
-    <!-- 轮播图 -->
-    <div class="banner">
-        <div class="backImgWrap" @click="goShop();">
-            <img src="../../../static/images/common/whiteBack.png" class="backImg">
-        </div>
-        <div class="wrap">
-            <ul class="txt">
-                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
-                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
-            </ul>
-            <div class="swiper-container swiper-container1 swiper-container-horizontal">
-                <div class="swiper-wrapper">
-                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
-                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
-                    </div>
-                </div>
-                <div class="swiper-pagination"></div>
-            </div>
-        </div>
-    </div>
-    <!-- 大轮播图 -->
-    <div class="bannerBig" @click="tab2()">
-        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
-        <div class="swiper-container swiper-container2 swiper-container-horizontal">
-            <div class="swiper-wrapper">
-                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
-            </div>
-            <div class="swiper-pagination"></div>
-        </div>
-    </div>
-    <!-- 商铺详情介绍 -->
-    <div class="detailBoxWrap">
-        <div class="topBox">
-            <h2>{{basic.name}}</h2>
-            <div class="labelWrap">
-                <ul>
-                    <li v-for="(item,index) in labelList">{{item}}</li>
-                </ul>
-            </div>
-            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
-            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
-            <div class="priceWrap clearfix">
-                <dl style="width: 50%;" v-if="basic.rent_type == 4">
-                    <dt>{{basic.monthly_rent}}{{basic.monthly_rent_u}}</dt>
-                    <dd>销售均价</dd>
-                </dl>
-
-                <dl style="width: 50%;" v-else>
-                    <dt>{{basic.daily_rent}}{{basic.daily_rent_u}}</dt>
-                    <dd>日租金</dd>
-                </dl>
-
-                <dl style="width: 50%;">
-                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
-                    <dd>建筑面积</dd>
-                </dl>
-            </div>
-        </div>
-        <div class="mainBox">
-            <dl class="dlTitle clearfix">
-                <dt>位置：</dt>
-                <dd>{{basic.real_address}}</dd>
-            </dl>
-            <div class="mainList clearfix">
-                <div class="divL fl">
-                    <dl class="clearfix">
-                        <dt>类型：</dt>
-                        <dd>{{basic.type}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>业态：</dt>
-                        <dd>{{basic.build_area}}{{basic.build_area_u}}</dd>
-                    </dl>
-                </div>
-            </div>
-            <dl class="dlType clearfix">
-                <dt>开发商：</dt>
-                <dd>{{basic.developer}}</dd>
-            </dl>
-        </div>
-    </div>
-    <!-- 铺源动态 -->
-    <div class="shopDynamic">
-        <span class="fl">铺源动态</span>
-        <!-- <span class="span2"></span> -->
-        <div class="scrollWrap fl">
-            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
-                <li v-for="item in dynamicList">{{item}}</li>  
-            </ul>
-            <ul class="scroll-content" v-else>
-                <li>暂无</li>
-            </ul>
-        </div>
-    </div>
-    <!-- 商铺描述 -->
-    <div class="shopDescribe">
-        <span>商铺描述</span>
-        <span class="span3">{{basic.introduce}}</span>
-    </div>
-    <!-- 查看经纪人 -->
-    <div class="telephoneWrap">
-        <dl>
-            <dt>
-                <img src="../../../static/images/shop/head.png">
-            </dt>
-            <dd>
-                <p>{{agentEntiy.name}}</p>
-                <h5>{{agentEntiy.company}}</h5>
-            </dd>
-        </dl>
-        <div class="telephone" @click="telephone();">
-            <i>
-                <img src="../../../static/images/shop/tel.png">
-            </i>
-            <span>电话</span>
-        </div>
-    </div>
-    <!-- 推荐列表 -->
-    <div class="recommendListWrap">
-        <h2>为你推荐</h2>
-        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
-            <dt>
-                <img :src="item.imgs" :onerror="defaultImg">
-            </dt>
-            <dd>
-                <h3>{{item.title}}</h3>
-                <h5>{{item.name}}</h5>
-                <h6><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
-                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                <p><span>合作佣金：</span>{{item.commission}}</p>
-            </dd>
-        </dl>
-    </div>
-
-</div>
-</template>
-
-<script>
-  import axios from 'axios';
-  import qs from 'qs';
-  export default {
-    data(){
-      return{
-        shopId: "",
-        basic: {},
-        lbtArr: [], //轮播图
-        imgTotal: 0,
-        num1: 1,
-        num2: 1,
-        sliderIndex: "",
-        activeIndex: "",
-        tabTitle: 0,
-
-        labelList: [], //标签
-        supportingList: [], //配套设施
-        dynamicList: [], //铺源动态
-
-        recommendedList: [], //推荐列表
-
-        agentEntiy: {}, //经纪人信息
-        telephoneVal: "", //经纪人电话
-
-        dynamicIndex: 0,
-
-        typeUrl: "",
-
-        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
-
-      }
-    },
-    computed: {
-        // 
-        top() {
-            return - this.dynamicIndex * 1.04 + 'rem';
-        }
-
-    },
-    watch:{
-
-    },
-    mounted(){
-        this.shopId = this.$route.query.id;
-
-        this.typeUrl = getUrlId("type");
-
-        //初始化
-        this.detailData();
-
-        //滚动事件
-        var _this = this;
-        window.onscroll = function(){
-            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
-            if(scrollTop >= 80){
-                _this.tabTitle = 1;
-                $(".tel-msg").hide();
-            }else{
-                _this.tabTitle = 0;
-            }
-        },
-
-        setInterval(_ => {
-            if(this.dynamicIndex < this.dynamicList.length) {
-                this.dynamicIndex += 1;
-            } else {
-                this.dynamicIndex = 0;
-            }
-        }, 1000);
-
-    },
-    updated(){
-        // this.fenxiangFun();
-        let _this = this;
-        setTimeout(function () {
-           _this.showBanner();
-        },500);
-    },
-    // beforeRouteEnter (to, from, next) {
-    //     var u = navigator.userAgent;
-    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
-    //     if (isiOS && to.path !== location.pathname) {
-    //         // 此处不可使用location.replace
-    //         location.assign(to.fullPath)
-    //     } else {
-    //         next()
-    //     }
-    // },
-    methods:{
-
-        goShop(){
-            if(this.typeUrl == "1"){
-                this.$router.go(-1);
-            }else if(this.typeUrl == "2"){
-                this.$router.push({path:"/home"});
-            }else{
-                this.$router.push({path:"/newshop"});
-            }
-        },
-
-        // 为您推荐
-        go(id){
-            window.location.href = "http://"+window.location.host+"/newshopdetail?"+"id="+id+"&type=1";
-            window.scrollTo('0','0');
-        },
-
-        // 详情列表
-        detailData() {
-            let _this = this;
-            let url = this.changeData() + '/shop/appShopDetail'
-            var data = {
-                projectId: this.shopId,  //项目ID（shopId或officeId）
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.basic = data.data.basic;
-                this.lbtArr = data.data.basic.imgs;
-                this.imgTotal = data.data.basic.imgs.length;
-                this.labelList = data.data.basic.label; 
-                this.supportingList = data.data.supportingList;
-                this.dynamicList = data.data.basic.dynamicList; //铺源动态
-                this.recommendedList = data.data.basic.recommendedList; //推荐列表
-                this.agentEntiy = data.data.agentEntiy; //经纪人信息
-                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        tab1(){
-            $(".bannerBig").show();
-            var that = this;
-
-            if(that.sliderIndex == 0){
-                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
-            }
-            
-            var swiper2 = new Swiper('.swiper-container2', {
-                initialSlide : that.sliderIndex,
-                on: {
-                    slideChangeTransitionEnd: function(){
-                       that.sliderIndex = this.activeIndex;
-                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        tab2(){
-            this.num2 = 1;
-            $(".bannerBig").hide();
-        },
-
-        showBanner(){
-            var that = this;
-            var swiper1 = new Swiper('.swiper-container1', {
-                on: {
-                    slideChangeTransitionEnd: function(){
-                        that.sliderIndex = this.activeIndex;
-                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        telephone(){
-            window.location.href = 'tel:'+this.telephoneVal;
-        }
-
-    },
-    watch: {
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-@import "../../../static/css/shopDetail.scss";
-</style>
-
-<style>
-.layui-m-layer-tel .layui-m-layercont{
-    padding: 35px 30px;
-}
-.layui-m-layer-tel h2{
-    font-size: .32rem;
-    color: #333;
-    margin-bottom: .3rem;
-}
-.layui-m-layer-tel p{
-    font-size: .36rem;
-    color: #e8584f;
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
-    color: #898989;
-    background: #f7f8fa;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
-    color: #fff;
-    background: #64AAFF;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    border-radius: 0 0 5px 0;
-}
-</style>
-
-
-
+<template>
+<div class="shopdetail">
+    <!-- 头部导航 -->
+    <div class="jiantou-title" v-show="tabTitle===1">
+        <span @click="goShop();"></span>{{basic.name}}
+    </div>
+    <!-- 轮播图 -->
+    <div class="banner">
+        <div class="backImgWrap" @click="goShop();">
+            <img src="../../../static/images/common/whiteBack.png" class="backImg">
+        </div>
+        <div class="wrap">
+            <ul class="txt">
+                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
+                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
+            </ul>
+            <div class="swiper-container swiper-container1 swiper-container-horizontal">
+                <div class="swiper-wrapper">
+                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
+                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
+                    </div>
+                </div>
+                <div class="swiper-pagination"></div>
+            </div>
+        </div>
+    </div>
+    <!-- 大轮播图 -->
+    <div class="bannerBig" @click="tab2()">
+        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
+        <div class="swiper-container swiper-container2 swiper-container-horizontal">
+            <div class="swiper-wrapper">
+                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
+            </div>
+            <div class="swiper-pagination"></div>
+        </div>
+    </div>
+    <!-- 商铺详情介绍 -->
+    <div class="detailBoxWrap">
+        <div class="topBox">
+            <h2>{{basic.name}}</h2>
+            <div class="labelWrap">
+                <ul>
+                    <li v-for="(item,index) in labelList">{{item}}</li>
+                </ul>
+            </div>
+            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
+            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
+            <div class="priceWrap clearfix">
+                <dl style="width: 50%;" v-if="basic.rent_type == 4">
+                    <dt>{{basic.monthly_rent}}{{basic.monthly_rent_u}}</dt>
+                    <dd>销售均价</dd>
+                </dl>
+
+                <dl style="width: 50%;" v-else>
+                    <dt>{{basic.daily_rent}}{{basic.daily_rent_u}}</dt>
+                    <dd>日租金</dd>
+                </dl>
+
+                <dl style="width: 50%;">
+                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
+                    <dd>建筑面积</dd>
+                </dl>
+            </div>
+        </div>
+        <div class="mainBox">
+            <dl class="dlTitle clearfix">
+                <dt>位置：</dt>
+                <dd>{{basic.real_address}}</dd>
+            </dl>
+            <div class="mainList clearfix">
+                <div class="divL fl">
+                    <dl class="clearfix">
+                        <dt>类型：</dt>
+                        <dd>{{basic.type}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>业态：</dt>
+                        <dd>{{basic.build_area}}{{basic.build_area_u}}</dd>
+                    </dl>
+                </div>
+            </div>
+            <dl class="dlType clearfix">
+                <dt>开发商：</dt>
+                <dd>{{basic.developer}}</dd>
+            </dl>
+        </div>
+    </div>
+    <!-- 铺源动态 -->
+    <div class="shopDynamic">
+        <span class="fl">铺源动态</span>
+        <!-- <span class="span2"></span> -->
+        <div class="scrollWrap fl">
+            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
+                <li v-for="item in dynamicList">{{item}}</li>  
+            </ul>
+            <ul class="scroll-content" v-else>
+                <li>暂无</li>
+            </ul>
+        </div>
+    </div>
+    <!-- 商铺描述 -->
+    <div class="shopDescribe">
+        <span>商铺描述</span>
+        <span class="span3">{{basic.introduce}}</span>
+    </div>
+    <!-- 查看经纪人 -->
+    <div class="telephoneWrap">
+        <dl>
+            <dt>
+                <img src="../../../static/images/shop/head.png">
+            </dt>
+            <dd>
+                <p>{{agentEntiy.name}}</p>
+                <h5>{{agentEntiy.company}}</h5>
+            </dd>
+        </dl>
+        <div class="telephone" @click="telephone();">
+            <i>
+                <img src="../../../static/images/shop/tel.png">
+            </i>
+            <span>电话</span>
+        </div>
+    </div>
+    <!-- 推荐列表 -->
+    <div class="recommendListWrap">
+        <h2>为你推荐</h2>
+        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
+            <dt>
+                <img :src="item.imgs" :onerror="defaultImg">
+            </dt>
+            <dd>
+                <h3>{{item.title}}</h3>
+                <h5>{{item.name}}</h5>
+                <h6><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
+                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                <p><span>合作佣金：</span>{{item.commission}}</p>
+            </dd>
+        </dl>
+    </div>
+
+</div>
+</template>
+
+<script>
+  import axios from 'axios';
+  import qs from 'qs';
+  export default {
+    data(){
+      return{
+        shopId: "",
+        basic: {},
+        lbtArr: [], //轮播图
+        imgTotal: 0,
+        num1: 1,
+        num2: 1,
+        sliderIndex: "",
+        activeIndex: "",
+        tabTitle: 0,
+
+        labelList: [], //标签
+        supportingList: [], //配套设施
+        dynamicList: [], //铺源动态
+
+        recommendedList: [], //推荐列表
+
+        agentEntiy: {}, //经纪人信息
+        telephoneVal: "", //经纪人电话
+
+        dynamicIndex: 0,
+
+        typeUrl: "",
+
+        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
+
+      }
+    },
+    computed: {
+        // 
+        top() {
+            return - this.dynamicIndex * 1.04 + 'rem';
+        }
+
+    },
+    watch:{
+
+    },
+    mounted(){
+        this.shopId = this.$route.query.id;
+
+        this.typeUrl = getUrlId("type");
+
+        //初始化
+        this.detailData();
+
+        //滚动事件
+        var _this = this;
+        window.onscroll = function(){
+            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+            if(scrollTop >= 80){
+                _this.tabTitle = 1;
+                $(".tel-msg").hide();
+            }else{
+                _this.tabTitle = 0;
+            }
+        },
+
+        setInterval(_ => {
+            if(this.dynamicIndex < this.dynamicList.length) {
+                this.dynamicIndex += 1;
+            } else {
+                this.dynamicIndex = 0;
+            }
+        }, 1000);
+
+    },
+    updated(){
+        // this.fenxiangFun();
+        let _this = this;
+        setTimeout(function () {
+           _this.showBanner();
+        },500);
+    },
+    // beforeRouteEnter (to, from, next) {
+    //     var u = navigator.userAgent;
+    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
+    //     if (isiOS && to.path !== location.pathname) {
+    //         // 此处不可使用location.replace
+    //         location.assign(to.fullPath)
+    //     } else {
+    //         next()
+    //     }
+    // },
+    methods:{
+
+        goShop(){
+            if(this.typeUrl == "1"){
+                this.$router.go(-1);
+            }else if(this.typeUrl == "2"){
+                this.$router.push({path:"/home"});
+            }else{
+                this.$router.push({path:"/newshop"});
+            }
+        },
+
+        // 为您推荐
+        go(id){
+            window.location.href = "http://"+window.location.host+"/newshopdetail?"+"id="+id+"&type=1";
+            window.scrollTo('0','0');
+        },
+
+        // 详情列表
+        detailData() {
+            let _this = this;
+            let url = this.changeData() + '/shop/appShopDetail'
+            var data = {
+                projectId: this.shopId,  //项目ID（shopId或officeId）
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.basic = data.data.basic;
+                this.lbtArr = data.data.basic.imgs;
+                this.imgTotal = data.data.basic.imgs.length;
+                this.labelList = data.data.basic.label; 
+                this.supportingList = data.data.supportingList;
+                this.dynamicList = data.data.basic.dynamicList; //铺源动态
+                this.recommendedList = data.data.basic.recommendedList; //推荐列表
+                this.agentEntiy = data.data.agentEntiy; //经纪人信息
+                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        tab1(){
+            $(".bannerBig").show();
+            var that = this;
+
+            if(that.sliderIndex == 0){
+                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
+            }
+            
+            var swiper2 = new Swiper('.swiper-container2', {
+                initialSlide : that.sliderIndex,
+                on: {
+                    slideChangeTransitionEnd: function(){
+                       that.sliderIndex = this.activeIndex;
+                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        tab2(){
+            this.num2 = 1;
+            $(".bannerBig").hide();
+        },
+
+        showBanner(){
+            var that = this;
+            var swiper1 = new Swiper('.swiper-container1', {
+                on: {
+                    slideChangeTransitionEnd: function(){
+                        that.sliderIndex = this.activeIndex;
+                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        telephone(){
+            window.location.href = 'tel:'+this.telephoneVal;
+        }
+
+    },
+    watch: {
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+@import "../../../static/css/shopDetail.scss";
+</style>
+
+<style>
+.layui-m-layer-tel .layui-m-layercont{
+    padding: 35px 30px;
+}
+.layui-m-layer-tel h2{
+    font-size: .32rem;
+    color: #333;
+    margin-bottom: .3rem;
+}
+.layui-m-layer-tel p{
+    font-size: .36rem;
+    color: #e8584f;
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
+    color: #898989;
+    background: #f7f8fa;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
+    color: #fff;
+    background: #64AAFF;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    border-radius: 0 0 5px 0;
+}
+</style>
+
+
+

src/components/shop/search.vue

@@ -1,290 +1,290 @@
-<template>
-<div class="searchWrap">
-    <div class="navSearch">
-        <div class="sou">
-            <form action="" class="">
-                <input class="keyword" :placeholder="placeholderVal" @focus="shiqu()" v-model="sousuo">
-                <b @click="sou()" v-show="close"></b>
-            </form>
-        </div>
-        <div class="cancle">
-            <span @click="back()">取消</span>
-        </div>
-    </div>
-
-    <div class="shoplist" v-show="noData===1" style="margin-top: .9rem;">
-        <div class="detail" ref="wrapper">
-            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
-                <ul>
-                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
-                        <div class="lisyImg">
-                            <img :src="item.imgs" :onerror="defaultImg">
-                        </div>
-                        <div class="listBox">
-                            <h3>{{item.title}}</h3>
-                            <h5>{{item.name}}</h5>
-                            <h6 v-show="rentType == '1'"><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
-                            <h6 v-show="rentType == '2'"><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
-                            <h6 v-show="rentType == '3'"><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
-                            <h6 v-show="rentType == '4'"><span>销售均价：</span>{{item.ave_price}}{{item.ave_price_u}}</h6>
-                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                            <p><span>合作佣金：</span>{{item.commission}}</p>
-                        </div>
-                    </li>
-                </ul>
-                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
-            </mt-loadmore>
-        </div>
-    </div>
-
-    <div class="noData" v-show="noData===2">
-        <div class="img"></div>
-        <p>您搜索的内容不存在</p>
-    </div>
-
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Indicator } from 'mint-ui';
-export default {
-    name: 'search',
-    data () {
-        return {
-            close: false,
-            sousuo: "",
-            listArr: [],
-            noData: "",
-            pageNum: 1,
-            pageSize: 10,
-            shopIndex: 1,
-            allLoaded: false,
-            more: false,
-            rentType: "",
-            placeholderVal: "",
-            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        }
-    },
-    mounted(){
-        this.rentType =  getUrlId("type");
-        var that = this;
-        $(".keyword").on('keypress',function(e) {
-            var keycode = e.keyCode;
-            if(keycode=='13') {
-                e.preventDefault();
-                //请求搜索接口
-                that.bianhua()
-            }
-        })
-
-        if(this.rentType == "1"){
-            this.placeholderVal = "请搜索在租写字楼";
-        }else if(this.rentType == "2"){
-            this.placeholderVal = "请搜索在售写字楼";
-        }else if(this.rentType == "3"){
-            this.placeholderVal = "请搜索在租写字楼新盘";
-        }else if(this.rentType == "4"){
-            this.placeholderVal = "请搜索在售写字楼新盘";
-        }
-
-    },
-    computed:{
-
-    },
-    methods:{
-        shiqu(){
-            this.close = true;
-        },
-        back(){
-            this.$router.go(-1);
-        },
-
-        goDetail(id){
-            if(this.rentType == "1"){
-                this.$router.push({path:"/zuloudetail",query:{id: id}});
-            }else if(this.rentType == "2"){
-                this.$router.push({path:"/shouloudetail",query:{id: id}});
-            }else{
-                this.$router.push({path:"/loupandetail",query:{id: id}});
-            }
-        },
-
-        sou(){
-            this.sousuo = "";
-            this.close = false;
-        },
-
-        bianhua(){
-            // 条件列表
-            let _this = this;
-            let url = this.changeData() + '/office/selectOfficePage';
-            var data = {
-                typeSale: this.rentType,  //1:出租 2:出售 3:新盘出租 4-新盘出售 
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.pageNum, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                keyWord: this.sousuo //搜索关键字
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                Indicator.open({
-                    text: '',
-                    spinnerType: 'fading-circle'
-                });
-                setTimeout(function () {
-                    Indicator.close();
-                },1000);
-
-                this.listArr = data.data.list; //列表
-
-                if(this.listArr.length==0){
-                    this.noData = 2;
-                }else{
-                    this.noData = 1;
-                }
-
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        //下拉刷新
-        loadTop(){
-            var _this = this;
-            this.shopIndex = 1;
-            var data = {
-                typeSale: this.rentType,  //1:出租 2:出售 3:新盘出租 4-新盘出售 
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: "1", //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                keyWord: this.sousuo //搜索关键字
-            }
-            setTimeout(function () {
-                _this.$http.post(_this.changeData() + '/office/selectOfficePage', qs.stringify(data)).then(function (data) {
-                    _this.listArr = data.data.list; //列表
-                    _this.$refs.loadmore.onTopLoaded();
-                }.bind(_this)).catch(function (err) {
-                    console.log("商店列表页面错误：", err)
-                })
-            }, 2000);
-        },
-
-        //上拉加载
-        loadBottom() {
-            var _this = this;
-            this.shopIndex++;
-            var data = {
-                typeSale: this.rentType,  //1:出租 2:出售 3:新盘出租 4-新盘出售 
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.shopIndex, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                keyWord: this.sousuo //搜索关键字
-            }
-            _this.$http.post(_this.changeData() + '/office/selectOfficePage',qs.stringify(data)).then(function(res){
-                _this.listArr = _this.listArr.concat(res.data.list);
-                if(res.data.list == ''){
-                    this.allLoaded = true;
-                }
-                _this.$refs.loadmore.onBottomLoaded();
-            }.bind(_this)).catch(function(err){
-                console.log("商店列表页面错误：",err);
-            })
-        },
-
-        handleBottomChange(){
-            var _this = this;
-            if(this.allLoaded == true){
-                this.more = true;
-                setTimeout(function () {
-                    _this.more = false;
-                },2000)
-            }
-        },
-    },
-    created() {
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-@import "../../../static/css/shopList.scss";
-.searchWrap{
-    width: 7.5rem;
-    height: 13.34rem;
-    overflow: scroll;
-    margin: 0 auto;
-    background: #fff;
-    position: relative;
-    .navSearch{
-        width: 7.5rem;
-        height: .9rem;
-        line-height: .9rem;
-        border-bottom: 0.01rem solid #eaeaea;
-        background: #fff;
-        position: fixed;
-        top: 0px;
-        left: auto;
-        .cancle{
-            width: 1rem;
-            float: left;
-            text-align: center;
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            span{
-                font-size: .26rem;
-                color: #111;
-            }
-        }
-        .sou{
-            width: 6.1rem;
-            float: left;
-            margin-left: .3rem;
-            input[type=search]::-webkit-input-placeholder{
-                line-height: .34rem;
-            }
-            input[type=search]::-webkit-search-cancel-button{
-                -webkit-appearance: none;
-            }
-            b{
-                position: absolute;
-                top: .33rem;
-                right: 1.3rem;
-                width: .26rem;
-                height: .26rem;
-                line-height: .26rem;
-                background: url("../../../static/images/common/close.png") no-repeat;
-                background-size: .26rem .26rem;
-            }
-            input{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                width: 5.8rem;
-                height: 0.6rem;
-                border-radius: 0.1rem;
-                background: #f0f1f3;
-                padding-left: .3rem;
-            }
-        }
-    }
-    .noData{
-        padding-top: 2.8rem;
-        text-align: center;
-        .img{
-            width: 1.6rem;
-            height: 1.6rem;
-            margin: 0 auto;
-            background: url("../../../static/images/common/noData.png") no-repeat;
-            background-size: 1.6rem 1.6rem;
-            margin-bottom: .4rem;
-        }
-        p{
-            font-size: .3rem;
-            color: #898989;
-        }
-    }
-}
-</style>
+<template>
+<div class="searchWrap">
+    <div class="navSearch">
+        <div class="sou">
+            <form action="" class="">
+                <input class="keyword" :placeholder="placeholderVal" @focus="shiqu()" v-model="sousuo">
+                <b @click="sou()" v-show="close"></b>
+            </form>
+        </div>
+        <div class="cancle">
+            <span @click="back()">取消</span>
+        </div>
+    </div>
+
+    <div class="shoplist" v-show="noData===1" style="margin-top: .9rem;">
+        <div class="detail" ref="wrapper">
+            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
+                <ul>
+                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
+                        <div class="lisyImg">
+                            <img :src="item.imgs" :onerror="defaultImg">
+                        </div>
+                        <div class="listBox">
+                            <h3>{{item.title}}</h3>
+                            <h5>{{item.name}}</h5>
+                            <h6 v-show="rentType == '1'"><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
+                            <h6 v-show="rentType == '2'"><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
+                            <h6 v-show="rentType == '3'"><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
+                            <h6 v-show="rentType == '4'"><span>销售均价：</span>{{item.ave_price}}{{item.ave_price_u}}</h6>
+                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                            <p><span>合作佣金：</span>{{item.commission}}</p>
+                        </div>
+                    </li>
+                </ul>
+                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
+            </mt-loadmore>
+        </div>
+    </div>
+
+    <div class="noData" v-show="noData===2">
+        <div class="img"></div>
+        <p>您搜索的内容不存在</p>
+    </div>
+
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Indicator } from 'mint-ui';
+export default {
+    name: 'search',
+    data () {
+        return {
+            close: false,
+            sousuo: "",
+            listArr: [],
+            noData: "",
+            pageNum: 1,
+            pageSize: 10,
+            shopIndex: 1,
+            allLoaded: false,
+            more: false,
+            rentType: "",
+            placeholderVal: "",
+            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        }
+    },
+    mounted(){
+        this.rentType =  getUrlId("type");
+        var that = this;
+        $(".keyword").on('keypress',function(e) {
+            var keycode = e.keyCode;
+            if(keycode=='13') {
+                e.preventDefault();
+                //请求搜索接口
+                that.bianhua()
+            }
+        })
+
+        if(this.rentType == "1"){
+            this.placeholderVal = "请搜索在租写字楼";
+        }else if(this.rentType == "2"){
+            this.placeholderVal = "请搜索在售写字楼";
+        }else if(this.rentType == "3"){
+            this.placeholderVal = "请搜索在租写字楼新盘";
+        }else if(this.rentType == "4"){
+            this.placeholderVal = "请搜索在售写字楼新盘";
+        }
+
+    },
+    computed:{
+
+    },
+    methods:{
+        shiqu(){
+            this.close = true;
+        },
+        back(){
+            this.$router.go(-1);
+        },
+
+        goDetail(id){
+            if(this.rentType == "1"){
+                this.$router.push({path:"/zuloudetail",query:{id: id}});
+            }else if(this.rentType == "2"){
+                this.$router.push({path:"/shouloudetail",query:{id: id}});
+            }else{
+                this.$router.push({path:"/loupandetail",query:{id: id}});
+            }
+        },
+
+        sou(){
+            this.sousuo = "";
+            this.close = false;
+        },
+
+        bianhua(){
+            // 条件列表
+            let _this = this;
+            let url = this.changeData() + '/office/selectOfficePage';
+            var data = {
+                typeSale: this.rentType,  //1:出租 2:出售 3:新盘出租 4-新盘出售 
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.pageNum, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                keyWord: this.sousuo //搜索关键字
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                Indicator.open({
+                    text: '',
+                    spinnerType: 'fading-circle'
+                });
+                setTimeout(function () {
+                    Indicator.close();
+                },1000);
+
+                this.listArr = data.data.list; //列表
+
+                if(this.listArr.length==0){
+                    this.noData = 2;
+                }else{
+                    this.noData = 1;
+                }
+
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        //下拉刷新
+        loadTop(){
+            var _this = this;
+            this.shopIndex = 1;
+            var data = {
+                typeSale: this.rentType,  //1:出租 2:出售 3:新盘出租 4-新盘出售 
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: "1", //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                keyWord: this.sousuo //搜索关键字
+            }
+            setTimeout(function () {
+                _this.$http.post(_this.changeData() + '/office/selectOfficePage', qs.stringify(data)).then(function (data) {
+                    _this.listArr = data.data.list; //列表
+                    _this.$refs.loadmore.onTopLoaded();
+                }.bind(_this)).catch(function (err) {
+                    console.log("商店列表页面错误：", err)
+                })
+            }, 2000);
+        },
+
+        //上拉加载
+        loadBottom() {
+            var _this = this;
+            this.shopIndex++;
+            var data = {
+                typeSale: this.rentType,  //1:出租 2:出售 3:新盘出租 4-新盘出售 
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.shopIndex, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                keyWord: this.sousuo //搜索关键字
+            }
+            _this.$http.post(_this.changeData() + '/office/selectOfficePage',qs.stringify(data)).then(function(res){
+                _this.listArr = _this.listArr.concat(res.data.list);
+                if(res.data.list == ''){
+                    this.allLoaded = true;
+                }
+                _this.$refs.loadmore.onBottomLoaded();
+            }.bind(_this)).catch(function(err){
+                console.log("商店列表页面错误：",err);
+            })
+        },
+
+        handleBottomChange(){
+            var _this = this;
+            if(this.allLoaded == true){
+                this.more = true;
+                setTimeout(function () {
+                    _this.more = false;
+                },2000)
+            }
+        },
+    },
+    created() {
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+@import "../../../static/css/shopList.scss";
+.searchWrap{
+    width: 7.5rem;
+    height: 13.34rem;
+    overflow: scroll;
+    margin: 0 auto;
+    background: #fff;
+    position: relative;
+    .navSearch{
+        width: 7.5rem;
+        height: .9rem;
+        line-height: .9rem;
+        border-bottom: 0.01rem solid #eaeaea;
+        background: #fff;
+        position: fixed;
+        top: 0px;
+        left: auto;
+        .cancle{
+            width: 1rem;
+            float: left;
+            text-align: center;
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            span{
+                font-size: .26rem;
+                color: #111;
+            }
+        }
+        .sou{
+            width: 6.1rem;
+            float: left;
+            margin-left: .3rem;
+            input[type=search]::-webkit-input-placeholder{
+                line-height: .34rem;
+            }
+            input[type=search]::-webkit-search-cancel-button{
+                -webkit-appearance: none;
+            }
+            b{
+                position: absolute;
+                top: .33rem;
+                right: 1.3rem;
+                width: .26rem;
+                height: .26rem;
+                line-height: .26rem;
+                background: url("../../../static/images/common/close.png") no-repeat;
+                background-size: .26rem .26rem;
+            }
+            input{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                width: 5.8rem;
+                height: 0.6rem;
+                border-radius: 0.1rem;
+                background: #f0f1f3;
+                padding-left: .3rem;
+            }
+        }
+    }
+    .noData{
+        padding-top: 2.8rem;
+        text-align: center;
+        .img{
+            width: 1.6rem;
+            height: 1.6rem;
+            margin: 0 auto;
+            background: url("../../../static/images/common/noData.png") no-repeat;
+            background-size: 1.6rem 1.6rem;
+            margin-bottom: .4rem;
+        }
+        p{
+            font-size: .3rem;
+            color: #898989;
+        }
+    }
+}
+</style>

src/components/shop/searchshop.vue

@@ -1,291 +1,291 @@
-<template>
-<div class="searchWrap">
-    <div class="navSearch">
-        <div class="sou">
-            <form action="" class="">
-                <input class="keyword" :placeholder="placeholderVal" @focus="shiqu()" v-model="sousuo">
-                <b @click="sou()" v-show="close"></b>
-            </form>
-        </div>
-        <div class="cancle">
-            <span @click="back()">取消</span>
-        </div>
-    </div>
-
-    <div class="shoplist" v-show="noData===1" style="margin-top: .9rem;">
-        <div class="detail" ref="wrapper">
-            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
-                <ul>
-                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
-                        <div class="lisyImg">
-                            <img :src="item.imgs" :onerror="defaultImg">
-                        </div>
-                        <div class="listBox">
-                            <h3>{{item.title}}</h3>
-                            <h5>{{item.name}}</h5>
-                            <h6 v-show="rentType == '1'"><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
-                            <h6 v-show="rentType == '2'"><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
-                            <h6 v-show="rentType == '3'"><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
-                            <h6 v-show="rentType == '4'"><span>销售均价：</span>{{item.ave_price}}{{item.ave_price_u}}</h6>
-                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                            <p><span>合作佣金：</span>{{item.commission}}</p>
-                        </div>
-                    </li>
-                </ul>
-                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
-            </mt-loadmore>
-        </div>
-    </div>
-
-    <div class="noData" v-show="noData===2">
-        <div class="img"></div>
-        <p>您搜索的内容不存在</p>
-    </div>
-
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Indicator } from 'mint-ui';
-export default {
-    name: 'search',
-    data () {
-        return {
-            close: false,
-            sousuo: "",
-            listArr: [],
-            noData: "",
-            pageNum: 1,
-            pageSize: 10,
-            shopIndex: 1,
-            allLoaded: false,
-            more: false,
-            rentType: "",
-            placeholderVal: "",
-            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        }
-    },
-    mounted(){
-        this.rentType =  getUrlId("type");
-        var that = this;
-        $(".keyword").on('keypress',function(e) {
-            var keycode = e.keyCode;
-            if(keycode=='13') {
-                e.preventDefault();
-                //请求搜索接口
-                that.bianhua()
-            }
-        })
-
-        if(this.rentType == "1"){
-            this.placeholderVal = "请搜索在租铺源";
-        }else if(this.rentType == "2"){
-            this.placeholderVal = "请搜索在售铺源";
-        }else if(this.rentType == "3"){
-            this.placeholderVal = "请搜索在租商铺新盘";
-        }else if(this.rentType == "4"){
-            this.placeholderVal = "请搜索在售商铺新盘";
-        }
-
-    },
-    computed:{
-
-    },
-    methods:{
-        shiqu(){
-            this.close = true;
-        },
-        back(){
-            this.$router.go(-1);
-        },
-
-        goDetail(id){
-            if(this.rentType == "1"){
-                this.$router.push({path:"/zushopdetail",query:{id: id}});
-            }else if(this.rentType == "2"){
-                this.$router.push({path:"/sellshopdetail",query:{id: id}});
-            }else{
-                this.$router.push({path:"/newshopdetail",query:{id: id}});
-            }
-        },
-
-        sou(){
-            this.sousuo = "";
-            this.close = false;
-        },
-
-        bianhua(){
-            // 条件列表
-            let _this = this;
-            let url = this.changeData() + '/shop/selectShopPage'
-            var data = {
-                rentType: this.rentType, // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售 
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.pageNum, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                keyWord: this.sousuo //搜索关键字
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                Indicator.open({
-                    text: '',
-                    spinnerType: 'fading-circle'
-                });
-                setTimeout(function () {
-                    Indicator.close();
-                },1000);
-
-                this.listArr = data.data.list; //列表
-
-                if(this.listArr.length==0){
-                    this.noData = 2;
-                }else{
-                    this.noData = 1;
-                }
-
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        //下拉刷新
-        loadTop(){
-            var _this = this;
-            this.shopIndex = 1;
-            var data = {
-                rentType: this.rentType, // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售 
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: "1", //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                keyWord: this.sousuo //搜索关键字
-            }
-            setTimeout(function () {
-                _this.$http.post(_this.changeData() + '/shop/selectShopPage', qs.stringify(data)).then(function (data) {
-                    _this.listArr = data.data.list; //列表
-                    _this.$refs.loadmore.onTopLoaded();
-                }.bind(_this)).catch(function (err) {
-                    console.log("商店列表页面错误：", err)
-                })
-            }, 2000);
-        },
-
-        //上拉加载
-        loadBottom() {
-            var _this = this;
-            this.shopIndex++;
-            var data = {
-                rentType: this.rentType, // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售 
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.shopIndex, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                keyWord: this.sousuo //搜索关键字
-            }
-            _this.$http.post(_this.changeData() + '/shop/selectShopPage',qs.stringify(data)).then(function(res){
-                _this.listArr = _this.listArr.concat(res.data.list);
-                if(res.data.list == ''){
-                    this.allLoaded = true;
-                }
-                _this.$refs.loadmore.onBottomLoaded();
-            }.bind(_this)).catch(function(err){
-                console.log("商店列表页面错误：",err);
-            })
-        },
-
-        handleBottomChange(){
-            var _this = this;
-            if(this.allLoaded == true){
-                this.more = true;
-                setTimeout(function () {
-                    _this.more = false;
-                },2000)
-            }
-        },
-    },
-    created() {
-
-    }
-}
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style lang="scss" type="text/scss" scoped>
-@import "../../../static/css/shopList.scss";
-.searchWrap{
-    width: 7.5rem;
-    height: 13.34rem;
-    overflow: scroll;
-    margin: 0 auto;
-    background: #fff;
-    position: relative;
-    .navSearch{
-        width: 7.5rem;
-        height: .9rem;
-        line-height: .9rem;
-        border-bottom: 0.01rem solid #eaeaea;
-        background: #fff;
-        position: fixed;
-        top: 0px;
-        left: auto;
-        .cancle{
-            width: 1rem;
-            float: left;
-            text-align: center;
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            span{
-                font-size: .26rem;
-                color: #111;
-            }
-        }
-        .sou{
-            width: 6.1rem;
-            float: left;
-            margin-left: .3rem;
-            input[type=search]::-webkit-input-placeholder{
-                line-height: .34rem;
-            }
-            input[type=search]::-webkit-search-cancel-button{
-                -webkit-appearance: none;
-            }
-            b{
-                position: absolute;
-                top: .33rem;
-                right: 1.3rem;
-                width: .26rem;
-                height: .26rem;
-                line-height: .26rem;
-                background: url("../../../static/images/common/close.png") no-repeat;
-                background-size: .26rem .26rem;
-            }
-            input{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                width: 5.8rem;
-                height: 0.6rem;
-                border-radius: 0.1rem;
-                background: #f0f1f3;
-                padding-left: .3rem;
-            }
-        }
-    }
-    .noData{
-        padding-top: 2.8rem;
-        text-align: center;
-        .img{
-            width: 1.6rem;
-            height: 1.6rem;
-            margin: 0 auto;
-            background: url("../../../static/images/common/noData.png") no-repeat;
-            background-size: 1.6rem 1.6rem;
-            margin-bottom: .4rem;
-        }
-        p{
-            font-size: .3rem;
-            color: #898989;
-        }
-    }
-}
-</style>
+<template>
+<div class="searchWrap">
+    <div class="navSearch">
+        <div class="sou">
+            <form action="" class="">
+                <input class="keyword" :placeholder="placeholderVal" @focus="shiqu()" v-model="sousuo">
+                <b @click="sou()" v-show="close"></b>
+            </form>
+        </div>
+        <div class="cancle">
+            <span @click="back()">取消</span>
+        </div>
+    </div>
+
+    <div class="shoplist" v-show="noData===1" style="margin-top: .9rem;">
+        <div class="detail" ref="wrapper">
+            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
+                <ul>
+                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
+                        <div class="lisyImg">
+                            <img :src="item.imgs" :onerror="defaultImg">
+                        </div>
+                        <div class="listBox">
+                            <h3>{{item.title}}</h3>
+                            <h5>{{item.name}}</h5>
+                            <h6 v-show="rentType == '1'"><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
+                            <h6 v-show="rentType == '2'"><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
+                            <h6 v-show="rentType == '3'"><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
+                            <h6 v-show="rentType == '4'"><span>销售均价：</span>{{item.ave_price}}{{item.ave_price_u}}</h6>
+                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                            <p><span>合作佣金：</span>{{item.commission}}</p>
+                        </div>
+                    </li>
+                </ul>
+                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
+            </mt-loadmore>
+        </div>
+    </div>
+
+    <div class="noData" v-show="noData===2">
+        <div class="img"></div>
+        <p>您搜索的内容不存在</p>
+    </div>
+
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Indicator } from 'mint-ui';
+export default {
+    name: 'search',
+    data () {
+        return {
+            close: false,
+            sousuo: "",
+            listArr: [],
+            noData: "",
+            pageNum: 1,
+            pageSize: 10,
+            shopIndex: 1,
+            allLoaded: false,
+            more: false,
+            rentType: "",
+            placeholderVal: "",
+            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        }
+    },
+    mounted(){
+        this.rentType =  getUrlId("type");
+        var that = this;
+        $(".keyword").on('keypress',function(e) {
+            var keycode = e.keyCode;
+            if(keycode=='13') {
+                e.preventDefault();
+                //请求搜索接口
+                that.bianhua()
+            }
+        })
+
+        if(this.rentType == "1"){
+            this.placeholderVal = "请搜索在租铺源";
+        }else if(this.rentType == "2"){
+            this.placeholderVal = "请搜索在售铺源";
+        }else if(this.rentType == "3"){
+            this.placeholderVal = "请搜索在租商铺新盘";
+        }else if(this.rentType == "4"){
+            this.placeholderVal = "请搜索在售商铺新盘";
+        }
+
+    },
+    computed:{
+
+    },
+    methods:{
+        shiqu(){
+            this.close = true;
+        },
+        back(){
+            this.$router.go(-1);
+        },
+
+        goDetail(id){
+            if(this.rentType == "1"){
+                this.$router.push({path:"/zushopdetail",query:{id: id}});
+            }else if(this.rentType == "2"){
+                this.$router.push({path:"/sellshopdetail",query:{id: id}});
+            }else{
+                this.$router.push({path:"/newshopdetail",query:{id: id}});
+            }
+        },
+
+        sou(){
+            this.sousuo = "";
+            this.close = false;
+        },
+
+        bianhua(){
+            // 条件列表
+            let _this = this;
+            let url = this.changeData() + '/shop/selectShopPage'
+            var data = {
+                rentType: this.rentType, // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售 
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.pageNum, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                keyWord: this.sousuo //搜索关键字
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                Indicator.open({
+                    text: '',
+                    spinnerType: 'fading-circle'
+                });
+                setTimeout(function () {
+                    Indicator.close();
+                },1000);
+
+                this.listArr = data.data.list; //列表
+
+                if(this.listArr.length==0){
+                    this.noData = 2;
+                }else{
+                    this.noData = 1;
+                }
+
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        //下拉刷新
+        loadTop(){
+            var _this = this;
+            this.shopIndex = 1;
+            var data = {
+                rentType: this.rentType, // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售 
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: "1", //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                keyWord: this.sousuo //搜索关键字
+            }
+            setTimeout(function () {
+                _this.$http.post(_this.changeData() + '/shop/selectShopPage', qs.stringify(data)).then(function (data) {
+                    _this.listArr = data.data.list; //列表
+                    _this.$refs.loadmore.onTopLoaded();
+                }.bind(_this)).catch(function (err) {
+                    console.log("商店列表页面错误：", err)
+                })
+            }, 2000);
+        },
+
+        //上拉加载
+        loadBottom() {
+            var _this = this;
+            this.shopIndex++;
+            var data = {
+                rentType: this.rentType, // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售 
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.shopIndex, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                keyWord: this.sousuo //搜索关键字
+            }
+            _this.$http.post(_this.changeData() + '/shop/selectShopPage',qs.stringify(data)).then(function(res){
+                _this.listArr = _this.listArr.concat(res.data.list);
+                if(res.data.list == ''){
+                    this.allLoaded = true;
+                }
+                _this.$refs.loadmore.onBottomLoaded();
+            }.bind(_this)).catch(function(err){
+                console.log("商店列表页面错误：",err);
+            })
+        },
+
+        handleBottomChange(){
+            var _this = this;
+            if(this.allLoaded == true){
+                this.more = true;
+                setTimeout(function () {
+                    _this.more = false;
+                },2000)
+            }
+        },
+    },
+    created() {
+
+    }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" type="text/scss" scoped>
+@import "../../../static/css/shopList.scss";
+.searchWrap{
+    width: 7.5rem;
+    height: 13.34rem;
+    overflow: scroll;
+    margin: 0 auto;
+    background: #fff;
+    position: relative;
+    .navSearch{
+        width: 7.5rem;
+        height: .9rem;
+        line-height: .9rem;
+        border-bottom: 0.01rem solid #eaeaea;
+        background: #fff;
+        position: fixed;
+        top: 0px;
+        left: auto;
+        .cancle{
+            width: 1rem;
+            float: left;
+            text-align: center;
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            span{
+                font-size: .26rem;
+                color: #111;
+            }
+        }
+        .sou{
+            width: 6.1rem;
+            float: left;
+            margin-left: .3rem;
+            input[type=search]::-webkit-input-placeholder{
+                line-height: .34rem;
+            }
+            input[type=search]::-webkit-search-cancel-button{
+                -webkit-appearance: none;
+            }
+            b{
+                position: absolute;
+                top: .33rem;
+                right: 1.3rem;
+                width: .26rem;
+                height: .26rem;
+                line-height: .26rem;
+                background: url("../../../static/images/common/close.png") no-repeat;
+                background-size: .26rem .26rem;
+            }
+            input{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                width: 5.8rem;
+                height: 0.6rem;
+                border-radius: 0.1rem;
+                background: #f0f1f3;
+                padding-left: .3rem;
+            }
+        }
+    }
+    .noData{
+        padding-top: 2.8rem;
+        text-align: center;
+        .img{
+            width: 1.6rem;
+            height: 1.6rem;
+            margin: 0 auto;
+            background: url("../../../static/images/common/noData.png") no-repeat;
+            background-size: 1.6rem 1.6rem;
+            margin-bottom: .4rem;
+        }
+        p{
+            font-size: .3rem;
+            color: #898989;
+        }
+    }
+}
+</style>

src/components/shop/sellshop.vue

@@ -1,392 +1,392 @@
-<template>
-<div class="shopWrap">
-    <div class="shopTop">
-        <dl class="searchNav">
-            <dt>
-                <img src="../../../static/images/common/back.png" @click="goHome();">
-            </dt>
-            <dd @click="goSearch();">
-                <img src="../../../static/images/shop/search.png">
-                <span>请搜索在售铺源</span>
-            </dd>
-        </dl>
-        <div class="shaixuan">
-            <div class="list">
-                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
-
-                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
-
-                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
-
-                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
-            </div>
-
-            <div class="listContent">
-                <ul class="one">
-                    <!-- 区域 -->
-                    <li class="oneList" v-show="tab===0">
-                        <ul class="two areaBox">
-                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
-                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                    <!-- 业态 -->
-                    <li class="oneList" v-show="tab===1">
-                        <ul class="four">
-                            <li v-for="(item,index) in yeTaiList" @click="yetaiChildFun($event,item)">{{item.d_name}}</li>
-                        </ul>
-                    </li>
-                    <!-- 面积 -->
-                    <li class="oneList" v-show="tab===2">
-                        <ul class="four">
-                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
-                        </ul>
-                    </li>
-                    <!-- 价格 -->
-                    <li class="oneList" v-show="tab===3">
-                        <ul class="two twoPrice">
-                            <li class="twoChild" v-for="(item,index) in price">
-                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in priceList" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                </ul>
-            </div>
-        </div>
-    </div>
-
-    <div class="shoplist" v-show="noData===1">
-        <div class="detail" ref="wrapper">
-            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
-                <ul>
-                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
-                        <div class="lisyImg">
-                            <img :src="item.imgs" :onerror="defaultImg">
-                        </div>
-                        <div class="listBox">
-                            <h3>{{item.title}}</h3>
-                            <h5>{{item.name}}</h5>
-                            <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
-                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                            <p><span>合作佣金：</span>{{item.commission}}</p>
-                        </div>
-                    </li>
-                </ul>
-                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
-            </mt-loadmore>
-        </div>
-    </div>
-
-    <div class="noData" v-show="noData===0">
-        <dl>
-            <dt>
-                <img src="../../../static/images/common/noData.png">
-            </dt>
-            <p>暂无数据</p>
-        </dl>
-    </div>
-
-</div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Indicator } from 'mint-ui';
-export default {
-    name: '',
-    data () {
-        return {
-            noData: 1,
-            tab: "",
-            pageSize: 10,
-            pageNum: 1,
-            shopIndex: 1,
-            allLoaded: false,
-            more: false,
-
-            num: 0,
-            num1: 0,
-            num2: 0,
-
-            areaList: [], //筛选区域
-            areaTxt: "", //区域文字
-            areaChild: [], //筛选区域子集
-            yeTaiList: [], //业态
-            yetaiChild: [], //业态子集
-            yeTaiTxt: "", //业态文案
-            mianjiList: [], //面积
-            mianjiTxt: "", //面积文案
-            price:[
-                {"name": "总价"},
-            ],
-            priceList: [],
-            priceChild: [], //价格子集
-            priceTxt: "", //价格文案
-            
-            areaId: "", //区域ID
-            businessAreaId: "", //商圈ID
-            typeId: "", //类型ID
-            yeTaiId: "", //行业ID
-            sonManageTypeId: "", //业态子集
-            mianjiId: "", //面积ID
-            priceId: "", //价格Id
-            
-            listArr: [],
-
-            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-       }
-    },
-    computed:{
-
-    },
-    methods:{
-
-        goHome(){
-            this.$router.push({path:"/home"});
-        },
-        goDetail(id){
-            this.$router.push({path:"/sellshopdetail",query:{id: id}});
-        },
-        goSearch(){
-            this.$router.push({path:"/searchshop",query:{type: "2"}});
-        },
-
-        // 条件列表
-        selectData() {
-            let _this = this;
-            let url = this.changeData() + '/shop/findShopSaleSearch'
-            var data = {
-                cityId: sessionStorage.cityId || 110100, //城市ID 
-                channel: "1",
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.areaList = data.data.areaList; //区域
-                this.yeTaiList = data.data.typeList; //业态
-                this.mianjiList = data.data.mianjiList; //面积
-                this.priceList = data.data.priceList; //总价
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        // 条件列表
-        listData() {
-            let _this = this;
-            let url = this.changeData() + '/shop/selectShopPage'
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleMianjiId: this.mianjiId, //面积ID
-                titleTotalPriceId: this.priceId, //总价Id
-                titleTypeId: this.yeTaiId, //业态（类型）
-                rentType: "2", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.pageNum, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-
-                Indicator.open({
-                    text: '',
-                    spinnerType: 'fading-circle'
-                });
-                setTimeout(function () {
-                    Indicator.close();
-                },1000);
-
-                this.listArr = data.data.list; //列表
-
-                if(this.listArr.length==0){
-                    this.noData = 0;
-                }else{
-                    this.noData = 1;
-                }
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        //下拉刷新
-        loadTop(){
-            $(".shoplist ul li").removeClass("cur");
-            var _this = this;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleTypeId: this.yeTaiId, //业态（类型）
-                titleMianjiId: this.mianjiId, //面积ID
-                titleTotalPriceId: this.priceId, //总价Id
-                rentType: "2", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: "1", //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            setTimeout(function () {
-                _this.$http.post(_this.changeData() + '/shop/selectShopPage', qs.stringify(data)).then(function (data) {
-                    _this.listArr = data.data.list; //列表
-                    _this.$refs.loadmore.onTopLoaded();
-                }.bind(_this)).catch(function (err) {
-                    console.log("商店列表页面错误：", err)
-                })
-            }, 2000);
-        },
-
-        //上拉加载
-        loadBottom() {
-            var _this = this;
-            this.shopIndex++;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleTypeId: this.yeTaiId, //业态（类型）
-                titleMianjiId: this.mianjiId, //面积ID
-                titleTotalPriceId: this.priceId, //总价Id
-                rentType: "2", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.shopIndex, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            _this.$http.post(_this.changeData() + '/shop/selectShopPage',qs.stringify(data)).then(function(res){
-                _this.listArr = _this.listArr.concat(res.data.list);
-                if(res.data.list == ''){
-                    this.allLoaded = true;
-                }
-                _this.$refs.loadmore.onBottomLoaded();
-            }.bind(_this)).catch(function(err){
-                console.log("商店列表页面错误：",err);
-            })
-        },
-        handleBottomChange(){
-            var _this = this;
-            if(this.allLoaded == true){
-                this.more = true;
-                setTimeout(function () {
-                    _this.more = false;
-                },2000)
-            }
-        },
-
-        tab1(e){
-            if($(e.srcElement).hasClass("cur")){
-               this.tab = "";
-            }else{
-                this.tab = 0;
-                if(this.num === 0){
-                   $(".areaBox li").eq(0).children(".first").click();
-                   this.num++;
-                }
-            }
-        },
-        tab2(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 1;
-                if(this.num2 === 0){
-                    $(".twoYetai li").eq(0).children(".first2").click();
-                    this.num2++;
-                }
-            }
-        },
-        tab3(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 2;
-            }
-        },
-        tab4(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 3;
-                if(this.num1 === 0){
-                    $(".twoPrice li").eq(0).children(".first1").click();
-                    this.num1++;
-                }
-            }
-        },
-
-        // 区域筛选
-        quyuFun(e,item){
-            this.areaChild = item;
-            this.areaId = item.id;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        quyuChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.businessAreaId = item.id;
-            this.areaTxt = item.name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 业态筛选
-        yetaiFun(e,item){
-            this.yetaiChild = item;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        yetaiChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.yeTaiId = item.d_value;
-            this.yeTaiTxt = item.d_name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 面积
-        mianjiFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.mianjiId = item.id;
-            this.mianjiTxt = item.show_text;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 价格
-        priceFun(e,index){
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        priceChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.priceId = item.id;
-            this.priceTxt = item.show_text;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-    },
-    mounted() {
-        // 条件列表
-        this.selectData();
-        this.listData();
-    },
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-@import "../../../static/css/shopList.scss";
-</style>
-
+<template>
+<div class="shopWrap">
+    <div class="shopTop">
+        <dl class="searchNav">
+            <dt>
+                <img src="../../../static/images/common/back.png" @click="goHome();">
+            </dt>
+            <dd @click="goSearch();">
+                <img src="../../../static/images/shop/search.png">
+                <span>请搜索在售铺源</span>
+            </dd>
+        </dl>
+        <div class="shaixuan">
+            <div class="list">
+                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
+
+                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
+
+                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
+
+                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
+            </div>
+
+            <div class="listContent">
+                <ul class="one">
+                    <!-- 区域 -->
+                    <li class="oneList" v-show="tab===0">
+                        <ul class="two areaBox">
+                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
+                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                    <!-- 业态 -->
+                    <li class="oneList" v-show="tab===1">
+                        <ul class="four">
+                            <li v-for="(item,index) in yeTaiList" @click="yetaiChildFun($event,item)">{{item.d_name}}</li>
+                        </ul>
+                    </li>
+                    <!-- 面积 -->
+                    <li class="oneList" v-show="tab===2">
+                        <ul class="four">
+                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
+                        </ul>
+                    </li>
+                    <!-- 价格 -->
+                    <li class="oneList" v-show="tab===3">
+                        <ul class="two twoPrice">
+                            <li class="twoChild" v-for="(item,index) in price">
+                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in priceList" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+
+    <div class="shoplist" v-show="noData===1">
+        <div class="detail" ref="wrapper">
+            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
+                <ul>
+                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
+                        <div class="lisyImg">
+                            <img :src="item.imgs" :onerror="defaultImg">
+                        </div>
+                        <div class="listBox">
+                            <h3>{{item.title}}</h3>
+                            <h5>{{item.name}}</h5>
+                            <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
+                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                            <p><span>合作佣金：</span>{{item.commission}}</p>
+                        </div>
+                    </li>
+                </ul>
+                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
+            </mt-loadmore>
+        </div>
+    </div>
+
+    <div class="noData" v-show="noData===0">
+        <dl>
+            <dt>
+                <img src="../../../static/images/common/noData.png">
+            </dt>
+            <p>暂无数据</p>
+        </dl>
+    </div>
+
+</div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Indicator } from 'mint-ui';
+export default {
+    name: '',
+    data () {
+        return {
+            noData: 1,
+            tab: "",
+            pageSize: 10,
+            pageNum: 1,
+            shopIndex: 1,
+            allLoaded: false,
+            more: false,
+
+            num: 0,
+            num1: 0,
+            num2: 0,
+
+            areaList: [], //筛选区域
+            areaTxt: "", //区域文字
+            areaChild: [], //筛选区域子集
+            yeTaiList: [], //业态
+            yetaiChild: [], //业态子集
+            yeTaiTxt: "", //业态文案
+            mianjiList: [], //面积
+            mianjiTxt: "", //面积文案
+            price:[
+                {"name": "总价"},
+            ],
+            priceList: [],
+            priceChild: [], //价格子集
+            priceTxt: "", //价格文案
+            
+            areaId: "", //区域ID
+            businessAreaId: "", //商圈ID
+            typeId: "", //类型ID
+            yeTaiId: "", //行业ID
+            sonManageTypeId: "", //业态子集
+            mianjiId: "", //面积ID
+            priceId: "", //价格Id
+            
+            listArr: [],
+
+            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+       }
+    },
+    computed:{
+
+    },
+    methods:{
+
+        goHome(){
+            this.$router.push({path:"/home"});
+        },
+        goDetail(id){
+            this.$router.push({path:"/sellshopdetail",query:{id: id}});
+        },
+        goSearch(){
+            this.$router.push({path:"/searchshop",query:{type: "2"}});
+        },
+
+        // 条件列表
+        selectData() {
+            let _this = this;
+            let url = this.changeData() + '/shop/findShopSaleSearch'
+            var data = {
+                cityId: sessionStorage.cityId || 110100, //城市ID 
+                channel: "1",
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.areaList = data.data.areaList; //区域
+                this.yeTaiList = data.data.typeList; //业态
+                this.mianjiList = data.data.mianjiList; //面积
+                this.priceList = data.data.priceList; //总价
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        // 条件列表
+        listData() {
+            let _this = this;
+            let url = this.changeData() + '/shop/selectShopPage'
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleMianjiId: this.mianjiId, //面积ID
+                titleTotalPriceId: this.priceId, //总价Id
+                titleTypeId: this.yeTaiId, //业态（类型）
+                rentType: "2", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.pageNum, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+
+                Indicator.open({
+                    text: '',
+                    spinnerType: 'fading-circle'
+                });
+                setTimeout(function () {
+                    Indicator.close();
+                },1000);
+
+                this.listArr = data.data.list; //列表
+
+                if(this.listArr.length==0){
+                    this.noData = 0;
+                }else{
+                    this.noData = 1;
+                }
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        //下拉刷新
+        loadTop(){
+            $(".shoplist ul li").removeClass("cur");
+            var _this = this;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleTypeId: this.yeTaiId, //业态（类型）
+                titleMianjiId: this.mianjiId, //面积ID
+                titleTotalPriceId: this.priceId, //总价Id
+                rentType: "2", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: "1", //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            setTimeout(function () {
+                _this.$http.post(_this.changeData() + '/shop/selectShopPage', qs.stringify(data)).then(function (data) {
+                    _this.listArr = data.data.list; //列表
+                    _this.$refs.loadmore.onTopLoaded();
+                }.bind(_this)).catch(function (err) {
+                    console.log("商店列表页面错误：", err)
+                })
+            }, 2000);
+        },
+
+        //上拉加载
+        loadBottom() {
+            var _this = this;
+            this.shopIndex++;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleTypeId: this.yeTaiId, //业态（类型）
+                titleMianjiId: this.mianjiId, //面积ID
+                titleTotalPriceId: this.priceId, //总价Id
+                rentType: "2", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.shopIndex, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            _this.$http.post(_this.changeData() + '/shop/selectShopPage',qs.stringify(data)).then(function(res){
+                _this.listArr = _this.listArr.concat(res.data.list);
+                if(res.data.list == ''){
+                    this.allLoaded = true;
+                }
+                _this.$refs.loadmore.onBottomLoaded();
+            }.bind(_this)).catch(function(err){
+                console.log("商店列表页面错误：",err);
+            })
+        },
+        handleBottomChange(){
+            var _this = this;
+            if(this.allLoaded == true){
+                this.more = true;
+                setTimeout(function () {
+                    _this.more = false;
+                },2000)
+            }
+        },
+
+        tab1(e){
+            if($(e.srcElement).hasClass("cur")){
+               this.tab = "";
+            }else{
+                this.tab = 0;
+                if(this.num === 0){
+                   $(".areaBox li").eq(0).children(".first").click();
+                   this.num++;
+                }
+            }
+        },
+        tab2(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 1;
+                if(this.num2 === 0){
+                    $(".twoYetai li").eq(0).children(".first2").click();
+                    this.num2++;
+                }
+            }
+        },
+        tab3(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 2;
+            }
+        },
+        tab4(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 3;
+                if(this.num1 === 0){
+                    $(".twoPrice li").eq(0).children(".first1").click();
+                    this.num1++;
+                }
+            }
+        },
+
+        // 区域筛选
+        quyuFun(e,item){
+            this.areaChild = item;
+            this.areaId = item.id;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        quyuChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.businessAreaId = item.id;
+            this.areaTxt = item.name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 业态筛选
+        yetaiFun(e,item){
+            this.yetaiChild = item;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        yetaiChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.yeTaiId = item.d_value;
+            this.yeTaiTxt = item.d_name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 面积
+        mianjiFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.mianjiId = item.id;
+            this.mianjiTxt = item.show_text;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 价格
+        priceFun(e,index){
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        priceChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.priceId = item.id;
+            this.priceTxt = item.show_text;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+    },
+    mounted() {
+        // 条件列表
+        this.selectData();
+        this.listData();
+    },
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+@import "../../../static/css/shopList.scss";
+</style>
+

src/components/shop/sellshopdetail.vue

@@ -1,385 +1,385 @@
-<template>
-<div class="shopdetail">
-    <!-- 头部导航 -->
-    <div class="jiantou-title" v-show="tabTitle===1">
-        <span @click="goShop();"></span>{{basic.name}}
-    </div>
-    <!-- 轮播图 -->
-    <div class="banner">
-        <div class="backImgWrap" @click="goShop();">
-            <img src="../../../static/images/common/whiteBack.png" class="backImg">
-        </div>
-        <div class="wrap">
-            <ul class="txt">
-                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
-                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
-            </ul>
-            <div class="swiper-container swiper-container1 swiper-container-horizontal">
-                <div class="swiper-wrapper">
-                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
-                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
-                    </div>
-                </div>
-                <div class="swiper-pagination"></div>
-            </div>
-        </div>
-    </div>
-    <!-- 大轮播图 -->
-    <div class="bannerBig" @click="tab2()">
-        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
-        <div class="swiper-container swiper-container2 swiper-container-horizontal">
-            <div class="swiper-wrapper">
-                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
-            </div>
-            <div class="swiper-pagination"></div>
-        </div>
-    </div>
-    <!-- 商铺详情介绍 -->
-    <div class="detailBoxWrap">
-        <div class="topBox">
-            <h2>{{basic.name}}</h2>
-            <div class="labelWrap">
-                <ul>
-                    <li v-for="(item,index) in labelList">{{item}}</li>
-                </ul>
-            </div>
-            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
-            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
-            <div class="priceWrap clearfix">
-                <dl>
-                    <dt>{{basic.total_price}}{{basic.totalPrice_u}}</dt>
-                    <dd>总价</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.unit_price}}{{basic.unit_price_u}}</dt>
-                    <dd>单价</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
-                    <dd>面积</dd>
-                </dl>
-            </div>
-        </div>
-        <div class="mainBox">
-            <dl class="dlTitle clearfix">
-                <dt>位置：</dt>
-                <dd>{{basic.real_address}}</dd>
-            </dl>
-            <div class="mainList clearfix">
-                <div class="divL fl">
-                    <dl class="clearfix">
-                        <dt>类型：</dt>
-                        <dd>{{basic.type}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>楼层：</dt>
-                        <dd>{{basic.floor_current}}</dd>
-                    </dl>
-                </div>
-
-                <div class="divR fl">
-                    <dl class="clearfix">
-                        <dt>状态：</dt>
-                        <dd>{{basic.manage_status}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>临街：</dt>
-                        <dd>{{basic.frontage}}</dd>
-                    </dl>
-                </div>
-            </div>
-            <dl class="dlType clearfix">
-                <dt>当前经营：</dt>
-                <dd>{{basic.yetai}}</dd>
-            </dl>
-        </div>
-    </div>
-    <!-- 配套设施 -->
-    <div class="supportingWrap clearfix">
-        <h3>配套设施</h3>
-        <ul v-for="(item,index) in supportingList">
-            <li v-if="item.d_value == 1"><img src="../../../static/images/shop/1.png"></li>
-            <li v-if="item.d_value == 2"><img src="../../../static/images/shop/2.png"></li>
-            <li v-if="item.d_value == 3"><img src="../../../static/images/shop/3.png"></li>
-            <li v-if="item.d_value == 4"><img src="../../../static/images/shop/4.png"></li>
-            <li v-if="item.d_value == 5"><img src="../../../static/images/shop/5.png"></li>
-            <li v-if="item.d_value == 6"><img src="../../../static/images/shop/6.png"></li>
-            <li v-if="item.d_value == 7"><img src="../../../static/images/shop/7.png"></li>
-            <li v-if="item.d_value == 8"><img src="../../../static/images/shop/8.png"></li>
-            <li v-if="item.d_value == 9"><img src="../../../static/images/shop/9.png"></li>
-            <li v-if="item.d_value == 10"><img src="../../../static/images/shop/10.png"></li>
-            <li v-if="item.d_value == 11"><img src="../../../static/images/shop/11.png"></li>
-        </ul>
-    </div>
-    <!-- 铺源动态 -->
-    <div class="shopDynamic">
-        <span class="fl">铺源动态</span>
-        <div class="scrollWrap fl">
-            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
-                <li v-for="item in dynamicList">{{item}}</li>  
-            </ul>
-            <ul class="scroll-content" v-else>
-                <li>暂无</li>
-            </ul>
-        </div>
-    </div>
-    <!-- 商铺描述 -->
-    <div class="shopDescribe">
-        <span>商铺描述</span>
-        <span class="span3">{{basic.introduce}}</span>
-    </div>
-    <!-- 查看经纪人 -->
-    <div class="telephoneWrap">
-        <dl>
-            <dt>
-                <img src="../../../static/images/shop/head.png">
-            </dt>
-            <dd>
-                <p>{{agentEntiy.name}}</p>
-                <h5>{{agentEntiy.company}}</h5>
-            </dd>
-        </dl>
-        <div class="telephone" @click="telephone();">
-            <i>
-                <img src="../../../static/images/shop/tel.png">
-            </i>
-            <span>电话</span>
-        </div>
-    </div>
-    <!-- 推荐列表 -->
-    <div class="recommendListWrap">
-        <h2>为你推荐</h2>
-        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
-            <dt>
-                <img :src="item.imgs" :onerror="defaultImg">
-            </dt>
-            <dd>
-                <h3>{{item.title}}</h3>
-                <h5>{{item.name}}</h5>
-                <h6><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
-                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                <p><span>合作佣金：</span>{{item.commission}}</p>
-            </dd>
-        </dl>
-    </div>
-
-</div>
-</template>
-
-<script>
-  import axios from 'axios';
-  import qs from 'qs';
-  export default {
-    data(){
-      return{
-        shopId: "",
-        basic: {},
-        lbtArr: [], //轮播图
-        imgTotal: 0,
-        num1: 1,
-        num2: 1,
-        sliderIndex: "",
-        activeIndex: "",
-        tabTitle: 0,
-
-        labelList: [], //标签
-        supportingList: [], //配套设施
-        dynamicList: [], //铺源动态
-
-        recommendedList: [], //推荐列表
-
-        agentEntiy: {}, //经纪人信息
-        telephoneVal: "", //经纪人电话
-
-        dynamicIndex: 0,
-
-        typeUrl: "",
-
-        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
-
-      }
-    },
-    computed: {
-        // 
-        top() {
-            return - this.dynamicIndex * 1.04 + 'rem';
-        }
-
-    },
-    watch:{
-
-    },
-    mounted(){
-        this.shopId = this.$route.query.id;
-
-        this.typeUrl = getUrlId("type");
-
-        //初始化
-        this.detailData();
-
-        //滚动事件
-        var _this = this;
-        window.onscroll = function(){
-            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
-            if(scrollTop >= 80){
-                _this.tabTitle = 1;
-                $(".tel-msg").hide();
-            }else{
-                _this.tabTitle = 0;
-            }
-        },
-
-        setInterval(_ => {
-            if(this.dynamicIndex < this.dynamicList.length) {
-                this.dynamicIndex += 1;
-            } else {
-                this.dynamicIndex = 0;
-            }
-        }, 1000);
-
-    },
-    updated(){
-        // this.fenxiangFun();
-        let _this = this;
-        setTimeout(function () {
-           _this.showBanner();
-        },500);
-    },
-    // beforeRouteEnter (to, from, next) {
-    //     var u = navigator.userAgent;
-    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
-    //     if (isiOS && to.path !== location.pathname) {
-    //         // 此处不可使用location.replace
-    //         location.assign(to.fullPath)
-    //     } else {
-    //         next()
-    //     }
-    // },
-    methods:{
-
-        goShop(){
-            if(this.typeUrl == "1"){
-                this.$router.go(-1);
-            }else if(this.typeUrl == "2"){
-                this.$router.push({path:"/home"});
-            }else{
-                this.$router.push({path:"/sellshop"});
-            }
-        },
-
-        // 为您推荐
-        go(id){
-            window.location.href = "http://"+window.location.host+"/sellshopdetail?"+"id="+id+"&type=1";
-            window.scrollTo('0','0');
-        },
-
-        // 详情列表
-        detailData() {
-            let _this = this;
-            let url = this.changeData() + '/shop/appShopDetail'
-            var data = {
-                projectId: this.shopId,  //项目ID（shopId或officeId）
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.basic = data.data.basic;
-                this.lbtArr = data.data.basic.imgs;
-                this.imgTotal = data.data.basic.imgs.length;
-                this.labelList = data.data.basic.label; 
-                this.supportingList = data.data.supportingList;
-                this.dynamicList = data.data.basic.dynamicList; //铺源动态
-                this.recommendedList = data.data.basic.recommendedList; //推荐列表
-                this.agentEntiy = data.data.agentEntiy; //经纪人信息
-                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
-                // console.log(this.basic);
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        tab1(){
-            $(".bannerBig").show();
-            var that = this;
-
-            if(that.sliderIndex == 0){
-                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
-            }
-            
-            var swiper2 = new Swiper('.swiper-container2', {
-                initialSlide : that.sliderIndex,
-                on: {
-                    slideChangeTransitionEnd: function(){
-                       that.sliderIndex = this.activeIndex;
-                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        tab2(){
-            this.num2 = 1;
-            $(".bannerBig").hide();
-        },
-
-        showBanner(){
-            var that = this;
-            var swiper1 = new Swiper('.swiper-container1', {
-                on: {
-                    slideChangeTransitionEnd: function(){
-                        that.sliderIndex = this.activeIndex;
-                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        telephone(){
-            window.location.href = 'tel:'+this.telephoneVal;
-        }
-
-    },
-    watch: {
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-@import "../../../static/css/shopDetail.scss";
-</style>
-
-<style>
-.layui-m-layer-tel .layui-m-layercont{
-    padding: 35px 30px;
-}
-.layui-m-layer-tel h2{
-    font-size: .32rem;
-    color: #333;
-    margin-bottom: .3rem;
-}
-.layui-m-layer-tel p{
-    font-size: .36rem;
-    color: #e8584f;
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
-    color: #898989;
-    background: #f7f8fa;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
-    color: #fff;
-    background: #64AAFF;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    border-radius: 0 0 5px 0;
-}
-</style>
-
-
-
+<template>
+<div class="shopdetail">
+    <!-- 头部导航 -->
+    <div class="jiantou-title" v-show="tabTitle===1">
+        <span @click="goShop();"></span>{{basic.name}}
+    </div>
+    <!-- 轮播图 -->
+    <div class="banner">
+        <div class="backImgWrap" @click="goShop();">
+            <img src="../../../static/images/common/whiteBack.png" class="backImg">
+        </div>
+        <div class="wrap">
+            <ul class="txt">
+                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
+                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
+            </ul>
+            <div class="swiper-container swiper-container1 swiper-container-horizontal">
+                <div class="swiper-wrapper">
+                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
+                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
+                    </div>
+                </div>
+                <div class="swiper-pagination"></div>
+            </div>
+        </div>
+    </div>
+    <!-- 大轮播图 -->
+    <div class="bannerBig" @click="tab2()">
+        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
+        <div class="swiper-container swiper-container2 swiper-container-horizontal">
+            <div class="swiper-wrapper">
+                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
+            </div>
+            <div class="swiper-pagination"></div>
+        </div>
+    </div>
+    <!-- 商铺详情介绍 -->
+    <div class="detailBoxWrap">
+        <div class="topBox">
+            <h2>{{basic.name}}</h2>
+            <div class="labelWrap">
+                <ul>
+                    <li v-for="(item,index) in labelList">{{item}}</li>
+                </ul>
+            </div>
+            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
+            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
+            <div class="priceWrap clearfix">
+                <dl>
+                    <dt>{{basic.total_price}}{{basic.totalPrice_u}}</dt>
+                    <dd>总价</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.unit_price}}{{basic.unit_price_u}}</dt>
+                    <dd>单价</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
+                    <dd>面积</dd>
+                </dl>
+            </div>
+        </div>
+        <div class="mainBox">
+            <dl class="dlTitle clearfix">
+                <dt>位置：</dt>
+                <dd>{{basic.real_address}}</dd>
+            </dl>
+            <div class="mainList clearfix">
+                <div class="divL fl">
+                    <dl class="clearfix">
+                        <dt>类型：</dt>
+                        <dd>{{basic.type}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>楼层：</dt>
+                        <dd>{{basic.floor_current}}</dd>
+                    </dl>
+                </div>
+
+                <div class="divR fl">
+                    <dl class="clearfix">
+                        <dt>状态：</dt>
+                        <dd>{{basic.manage_status}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>临街：</dt>
+                        <dd>{{basic.frontage}}</dd>
+                    </dl>
+                </div>
+            </div>
+            <dl class="dlType clearfix">
+                <dt>当前经营：</dt>
+                <dd>{{basic.yetai}}</dd>
+            </dl>
+        </div>
+    </div>
+    <!-- 配套设施 -->
+    <div class="supportingWrap clearfix">
+        <h3>配套设施</h3>
+        <ul v-for="(item,index) in supportingList">
+            <li v-if="item.d_value == 1"><img src="../../../static/images/shop/1.png"></li>
+            <li v-if="item.d_value == 2"><img src="../../../static/images/shop/2.png"></li>
+            <li v-if="item.d_value == 3"><img src="../../../static/images/shop/3.png"></li>
+            <li v-if="item.d_value == 4"><img src="../../../static/images/shop/4.png"></li>
+            <li v-if="item.d_value == 5"><img src="../../../static/images/shop/5.png"></li>
+            <li v-if="item.d_value == 6"><img src="../../../static/images/shop/6.png"></li>
+            <li v-if="item.d_value == 7"><img src="../../../static/images/shop/7.png"></li>
+            <li v-if="item.d_value == 8"><img src="../../../static/images/shop/8.png"></li>
+            <li v-if="item.d_value == 9"><img src="../../../static/images/shop/9.png"></li>
+            <li v-if="item.d_value == 10"><img src="../../../static/images/shop/10.png"></li>
+            <li v-if="item.d_value == 11"><img src="../../../static/images/shop/11.png"></li>
+        </ul>
+    </div>
+    <!-- 铺源动态 -->
+    <div class="shopDynamic">
+        <span class="fl">铺源动态</span>
+        <div class="scrollWrap fl">
+            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
+                <li v-for="item in dynamicList">{{item}}</li>  
+            </ul>
+            <ul class="scroll-content" v-else>
+                <li>暂无</li>
+            </ul>
+        </div>
+    </div>
+    <!-- 商铺描述 -->
+    <div class="shopDescribe">
+        <span>商铺描述</span>
+        <span class="span3">{{basic.introduce}}</span>
+    </div>
+    <!-- 查看经纪人 -->
+    <div class="telephoneWrap">
+        <dl>
+            <dt>
+                <img src="../../../static/images/shop/head.png">
+            </dt>
+            <dd>
+                <p>{{agentEntiy.name}}</p>
+                <h5>{{agentEntiy.company}}</h5>
+            </dd>
+        </dl>
+        <div class="telephone" @click="telephone();">
+            <i>
+                <img src="../../../static/images/shop/tel.png">
+            </i>
+            <span>电话</span>
+        </div>
+    </div>
+    <!-- 推荐列表 -->
+    <div class="recommendListWrap">
+        <h2>为你推荐</h2>
+        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
+            <dt>
+                <img :src="item.imgs" :onerror="defaultImg">
+            </dt>
+            <dd>
+                <h3>{{item.title}}</h3>
+                <h5>{{item.name}}</h5>
+                <h6><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
+                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                <p><span>合作佣金：</span>{{item.commission}}</p>
+            </dd>
+        </dl>
+    </div>
+
+</div>
+</template>
+
+<script>
+  import axios from 'axios';
+  import qs from 'qs';
+  export default {
+    data(){
+      return{
+        shopId: "",
+        basic: {},
+        lbtArr: [], //轮播图
+        imgTotal: 0,
+        num1: 1,
+        num2: 1,
+        sliderIndex: "",
+        activeIndex: "",
+        tabTitle: 0,
+
+        labelList: [], //标签
+        supportingList: [], //配套设施
+        dynamicList: [], //铺源动态
+
+        recommendedList: [], //推荐列表
+
+        agentEntiy: {}, //经纪人信息
+        telephoneVal: "", //经纪人电话
+
+        dynamicIndex: 0,
+
+        typeUrl: "",
+
+        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
+
+      }
+    },
+    computed: {
+        // 
+        top() {
+            return - this.dynamicIndex * 1.04 + 'rem';
+        }
+
+    },
+    watch:{
+
+    },
+    mounted(){
+        this.shopId = this.$route.query.id;
+
+        this.typeUrl = getUrlId("type");
+
+        //初始化
+        this.detailData();
+
+        //滚动事件
+        var _this = this;
+        window.onscroll = function(){
+            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+            if(scrollTop >= 80){
+                _this.tabTitle = 1;
+                $(".tel-msg").hide();
+            }else{
+                _this.tabTitle = 0;
+            }
+        },
+
+        setInterval(_ => {
+            if(this.dynamicIndex < this.dynamicList.length) {
+                this.dynamicIndex += 1;
+            } else {
+                this.dynamicIndex = 0;
+            }
+        }, 1000);
+
+    },
+    updated(){
+        // this.fenxiangFun();
+        let _this = this;
+        setTimeout(function () {
+           _this.showBanner();
+        },500);
+    },
+    // beforeRouteEnter (to, from, next) {
+    //     var u = navigator.userAgent;
+    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
+    //     if (isiOS && to.path !== location.pathname) {
+    //         // 此处不可使用location.replace
+    //         location.assign(to.fullPath)
+    //     } else {
+    //         next()
+    //     }
+    // },
+    methods:{
+
+        goShop(){
+            if(this.typeUrl == "1"){
+                this.$router.go(-1);
+            }else if(this.typeUrl == "2"){
+                this.$router.push({path:"/home"});
+            }else{
+                this.$router.push({path:"/sellshop"});
+            }
+        },
+
+        // 为您推荐
+        go(id){
+            window.location.href = "http://"+window.location.host+"/sellshopdetail?"+"id="+id+"&type=1";
+            window.scrollTo('0','0');
+        },
+
+        // 详情列表
+        detailData() {
+            let _this = this;
+            let url = this.changeData() + '/shop/appShopDetail'
+            var data = {
+                projectId: this.shopId,  //项目ID（shopId或officeId）
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.basic = data.data.basic;
+                this.lbtArr = data.data.basic.imgs;
+                this.imgTotal = data.data.basic.imgs.length;
+                this.labelList = data.data.basic.label; 
+                this.supportingList = data.data.supportingList;
+                this.dynamicList = data.data.basic.dynamicList; //铺源动态
+                this.recommendedList = data.data.basic.recommendedList; //推荐列表
+                this.agentEntiy = data.data.agentEntiy; //经纪人信息
+                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
+                // console.log(this.basic);
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        tab1(){
+            $(".bannerBig").show();
+            var that = this;
+
+            if(that.sliderIndex == 0){
+                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
+            }
+            
+            var swiper2 = new Swiper('.swiper-container2', {
+                initialSlide : that.sliderIndex,
+                on: {
+                    slideChangeTransitionEnd: function(){
+                       that.sliderIndex = this.activeIndex;
+                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        tab2(){
+            this.num2 = 1;
+            $(".bannerBig").hide();
+        },
+
+        showBanner(){
+            var that = this;
+            var swiper1 = new Swiper('.swiper-container1', {
+                on: {
+                    slideChangeTransitionEnd: function(){
+                        that.sliderIndex = this.activeIndex;
+                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        telephone(){
+            window.location.href = 'tel:'+this.telephoneVal;
+        }
+
+    },
+    watch: {
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+@import "../../../static/css/shopDetail.scss";
+</style>
+
+<style>
+.layui-m-layer-tel .layui-m-layercont{
+    padding: 35px 30px;
+}
+.layui-m-layer-tel h2{
+    font-size: .32rem;
+    color: #333;
+    margin-bottom: .3rem;
+}
+.layui-m-layer-tel p{
+    font-size: .36rem;
+    color: #e8584f;
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
+    color: #898989;
+    background: #f7f8fa;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
+    color: #fff;
+    background: #64AAFF;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    border-radius: 0 0 5px 0;
+}
+</style>
+
+
+

src/components/shop/shoulou.vue

@@ -1,443 +1,443 @@
-<template>
-<div class="shopWrap">
-    <div class="shopTop">
-        <dl class="searchNav">
-            <dt>
-                <img src="../../../static/images/common/back.png" @click="goHome();">
-            </dt>
-            <dd @click="goSearch();">
-                <img src="../../../static/images/shop/search.png">
-                <span>请搜索在售写字楼</span>
-            </dd>
-        </dl>
-        <div class="shaixuan">
-            <div class="list">
-                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
-
-                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
-
-                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
-
-                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
-            </div>
-
-            <div class="listContent">
-                <ul class="one">
-                    <!-- 区域 -->
-                    <li class="oneList" v-show="tab===0">
-                        <ul class="two areaBox">
-                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
-                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                    <!-- 业态 -->
-                    <li class="oneList" v-show="tab===1">
-                        <ul class="four">
-                            <li v-for="(item,index) in yeTaiList" @click="yetaiChildFun($event,item)">{{item.d_name}}</li>
-                        </ul>
-                    </li>
-                    <!-- 面积 -->
-                    <li class="oneList" v-show="tab===2">
-                        <ul class="four">
-                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
-                        </ul>
-                    </li>
-                    <!-- 价格 -->
-                    <li class="oneList" v-show="tab===3">
-                        <ul class="two twoPrice">
-                            <li class="twoChild" v-for="(item,index) in price">
-                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in priceList" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                </ul>
-            </div>
-        </div>
-    </div>
-
-    <div class="shoplist" v-show="noData===1">
-        <div class="detail" ref="wrapper">
-            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
-                <ul>
-                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
-                        <div class="lisyImg">
-                            <img :src="item.imgs" :onerror="defaultImg">
-                        </div>
-                        <div class="listBox">
-                            <h3>{{item.title}}</h3>
-                            <h5>{{item.name}}</h5>
-                            <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
-                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                            <p><span>合作佣金：</span>{{item.commission}}</p>
-                        </div>
-                    </li>
-                </ul>
-                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
-            </mt-loadmore>
-        </div>
-    </div>
-
-    <div class="noData" v-show="noData===0">
-        <dl>
-            <dt>
-                <img src="../../../static/images/common/noData.png">
-            </dt>
-            <p>暂无数据</p>
-        </dl>
-    </div>
-
-</div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Indicator } from 'mint-ui';
-export default {
-    name: '',
-    data () {
-        return {
-            noData: 1,
-            tab: "",
-            pageSize: 10,
-            pageNum: 1,
-            shopIndex: 1,
-            allLoaded: false,
-            more: false,
-
-            num: 0,
-            num1: 0,
-            num2: 0,
-
-            areaList: [], //筛选区域
-            areaTxt: "", //区域文字
-            areaChild: [], //筛选区域子集
-            yeTaiList: [], //业态
-            yetaiChild: [], //业态子集
-            yeTaiTxt: "", //业态文案
-            mianjiList: [], //面积
-            mianjiTxt: "", //面积文案
-            price:[
-                {"name": "总价"},
-            ],
-            priceList: [],
-            priceChild: [], //价格子集
-            priceTxt: "", //价格文案
-            
-            areaId: "", //区域ID
-            businessAreaId: "", //商圈ID
-            typeId: "", //类型ID
-            yeTaiId: "", //行业ID
-            sonManageTypeId: "", //业态子集
-            mianjiId: "", //面积ID
-            priceId: "", //价格Id
-            
-            listArr: [],
-
-            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-
-       }
-    },
-    computed:{
-
-    },
-    methods:{
-
-        goHome(){
-            this.$router.push({path:"/home"});
-        },
-        goDetail(id){
-            this.$router.push({path:"/shouloudetail",query:{id: id}});
-        },
-        goSearch(){
-            this.$router.push({path:"/search",query:{type: "2"}});
-        },
-
-        // 条件列表
-        selectData() {
-            let _this = this;
-            let url = this.changeData() + '/office/findOfficeSaleSearch'
-            var data = {
-                cityId: sessionStorage.cityId || 110100, //城市ID 
-                channel: "1",
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.areaList = data.data.areaList; //区域
-                this.yeTaiList = data.data.typeList; //业态
-                this.mianjiList = data.data.mianjiList; //面积
-                this.priceList = data.data.priceList; //总价
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        // 条件列表
-        listData() {
-            let _this = this;
-            let url = this.changeData() + '/office/selectOfficePage';
-            var data = {
-                titleArea: this.businessAreaId, //区域ID
-                titleMianjiId: this.mianjiId, //面积ID
-                titleTotalPriceId: this.priceId, //总价Id
-                titleType: this.yeTaiId, //业态（类型）
-                typeSale: "2",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.pageNum, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                Indicator.open({
-                    text: '',
-                    spinnerType: 'fading-circle'
-                });
-                setTimeout(function () {
-                    Indicator.close();
-                },1000);
-                this.listArr = data.data.list; //列表
-                if(this.listArr.length==0){
-                    this.noData = 0;
-                }else{
-                    this.noData = 1;
-                }
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        //下拉刷新
-        loadTop(){
-            $(".shoplist ul li").removeClass("cur");
-            var _this = this;
-            this.shopIndex = 1;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleMianjiId: this.mianjiId, //面积ID
-                titleTotalPriceId: this.priceId, //总价Id
-                titleType: this.yeTaiId, //业态（类型）
-                typeSale: "2",  //1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: "1", //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            setTimeout(function () {
-                _this.$http.post(_this.changeData() + '/office/selectOfficePage', qs.stringify(data)).then(function (data) {
-                    _this.listArr = data.data.list; //列表
-                    _this.$refs.loadmore.onTopLoaded();
-                }.bind(_this)).catch(function (err) {
-                    console.log("商店列表页面错误：", err)
-                })
-            }, 2000);
-        },
-
-        //上拉加载
-        loadBottom() {
-            var _this = this;
-            this.shopIndex++;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleMianjiId: this.mianjiId, //面积ID
-                titleTotalPriceId: this.priceId, //总价Id
-                titleType: this.yeTaiId, //业态（类型）
-                typeSale: "2",  //1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.shopIndex, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            _this.$http.post(_this.changeData() + '/office/selectOfficePage',qs.stringify(data)).then(function(res){
-                _this.listArr = _this.listArr.concat(res.data.list);
-                if(res.data.list == ''){
-                    this.allLoaded = true;
-                }
-                _this.$refs.loadmore.onBottomLoaded();
-            }.bind(_this)).catch(function(err){
-                console.log("商店列表页面错误：",err);
-            })
-        },
-        handleBottomChange(){
-            var _this = this;
-            if(this.allLoaded == true){
-                this.more = true;
-                setTimeout(function () {
-                    _this.more = false;
-                },2000)
-            }
-        },
-
-        tab1(e){
-            if($(e.srcElement).hasClass("cur")){
-               this.tab = "";
-            }else{
-                this.tab = 0;
-                if(this.num === 0){
-                   $(".areaBox li").eq(0).children(".first").click();
-                   this.num++;
-                }
-            }
-        },
-        tab2(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 1;
-                if(this.num2 === 0){
-                    $(".twoYetai li").eq(0).children(".first2").click();
-                    this.num2++;
-                }
-            }
-        },
-        tab3(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 2;
-            }
-        },
-        tab4(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 3;
-                if(this.num1 === 0){
-                    $(".twoPrice li").eq(0).children(".first1").click();
-                    this.num1++;
-                }
-            }
-        },
-
-        // 区域筛选
-        quyuFun(e,item){
-            this.areaChild = item;
-            this.areaId = item.id;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        quyuChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.businessAreaId = item.id;
-            this.areaTxt = item.name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 业态筛选
-        yetaiFun(e,item){
-            this.yetaiChild = item;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        yetaiChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.yeTaiId = item.d_value;
-            this.yeTaiTxt = item.d_name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 面积
-        mianjiFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.mianjiId = item.id;
-            this.mianjiTxt = item.show_text;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 价格
-        priceFun(e,index){
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        priceChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.priceId = item.id;
-            this.priceTxt = item.show_text;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-    },
-    mounted() {
-        // 条件列表
-        this.selectData();
-        this.listData();
-    },
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-@import "../../../static/css/shopList.scss";
-.shopWrap{
-    width: 7.5rem;
-}
-.shopTop{
-    width: 7.5rem;
-    height: 1.88rem;
-    position: fixed;
-    left: auto;
-    top: 0;
-    z-index: 10;
-}
-.searchNav{
-    width: 7.5rem;
-    height: .88rem;
-    padding-top: .2rem;
-    background: #f6f6f6;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    dt{
-        width: .2rem;
-        height: .34rem;
-        float: left;
-        margin: .16rem .48rem 0;
-        img{
-            width: .2rem;
-            height: .34rem;
-        }
-    }
-    dd{
-        width: 6.06rem;
-        height: .68rem;
-        background: #fff;
-        float: left;
-        border-radius: 8px;
-        text-align: center;
-        line-height: .68rem;
-        img{
-            width: .32rem;
-            height: .32rem;
-            position: relative;
-            left: .01rem;
-            top: -.04rem;
-        }
-        span{
-            font-size: .3rem;
-            font-family: PingFangSC-Regular,PingFangSC;
-            font-weight: 400;
-            color: #999;
-            line-height: .68rem;
-        }
-    }
-}
-
-</style>
-
+<template>
+<div class="shopWrap">
+    <div class="shopTop">
+        <dl class="searchNav">
+            <dt>
+                <img src="../../../static/images/common/back.png" @click="goHome();">
+            </dt>
+            <dd @click="goSearch();">
+                <img src="../../../static/images/shop/search.png">
+                <span>请搜索在售写字楼</span>
+            </dd>
+        </dl>
+        <div class="shaixuan">
+            <div class="list">
+                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
+
+                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
+
+                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
+
+                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
+            </div>
+
+            <div class="listContent">
+                <ul class="one">
+                    <!-- 区域 -->
+                    <li class="oneList" v-show="tab===0">
+                        <ul class="two areaBox">
+                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
+                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                    <!-- 业态 -->
+                    <li class="oneList" v-show="tab===1">
+                        <ul class="four">
+                            <li v-for="(item,index) in yeTaiList" @click="yetaiChildFun($event,item)">{{item.d_name}}</li>
+                        </ul>
+                    </li>
+                    <!-- 面积 -->
+                    <li class="oneList" v-show="tab===2">
+                        <ul class="four">
+                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
+                        </ul>
+                    </li>
+                    <!-- 价格 -->
+                    <li class="oneList" v-show="tab===3">
+                        <ul class="two twoPrice">
+                            <li class="twoChild" v-for="(item,index) in price">
+                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in priceList" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+
+    <div class="shoplist" v-show="noData===1">
+        <div class="detail" ref="wrapper">
+            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
+                <ul>
+                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
+                        <div class="lisyImg">
+                            <img :src="item.imgs" :onerror="defaultImg">
+                        </div>
+                        <div class="listBox">
+                            <h3>{{item.title}}</h3>
+                            <h5>{{item.name}}</h5>
+                            <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
+                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                            <p><span>合作佣金：</span>{{item.commission}}</p>
+                        </div>
+                    </li>
+                </ul>
+                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
+            </mt-loadmore>
+        </div>
+    </div>
+
+    <div class="noData" v-show="noData===0">
+        <dl>
+            <dt>
+                <img src="../../../static/images/common/noData.png">
+            </dt>
+            <p>暂无数据</p>
+        </dl>
+    </div>
+
+</div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Indicator } from 'mint-ui';
+export default {
+    name: '',
+    data () {
+        return {
+            noData: 1,
+            tab: "",
+            pageSize: 10,
+            pageNum: 1,
+            shopIndex: 1,
+            allLoaded: false,
+            more: false,
+
+            num: 0,
+            num1: 0,
+            num2: 0,
+
+            areaList: [], //筛选区域
+            areaTxt: "", //区域文字
+            areaChild: [], //筛选区域子集
+            yeTaiList: [], //业态
+            yetaiChild: [], //业态子集
+            yeTaiTxt: "", //业态文案
+            mianjiList: [], //面积
+            mianjiTxt: "", //面积文案
+            price:[
+                {"name": "总价"},
+            ],
+            priceList: [],
+            priceChild: [], //价格子集
+            priceTxt: "", //价格文案
+            
+            areaId: "", //区域ID
+            businessAreaId: "", //商圈ID
+            typeId: "", //类型ID
+            yeTaiId: "", //行业ID
+            sonManageTypeId: "", //业态子集
+            mianjiId: "", //面积ID
+            priceId: "", //价格Id
+            
+            listArr: [],
+
+            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+
+       }
+    },
+    computed:{
+
+    },
+    methods:{
+
+        goHome(){
+            this.$router.push({path:"/home"});
+        },
+        goDetail(id){
+            this.$router.push({path:"/shouloudetail",query:{id: id}});
+        },
+        goSearch(){
+            this.$router.push({path:"/search",query:{type: "2"}});
+        },
+
+        // 条件列表
+        selectData() {
+            let _this = this;
+            let url = this.changeData() + '/office/findOfficeSaleSearch'
+            var data = {
+                cityId: sessionStorage.cityId || 110100, //城市ID 
+                channel: "1",
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.areaList = data.data.areaList; //区域
+                this.yeTaiList = data.data.typeList; //业态
+                this.mianjiList = data.data.mianjiList; //面积
+                this.priceList = data.data.priceList; //总价
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        // 条件列表
+        listData() {
+            let _this = this;
+            let url = this.changeData() + '/office/selectOfficePage';
+            var data = {
+                titleArea: this.businessAreaId, //区域ID
+                titleMianjiId: this.mianjiId, //面积ID
+                titleTotalPriceId: this.priceId, //总价Id
+                titleType: this.yeTaiId, //业态（类型）
+                typeSale: "2",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.pageNum, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                Indicator.open({
+                    text: '',
+                    spinnerType: 'fading-circle'
+                });
+                setTimeout(function () {
+                    Indicator.close();
+                },1000);
+                this.listArr = data.data.list; //列表
+                if(this.listArr.length==0){
+                    this.noData = 0;
+                }else{
+                    this.noData = 1;
+                }
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        //下拉刷新
+        loadTop(){
+            $(".shoplist ul li").removeClass("cur");
+            var _this = this;
+            this.shopIndex = 1;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleMianjiId: this.mianjiId, //面积ID
+                titleTotalPriceId: this.priceId, //总价Id
+                titleType: this.yeTaiId, //业态（类型）
+                typeSale: "2",  //1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: "1", //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            setTimeout(function () {
+                _this.$http.post(_this.changeData() + '/office/selectOfficePage', qs.stringify(data)).then(function (data) {
+                    _this.listArr = data.data.list; //列表
+                    _this.$refs.loadmore.onTopLoaded();
+                }.bind(_this)).catch(function (err) {
+                    console.log("商店列表页面错误：", err)
+                })
+            }, 2000);
+        },
+
+        //上拉加载
+        loadBottom() {
+            var _this = this;
+            this.shopIndex++;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleMianjiId: this.mianjiId, //面积ID
+                titleTotalPriceId: this.priceId, //总价Id
+                titleType: this.yeTaiId, //业态（类型）
+                typeSale: "2",  //1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.shopIndex, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            _this.$http.post(_this.changeData() + '/office/selectOfficePage',qs.stringify(data)).then(function(res){
+                _this.listArr = _this.listArr.concat(res.data.list);
+                if(res.data.list == ''){
+                    this.allLoaded = true;
+                }
+                _this.$refs.loadmore.onBottomLoaded();
+            }.bind(_this)).catch(function(err){
+                console.log("商店列表页面错误：",err);
+            })
+        },
+        handleBottomChange(){
+            var _this = this;
+            if(this.allLoaded == true){
+                this.more = true;
+                setTimeout(function () {
+                    _this.more = false;
+                },2000)
+            }
+        },
+
+        tab1(e){
+            if($(e.srcElement).hasClass("cur")){
+               this.tab = "";
+            }else{
+                this.tab = 0;
+                if(this.num === 0){
+                   $(".areaBox li").eq(0).children(".first").click();
+                   this.num++;
+                }
+            }
+        },
+        tab2(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 1;
+                if(this.num2 === 0){
+                    $(".twoYetai li").eq(0).children(".first2").click();
+                    this.num2++;
+                }
+            }
+        },
+        tab3(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 2;
+            }
+        },
+        tab4(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 3;
+                if(this.num1 === 0){
+                    $(".twoPrice li").eq(0).children(".first1").click();
+                    this.num1++;
+                }
+            }
+        },
+
+        // 区域筛选
+        quyuFun(e,item){
+            this.areaChild = item;
+            this.areaId = item.id;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        quyuChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.businessAreaId = item.id;
+            this.areaTxt = item.name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 业态筛选
+        yetaiFun(e,item){
+            this.yetaiChild = item;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        yetaiChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.yeTaiId = item.d_value;
+            this.yeTaiTxt = item.d_name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 面积
+        mianjiFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.mianjiId = item.id;
+            this.mianjiTxt = item.show_text;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 价格
+        priceFun(e,index){
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        priceChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.priceId = item.id;
+            this.priceTxt = item.show_text;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+    },
+    mounted() {
+        // 条件列表
+        this.selectData();
+        this.listData();
+    },
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+@import "../../../static/css/shopList.scss";
+.shopWrap{
+    width: 7.5rem;
+}
+.shopTop{
+    width: 7.5rem;
+    height: 1.88rem;
+    position: fixed;
+    left: auto;
+    top: 0;
+    z-index: 10;
+}
+.searchNav{
+    width: 7.5rem;
+    height: .88rem;
+    padding-top: .2rem;
+    background: #f6f6f6;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    dt{
+        width: .2rem;
+        height: .34rem;
+        float: left;
+        margin: .16rem .48rem 0;
+        img{
+            width: .2rem;
+            height: .34rem;
+        }
+    }
+    dd{
+        width: 6.06rem;
+        height: .68rem;
+        background: #fff;
+        float: left;
+        border-radius: 8px;
+        text-align: center;
+        line-height: .68rem;
+        img{
+            width: .32rem;
+            height: .32rem;
+            position: relative;
+            left: .01rem;
+            top: -.04rem;
+        }
+        span{
+            font-size: .3rem;
+            font-family: PingFangSC-Regular,PingFangSC;
+            font-weight: 400;
+            color: #999;
+            line-height: .68rem;
+        }
+    }
+}
+
+</style>
+

src/components/shop/shouloudetail.vue

@@ -1,397 +1,397 @@
-<template>
-<div class="shopdetail">
-    <!-- 头部导航 -->
-    <div class="jiantou-title" v-show="tabTitle===1">
-        <span @click="goShop();"></span>{{basic.name}}
-    </div>
-    <!-- 轮播图 -->
-    <div class="banner">
-        <div class="backImgWrap" @click="goShop();">
-            <img src="../../../static/images/common/whiteBack.png" class="backImg">
-        </div>
-        <div class="wrap">
-            <ul class="txt">
-                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
-                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
-            </ul>
-            <div class="swiper-container swiper-container1 swiper-container-horizontal">
-                <div class="swiper-wrapper">
-                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
-                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
-                    </div>
-                </div>
-                <div class="swiper-pagination"></div>
-            </div>
-        </div>
-    </div>
-    <!-- 大轮播图 -->
-    <div class="bannerBig" @click="tab2()">
-        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
-        <div class="swiper-container swiper-container2 swiper-container-horizontal">
-            <div class="swiper-wrapper">
-                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
-            </div>
-            <div class="swiper-pagination"></div>
-        </div>
-    </div>
-    <!-- 商铺详情介绍 -->
-    <div class="detailBoxWrap">
-        <div class="topBox">
-            <h2>{{basic.name}}</h2>
-            <div class="labelWrap">
-                <ul>
-                    <li v-for="(item,index) in labelList">{{item}}</li>
-                </ul>
-            </div>
-            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
-            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
-            <div class="priceWrap clearfix">
-                <dl>
-                    <dt>{{basic.total_price}}{{basic.totalPrice_u}}</dt>
-                    <dd>总价</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.ave_price}}{{basic.ave_price_u}}</dt>
-                    <dd>单价</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
-                    <dd>建筑面积</dd>
-                </dl>
-            </div>
-        </div>
-        <div class="mainBox">
-            <dl class="dlTitle clearfix">
-                <dt>位置：</dt>
-                <dd>{{basic.real_address}}</dd>
-            </dl>
-            <div class="mainList clearfix">
-                <div class="divL fl">
-                    <dl class="clearfix">
-                        <dt>类型：</dt>
-                        <dd>{{basic.type}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>楼层：</dt>
-                        <dd>{{basic.floor_current}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>可注册：</dt>
-                        <dd>{{basic.register}}</dd>
-                    </dl>
-                </div>
-
-                <div class="divR fl">
-                    <dl class="clearfix">
-                        <dt>装修：</dt>
-                        <dd>{{basic.decorate}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>工位数：</dt>
-                        <dd>{{basic.station}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>可分割：</dt>
-                        <dd>{{basic.separate}}</dd>
-                    </dl>
-                </div>
-            </div>
-            <!-- <dl class="dlType clearfix">
-                <dt>付款方式：</dt>
-                <dd>{{basic.pay_method}}</dd>
-            </dl> -->
-            <dl class="dlType clearfix">
-                <dt>开发商：</dt>
-                <dd>{{basic.developer}}</dd>
-            </dl>
-        </div>
-    </div>
-    <!-- 配套设施 -->
-    <div class="supportingWrap clearfix">
-        <h3>配套设施</h3>
-        <ul v-for="(item,index) in supportingList">
-            <li v-if="item.d_value == 0"><img src="../../../static/images/shop/icon0.png"></li>
-            <li v-if="item.d_value == 1"><img src="../../../static/images/shop/icon1.png"></li>
-            <li v-if="item.d_value == 2"><img src="../../../static/images/shop/icon2.png"></li>
-            <li v-if="item.d_value == 3"><img src="../../../static/images/shop/icon3.png"></li>
-            <li v-if="item.d_value == 4"><img src="../../../static/images/shop/icon4.png"></li>
-            <li v-if="item.d_value == 5"><img src="../../../static/images/shop/icon5.png"></li>
-            <li v-if="item.d_value == 6"><img src="../../../static/images/shop/icon6.png"></li>
-            <li v-if="item.d_value == 7"><img src="../../../static/images/shop/icon7.png"></li>
-            <li v-if="item.d_value == 8"><img src="../../../static/images/shop/icon8.png"></li>
-            <li v-if="item.d_value == 9"><img src="../../../static/images/shop/icon9.png"></li>
-            <li v-if="item.d_value == 10"><img src="../../../static/images/shop/icon10.png"></li>
-            <li v-if="item.d_value == 11"><img src="../../../static/images/shop/icon11.png"></li>
-        </ul>
-    </div>
-    <!-- 铺源动态 -->
-    <div class="shopDynamic">
-        <span class="fl">铺源动态</span>
-        <!-- <span class="span2"></span> -->
-        <div class="scrollWrap fl">
-            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
-                <li v-for="item in dynamicList">{{item}}</li>  
-            </ul>
-            <ul class="scroll-content" v-else>
-                <li>暂无</li>
-            </ul>
-        </div>
-    </div>
-    <!-- 商铺描述 -->
-    <div class="shopDescribe">
-        <span>商铺描述</span>
-        <span class="span3">{{basic.introduce}}</span>
-    </div>
-    <!-- 查看经纪人 -->
-    <div class="telephoneWrap">
-        <dl>
-            <dt>
-                <img src="../../../static/images/shop/head.png">
-            </dt>
-            <dd>
-                <p>{{agentEntiy.name}}</p>
-                <h5>{{agentEntiy.company}}</h5>
-            </dd>
-        </dl>
-        <div class="telephone" @click="telephone();">
-            <i>
-                <img src="../../../static/images/shop/tel.png">
-            </i>
-            <span>电话</span>
-        </div>
-    </div>
-    <!-- 推荐列表 -->
-    <div class="recommendListWrap">
-        <h2>为你推荐</h2>
-        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
-            <dt>
-                <img :src="item.imgs" :onerror="defaultImg">
-            </dt>
-            <dd>
-                <h3>{{item.title}}</h3>
-                <h5>{{item.name}}</h5>
-                <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
-                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                <p><span>合作佣金：</span>{{item.commission}}</p>
-            </dd>
-        </dl>
-    </div>
-
-</div>
-</template>
-
-<script>
-  import axios from 'axios';
-  import qs from 'qs';
-  export default {
-    data(){
-      return{
-        shopId: "",
-        basic: {},
-        lbtArr: [], //轮播图
-        imgTotal: 0,
-        num1: 1,
-        num2: 1,
-        sliderIndex: "",
-        activeIndex: "",
-        tabTitle: 0,
-
-        labelList: [], //标签
-        supportingList: [], //配套设施
-        dynamicList: [], //铺源动态
-
-        recommendedList: [], //推荐列表
-
-        agentEntiy: {}, //经纪人信息
-        telephoneVal: "", //经纪人电话
-
-        dynamicIndex: 0,
-
-        typeUrl: "",
-
-        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
-
-      }
-    },
-    computed: {
-        // 
-        top() {
-            return - this.dynamicIndex * 1.04 + 'rem';
-        }
-
-    },
-    watch:{
-
-    },
-    mounted(){
-        this.shopId = this.$route.query.id;
-
-        this.typeUrl = getUrlId("type");
-
-        //初始化
-        this.detailData();
-
-        //滚动事件
-        var _this = this;
-        window.onscroll = function(){
-            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
-            if(scrollTop >= 80){
-                _this.tabTitle = 1;
-                $(".tel-msg").hide();
-            }else{
-                _this.tabTitle = 0;
-            }
-        },
-
-        setInterval(_ => {
-            if(this.dynamicIndex < this.dynamicList.length) {
-                this.dynamicIndex += 1;
-            } else {
-                this.dynamicIndex = 0;
-            }
-        }, 1000);
-
-    },
-    updated(){
-        // this.fenxiangFun();
-        let _this = this;
-        setTimeout(function () {
-           _this.showBanner();
-        },500);
-    },
-    // beforeRouteEnter (to, from, next) {
-    //     var u = navigator.userAgent;
-    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
-    //     if (isiOS && to.path !== location.pathname) {
-    //         // 此处不可使用location.replace
-    //         location.assign(to.fullPath)
-    //     } else {
-    //         next()
-    //     }
-    // },
-    methods:{
-
-        goShop(){
-            if(this.typeUrl == "1"){
-                this.$router.go(-1);
-            }else if(this.typeUrl == "2"){
-                this.$router.push({path:"/home"});
-            }else{
-                this.$router.push({path:"/shoulou"});
-            }
-        },
-
-        // 为您推荐
-        go(id){
-            window.location.href = "http://"+window.location.host+"/shouloudetail?"+"id="+id+"&type=1";
-            window.scrollTo('0','0');
-        },
-
-        // 详情列表
-        detailData() {
-            let _this = this;
-            let url = this.changeData() + '/office/appOfficeDetail'
-            var data = {
-                projectId: this.shopId,  //项目ID（shopId或officeId）
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.basic = data.data.basic;
-                this.lbtArr = data.data.basic.imgs;
-                this.imgTotal = data.data.basic.imgs.length;
-                this.labelList = data.data.basic.label; 
-                this.supportingList = data.data.supportingList;
-                this.dynamicList = data.data.basic.dynamicList; //铺源动态
-                this.recommendedList = data.data.basic.recommendedList; //推荐列表
-                this.agentEntiy = data.data.agentEntiy; //经纪人信息
-                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
-                console.log(this.basic);
-                // console.log(this.recommendedList);
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        tab1(){
-            $(".bannerBig").show();
-            var that = this;
-
-            if(that.sliderIndex == 0){
-                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
-            }
-            
-            var swiper2 = new Swiper('.swiper-container2', {
-                initialSlide : that.sliderIndex,
-                on: {
-                    slideChangeTransitionEnd: function(){
-                       that.sliderIndex = this.activeIndex;
-                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        tab2(){
-            this.num2 = 1;
-            $(".bannerBig").hide();
-        },
-
-        showBanner(){
-            var that = this;
-            var swiper1 = new Swiper('.swiper-container1', {
-                on: {
-                    slideChangeTransitionEnd: function(){
-                        that.sliderIndex = this.activeIndex;
-                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        telephone(){
-            window.location.href = 'tel:'+this.telephoneVal;
-        }
-
-    },
-    watch: {
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-@import "../../../static/css/shopDetail.scss";
-</style>
-
-<style>
-.layui-m-layer-tel .layui-m-layercont{
-    padding: 35px 30px;
-}
-.layui-m-layer-tel h2{
-    font-size: .32rem;
-    color: #333;
-    margin-bottom: .3rem;
-}
-.layui-m-layer-tel p{
-    font-size: .36rem;
-    color: #e8584f;
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
-    color: #898989;
-    background: #f7f8fa;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
-    color: #fff;
-    background: #64AAFF;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    border-radius: 0 0 5px 0;
-}
+<template>
+<div class="shopdetail">
+    <!-- 头部导航 -->
+    <div class="jiantou-title" v-show="tabTitle===1">
+        <span @click="goShop();"></span>{{basic.name}}
+    </div>
+    <!-- 轮播图 -->
+    <div class="banner">
+        <div class="backImgWrap" @click="goShop();">
+            <img src="../../../static/images/common/whiteBack.png" class="backImg">
+        </div>
+        <div class="wrap">
+            <ul class="txt">
+                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
+                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
+            </ul>
+            <div class="swiper-container swiper-container1 swiper-container-horizontal">
+                <div class="swiper-wrapper">
+                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
+                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
+                    </div>
+                </div>
+                <div class="swiper-pagination"></div>
+            </div>
+        </div>
+    </div>
+    <!-- 大轮播图 -->
+    <div class="bannerBig" @click="tab2()">
+        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
+        <div class="swiper-container swiper-container2 swiper-container-horizontal">
+            <div class="swiper-wrapper">
+                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
+            </div>
+            <div class="swiper-pagination"></div>
+        </div>
+    </div>
+    <!-- 商铺详情介绍 -->
+    <div class="detailBoxWrap">
+        <div class="topBox">
+            <h2>{{basic.name}}</h2>
+            <div class="labelWrap">
+                <ul>
+                    <li v-for="(item,index) in labelList">{{item}}</li>
+                </ul>
+            </div>
+            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
+            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
+            <div class="priceWrap clearfix">
+                <dl>
+                    <dt>{{basic.total_price}}{{basic.totalPrice_u}}</dt>
+                    <dd>总价</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.ave_price}}{{basic.ave_price_u}}</dt>
+                    <dd>单价</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
+                    <dd>建筑面积</dd>
+                </dl>
+            </div>
+        </div>
+        <div class="mainBox">
+            <dl class="dlTitle clearfix">
+                <dt>位置：</dt>
+                <dd>{{basic.real_address}}</dd>
+            </dl>
+            <div class="mainList clearfix">
+                <div class="divL fl">
+                    <dl class="clearfix">
+                        <dt>类型：</dt>
+                        <dd>{{basic.type}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>楼层：</dt>
+                        <dd>{{basic.floor_current}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>可注册：</dt>
+                        <dd>{{basic.register}}</dd>
+                    </dl>
+                </div>
+
+                <div class="divR fl">
+                    <dl class="clearfix">
+                        <dt>装修：</dt>
+                        <dd>{{basic.decorate}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>工位数：</dt>
+                        <dd>{{basic.station}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>可分割：</dt>
+                        <dd>{{basic.separate}}</dd>
+                    </dl>
+                </div>
+            </div>
+            <!-- <dl class="dlType clearfix">
+                <dt>付款方式：</dt>
+                <dd>{{basic.pay_method}}</dd>
+            </dl> -->
+            <dl class="dlType clearfix">
+                <dt>开发商：</dt>
+                <dd>{{basic.developer}}</dd>
+            </dl>
+        </div>
+    </div>
+    <!-- 配套设施 -->
+    <div class="supportingWrap clearfix">
+        <h3>配套设施</h3>
+        <ul v-for="(item,index) in supportingList">
+            <li v-if="item.d_value == 0"><img src="../../../static/images/shop/icon0.png"></li>
+            <li v-if="item.d_value == 1"><img src="../../../static/images/shop/icon1.png"></li>
+            <li v-if="item.d_value == 2"><img src="../../../static/images/shop/icon2.png"></li>
+            <li v-if="item.d_value == 3"><img src="../../../static/images/shop/icon3.png"></li>
+            <li v-if="item.d_value == 4"><img src="../../../static/images/shop/icon4.png"></li>
+            <li v-if="item.d_value == 5"><img src="../../../static/images/shop/icon5.png"></li>
+            <li v-if="item.d_value == 6"><img src="../../../static/images/shop/icon6.png"></li>
+            <li v-if="item.d_value == 7"><img src="../../../static/images/shop/icon7.png"></li>
+            <li v-if="item.d_value == 8"><img src="../../../static/images/shop/icon8.png"></li>
+            <li v-if="item.d_value == 9"><img src="../../../static/images/shop/icon9.png"></li>
+            <li v-if="item.d_value == 10"><img src="../../../static/images/shop/icon10.png"></li>
+            <li v-if="item.d_value == 11"><img src="../../../static/images/shop/icon11.png"></li>
+        </ul>
+    </div>
+    <!-- 铺源动态 -->
+    <div class="shopDynamic">
+        <span class="fl">铺源动态</span>
+        <!-- <span class="span2"></span> -->
+        <div class="scrollWrap fl">
+            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
+                <li v-for="item in dynamicList">{{item}}</li>  
+            </ul>
+            <ul class="scroll-content" v-else>
+                <li>暂无</li>
+            </ul>
+        </div>
+    </div>
+    <!-- 商铺描述 -->
+    <div class="shopDescribe">
+        <span>商铺描述</span>
+        <span class="span3">{{basic.introduce}}</span>
+    </div>
+    <!-- 查看经纪人 -->
+    <div class="telephoneWrap">
+        <dl>
+            <dt>
+                <img src="../../../static/images/shop/head.png">
+            </dt>
+            <dd>
+                <p>{{agentEntiy.name}}</p>
+                <h5>{{agentEntiy.company}}</h5>
+            </dd>
+        </dl>
+        <div class="telephone" @click="telephone();">
+            <i>
+                <img src="../../../static/images/shop/tel.png">
+            </i>
+            <span>电话</span>
+        </div>
+    </div>
+    <!-- 推荐列表 -->
+    <div class="recommendListWrap">
+        <h2>为你推荐</h2>
+        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
+            <dt>
+                <img :src="item.imgs" :onerror="defaultImg">
+            </dt>
+            <dd>
+                <h3>{{item.title}}</h3>
+                <h5>{{item.name}}</h5>
+                <h6><span>总价：</span>{{item.totalPrice}}{{item.totalPrice_u}}</h6>
+                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                <p><span>合作佣金：</span>{{item.commission}}</p>
+            </dd>
+        </dl>
+    </div>
+
+</div>
+</template>
+
+<script>
+  import axios from 'axios';
+  import qs from 'qs';
+  export default {
+    data(){
+      return{
+        shopId: "",
+        basic: {},
+        lbtArr: [], //轮播图
+        imgTotal: 0,
+        num1: 1,
+        num2: 1,
+        sliderIndex: "",
+        activeIndex: "",
+        tabTitle: 0,
+
+        labelList: [], //标签
+        supportingList: [], //配套设施
+        dynamicList: [], //铺源动态
+
+        recommendedList: [], //推荐列表
+
+        agentEntiy: {}, //经纪人信息
+        telephoneVal: "", //经纪人电话
+
+        dynamicIndex: 0,
+
+        typeUrl: "",
+
+        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
+
+      }
+    },
+    computed: {
+        // 
+        top() {
+            return - this.dynamicIndex * 1.04 + 'rem';
+        }
+
+    },
+    watch:{
+
+    },
+    mounted(){
+        this.shopId = this.$route.query.id;
+
+        this.typeUrl = getUrlId("type");
+
+        //初始化
+        this.detailData();
+
+        //滚动事件
+        var _this = this;
+        window.onscroll = function(){
+            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+            if(scrollTop >= 80){
+                _this.tabTitle = 1;
+                $(".tel-msg").hide();
+            }else{
+                _this.tabTitle = 0;
+            }
+        },
+
+        setInterval(_ => {
+            if(this.dynamicIndex < this.dynamicList.length) {
+                this.dynamicIndex += 1;
+            } else {
+                this.dynamicIndex = 0;
+            }
+        }, 1000);
+
+    },
+    updated(){
+        // this.fenxiangFun();
+        let _this = this;
+        setTimeout(function () {
+           _this.showBanner();
+        },500);
+    },
+    // beforeRouteEnter (to, from, next) {
+    //     var u = navigator.userAgent;
+    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
+    //     if (isiOS && to.path !== location.pathname) {
+    //         // 此处不可使用location.replace
+    //         location.assign(to.fullPath)
+    //     } else {
+    //         next()
+    //     }
+    // },
+    methods:{
+
+        goShop(){
+            if(this.typeUrl == "1"){
+                this.$router.go(-1);
+            }else if(this.typeUrl == "2"){
+                this.$router.push({path:"/home"});
+            }else{
+                this.$router.push({path:"/shoulou"});
+            }
+        },
+
+        // 为您推荐
+        go(id){
+            window.location.href = "http://"+window.location.host+"/shouloudetail?"+"id="+id+"&type=1";
+            window.scrollTo('0','0');
+        },
+
+        // 详情列表
+        detailData() {
+            let _this = this;
+            let url = this.changeData() + '/office/appOfficeDetail'
+            var data = {
+                projectId: this.shopId,  //项目ID（shopId或officeId）
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.basic = data.data.basic;
+                this.lbtArr = data.data.basic.imgs;
+                this.imgTotal = data.data.basic.imgs.length;
+                this.labelList = data.data.basic.label; 
+                this.supportingList = data.data.supportingList;
+                this.dynamicList = data.data.basic.dynamicList; //铺源动态
+                this.recommendedList = data.data.basic.recommendedList; //推荐列表
+                this.agentEntiy = data.data.agentEntiy; //经纪人信息
+                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
+                console.log(this.basic);
+                // console.log(this.recommendedList);
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        tab1(){
+            $(".bannerBig").show();
+            var that = this;
+
+            if(that.sliderIndex == 0){
+                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
+            }
+            
+            var swiper2 = new Swiper('.swiper-container2', {
+                initialSlide : that.sliderIndex,
+                on: {
+                    slideChangeTransitionEnd: function(){
+                       that.sliderIndex = this.activeIndex;
+                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        tab2(){
+            this.num2 = 1;
+            $(".bannerBig").hide();
+        },
+
+        showBanner(){
+            var that = this;
+            var swiper1 = new Swiper('.swiper-container1', {
+                on: {
+                    slideChangeTransitionEnd: function(){
+                        that.sliderIndex = this.activeIndex;
+                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        telephone(){
+            window.location.href = 'tel:'+this.telephoneVal;
+        }
+
+    },
+    watch: {
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+@import "../../../static/css/shopDetail.scss";
+</style>
+
+<style>
+.layui-m-layer-tel .layui-m-layercont{
+    padding: 35px 30px;
+}
+.layui-m-layer-tel h2{
+    font-size: .32rem;
+    color: #333;
+    margin-bottom: .3rem;
+}
+.layui-m-layer-tel p{
+    font-size: .36rem;
+    color: #e8584f;
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
+    color: #898989;
+    background: #f7f8fa;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
+    color: #fff;
+    background: #64AAFF;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    border-radius: 0 0 5px 0;
+}
 </style>

src/components/shop/zulou.vue

@@ -1,390 +1,390 @@
-<template>
-<div class="shopWrap">
-    <div class="shopTop">
-        <dl class="searchNav">
-            <dt>
-                <img src="../../../static/images/common/back.png" @click="goHome();">
-            </dt>
-            <dd @click="goSearch();">
-                <img src="../../../static/images/shop/search.png">
-                <span>请搜索在租写字楼</span>
-            </dd>
-        </dl>
-        <div class="shaixuan">
-            <div class="list">
-                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
-
-                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
-
-                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
-
-                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
-            </div>
-
-            <div class="listContent">
-                <ul class="one">
-                    <!-- 区域 -->
-                    <li class="oneList" v-show="tab===0">
-                        <ul class="two areaBox">
-                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
-                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                    <!-- 业态 -->
-                    <li class="oneList" v-show="tab===1">
-                        <ul class="four">
-                            <li v-for="(item,index) in yeTaiList" @click="yetaiChildFun($event,item)">{{item.d_name}}</li>
-                        </ul>
-                    </li>
-                    <!-- 面积 -->
-                    <li class="oneList" v-show="tab===2">
-                        <ul class="four">
-                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
-                        </ul>
-                    </li>
-                    <!-- 价格 -->
-                    <li class="oneList" v-show="tab===3">
-                        <ul class="two twoPrice">
-                            <li class="twoChild" v-for="(item,index) in price">
-                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in priceList" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                </ul>
-            </div>
-        </div>
-    </div>
-
-    <div class="shoplist" v-show="noData===1">
-        <div class="detail" ref="wrapper">
-            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
-                <ul>
-                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
-                        <div class="lisyImg">
-                            <img :src="item.imgs" :onerror="defaultImg">
-                        </div>
-                        <div class="listBox">
-                            <h3>{{item.title}}</h3>
-                            <h5>{{item.name}}</h5>
-                            <h6><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
-                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                            <p><span>合作佣金：</span>{{item.commission}}</p>
-                        </div>
-                    </li>
-                </ul>
-                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
-            </mt-loadmore>
-        </div>
-    </div>
-
-    <div class="noData" v-show="noData===0">
-        <dl>
-            <dt>
-                <img src="../../../static/images/common/noData.png">
-            </dt>
-            <p>暂无数据</p>
-        </dl>
-    </div>
-
-</div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Indicator } from 'mint-ui';
-export default {
-    name: '',
-    data () {
-        return {
-            noData: 1,
-            tab: "",
-            pageSize: 10,
-            pageNum: 1,
-            shopIndex: 1,
-            allLoaded: false,
-            more: false,
-
-            num: 0,
-            num1: 0,
-            num2: 0,
-
-            areaList: [], //筛选区域
-            areaTxt: "", //区域文字
-            areaChild: [], //筛选区域子集
-            yeTaiList: [], //业态
-            yetaiChild: [], //业态子集
-            yeTaiTxt: "", //业态文案
-            mianjiList: [], //面积
-            mianjiTxt: "", //面积文案
-            price:[
-                {"name": "日租金"},
-            ],
-            priceList: [],
-            priceChild: [], //价格子集
-            priceTxt: "", //价格文案
-            
-            areaId: "", //区域ID
-            businessAreaId: "", //商圈ID
-            typeId: "", //类型ID
-            yeTaiId: "", //行业ID
-            sonManageTypeId: "", //业态子集
-            mianjiId: "", //面积ID
-            priceId: "", //价格Id
-            
-            listArr: [],
-
-            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-       }
-    },
-    computed:{
-
-    },
-    methods:{
-
-        goHome(){
-            this.$router.push({path:"/home"});
-        },
-        goDetail(id){
-            this.$router.push({path:"/zuloudetail",query:{id: id}});
-        },
-        goSearch(){
-            this.$router.push({path:"/search",query:{type: "1"}});
-        },
-
-        // 条件列表
-        selectData() {
-            let _this = this;
-            let url = this.changeData() + '/office/findOfficeRentSearch'
-            var data = {
-                cityId: sessionStorage.cityId || 110100, //城市ID 
-                channel: "1",
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.areaList = data.data.areaList; //区域
-                this.yeTaiList = data.data.typeList; //业态
-                this.mianjiList = data.data.mianjiList; //面积
-                this.priceList = data.data.dailyList; //日租金
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        // 条件列表
-        listData() {
-            let _this = this;
-            let url = this.changeData() + '/office/selectOfficePage'
-            var data = {
-                titleArea: this.businessAreaId, //区域ID
-                titleMianjiId: this.mianjiId, //面积ID
-                titleDailyRentId: this.priceId, //日租金Id
-                titleType: this.yeTaiId, //业态（类型）
-                typeSale: "1",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.pageNum, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                Indicator.open({
-                    text: '',
-                    spinnerType: 'fading-circle'
-                });
-                setTimeout(function () {
-                    Indicator.close();
-                },1000);
-                this.listArr = data.data.list; //列表
-                if(this.listArr.length==0){
-                    this.noData = 0;
-                }else{
-                    this.noData = 1;
-                }
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        //下拉刷新
-        loadTop(){
-            $(".shoplist ul li").removeClass("cur");
-            var _this = this;
-            this.shopIndex = 1;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleMianjiId: this.mianjiId, //面积ID
-                titleDailyRentId: this.priceId, //日租金Id
-                titleType: this.yeTaiId, //业态（类型）
-                typeSale: "1",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: "1", //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            setTimeout(function () {
-                _this.$http.post(_this.changeData() + '/office/selectOfficePage', qs.stringify(data)).then(function (data) {
-                    _this.listArr = data.data.list; //列表
-                    _this.$refs.loadmore.onTopLoaded();
-                }.bind(_this)).catch(function (err) {
-                    console.log("商店列表页面错误：", err)
-                })
-            }, 2000);
-        },
-
-        //上拉加载
-        loadBottom() {
-            var _this = this;
-            this.shopIndex++;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleMianjiId: this.mianjiId, //面积ID
-                titleDailyRentId: this.priceId, //日租金Id
-                titleType: this.yeTaiId, //业态（类型）
-                typeSale: "1",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.shopIndex, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            _this.$http.post(_this.changeData() + '/office/selectOfficePage',qs.stringify(data)).then(function(res){
-                _this.listArr = _this.listArr.concat(res.data.list);
-                if(res.data.list == ''){
-                    this.allLoaded = true;
-                }
-                _this.$refs.loadmore.onBottomLoaded();
-            }.bind(_this)).catch(function(err){
-                console.log("商店列表页面错误：",err);
-            })
-        },
-        handleBottomChange(){
-            var _this = this;
-            if(this.allLoaded == true){
-                this.more = true;
-                setTimeout(function () {
-                    _this.more = false;
-                },2000)
-            }
-        },
-
-        tab1(e){
-            if($(e.srcElement).hasClass("cur")){
-               this.tab = "";
-            }else{
-                this.tab = 0;
-                if(this.num === 0){
-                   $(".areaBox li").eq(0).children(".first").click();
-                   this.num++;
-                }
-            }
-        },
-        tab2(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 1;
-                if(this.num2 === 0){
-                    $(".twoYetai li").eq(0).children(".first2").click();
-                    this.num2++;
-                }
-            }
-        },
-        tab3(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 2;
-            }
-        },
-        tab4(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 3;
-                if(this.num1 === 0){
-                    $(".twoPrice li").eq(0).children(".first1").click();
-                    this.num1++;
-                }
-            }
-        },
-
-        // 区域筛选
-        quyuFun(e,item){
-            this.areaChild = item;
-            this.areaId = item.id;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        quyuChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.businessAreaId = item.id;
-            this.areaTxt = item.name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 业态筛选
-        yetaiFun(e,item){
-            this.yetaiChild = item;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        yetaiChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.yeTaiId = item.d_value;
-            this.yeTaiTxt = item.d_name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 面积
-        mianjiFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.mianjiId = item.id;
-            this.mianjiTxt = item.show_text;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 价格
-        priceFun(e,index){
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        priceChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.priceId = item.id;
-            this.priceTxt = item.show_text;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-    },
-    mounted() {
-        // 条件列表
-        this.selectData();
-        this.listData();
-    },
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-@import "../../../static/css/shopList.scss";
-</style>
-
+<template>
+<div class="shopWrap">
+    <div class="shopTop">
+        <dl class="searchNav">
+            <dt>
+                <img src="../../../static/images/common/back.png" @click="goHome();">
+            </dt>
+            <dd @click="goSearch();">
+                <img src="../../../static/images/shop/search.png">
+                <span>请搜索在租写字楼</span>
+            </dd>
+        </dl>
+        <div class="shaixuan">
+            <div class="list">
+                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
+
+                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
+
+                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
+
+                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
+            </div>
+
+            <div class="listContent">
+                <ul class="one">
+                    <!-- 区域 -->
+                    <li class="oneList" v-show="tab===0">
+                        <ul class="two areaBox">
+                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
+                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                    <!-- 业态 -->
+                    <li class="oneList" v-show="tab===1">
+                        <ul class="four">
+                            <li v-for="(item,index) in yeTaiList" @click="yetaiChildFun($event,item)">{{item.d_name}}</li>
+                        </ul>
+                    </li>
+                    <!-- 面积 -->
+                    <li class="oneList" v-show="tab===2">
+                        <ul class="four">
+                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
+                        </ul>
+                    </li>
+                    <!-- 价格 -->
+                    <li class="oneList" v-show="tab===3">
+                        <ul class="two twoPrice">
+                            <li class="twoChild" v-for="(item,index) in price">
+                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in priceList" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+
+    <div class="shoplist" v-show="noData===1">
+        <div class="detail" ref="wrapper">
+            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
+                <ul>
+                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
+                        <div class="lisyImg">
+                            <img :src="item.imgs" :onerror="defaultImg">
+                        </div>
+                        <div class="listBox">
+                            <h3>{{item.title}}</h3>
+                            <h5>{{item.name}}</h5>
+                            <h6><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
+                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                            <p><span>合作佣金：</span>{{item.commission}}</p>
+                        </div>
+                    </li>
+                </ul>
+                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
+            </mt-loadmore>
+        </div>
+    </div>
+
+    <div class="noData" v-show="noData===0">
+        <dl>
+            <dt>
+                <img src="../../../static/images/common/noData.png">
+            </dt>
+            <p>暂无数据</p>
+        </dl>
+    </div>
+
+</div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Indicator } from 'mint-ui';
+export default {
+    name: '',
+    data () {
+        return {
+            noData: 1,
+            tab: "",
+            pageSize: 10,
+            pageNum: 1,
+            shopIndex: 1,
+            allLoaded: false,
+            more: false,
+
+            num: 0,
+            num1: 0,
+            num2: 0,
+
+            areaList: [], //筛选区域
+            areaTxt: "", //区域文字
+            areaChild: [], //筛选区域子集
+            yeTaiList: [], //业态
+            yetaiChild: [], //业态子集
+            yeTaiTxt: "", //业态文案
+            mianjiList: [], //面积
+            mianjiTxt: "", //面积文案
+            price:[
+                {"name": "日租金"},
+            ],
+            priceList: [],
+            priceChild: [], //价格子集
+            priceTxt: "", //价格文案
+            
+            areaId: "", //区域ID
+            businessAreaId: "", //商圈ID
+            typeId: "", //类型ID
+            yeTaiId: "", //行业ID
+            sonManageTypeId: "", //业态子集
+            mianjiId: "", //面积ID
+            priceId: "", //价格Id
+            
+            listArr: [],
+
+            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+       }
+    },
+    computed:{
+
+    },
+    methods:{
+
+        goHome(){
+            this.$router.push({path:"/home"});
+        },
+        goDetail(id){
+            this.$router.push({path:"/zuloudetail",query:{id: id}});
+        },
+        goSearch(){
+            this.$router.push({path:"/search",query:{type: "1"}});
+        },
+
+        // 条件列表
+        selectData() {
+            let _this = this;
+            let url = this.changeData() + '/office/findOfficeRentSearch'
+            var data = {
+                cityId: sessionStorage.cityId || 110100, //城市ID 
+                channel: "1",
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.areaList = data.data.areaList; //区域
+                this.yeTaiList = data.data.typeList; //业态
+                this.mianjiList = data.data.mianjiList; //面积
+                this.priceList = data.data.dailyList; //日租金
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        // 条件列表
+        listData() {
+            let _this = this;
+            let url = this.changeData() + '/office/selectOfficePage'
+            var data = {
+                titleArea: this.businessAreaId, //区域ID
+                titleMianjiId: this.mianjiId, //面积ID
+                titleDailyRentId: this.priceId, //日租金Id
+                titleType: this.yeTaiId, //业态（类型）
+                typeSale: "1",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.pageNum, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                Indicator.open({
+                    text: '',
+                    spinnerType: 'fading-circle'
+                });
+                setTimeout(function () {
+                    Indicator.close();
+                },1000);
+                this.listArr = data.data.list; //列表
+                if(this.listArr.length==0){
+                    this.noData = 0;
+                }else{
+                    this.noData = 1;
+                }
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        //下拉刷新
+        loadTop(){
+            $(".shoplist ul li").removeClass("cur");
+            var _this = this;
+            this.shopIndex = 1;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleMianjiId: this.mianjiId, //面积ID
+                titleDailyRentId: this.priceId, //日租金Id
+                titleType: this.yeTaiId, //业态（类型）
+                typeSale: "1",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: "1", //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            setTimeout(function () {
+                _this.$http.post(_this.changeData() + '/office/selectOfficePage', qs.stringify(data)).then(function (data) {
+                    _this.listArr = data.data.list; //列表
+                    _this.$refs.loadmore.onTopLoaded();
+                }.bind(_this)).catch(function (err) {
+                    console.log("商店列表页面错误：", err)
+                })
+            }, 2000);
+        },
+
+        //上拉加载
+        loadBottom() {
+            var _this = this;
+            this.shopIndex++;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleMianjiId: this.mianjiId, //面积ID
+                titleDailyRentId: this.priceId, //日租金Id
+                titleType: this.yeTaiId, //业态（类型）
+                typeSale: "1",  //1:出租 2:出售 3:新盘出租 4-新盘出售 【这里直接传2】
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.shopIndex, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            _this.$http.post(_this.changeData() + '/office/selectOfficePage',qs.stringify(data)).then(function(res){
+                _this.listArr = _this.listArr.concat(res.data.list);
+                if(res.data.list == ''){
+                    this.allLoaded = true;
+                }
+                _this.$refs.loadmore.onBottomLoaded();
+            }.bind(_this)).catch(function(err){
+                console.log("商店列表页面错误：",err);
+            })
+        },
+        handleBottomChange(){
+            var _this = this;
+            if(this.allLoaded == true){
+                this.more = true;
+                setTimeout(function () {
+                    _this.more = false;
+                },2000)
+            }
+        },
+
+        tab1(e){
+            if($(e.srcElement).hasClass("cur")){
+               this.tab = "";
+            }else{
+                this.tab = 0;
+                if(this.num === 0){
+                   $(".areaBox li").eq(0).children(".first").click();
+                   this.num++;
+                }
+            }
+        },
+        tab2(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 1;
+                if(this.num2 === 0){
+                    $(".twoYetai li").eq(0).children(".first2").click();
+                    this.num2++;
+                }
+            }
+        },
+        tab3(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 2;
+            }
+        },
+        tab4(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 3;
+                if(this.num1 === 0){
+                    $(".twoPrice li").eq(0).children(".first1").click();
+                    this.num1++;
+                }
+            }
+        },
+
+        // 区域筛选
+        quyuFun(e,item){
+            this.areaChild = item;
+            this.areaId = item.id;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        quyuChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.businessAreaId = item.id;
+            this.areaTxt = item.name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 业态筛选
+        yetaiFun(e,item){
+            this.yetaiChild = item;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        yetaiChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.yeTaiId = item.d_value;
+            this.yeTaiTxt = item.d_name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 面积
+        mianjiFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.mianjiId = item.id;
+            this.mianjiTxt = item.show_text;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 价格
+        priceFun(e,index){
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        priceChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.priceId = item.id;
+            this.priceTxt = item.show_text;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+    },
+    mounted() {
+        // 条件列表
+        this.selectData();
+        this.listData();
+    },
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+@import "../../../static/css/shopList.scss";
+</style>
+

src/components/shop/zuloudetail.vue

@@ -1,399 +1,399 @@
-<template>
-<div class="shopdetail">
-    <!-- 头部导航 -->
-    <div class="jiantou-title" v-show="tabTitle===1">
-        <span @click="goShop();"></span>{{basic.name}}
-    </div>
-    <!-- 轮播图 -->
-    <div class="banner">
-        <div class="backImgWrap" @click="goShop();">
-            <img src="../../../static/images/common/whiteBack.png" class="backImg">
-        </div>
-        <div class="wrap">
-            <ul class="txt">
-                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
-                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
-            </ul>
-            <div class="swiper-container swiper-container1 swiper-container-horizontal">
-                <div class="swiper-wrapper">
-                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
-                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
-                    </div>
-                </div>
-                <div class="swiper-pagination"></div>
-            </div>
-        </div>
-    </div>
-    <!-- 大轮播图 -->
-    <div class="bannerBig" @click="tab2()">
-        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
-        <div class="swiper-container swiper-container2 swiper-container-horizontal">
-            <div class="swiper-wrapper">
-                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
-            </div>
-            <div class="swiper-pagination"></div>
-        </div>
-    </div>
-    <!-- 商铺详情介绍 -->
-    <div class="detailBoxWrap">
-        <div class="topBox">
-            <h2>{{basic.name}}</h2>
-            <div class="labelWrap">
-                <ul>
-                    <li v-for="(item,index) in labelList">{{item}}</li>
-                </ul>
-            </div>
-            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
-            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
-            <div class="priceWrap clearfix">
-                <dl>
-                    <dt>{{basic.monthly_rent}}{{basic.monthly_rent_u}}</dt>
-                    <dd>月租金</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.daily_rent}}{{basic.daily_rent_u}}</dt>
-                    <dd>日租金</dd>
-                </dl>
-                <dl>
-                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
-                    <dd>建筑面积</dd>
-                </dl>
-            </div>
-        </div>
-        <div class="mainBox">
-            <dl class="dlTitle clearfix">
-                <dt>位置：</dt>
-                <dd>{{basic.real_address}}</dd>
-            </dl>
-            <div class="mainList clearfix">
-                <div class="divL fl">
-                    <dl class="clearfix">
-                        <dt>类型：</dt>
-                        <dd>{{basic.type}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>楼层：</dt>
-                        <dd>{{basic.floor_current}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>可注册：</dt>
-                        <dd>{{basic.register}}</dd>
-                    </dl>
-                </div>
-
-                <div class="divR fl">
-                    <dl class="clearfix">
-                        <dt>装修：</dt>
-                        <dd>{{basic.decorate}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>工位数：</dt>
-                        <dd>{{basic.station}}</dd>
-                    </dl>
-                    <dl class="clearfix">
-                        <dt>可分割：</dt>
-                        <dd>{{basic.separate}}</dd>
-                    </dl>
-                </div>
-            </div>
-            <dl class="dlType clearfix">
-                <dt>付款方式：</dt>
-                <dd>{{basic.pay_method}}</dd>
-            </dl>
-            <dl class="dlType clearfix">
-                <dt>开发商：</dt>
-                <dd>{{basic.developer}}</dd>
-            </dl>
-        </div>
-    </div>
-    <!-- 配套设施 -->
-    <div class="supportingWrap clearfix">
-        <h3>配套设施</h3>
-        <ul v-for="(item,index) in supportingList">
-            <li v-if="item.d_value == 0"><img src="../../../static/images/shop/icon0.png"></li>
-            <li v-if="item.d_value == 1"><img src="../../../static/images/shop/icon1.png"></li>
-            <li v-if="item.d_value == 2"><img src="../../../static/images/shop/icon2.png"></li>
-            <li v-if="item.d_value == 3"><img src="../../../static/images/shop/icon3.png"></li>
-            <li v-if="item.d_value == 4"><img src="../../../static/images/shop/icon4.png"></li>
-            <li v-if="item.d_value == 5"><img src="../../../static/images/shop/icon5.png"></li>
-            <li v-if="item.d_value == 6"><img src="../../../static/images/shop/icon6.png"></li>
-            <li v-if="item.d_value == 7"><img src="../../../static/images/shop/icon7.png"></li>
-            <li v-if="item.d_value == 8"><img src="../../../static/images/shop/icon8.png"></li>
-            <li v-if="item.d_value == 9"><img src="../../../static/images/shop/icon9.png"></li>
-            <li v-if="item.d_value == 10"><img src="../../../static/images/shop/icon10.png"></li>
-            <li v-if="item.d_value == 11"><img src="../../../static/images/shop/icon11.png"></li>
-        </ul>
-    </div>
-    <!-- 铺源动态 -->
-    <div class="shopDynamic">
-        <span class="fl">铺源动态</span>
-        <!-- <span class="span2"></span> -->
-        <div class="scrollWrap fl">
-            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
-                <li v-for="item in dynamicList">{{item}}</li>  
-            </ul>
-            <ul class="scroll-content" v-else>
-                <li>暂无</li>
-            </ul>
-        </div>
-    </div>
-    <!-- 商铺描述 -->
-    <div class="shopDescribe">
-        <span>商铺描述</span>
-        <span class="span3">{{basic.introduce}}</span>
-    </div>
-    <!-- 查看经纪人 -->
-    <div class="telephoneWrap">
-        <dl>
-            <dt>
-                <img src="../../../static/images/shop/head.png">
-            </dt>
-            <dd>
-                <p>{{agentEntiy.name}}</p>
-                <h5>{{agentEntiy.company}}</h5>
-            </dd>
-        </dl>
-        <div class="telephone" @click="telephone();">
-            <i>
-                <img src="../../../static/images/shop/tel.png">
-            </i>
-            <span>电话</span>
-        </div>
-    </div>
-    <!-- 推荐列表 -->
-    <div class="recommendListWrap">
-        <h2>为你推荐</h2>
-        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
-            <dt>
-                <img :src="item.imgs" :onerror="defaultImg">
-            </dt>
-            <dd>
-                <h3>{{item.title}}</h3>
-                <h5>{{item.name}}</h5>
-                <h6><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
-                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                <p><span>合作佣金：</span>{{item.commission}}</p>
-            </dd>
-        </dl>
-    </div>
-
-</div>
-</template>
-
-<script>
-  import axios from 'axios';
-  import qs from 'qs';
-  export default {
-    data(){
-      return{
-        shopId: "",
-        basic: {},
-        lbtArr: [], //轮播图
-        imgTotal: 0,
-        num1: 1,
-        num2: 1,
-        sliderIndex: "",
-        activeIndex: "",
-        tabTitle: 0,
-
-        labelList: [], //标签
-        supportingList: [], //配套设施
-        dynamicList: [], //铺源动态
-
-        recommendedList: [], //推荐列表
-
-        agentEntiy: {}, //经纪人信息
-        telephoneVal: "", //经纪人电话
-
-        dynamicIndex: 0,
-
-        typeUrl: "",
-
-        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
-
-      }
-    },
-    computed: {
-        // 
-        top() {
-            return - this.dynamicIndex * 1.04 + 'rem';
-        }
-
-    },
-    watch:{
-
-    },
-    mounted(){
-        this.shopId = this.$route.query.id;
-
-        this.typeUrl = getUrlId("type");
-
-        //初始化
-        this.detailData();
-
-        //滚动事件
-        var _this = this;
-        window.onscroll = function(){
-            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
-            if(scrollTop >= 80){
-                _this.tabTitle = 1;
-                $(".tel-msg").hide();
-            }else{
-                _this.tabTitle = 0;
-            }
-        },
-
-        setInterval(_ => {
-            if(this.dynamicIndex < this.dynamicList.length) {
-                this.dynamicIndex += 1;
-            } else {
-                this.dynamicIndex = 0;
-            }
-        }, 1000);
-
-    },
-    updated(){
-        // this.fenxiangFun();
-        let _this = this;
-        setTimeout(function () {
-           _this.showBanner();
-        },500);
-    },
-    // beforeRouteEnter (to, from, next) {
-    //     var u = navigator.userAgent;
-    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
-    //     if (isiOS && to.path !== location.pathname) {
-    //         // 此处不可使用location.replace
-    //         location.assign(to.fullPath)
-    //     } else {
-    //         next()
-    //     }
-    // },
-    methods:{
-
-        goShop(){
-            if(this.typeUrl == "1"){
-                this.$router.go(-1);
-            }else if(this.typeUrl == "2"){
-                this.$router.push({path:"/home"});
-            }else{
-                this.$router.push({path:"/zulou"});
-            }
-        },
-
-        // 为您推荐
-        go(id){
-            window.location.href = "http://"+window.location.host+"/zuloudetail?"+"id="+id+"&type=1";
-            window.scrollTo('0','0');
-        },
-
-        // 详情列表
-        detailData() {
-            let _this = this;
-            let url = this.changeData() + '/office/appOfficeDetail'
-            var data = {
-                projectId: this.shopId,  //项目ID（shopId或officeId）
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.basic = data.data.basic;
-                this.lbtArr = data.data.basic.imgs;
-                this.imgTotal = data.data.basic.imgs.length;
-                this.labelList = data.data.basic.label; 
-                this.supportingList = data.data.supportingList;
-                this.dynamicList = data.data.basic.dynamicList; //铺源动态
-                this.recommendedList = data.data.basic.recommendedList; //推荐列表
-                this.agentEntiy = data.data.agentEntiy; //经纪人信息
-                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
-                // console.log(this.basic);
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        tab1(){
-            $(".bannerBig").show();
-            var that = this;
-
-            if(that.sliderIndex == 0){
-                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
-            }
-            
-            var swiper2 = new Swiper('.swiper-container2', {
-                initialSlide : that.sliderIndex,
-                on: {
-                    slideChangeTransitionEnd: function(){
-                       that.sliderIndex = this.activeIndex;
-                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        tab2(){
-            this.num2 = 1;
-            $(".bannerBig").hide();
-        },
-
-        showBanner(){
-            var that = this;
-            var swiper1 = new Swiper('.swiper-container1', {
-                on: {
-                    slideChangeTransitionEnd: function(){
-                        that.sliderIndex = this.activeIndex;
-                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
-                    }
-                }
-            });
-        },
-
-        telephone(){
-            window.location.href = 'tel:'+this.telephoneVal;
-        }
-
-    },
-    watch: {
-
-    }
-}
-</script>
-
-<style lang="scss" type="text/scss" scoped>
-@import "../../../static/css/shopDetail.scss";
-</style>
-
-<style>
-.layui-m-layer-tel .layui-m-layercont{
-    padding: 35px 30px;
-}
-.layui-m-layer-tel h2{
-    font-size: .32rem;
-    color: #333;
-    margin-bottom: .3rem;
-}
-.layui-m-layer-tel p{
-    font-size: .36rem;
-    color: #e8584f;
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
-    color: #898989;
-    background: #f7f8fa;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-}
-.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
-    color: #fff;
-    background: #64AAFF;
-    font-size: .34rem;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    border-radius: 0 0 5px 0;
-}
-</style>
-
-
-
+<template>
+<div class="shopdetail">
+    <!-- 头部导航 -->
+    <div class="jiantou-title" v-show="tabTitle===1">
+        <span @click="goShop();"></span>{{basic.name}}
+    </div>
+    <!-- 轮播图 -->
+    <div class="banner">
+        <div class="backImgWrap" @click="goShop();">
+            <img src="../../../static/images/common/whiteBack.png" class="backImg">
+        </div>
+        <div class="wrap">
+            <ul class="txt">
+                <li class="li1 fl">商铺编号：{{basic.shop_number}}</li>
+                <li class="swiperOne fr">{{num1}}/{{imgTotal}}</li>
+            </ul>
+            <div class="swiper-container swiper-container1 swiper-container-horizontal">
+                <div class="swiper-wrapper">
+                    <div class="swiper-slide" v-for="(item,index) in lbtArr">
+                        <img :src="item" alt="" :onerror="defaultImg1" @click="tab1()">
+                    </div>
+                </div>
+                <div class="swiper-pagination"></div>
+            </div>
+        </div>
+    </div>
+    <!-- 大轮播图 -->
+    <div class="bannerBig" @click="tab2()">
+        <div class="swiper-bottom">{{num2}}/{{imgTotal}}</div>
+        <div class="swiper-container swiper-container2 swiper-container-horizontal">
+            <div class="swiper-wrapper">
+                <div class="swiper-slide" v-for="(item,index) in lbtArr"><img :src="item" alt="" :onerror="defaultImg1"></div>
+            </div>
+            <div class="swiper-pagination"></div>
+        </div>
+    </div>
+    <!-- 商铺详情介绍 -->
+    <div class="detailBoxWrap">
+        <div class="topBox">
+            <h2>{{basic.name}}</h2>
+            <div class="labelWrap">
+                <ul>
+                    <li v-for="(item,index) in labelList">{{item}}</li>
+                </ul>
+            </div>
+            <h4>合作佣金：<span>{{basic.commission}}</span></h4>
+            <p>结佣时间：合同签订日期后{{basic.expired}}天内</p>
+            <div class="priceWrap clearfix">
+                <dl>
+                    <dt>{{basic.monthly_rent}}{{basic.monthly_rent_u}}</dt>
+                    <dd>月租金</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.daily_rent}}{{basic.daily_rent_u}}</dt>
+                    <dd>日租金</dd>
+                </dl>
+                <dl>
+                    <dt>{{basic.build_area}}{{basic.build_area_u}}</dt>
+                    <dd>建筑面积</dd>
+                </dl>
+            </div>
+        </div>
+        <div class="mainBox">
+            <dl class="dlTitle clearfix">
+                <dt>位置：</dt>
+                <dd>{{basic.real_address}}</dd>
+            </dl>
+            <div class="mainList clearfix">
+                <div class="divL fl">
+                    <dl class="clearfix">
+                        <dt>类型：</dt>
+                        <dd>{{basic.type}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>楼层：</dt>
+                        <dd>{{basic.floor_current}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>可注册：</dt>
+                        <dd>{{basic.register}}</dd>
+                    </dl>
+                </div>
+
+                <div class="divR fl">
+                    <dl class="clearfix">
+                        <dt>装修：</dt>
+                        <dd>{{basic.decorate}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>工位数：</dt>
+                        <dd>{{basic.station}}</dd>
+                    </dl>
+                    <dl class="clearfix">
+                        <dt>可分割：</dt>
+                        <dd>{{basic.separate}}</dd>
+                    </dl>
+                </div>
+            </div>
+            <dl class="dlType clearfix">
+                <dt>付款方式：</dt>
+                <dd>{{basic.pay_method}}</dd>
+            </dl>
+            <dl class="dlType clearfix">
+                <dt>开发商：</dt>
+                <dd>{{basic.developer}}</dd>
+            </dl>
+        </div>
+    </div>
+    <!-- 配套设施 -->
+    <div class="supportingWrap clearfix">
+        <h3>配套设施</h3>
+        <ul v-for="(item,index) in supportingList">
+            <li v-if="item.d_value == 0"><img src="../../../static/images/shop/icon0.png"></li>
+            <li v-if="item.d_value == 1"><img src="../../../static/images/shop/icon1.png"></li>
+            <li v-if="item.d_value == 2"><img src="../../../static/images/shop/icon2.png"></li>
+            <li v-if="item.d_value == 3"><img src="../../../static/images/shop/icon3.png"></li>
+            <li v-if="item.d_value == 4"><img src="../../../static/images/shop/icon4.png"></li>
+            <li v-if="item.d_value == 5"><img src="../../../static/images/shop/icon5.png"></li>
+            <li v-if="item.d_value == 6"><img src="../../../static/images/shop/icon6.png"></li>
+            <li v-if="item.d_value == 7"><img src="../../../static/images/shop/icon7.png"></li>
+            <li v-if="item.d_value == 8"><img src="../../../static/images/shop/icon8.png"></li>
+            <li v-if="item.d_value == 9"><img src="../../../static/images/shop/icon9.png"></li>
+            <li v-if="item.d_value == 10"><img src="../../../static/images/shop/icon10.png"></li>
+            <li v-if="item.d_value == 11"><img src="../../../static/images/shop/icon11.png"></li>
+        </ul>
+    </div>
+    <!-- 铺源动态 -->
+    <div class="shopDynamic">
+        <span class="fl">铺源动态</span>
+        <!-- <span class="span2"></span> -->
+        <div class="scrollWrap fl">
+            <ul class="scroll-content" :style="{ top }" v-if="this.dynamicList.length != 0">
+                <li v-for="item in dynamicList">{{item}}</li>  
+            </ul>
+            <ul class="scroll-content" v-else>
+                <li>暂无</li>
+            </ul>
+        </div>
+    </div>
+    <!-- 商铺描述 -->
+    <div class="shopDescribe">
+        <span>商铺描述</span>
+        <span class="span3">{{basic.introduce}}</span>
+    </div>
+    <!-- 查看经纪人 -->
+    <div class="telephoneWrap">
+        <dl>
+            <dt>
+                <img src="../../../static/images/shop/head.png">
+            </dt>
+            <dd>
+                <p>{{agentEntiy.name}}</p>
+                <h5>{{agentEntiy.company}}</h5>
+            </dd>
+        </dl>
+        <div class="telephone" @click="telephone();">
+            <i>
+                <img src="../../../static/images/shop/tel.png">
+            </i>
+            <span>电话</span>
+        </div>
+    </div>
+    <!-- 推荐列表 -->
+    <div class="recommendListWrap">
+        <h2>为你推荐</h2>
+        <dl class="recommendList" v-for="(item,index) in recommendedList" @click="go(item.id)">
+            <dt>
+                <img :src="item.imgs" :onerror="defaultImg">
+            </dt>
+            <dd>
+                <h3>{{item.title}}</h3>
+                <h5>{{item.name}}</h5>
+                <h6><span>日租金：</span>{{item.daily_rent}}{{item.daily_rent_u}}</h6>
+                <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                <p><span>合作佣金：</span>{{item.commission}}</p>
+            </dd>
+        </dl>
+    </div>
+
+</div>
+</template>
+
+<script>
+  import axios from 'axios';
+  import qs from 'qs';
+  export default {
+    data(){
+      return{
+        shopId: "",
+        basic: {},
+        lbtArr: [], //轮播图
+        imgTotal: 0,
+        num1: 1,
+        num2: 1,
+        sliderIndex: "",
+        activeIndex: "",
+        tabTitle: 0,
+
+        labelList: [], //标签
+        supportingList: [], //配套设施
+        dynamicList: [], //铺源动态
+
+        recommendedList: [], //推荐列表
+
+        agentEntiy: {}, //经纪人信息
+        telephoneVal: "", //经纪人电话
+
+        dynamicIndex: 0,
+
+        typeUrl: "",
+
+        defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        defaultImg1: 'this.src="' + require('../../../static/images/errImg/err1.png') + '"', //默认图
+
+      }
+    },
+    computed: {
+        // 
+        top() {
+            return - this.dynamicIndex * 1.04 + 'rem';
+        }
+
+    },
+    watch:{
+
+    },
+    mounted(){
+        this.shopId = this.$route.query.id;
+
+        this.typeUrl = getUrlId("type");
+
+        //初始化
+        this.detailData();
+
+        //滚动事件
+        var _this = this;
+        window.onscroll = function(){
+            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+            if(scrollTop >= 80){
+                _this.tabTitle = 1;
+                $(".tel-msg").hide();
+            }else{
+                _this.tabTitle = 0;
+            }
+        },
+
+        setInterval(_ => {
+            if(this.dynamicIndex < this.dynamicList.length) {
+                this.dynamicIndex += 1;
+            } else {
+                this.dynamicIndex = 0;
+            }
+        }, 1000);
+
+    },
+    updated(){
+        // this.fenxiangFun();
+        let _this = this;
+        setTimeout(function () {
+           _this.showBanner();
+        },500);
+    },
+    // beforeRouteEnter (to, from, next) {
+    //     var u = navigator.userAgent;
+    //     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+    //     // XXX: 修复iOS版微信HTML5 History兼容性问题
+    //     if (isiOS && to.path !== location.pathname) {
+    //         // 此处不可使用location.replace
+    //         location.assign(to.fullPath)
+    //     } else {
+    //         next()
+    //     }
+    // },
+    methods:{
+
+        goShop(){
+            if(this.typeUrl == "1"){
+                this.$router.go(-1);
+            }else if(this.typeUrl == "2"){
+                this.$router.push({path:"/home"});
+            }else{
+                this.$router.push({path:"/zulou"});
+            }
+        },
+
+        // 为您推荐
+        go(id){
+            window.location.href = "http://"+window.location.host+"/zuloudetail?"+"id="+id+"&type=1";
+            window.scrollTo('0','0');
+        },
+
+        // 详情列表
+        detailData() {
+            let _this = this;
+            let url = this.changeData() + '/office/appOfficeDetail'
+            var data = {
+                projectId: this.shopId,  //项目ID（shopId或officeId）
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.basic = data.data.basic;
+                this.lbtArr = data.data.basic.imgs;
+                this.imgTotal = data.data.basic.imgs.length;
+                this.labelList = data.data.basic.label; 
+                this.supportingList = data.data.supportingList;
+                this.dynamicList = data.data.basic.dynamicList; //铺源动态
+                this.recommendedList = data.data.basic.recommendedList; //推荐列表
+                this.agentEntiy = data.data.agentEntiy; //经纪人信息
+                this.telephoneVal = data.data.agentEntiy.tel; //经纪人电话
+                // console.log(this.basic);
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        tab1(){
+            $(".bannerBig").show();
+            var that = this;
+
+            if(that.sliderIndex == 0){
+                $(".swiper-bottom").text(1 + "/" + that.imgTotal);
+            }
+            
+            var swiper2 = new Swiper('.swiper-container2', {
+                initialSlide : that.sliderIndex,
+                on: {
+                    slideChangeTransitionEnd: function(){
+                       that.sliderIndex = this.activeIndex;
+                       $(".swiper-bottom").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        tab2(){
+            this.num2 = 1;
+            $(".bannerBig").hide();
+        },
+
+        showBanner(){
+            var that = this;
+            var swiper1 = new Swiper('.swiper-container1', {
+                on: {
+                    slideChangeTransitionEnd: function(){
+                        that.sliderIndex = this.activeIndex;
+                        $(".swiperOne").text(1+this.activeIndex + "/" + that.imgTotal);
+                    }
+                }
+            });
+        },
+
+        telephone(){
+            window.location.href = 'tel:'+this.telephoneVal;
+        }
+
+    },
+    watch: {
+
+    }
+}
+</script>
+
+<style lang="scss" type="text/scss" scoped>
+@import "../../../static/css/shopDetail.scss";
+</style>
+
+<style>
+.layui-m-layer-tel .layui-m-layercont{
+    padding: 35px 30px;
+}
+.layui-m-layer-tel h2{
+    font-size: .32rem;
+    color: #333;
+    margin-bottom: .3rem;
+}
+.layui-m-layer-tel p{
+    font-size: .36rem;
+    color: #e8584f;
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(1){
+    color: #898989;
+    background: #f7f8fa;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+.layui-m-layer-tel .layui-m-layerbtn span:nth-of-type(2){
+    color: #fff;
+    background: #64AAFF;
+    font-size: .34rem;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    border-radius: 0 0 5px 0;
+}
+</style>
+
+
+

src/components/shop/zushop.vue

@@ -1,415 +1,415 @@
-<template>
-<div class="shopWrap">
-    <div class="shopTop">
-        <dl class="searchNav">
-            <dt>
-                <img src="../../../static/images/common/back.png" @click="goHome();">
-            </dt>
-            <dd @click="goSearch();">
-                <img src="../../../static/images/shop/search.png">
-                <span>请搜索在租铺源</span>
-            </dd>
-        </dl>
-        <div class="shaixuan">
-            <div class="list">
-                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
-
-                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
-
-                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
-
-                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
-                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
-            </div>
-
-            <div class="listContent">
-                <!-- <div class="modal" @click="modalHide()" ref="modal"></div> -->
-                <ul class="one">
-                    <!-- 区域 -->
-                    <li class="oneList" v-show="tab===0">
-                        <ul class="two areaBox">
-                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
-                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                    <!-- 业态 -->
-                    <li class="oneList" v-show="tab===1">
-                        <ul class="four">
-                            <ul class="two twoYetai">
-                                <li class="twoChild" v-for="(item,index) in yeTaiList"><span class="first2" @click="yetaiFun($event,item)">{{item.name}}</span>
-                                    <ol class="three">
-                                        <li v-for="(item1,index1) in yetaiChild.childrenList" @click="yetaiChildFun($event,item1)">{{item1.name}}</li>
-                                    </ol>
-                                </li>
-                            </ul>
-                        </ul>
-                    </li>
-                    <!-- 面积 -->
-                    <li class="oneList" v-show="tab===2">
-                        <ul class="four">
-                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
-                        </ul>
-                    </li>
-                    <!-- 价格 -->
-                    <li class="oneList" v-show="tab===3">
-                        <ul class="two twoPrice">
-                            <li class="twoChild" v-for="(item,index) in price">
-                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
-                                <ol class="three">
-                                    <li v-for="(item1,index1) in priceChild" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
-                                </ol>
-                            </li>
-                        </ul>
-                    </li>
-                </ul>
-            </div>
-        </div>
-    </div>
-
-    <div class="shoplist" v-show="noData===1">
-        <div class="detail" ref="wrapper">
-            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
-                <ul>
-                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
-                        <div class="lisyImg">
-                            <img :src="item.imgs" :onerror="defaultImg">
-                        </div>
-                        <div class="listBox">
-                            <h3>{{item.title}}</h3>
-                            <h5>{{item.name}}</h5>
-                            <h6><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
-                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
-                            <p><span>合作佣金：</span>{{item.commission}}</p>
-                        </div>
-                    </li>
-                </ul>
-                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
-            </mt-loadmore>
-        </div>
-    </div>
-
-    <div class="noData" v-show="noData===0">
-        <dl>
-            <dt>
-                <img src="../../../static/images/common/noData.png">
-            </dt>
-            <p>暂无数据</p>
-        </dl>
-    </div>
-
-</div>
-</template>
-<script>
-import axios from 'axios';
-import qs from "qs";
-import { Indicator } from 'mint-ui';
-export default {
-    name: '',
-    data () {
-        return {
-            noData: 1,
-
-            tab: "",
-            pageSize: 10,
-            pageNum: 1,
-            shopIndex: 1,
-            allLoaded: false,
-            more: false,
-
-            num: 0,
-            num1: 0,
-            num2: 0,
-
-            areaList: [], //筛选区域
-            areaTxt: "", //区域文字
-            areaChild: [], //筛选区域子集
-            yeTaiList: [], //业态
-            yetaiChild: [], //业态子集
-            yeTaiTxt: "", //业态文案
-            mianjiList: [], //面积
-            mianjiTxt: "", //面积文案
-            price:[
-                {"name": "月租金",},
-                {"name": "转让费"}
-            ],
-            priceChild: [], //价格子集
-            priceTxt: "", //价格文案
-            monthlyList: [],
-            transFeeList: [],
-
-            areaId: "", //区域ID
-            businessAreaId: "", //商圈ID
-            typeId: "", //类型ID
-            yeTaiId: "", //行业ID
-            sonManageTypeId: "", //业态子集
-            mianjiId: "", //面积ID
-            monthlyRentListId: "", //月租ID
-            transFeeId: "", //转让费ID
-
-            listArr: [],
-
-            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
-        }
-    },
-    computed:{
-        
-    },
-    methods:{
-        goHome(){
-            this.$router.push({path:"/home"});
-        },
-        goDetail(id){
-            this.$router.push({path:"/zushopdetail",query:{id: id}});
-        },
-        goSearch(){
-            this.$router.push({path:"/searchshop",query:{type: "1"}});
-        },
-        // 条件列表
-        selectData() {
-            let _this = this;
-            let url = this.changeData() + '/shop/findShopRentSearch'
-            var data = {
-                cityId: sessionStorage.cityId || 110100, //城市ID 
-                channel: "1",
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                this.areaList = data.data.areaList; //区域
-                this.yeTaiList = data.data.yeTaiList; //业态
-                this.mianjiList = data.data.mianjiList; //面积
-                this.monthlyList = data.data.monthlyRentList; //月租金
-                this.transFeeList = data.data.transFeeList; //转让费
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        // 条件列表
-        listData() {
-            let _this = this;
-            let url = this.changeData() + '/shop/selectShopPage'
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleYeTaiId: this.yeTaiId, //行业
-                titleMianjiId: this.mianjiId, //面积ID
-                titleMonthlyId: this.monthlyRentListId, //月租ID
-                titleTransfeeId: this.transFeeId, //转让费ID
-                rentType: "1", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.pageNum, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            axios(url,{
-                method: 'post',
-                params: data
-            }).then(data => {
-                // console.log(data);
-                Indicator.open({
-                    text: '',
-                    spinnerType: 'fading-circle'
-                });
-                setTimeout(function () {
-                    Indicator.close();
-                },1000);
-                this.listArr = data.data.list; //列表
-                if(this.listArr.length==0){
-                    this.noData = 0;
-                }else{
-                    this.noData = 1;
-                }
-
-            }).catch(err => {
-                console.log(err)
-            });
-        },
-
-        //下拉刷新
-        loadTop(){
-            $(".shoplist ul li").removeClass("cur");
-            this.shopIndex = 1;
-            var _this = this;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleYeTaiId: this.yeTaiId, //行业
-                titleMianjiId: this.mianjiId, //面积ID
-                titleMonthlyId: this.monthlyRentListId, //月租ID
-                titleTransfeeId: this.transFeeId, //转让费ID
-                rentType: "1", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: "1", //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            setTimeout(function () {
-                _this.$http.post(_this.changeData() + '/shop/selectShopPage', qs.stringify(data)).then(function (data) {
-                    _this.listArr = data.data.list; //列表
-                    _this.$refs.loadmore.onTopLoaded();
-                }.bind(_this)).catch(function (err) {
-                    console.log("商店列表页面错误：", err)
-                })
-            }, 2000);
-        },
-
-        //上拉加载
-        loadBottom() {
-            var _this = this;
-            this.shopIndex++;
-            var data = {
-                titleAreaId: this.businessAreaId, //区域ID
-                titleYeTaiId: this.yeTaiId, //行业
-                titleMianjiId: this.mianjiId, //面积ID
-                titleMonthlyId: this.monthlyRentListId, //月租ID
-                titleTransfeeId: this.transFeeId, //转让费ID
-                rentType: "1", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
-                pageSize: this.pageSize, // 每页显示条数
-                pageNum: this.shopIndex, //第几页
-                cityId: sessionStorage.cityId || 110100, //城市ID
-                sonManageTypeId: this.sonManageTypeId, //业态子集
-            }
-            _this.$http.post(_this.changeData() + '/shop/selectShopPage',qs.stringify(data)).then(function(res){
-                _this.listArr = _this.listArr.concat(res.data.list);
-                if(res.data.list == ''){
-                    this.allLoaded = true;
-                }
-                _this.$refs.loadmore.onBottomLoaded();
-            }.bind(_this)).catch(function(err){
-                console.log("商店列表页面错误：",err);
-            })
-        },
-        handleBottomChange(){
-            var _this = this;
-            if(this.allLoaded == true){
-                this.more = true;
-                setTimeout(function () {
-                    _this.more = false;
-                },2000)
-            }
-        },
-
-        tab1(e){
-            if($(e.srcElement).hasClass("cur")){
-               this.tab = "";
-            }else{
-                this.tab = 0;
-                if(this.num === 0){
-                   $(".areaBox li").eq(0).children(".first").click();
-                   this.num++;
-                }
-            }
-        },
-        tab2(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 1;
-                if(this.num2 === 0){
-                    $(".twoYetai li").eq(0).children(".first2").click();
-                    this.num2++;
-                }
-            }
-        },
-        tab3(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 2;
-            }
-        },
-        tab4(e){
-            if($(e.srcElement).hasClass("cur")){
-                this.tab = "";
-            }else{
-                this.tab = 3;
-                if(this.num1 === 0){
-                    $(".twoPrice li").eq(0).children(".first1").click();
-                    this.num1++;
-                }
-            }
-        },
-
-        // 区域筛选
-        quyuFun(e,item){
-            this.areaChild = item;
-            this.areaId = item.id;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        quyuChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.businessAreaId = item.id;
-            this.areaTxt = item.name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 业态筛选
-        yetaiFun(e,item){
-            this.yetaiChild = item;
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        yetaiChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.yeTaiId = item.id;
-            this.yeTaiTxt = item.name;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 面积
-        mianjiFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            this.mianjiId = item.id;
-            this.mianjiTxt = item.show_text;
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.tab = "";
-            this.listData();
-        },
-        // 价格
-        priceFun(e,index){
-            if(index == 0){
-                this.priceChild = this.monthlyList; //月租金
-                this.priceIndex = 0;
-            }else{
-                this.priceIndex = 1;
-                this.priceChild = this.transFeeList; //转让费
-            }
-            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
-        },
-        priceChildFun(e,item){
-            this.shopIndex = 1;
-            this.allLoaded = false;
-            if(this.priceIndex == 0){
-                this.monthlyRentListId = item.id;  //月租金id
-            }else{
-                this.transFeeId = item.id; //转让费id
-            }
-            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
-            this.priceTxt = item.show_text;
-            this.tab = "";
-            this.listData();
-        },
-    },
-    mounted() {
-        // 条件列表
-        this.selectData();
-        this.listData();
-    },
-}
-</script>
-<style scoped lang="scss"  type="text/scss">
-@import "../../../static/css/shopList.scss";
-</style>
-
+<template>
+<div class="shopWrap">
+    <div class="shopTop">
+        <dl class="searchNav">
+            <dt>
+                <img src="../../../static/images/common/back.png" @click="goHome();">
+            </dt>
+            <dd @click="goSearch();">
+                <img src="../../../static/images/shop/search.png">
+                <span>请搜索在租铺源</span>
+            </dd>
+        </dl>
+        <div class="shaixuan">
+            <div class="list">
+                <div @click="tab1($event)" :class="{'cur':tab===0}" v-if="this.areaTxt == '' || this.areaTxt == '全部'"><span>区域</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab1($event)" class="listTxt" v-else><span>{{areaTxt}}</span><i></i></div>
+
+                <div @click="tab2($event)" :class="{'cur':tab===1}" v-if="this.yeTaiTxt == '' || this.yeTaiTxt == '全部'"><span>业态</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab2($event)" class="listTxt" v-else><span>{{yeTaiTxt}}</span><i></i></div>
+
+                <div @click="tab3($event)" :class="{'cur':tab===2}" v-if="this.mianjiTxt == '' || this.mianjiTxt == '全部'"><span>面积</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab3($event)" class="listTxt" v-else><span>{{mianjiTxt}}</span><i></i></div>
+
+                <div @click="tab4($event)" :class="{'cur':tab===3}" v-if="this.priceTxt == '' || this.priceTxt == '全部'"><span>价格</span><i class="deltaBlack"></i><i class="deltaBlue"></i></div>
+                <div @click="tab4($event)" class="listTxt" v-else><span>{{priceTxt}}</span><i></i></div>
+            </div>
+
+            <div class="listContent">
+                <!-- <div class="modal" @click="modalHide()" ref="modal"></div> -->
+                <ul class="one">
+                    <!-- 区域 -->
+                    <li class="oneList" v-show="tab===0">
+                        <ul class="two areaBox">
+                            <li class="twoChild" v-for="(item,index) in areaList" ref="first">
+                                <span class="first" @click="quyuFun($event,item)">{{item.area_name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in areaChild.regionsList" @click="quyuChildFun($event,item1)">{{item1.name}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                    <!-- 业态 -->
+                    <li class="oneList" v-show="tab===1">
+                        <ul class="four">
+                            <ul class="two twoYetai">
+                                <li class="twoChild" v-for="(item,index) in yeTaiList"><span class="first2" @click="yetaiFun($event,item)">{{item.name}}</span>
+                                    <ol class="three">
+                                        <li v-for="(item1,index1) in yetaiChild.childrenList" @click="yetaiChildFun($event,item1)">{{item1.name}}</li>
+                                    </ol>
+                                </li>
+                            </ul>
+                        </ul>
+                    </li>
+                    <!-- 面积 -->
+                    <li class="oneList" v-show="tab===2">
+                        <ul class="four">
+                            <li v-for="(item,index) in mianjiList" @click="mianjiFun($event,item)">{{item.show_text}}</li>
+                        </ul>
+                    </li>
+                    <!-- 价格 -->
+                    <li class="oneList" v-show="tab===3">
+                        <ul class="two twoPrice">
+                            <li class="twoChild" v-for="(item,index) in price">
+                                <span class="first1" @click="priceFun($event,index)">{{item.name}}</span>
+                                <ol class="three">
+                                    <li v-for="(item1,index1) in priceChild" @click="priceChildFun($event,item1)">{{item1.show_text}}</li>
+                                </ol>
+                            </li>
+                        </ul>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+
+    <div class="shoplist" v-show="noData===1">
+        <div class="detail" ref="wrapper">
+            <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" @bottom-status-change="handleBottomChange" ref="loadmore" :bottom-all-loaded="allLoaded" :auto-fill="false"> 
+                <ul>
+                    <li v-for="(item,index) in listArr" @click="goDetail(item.id);">
+                        <div class="lisyImg">
+                            <img :src="item.imgs" :onerror="defaultImg">
+                        </div>
+                        <div class="listBox">
+                            <h3>{{item.title}}</h3>
+                            <h5>{{item.name}}</h5>
+                            <h6><span>月租金：</span>{{item.monthly_rent}}{{item.monthly_rent_u}}</h6>
+                            <div class="tags"><span v-if="index1 < 3" v-for="(item1,index1) in item.label">{{item1}}</span></div>
+                            <p><span>合作佣金：</span>{{item.commission}}</p>
+                        </div>
+                    </li>
+                </ul>
+                <div class="noMore" v-if="more" style=" margin-bottom: 1.8rem;">没有更多数据了...</div>
+            </mt-loadmore>
+        </div>
+    </div>
+
+    <div class="noData" v-show="noData===0">
+        <dl>
+            <dt>
+                <img src="../../../static/images/common/noData.png">
+            </dt>
+            <p>暂无数据</p>
+        </dl>
+    </div>
+
+</div>
+</template>
+<script>
+import axios from 'axios';
+import qs from "qs";
+import { Indicator } from 'mint-ui';
+export default {
+    name: '',
+    data () {
+        return {
+            noData: 1,
+
+            tab: "",
+            pageSize: 10,
+            pageNum: 1,
+            shopIndex: 1,
+            allLoaded: false,
+            more: false,
+
+            num: 0,
+            num1: 0,
+            num2: 0,
+
+            areaList: [], //筛选区域
+            areaTxt: "", //区域文字
+            areaChild: [], //筛选区域子集
+            yeTaiList: [], //业态
+            yetaiChild: [], //业态子集
+            yeTaiTxt: "", //业态文案
+            mianjiList: [], //面积
+            mianjiTxt: "", //面积文案
+            price:[
+                {"name": "月租金",},
+                {"name": "转让费"}
+            ],
+            priceChild: [], //价格子集
+            priceTxt: "", //价格文案
+            monthlyList: [],
+            transFeeList: [],
+
+            areaId: "", //区域ID
+            businessAreaId: "", //商圈ID
+            typeId: "", //类型ID
+            yeTaiId: "", //行业ID
+            sonManageTypeId: "", //业态子集
+            mianjiId: "", //面积ID
+            monthlyRentListId: "", //月租ID
+            transFeeId: "", //转让费ID
+
+            listArr: [],
+
+            defaultImg: 'this.src="' + require('../../../static/images/errImg/err.png') + '"', //默认图
+        }
+    },
+    computed:{
+        
+    },
+    methods:{
+        goHome(){
+            this.$router.push({path:"/home"});
+        },
+        goDetail(id){
+            this.$router.push({path:"/zushopdetail",query:{id: id}});
+        },
+        goSearch(){
+            this.$router.push({path:"/searchshop",query:{type: "1"}});
+        },
+        // 条件列表
+        selectData() {
+            let _this = this;
+            let url = this.changeData() + '/shop/findShopRentSearch'
+            var data = {
+                cityId: sessionStorage.cityId || 110100, //城市ID 
+                channel: "1",
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                this.areaList = data.data.areaList; //区域
+                this.yeTaiList = data.data.yeTaiList; //业态
+                this.mianjiList = data.data.mianjiList; //面积
+                this.monthlyList = data.data.monthlyRentList; //月租金
+                this.transFeeList = data.data.transFeeList; //转让费
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        // 条件列表
+        listData() {
+            let _this = this;
+            let url = this.changeData() + '/shop/selectShopPage'
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleYeTaiId: this.yeTaiId, //行业
+                titleMianjiId: this.mianjiId, //面积ID
+                titleMonthlyId: this.monthlyRentListId, //月租ID
+                titleTransfeeId: this.transFeeId, //转让费ID
+                rentType: "1", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.pageNum, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            axios(url,{
+                method: 'post',
+                params: data
+            }).then(data => {
+                // console.log(data);
+                Indicator.open({
+                    text: '',
+                    spinnerType: 'fading-circle'
+                });
+                setTimeout(function () {
+                    Indicator.close();
+                },1000);
+                this.listArr = data.data.list; //列表
+                if(this.listArr.length==0){
+                    this.noData = 0;
+                }else{
+                    this.noData = 1;
+                }
+
+            }).catch(err => {
+                console.log(err)
+            });
+        },
+
+        //下拉刷新
+        loadTop(){
+            $(".shoplist ul li").removeClass("cur");
+            this.shopIndex = 1;
+            var _this = this;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleYeTaiId: this.yeTaiId, //行业
+                titleMianjiId: this.mianjiId, //面积ID
+                titleMonthlyId: this.monthlyRentListId, //月租ID
+                titleTransfeeId: this.transFeeId, //转让费ID
+                rentType: "1", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: "1", //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            setTimeout(function () {
+                _this.$http.post(_this.changeData() + '/shop/selectShopPage', qs.stringify(data)).then(function (data) {
+                    _this.listArr = data.data.list; //列表
+                    _this.$refs.loadmore.onTopLoaded();
+                }.bind(_this)).catch(function (err) {
+                    console.log("商店列表页面错误：", err)
+                })
+            }, 2000);
+        },
+
+        //上拉加载
+        loadBottom() {
+            var _this = this;
+            this.shopIndex++;
+            var data = {
+                titleAreaId: this.businessAreaId, //区域ID
+                titleYeTaiId: this.yeTaiId, //行业
+                titleMianjiId: this.mianjiId, //面积ID
+                titleMonthlyId: this.monthlyRentListId, //月租ID
+                titleTransfeeId: this.transFeeId, //转让费ID
+                rentType: "1", // 销售类别：1:出租 2:出售 3:新盘出租 4-新盘出售
+                pageSize: this.pageSize, // 每页显示条数
+                pageNum: this.shopIndex, //第几页
+                cityId: sessionStorage.cityId || 110100, //城市ID
+                sonManageTypeId: this.sonManageTypeId, //业态子集
+            }
+            _this.$http.post(_this.changeData() + '/shop/selectShopPage',qs.stringify(data)).then(function(res){
+                _this.listArr = _this.listArr.concat(res.data.list);
+                if(res.data.list == ''){
+                    this.allLoaded = true;
+                }
+                _this.$refs.loadmore.onBottomLoaded();
+            }.bind(_this)).catch(function(err){
+                console.log("商店列表页面错误：",err);
+            })
+        },
+        handleBottomChange(){
+            var _this = this;
+            if(this.allLoaded == true){
+                this.more = true;
+                setTimeout(function () {
+                    _this.more = false;
+                },2000)
+            }
+        },
+
+        tab1(e){
+            if($(e.srcElement).hasClass("cur")){
+               this.tab = "";
+            }else{
+                this.tab = 0;
+                if(this.num === 0){
+                   $(".areaBox li").eq(0).children(".first").click();
+                   this.num++;
+                }
+            }
+        },
+        tab2(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 1;
+                if(this.num2 === 0){
+                    $(".twoYetai li").eq(0).children(".first2").click();
+                    this.num2++;
+                }
+            }
+        },
+        tab3(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 2;
+            }
+        },
+        tab4(e){
+            if($(e.srcElement).hasClass("cur")){
+                this.tab = "";
+            }else{
+                this.tab = 3;
+                if(this.num1 === 0){
+                    $(".twoPrice li").eq(0).children(".first1").click();
+                    this.num1++;
+                }
+            }
+        },
+
+        // 区域筛选
+        quyuFun(e,item){
+            this.areaChild = item;
+            this.areaId = item.id;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        quyuChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.businessAreaId = item.id;
+            this.areaTxt = item.name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 业态筛选
+        yetaiFun(e,item){
+            this.yetaiChild = item;
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        yetaiChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.yeTaiId = item.id;
+            this.yeTaiTxt = item.name;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 面积
+        mianjiFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            this.mianjiId = item.id;
+            this.mianjiTxt = item.show_text;
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.tab = "";
+            this.listData();
+        },
+        // 价格
+        priceFun(e,index){
+            if(index == 0){
+                this.priceChild = this.monthlyList; //月租金
+                this.priceIndex = 0;
+            }else{
+                this.priceIndex = 1;
+                this.priceChild = this.transFeeList; //转让费
+            }
+            $(e.srcElement).parent(".twoChild").addClass("cur").siblings().removeClass("cur");
+        },
+        priceChildFun(e,item){
+            this.shopIndex = 1;
+            this.allLoaded = false;
+            if(this.priceIndex == 0){
+                this.monthlyRentListId = item.id;  //月租金id
+            }else{
+                this.transFeeId = item.id; //转让费id
+            }
+            $(e.srcElement).addClass("cur").siblings().removeClass("cur");
+            this.priceTxt = item.show_text;
+            this.tab = "";
+            this.listData();
+        },
+    },
+    mounted() {
+        // 条件列表
+        this.selectData();
+        this.listData();
+    },
+}
+</script>
+<style scoped lang="scss"  type="text/scss">
+@import "../../../static/css/shopList.scss";
+</style>
+

src/components/work/work.vue

@@ -1,34 +1,34 @@
-<template>
-<div class="work">
-
-</div>
-</template>
-
-<script>
-import axios from 'axios';
-import qs from "qs";
-export default {
-    name: 'work',
-    data () {
-        return {
-           
-        }
-    },
-    computed:{
-
-    },
-    methods:{
-
-        
-    },
-    mounted() {       
-
-    }
-}
-</script>
-
-<style scoped lang="scss"  type="text/scss">
-
-</style>
-
-
+<template>
+<div class="work">
+
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import qs from "qs";
+export default {
+    name: 'work',
+    data () {
+        return {
+           
+        }
+    },
+    computed:{
+
+    },
+    methods:{
+
+        
+    },
+    mounted() {       
+
+    }
+}
+</script>
+
+<style scoped lang="scss"  type="text/scss">
+
+</style>
+
+

src/main.js

@@ -1,84 +1,84 @@
-// The Vue build version to load with the `import` command
-// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
-import Vue from 'vue'
-import App from './App'
-import Mint from 'mint-ui'
-import axios from "axios"
-import Qs from "qs"
-import QRCode from 'qrcode'     //引入生成二维码组件
-import router from './router'
-import store from './store/index.js'
-import host from '../static/js/host/host.js'
-// import VueAxios from 'vue-axios'
-
-import 'mint-ui/lib/style.css'
-import 'babel-polyfill'
-
-Vue.use(Mint);
-Vue.use(host);
-Vue.prototype.$http = axios;
-Vue.config.productionTip = false;
-
-import { Toast } from 'mint-ui';
-// var axios_instance = axios.create({
-//   baseURL:'http://test-api-mpb.yingshangchina.com',
-//   transformRequest: [function (data) {
-//     data = Qs.stringify(data);
-//     return data;
-//   }]
-// });
-// Vue.use(VueAxios, axios_instance);
-
-
-// http request 拦截器
-axios.interceptors.request.use(
-config => {
-if (localStorage.token) {  // 判断是否存在token，如果存在的话，则每个http header都加上token
-    config.headers["token"]  = localStorage.token;
-}
-    return config;
-},
-err => {
-    return Promise.reject(err);
-});
-
-// http response 拦截器
-axios.interceptors.response.use(
-response => {
-    if(response.data.code == 201){
-        localStorage.clear();
-        Toast("请先登录")
-        router.replace({
-            path: "userLogin",
-            query: {redirect: router.currentRoute.fullPath}
-        })
-    }else if(response.data.code == 202){
-        localStorage.clear();
-        Toast("登录超时，请重新登录")
-        router.replace({
-            path: 'userLogin',
-            query: {redirect: router.currentRoute.fullPath}
-        })
-    }
-    return response;
-},
-error => {
-    return Promise.reject(error)   // 返回接口返回的错误信息
-});
-
-
-
-/* eslint-disable no-new */
-new Vue({
-    el: '#app',
-    router,
-    store,
-    host,
-    components: { App },
-    template: '<App/>',
-    render: h => h(App),
-    // mounted () {
-    //   document.dispatchEvent(new Event('render-event'))
-    // }
-})
-
+// The Vue build version to load with the `import` command
+// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
+import Vue from 'vue'
+import App from './App'
+import Mint from 'mint-ui'
+import axios from "axios"
+import Qs from "qs"
+import QRCode from 'qrcode'     //引入生成二维码组件
+import router from './router'
+import store from './store/index.js'
+import host from '../static/js/host/host.js'
+// import VueAxios from 'vue-axios'
+
+import 'mint-ui/lib/style.css'
+import 'babel-polyfill'
+
+Vue.use(Mint);
+Vue.use(host);
+Vue.prototype.$http = axios;
+Vue.config.productionTip = false;
+
+import { Toast } from 'mint-ui';
+// var axios_instance = axios.create({
+//   baseURL:'http://test-api-mpb.yingshangchina.com',
+//   transformRequest: [function (data) {
+//     data = Qs.stringify(data);
+//     return data;
+//   }]
+// });
+// Vue.use(VueAxios, axios_instance);
+
+
+// http request 拦截器
+axios.interceptors.request.use(
+config => {
+if (localStorage.token) {  // 判断是否存在token，如果存在的话，则每个http header都加上token
+    config.headers["token"]  = localStorage.token;
+}
+    return config;
+},
+err => {
+    return Promise.reject(err);
+});
+
+// http response 拦截器
+axios.interceptors.response.use(
+response => {
+    if(response.data.code == 201){
+        localStorage.clear();
+        Toast("请先登录")
+        router.replace({
+            path: "userLogin",
+            query: {redirect: router.currentRoute.fullPath}
+        })
+    }else if(response.data.code == 202){
+        localStorage.clear();
+        Toast("登录超时，请重新登录")
+        router.replace({
+            path: 'userLogin',
+            query: {redirect: router.currentRoute.fullPath}
+        })
+    }
+    return response;
+},
+error => {
+    return Promise.reject(error)   // 返回接口返回的错误信息
+});
+
+
+
+/* eslint-disable no-new */
+new Vue({
+    el: '#app',
+    router,
+    store,
+    host,
+    components: { App },
+    template: '<App/>',
+    render: h => h(App),
+    // mounted () {
+    //   document.dispatchEvent(new Event('render-event'))
+    // }
+})
+

src/router/index.js

@@ -1,114 +1,114 @@
-import Vue from 'vue'
-import Router from 'vue-router'
-import store from "../store/index.js"
-
-// 一级路由
-import NavBar from '@/components/navBar'
-
-//二级路由
-import Home from '@/components/home/home.vue' //首页
-import Work from '@/components/work/work.vue' //工作管理
-import Message from '@/components/message/message.vue' //消息
-import Mine from '@/components/mine/mine.vue' //我的
-
-import ZuShop from '@/components/shop/zushop.vue' //租商铺列表
-import ZuShopDetail from '@/components/shop/zushopdetail.vue' //租商铺详情
-import SellShop from '@/components/shop/sellshop.vue' //买商铺列表
-import SellShopDetail from '@/components/shop/sellshopdetail.vue' //买商铺详情
-import NewShop from '@/components/shop/newshop.vue' //商铺新盘列表
-import NewShopDetail from '@/components/shop/newshopdetail.vue' //商铺新盘详情
-
-import ShouLou from '@/components/shop/shoulou.vue' //买写字楼列表
-import ShouLouDetail from '@/components/shop/shouloudetail.vue' //买写字楼详情
-import ZuLou from '@/components/shop/zulou.vue' //买写字楼列表
-import ZuLouDetail from '@/components/shop/zuloudetail.vue' //买写字楼详情
-import Loupan from '@/components/shop/loupan.vue' //写字楼新盘列表
-import LoupanDetail from '@/components/shop/loupandetail.vue' //写字楼新盘详情
-import Search from '@/components/shop/search.vue' //搜索楼盘
-import Searchshop from '@/components/shop/searchshop.vue' //搜索商铺
-
-import Login from '@/components/login/login' //登录
-import UserLogin from '@/components/login/userLogin' //登录
-import UserAgreement from '@/components/login/userAgreement' //用户协议
-
-import DevelopmentTeam from '@/components/code/developmentTeam' //发展团队
-import DevelopmentTeamH5 from '@/components/code/developmentTeamH5' //发展团队PC使用
-
-import NewsDel from '@/components/news/newsDel' //资讯详情 (APP端使用)
-import News from '@/components/news/news' //资讯详情
-import Agreement from '@/components/common/agreement' //实名认证服务协议
-
-import AboutUP from '@/components/mine/aboutUP' //关于优铺
-import Consultation from '@/components/mine/consultation' //问题咨询
-import SetList from '@/components/mine/set' //系统设置
-
-import Brand from '@/components/brand/brand' //品牌
-import ZyBrand from '@/components/brand/zybrand' //直营品牌
-import JmBrand from '@/components/brand/jmbrand' //加盟品牌
-import ZyDetail from '@/components/brand/zydetail' //直营品牌详情
-import JmDetail from '@/components/brand/jmdetail' //加盟品牌详情
-import BrandSearch from '@/components/brand/brandsearch' //加盟品牌详情
-
-import Entrust from '@/components/entrust/entrust' //在线委托
-
-import Qiuzu from '@/components/qiuzu/qiuzu' //求租列表
-import Qiugou from '@/components/qiugou/qiugou' //求购列表
-
-Vue.use(Router)
-
-const router =  new Router({
-  // base: "/",
-  mode: "history",
-  scrollBehavior: ()=>({y:0}),//路由切换以后返回到顶部
-  routes: [
-    {path: '*', name:'navBar',redirect: "/home",component: NavBar,
-        children:[
-          {path: '/home',component: Home},
-          {path: '/mine',component: Mine},
-          {path: '/work',component: Work},
-          {path: '/message',component: Message},
-        ]
-    },
-    {path: '/zuShop',component: ZuShop}, //租商铺
-    {path: '/zuShopDetail',component: ZuShopDetail}, //租商铺详情
-    {path: '/sellShop',component: SellShop}, //买商铺
-    {path: '/sellShopDetail',component: SellShopDetail}, //买商铺详情
-    {path: '/shoulou',component: ShouLou}, //买写字楼
-    {path: '/shouloudetail',component: ShouLouDetail}, //买写字楼详情
-    {path: '/zuLou',component: ZuLou}, //租写字楼
-    {path: '/zuLouDetail',component: ZuLouDetail}, //租写字楼详情
-    {path: '/newShop',component: NewShop}, //商铺新盘列表
-    {path: '/newshopdetail',component: NewShopDetail}, //商铺新盘详情
-    {path: '/loupan',component: Loupan}, //写字楼新盘列表
-    {path: '/loupandetail',component: LoupanDetail}, //写字楼新盘详情
-    {path: '/search',component: Search}, //搜索楼盘
-    {path: '/searchshop',component: Searchshop}, //搜索商铺
-
-    {path: '/brand',component: Brand}, //品牌
-    {path: '/zybrand',component: ZyBrand}, //直营品牌
-    {path: '/jmbrand',component: JmBrand}, //加盟品牌
-    {path: '/zydetail',component: ZyDetail}, //直营品牌详情
-    {path: '/jmdetail',component: JmDetail}, //加盟品牌详情
-    {path: '/brandsearch',component: BrandSearch}, //品牌搜索
-
-    {path: '/login',component: Login}, // 登录
-    {path: '/userlogin',component: UserLogin}, // 用户登录
-    {path: '/UserAgreement',component: UserAgreement}, //用户协议
-    {path: '/developmentTeam',component: DevelopmentTeam}, //发展团队
-    {path: '/developmentTeamH5',component: DevelopmentTeamH5}, //发展团队PC使用
-    {path: '/aboutUP',component: AboutUP}, //关于优铺
-    {path: '/agreement',component: Agreement}, //实名认证服务协议
-    {path: '/newsDel',component: NewsDel}, //资讯详情(APP端使用)
-    {path: '/news',component: News}, //资讯详情
-    {path: '/set',component: SetList}, //系统设置
-    {path: '/consultation',component: Consultation}, //问题咨询
-
-    {path: '/entrust',component: Entrust}, //在线委托
-
-    {path: '/qiuzu',component: Qiuzu}, //求租列表
-    {path: '/qiugou',component: Qiugou}, //求购列表
-
-  ],
-})
-
-export default router;
+import Vue from 'vue'
+import Router from 'vue-router'
+import store from "../store/index.js"
+
+// 一级路由
+import NavBar from '@/components/navBar'
+
+//二级路由
+import Home from '@/components/home/home.vue' //首页
+import Work from '@/components/work/work.vue' //工作管理
+import Message from '@/components/message/message.vue' //消息
+import Mine from '@/components/mine/mine.vue' //我的
+
+import ZuShop from '@/components/shop/zushop.vue' //租商铺列表
+import ZuShopDetail from '@/components/shop/zushopdetail.vue' //租商铺详情
+import SellShop from '@/components/shop/sellshop.vue' //买商铺列表
+import SellShopDetail from '@/components/shop/sellshopdetail.vue' //买商铺详情
+import NewShop from '@/components/shop/newshop.vue' //商铺新盘列表
+import NewShopDetail from '@/components/shop/newshopdetail.vue' //商铺新盘详情
+
+import ShouLou from '@/components/shop/shoulou.vue' //买写字楼列表
+import ShouLouDetail from '@/components/shop/shouloudetail.vue' //买写字楼详情
+import ZuLou from '@/components/shop/zulou.vue' //买写字楼列表
+import ZuLouDetail from '@/components/shop/zuloudetail.vue' //买写字楼详情
+import Loupan from '@/components/shop/loupan.vue' //写字楼新盘列表
+import LoupanDetail from '@/components/shop/loupandetail.vue' //写字楼新盘详情
+import Search from '@/components/shop/search.vue' //搜索楼盘
+import Searchshop from '@/components/shop/searchshop.vue' //搜索商铺
+
+import Login from '@/components/login/login' //登录
+import UserLogin from '@/components/login/userLogin' //登录
+import UserAgreement from '@/components/login/userAgreement' //用户协议
+
+import DevelopmentTeam from '@/components/code/developmentTeam' //发展团队
+import DevelopmentTeamH5 from '@/components/code/developmentTeamH5' //发展团队PC使用
+
+import NewsDel from '@/components/news/newsDel' //资讯详情 (APP端使用)
+import News from '@/components/news/news' //资讯详情
+import Agreement from '@/components/common/agreement' //实名认证服务协议
+
+import AboutUP from '@/components/mine/aboutUP' //关于优铺
+import Consultation from '@/components/mine/consultation' //问题咨询
+import SetList from '@/components/mine/set' //系统设置
+
+import Brand from '@/components/brand/brand' //品牌
+import ZyBrand from '@/components/brand/zybrand' //直营品牌
+import JmBrand from '@/components/brand/jmbrand' //加盟品牌
+import ZyDetail from '@/components/brand/zydetail' //直营品牌详情
+import JmDetail from '@/components/brand/jmdetail' //加盟品牌详情
+import BrandSearch from '@/components/brand/brandsearch' //加盟品牌详情
+
+import Entrust from '@/components/entrust/entrust' //在线委托
+
+import Qiuzu from '@/components/qiuzu/qiuzu' //求租列表
+import Qiugou from '@/components/qiugou/qiugou' //求购列表
+
+Vue.use(Router)
+
+const router =  new Router({
+  // base: "/",
+  mode: "history",
+  scrollBehavior: ()=>({y:0}),//路由切换以后返回到顶部
+  routes: [
+    {path: '*', name:'navBar',redirect: "/home",component: NavBar,
+        children:[
+          {path: '/home',component: Home},
+          {path: '/mine',component: Mine},
+          {path: '/work',component: Work},
+          {path: '/message',component: Message},
+        ]
+    },
+    {path: '/zuShop',component: ZuShop}, //租商铺
+    {path: '/zuShopDetail',component: ZuShopDetail}, //租商铺详情
+    {path: '/sellShop',component: SellShop}, //买商铺
+    {path: '/sellShopDetail',component: SellShopDetail}, //买商铺详情
+    {path: '/shoulou',component: ShouLou}, //买写字楼
+    {path: '/shouloudetail',component: ShouLouDetail}, //买写字楼详情
+    {path: '/zuLou',component: ZuLou}, //租写字楼
+    {path: '/zuLouDetail',component: ZuLouDetail}, //租写字楼详情
+    {path: '/newShop',component: NewShop}, //商铺新盘列表
+    {path: '/newshopdetail',component: NewShopDetail}, //商铺新盘详情
+    {path: '/loupan',component: Loupan}, //写字楼新盘列表
+    {path: '/loupandetail',component: LoupanDetail}, //写字楼新盘详情
+    {path: '/search',component: Search}, //搜索楼盘
+    {path: '/searchshop',component: Searchshop}, //搜索商铺
+
+    {path: '/brand',component: Brand}, //品牌
+    {path: '/zybrand',component: ZyBrand}, //直营品牌
+    {path: '/jmbrand',component: JmBrand}, //加盟品牌
+    {path: '/zydetail',component: ZyDetail}, //直营品牌详情
+    {path: '/jmdetail',component: JmDetail}, //加盟品牌详情
+    {path: '/brandsearch',component: BrandSearch}, //品牌搜索
+
+    {path: '/login',component: Login}, // 登录
+    {path: '/userlogin',component: UserLogin}, // 用户登录
+    {path: '/UserAgreement',component: UserAgreement}, //用户协议
+    {path: '/developmentTeam',component: DevelopmentTeam}, //发展团队
+    {path: '/developmentTeamH5',component: DevelopmentTeamH5}, //发展团队PC使用
+    {path: '/aboutUP',component: AboutUP}, //关于优铺
+    {path: '/agreement',component: Agreement}, //实名认证服务协议
+    {path: '/newsDel',component: NewsDel}, //资讯详情(APP端使用)
+    {path: '/news',component: News}, //资讯详情
+    {path: '/set',component: SetList}, //系统设置
+    {path: '/consultation',component: Consultation}, //问题咨询
+
+    {path: '/entrust',component: Entrust}, //在线委托
+
+    {path: '/qiuzu',component: Qiuzu}, //求租列表
+    {path: '/qiugou',component: Qiugou}, //求购列表
+
+  ],
+})
+
+export default router;

src/store/actions.js

@@ -1,9 +1,9 @@
-
-export default{
-  login: ({commit})=>{
-    commit("login")
-  },
-	logout: ({commit})=>{
-		commit("logout")
-	}
-}
+
+export default{
+  login: ({commit})=>{
+    commit("login")
+  },
+	logout: ({commit})=>{
+		commit("logout")
+	}
+}

src/store/getters.js

@@ -1,5 +1,5 @@
-export default{
-	token:(state)=> {
-    return state.token;
-  }
-}
+export default{
+	token:(state)=> {
+    return state.token;
+  }
+}

src/store/index.js

@@ -1,18 +1,18 @@
-import Vue from "vue";
-import Vuex from "vuex";
-
-Vue.use(Vuex);
-
-
-import actions from "./actions.js";
-import mutations from "./mutations.js";
-
-
-
-export default new Vuex.Store({
-    actions,
-    modules: {
-        mutations
-    }
-});
-
+import Vue from "vue";
+import Vuex from "vuex";
+
+Vue.use(Vuex);
+
+
+import actions from "./actions.js";
+import mutations from "./mutations.js";
+
+
+
+export default new Vuex.Store({
+    actions,
+    modules: {
+        mutations
+    }
+});
+

src/store/mutations.js

@@ -1,23 +1,23 @@
-
-import getters from './getters.js';
-
-var state = {
-	token: ""
-}
-const mutations = {
-	login(state,data){
-		localStorage.token = data;
-		state.token = data;
-	},
-  logout(state,data){
-    localStorage.clear();
-    state.token = "";
-  }
-}
-
-
-export default{
-	state,
-	mutations,
-	getters
-}
+
+import getters from './getters.js';
+
+var state = {
+	token: ""
+}
+const mutations = {
+	login(state,data){
+		localStorage.token = data;
+		state.token = data;
+	},
+  logout(state,data){
+    localStorage.clear();
+    state.token = "";
+  }
+}
+
+
+export default{
+	state,
+	mutations,
+	getters
+}

src/store/types.js

@@ -1 +1 @@
-export const INCREMENT = "INCREMENT";
+export const INCREMENT = "INCREMENT";

static/css/base.css

@@ -1,78 +1,78 @@
-@charset "UTF-8";
-/*css 初始化 */
-html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }
-fieldset, img,input,button { border:none; padding:0;margin:0;outline-style:none; }
-ul, ol { list-style:none; }
-input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";}
-select, input { vertical-align:middle;}
-select, input, textarea { font-size:12px; margin:0; }
-textarea { resize:none; } /*防止拖动*/
-img {border:0;	vertical-align:middle; }  /*  去掉图片低测默认的3像素空白缝隙*/
-table { border-collapse:collapse; }
-body {
-    font:12px/150% Arial,Verdana,"\5b8b\4f53";
-    color:#333;
-    background: #f5f5f5;
-}
-.clearfix:before,.clearfix:after {
-    content:"";
-    display:table;
-}
-.clearfix:after{clear:both;}
-.clearfix{
-    *zoom:1;/*IE/7/6*/
-}
-a {color:#666; text-decoration:none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
-h1,h2,h3,h4,h5,h6 {text-decoration:none;font-weight:normal;font-size:100%;}
-s,i,em,b{font-style:normal;text-decoration:none;font-weight: normal}
-
-
-/*公共类*/
-.fl {
-    float:left
-}
-.fr {
-    float:right
-}
-.al {
-    text-align:left
-}
-.ac {
-    text-align:center
-}
-.ar {
-    text-align:right
-}
-.hide {
-    display:none
-}
-a[title="站长统计"]{
-  visibility: hidden;
-  position: absolute;
-  left: 0;
-  top: 0;
-}
-
-input::-webkit-input-placeholder{
-  color: #ccc;
-}
-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
-  color: #ccc;
-}
-input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
-  color: #ccc;
-}
-input:-ms-input-placeholder{  /* Internet Explorer 10-11 */
-  color:  #ccc;
-}
-
-
-
-
-
-
-
-
-
-
-
+@charset "UTF-8";
+/*css 初始化 */
+html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }
+fieldset, img,input,button { border:none; padding:0;margin:0;outline-style:none; }
+ul, ol { list-style:none; }
+input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";}
+select, input { vertical-align:middle;}
+select, input, textarea { font-size:12px; margin:0; }
+textarea { resize:none; } /*防止拖动*/
+img {border:0;	vertical-align:middle; }  /*  去掉图片低测默认的3像素空白缝隙*/
+table { border-collapse:collapse; }
+body {
+    font:12px/150% Arial,Verdana,"\5b8b\4f53";
+    color:#333;
+    background: #f5f5f5;
+}
+.clearfix:before,.clearfix:after {
+    content:"";
+    display:table;
+}
+.clearfix:after{clear:both;}
+.clearfix{
+    *zoom:1;/*IE/7/6*/
+}
+a {color:#666; text-decoration:none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
+h1,h2,h3,h4,h5,h6 {text-decoration:none;font-weight:normal;font-size:100%;}
+s,i,em,b{font-style:normal;text-decoration:none;font-weight: normal}
+
+
+/*公共类*/
+.fl {
+    float:left
+}
+.fr {
+    float:right
+}
+.al {
+    text-align:left
+}
+.ac {
+    text-align:center
+}
+.ar {
+    text-align:right
+}
+.hide {
+    display:none
+}
+a[title="站长统计"]{
+  visibility: hidden;
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+
+input::-webkit-input-placeholder{
+  color: #ccc;
+}
+input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #ccc;
+}
+input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #ccc;
+}
+input:-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color:  #ccc;
+}
+
+
+
+
+
+
+
+
+
+
+

static/css/commonNav.css

@@ -1,25 +1,25 @@
-.nav{
-	width: 7.5rem;
-	height: .9rem;
-	background: #fff;
-	border-bottom: 1px solid #eaeaea;
-    position: fixed;
-    top: 0px;
-    /*left: 50%;
-    margin-left: -3.75rem;*/
-    z-index: 1000000;
-    /*margin: 0 auto;*/
-}
-.navBack{
-    width: 0.36rem;
-    height: 0.36rem;
-    margin-top: .3rem;
-    margin-left: .3rem;
-}
-.navTitle{
-    width: 6.4rem;
-    line-height: .9rem;
-    font-size: 0.36rem;
-    color: #3c3c3c;
-    text-align: center;
+.nav{
+	width: 7.5rem;
+	height: .9rem;
+	background: #fff;
+	border-bottom: 1px solid #eaeaea;
+    position: fixed;
+    top: 0px;
+    /*left: 50%;
+    margin-left: -3.75rem;*/
+    z-index: 1000000;
+    /*margin: 0 auto;*/
+}
+.navBack{
+    width: 0.36rem;
+    height: 0.36rem;
+    margin-top: .3rem;
+    margin-left: .3rem;
+}
+.navTitle{
+    width: 6.4rem;
+    line-height: .9rem;
+    font-size: 0.36rem;
+    color: #3c3c3c;
+    text-align: center;
 }

static/css/nav.css

@@ -1,77 +1,77 @@
-.nav{
-  width: 7.5rem;
-  height: .9rem;
-  background: #fff;
-  border-bottom: 1px solid #eaeaea;
-  position: fixed;
-  top: 0;
-  z-index: 99;
-}
-.navBack{
-  width: 0.36rem;
-  height: 0.36rem;
-  margin-top: .3rem;
-  margin-left: .3rem;
-}
-.navTitle{
-  width: 6.4rem;
-  line-height: .9rem;
-  font-size: 0.34rem;
-  font-weight: bold;
-  color: #3c3c3c;
-  text-align: center;
-}
-
-.nav .txt{
-  position: absolute;
-  top: .3rem;
-  right: .2rem;
-}
-
-.nav .txt a{
-  font-size: .26rem;
-}
-
-
-.contentMsg{
-  padding: .3rem;
-  background: #fff;
-}
-.contentMsg p{
-  text-indent: 2em;
-  line-height: .5rem;
-  font-size: .28rem;
-  text-align: justify;
-}
-
-
-/*底部弹窗*/
-.bottomModel{
-  position: fixed;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  background: rgba(0,0,0,.5);
-  z-index: 100;
-}
-.bottomModel .wrap{
-  position: absolute;
-  bottom: 0rem;
-}
-.bottomModel ul{
-  width: 7.5rem;
-  max-height: 4rem;
-  overflow: auto;
-}
-.bottomModel ul li,.bottomModel .cancle{
-  width: 7.5rem;
-  height: .9rem;
-  line-height: .9rem;
-  background: #fff;
-  text-align: center;
-  border-bottom: 0.01rem solid #eaeaea;
-}
-.bottomModel .cancle{
-  margin-top: .1rem;
-}
+.nav{
+  width: 7.5rem;
+  height: .9rem;
+  background: #fff;
+  border-bottom: 1px solid #eaeaea;
+  position: fixed;
+  top: 0;
+  z-index: 99;
+}
+.navBack{
+  width: 0.36rem;
+  height: 0.36rem;
+  margin-top: .3rem;
+  margin-left: .3rem;
+}
+.navTitle{
+  width: 6.4rem;
+  line-height: .9rem;
+  font-size: 0.34rem;
+  font-weight: bold;
+  color: #3c3c3c;
+  text-align: center;
+}
+
+.nav .txt{
+  position: absolute;
+  top: .3rem;
+  right: .2rem;
+}
+
+.nav .txt a{
+  font-size: .26rem;
+}
+
+
+.contentMsg{
+  padding: .3rem;
+  background: #fff;
+}
+.contentMsg p{
+  text-indent: 2em;
+  line-height: .5rem;
+  font-size: .28rem;
+  text-align: justify;
+}
+
+
+/*底部弹窗*/
+.bottomModel{
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,.5);
+  z-index: 100;
+}
+.bottomModel .wrap{
+  position: absolute;
+  bottom: 0rem;
+}
+.bottomModel ul{
+  width: 7.5rem;
+  max-height: 4rem;
+  overflow: auto;
+}
+.bottomModel ul li,.bottomModel .cancle{
+  width: 7.5rem;
+  height: .9rem;
+  line-height: .9rem;
+  background: #fff;
+  text-align: center;
+  border-bottom: 0.01rem solid #eaeaea;
+}
+.bottomModel .cancle{
+  margin-top: .1rem;
+}

static/css/shopList.scss

@@ -1,430 +1,430 @@
-.shopWrap{
-    width: 7.5rem;
-}
-.shopTop{
-    width: 7.5rem;
-    height: 1.88rem;
-    position: fixed;
-    left: auto;
-    top: 0;
-    z-index: 10;
-}
-/*搜索框*/
-.searchNav{
-    width: 7.5rem;
-    height: .88rem;
-    padding-top: .2rem;
-    background: #f6f6f6;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    dt{
-        width: .2rem;
-        height: .34rem;
-        float: left;
-        margin: .16rem .48rem 0;
-        img{
-            width: .2rem;
-            height: .34rem;
-        }
-    }
-    dd{
-        width: 6.06rem;
-        height: .68rem;
-        background: #fff;
-        float: left;
-        border-radius: 8px;
-        text-align: center;
-        line-height: .68rem;
-        img{
-            width: .32rem;
-            height: .32rem;
-            position: relative;
-            left: .01rem;
-            top: -.04rem;
-        }
-        span{
-            font-size: .3rem;
-            font-family: PingFangSC-Regular,PingFangSC;
-            font-weight: 400;
-            color: #999;
-            line-height: .68rem;
-        }
-    }
-}
-/*筛选列表*/
-.shaixuan{
-    position: relative;
-    width: 7.5rem;
-    height: .8rem;
-    z-index: 11;
-    background: #fff;
-    border-bottom: 1px solid #eee;
-    .list{
-        width: 7.5rem;
-        height: .8rem;
-        display: flex;
-        background: #fff;
-        div{
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            width: 25%;
-            height: .8rem;
-            line-height: .8rem;
-            font-size: .3rem;
-            justify-content: space-around;
-            text-align: center;
-            background: #fff;
-            position: relative;
-            span{
-                display: inline-block;
-                width: .8rem;
-                font-size: .28rem;
-                font-family: PingFangSC-Medium,PingFangSC;
-                font-weight: 500;
-                color: #222;
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-                margin-right: .1rem;
-                text-align: center;
-            }
-            &.cur{
-                span{
-                    color: #2f7af7;
-                }
-                .deltaBlue{
-                    display: block;
-                    display: inline-block;
-                    width: 0;
-                    height: 0;
-                    border-left: 4px solid transparent;
-                    border-right: 4px solid transparent;
-                    border-top: 4px solid #2f7af7;
-                    position: absolute;
-                    right: .3rem;
-                    top: .35rem;
-                }
-                .deltaBlack{
-                    display: none;
-                }
-            }
-            .deltaBlack{
-                display: inline-block;
-                width: 0;
-                height: 0;
-                border-left: 4px solid transparent;
-                border-right: 4px solid transparent;
-                border-bottom: 4px solid #ddd;
-                position: absolute;
-                right: .3rem;
-                top: .35rem;
-            }
-            .deltaBlue{
-                display: none;
-            }
-        }
-        .listTxt{
-            span{
-                display: inline-block;
-                width: .88rem;
-                font-size: .28rem;
-                font-family: PingFangSC-Medium,PingFangSC;
-                font-weight: 500;
-                color: #2f7af7;
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-                margin-right: .1rem;
-            }
-            i{
-                display: inline-block;
-                width: 0;
-                height: 0;
-                border-left: 4px solid transparent;
-                border-right: 4px solid transparent;
-                border-top: 4px solid #2f7af7;
-                position: absolute;
-                right: .3rem;
-                top: .35rem;
-            }
-        }
-    }
-    .listContent{
-        position: relative;
-        top: .01rem;
-        ul.one{
-            position: absolute;
-            background: #fff;
-            left: 0;
-            top: 0rem;
-            z-index:2;
-            overflow: hidden;
-            .oneList{
-                width: 7.5rem;
-                height: 5rem;
-                border-bottom: 1px solid #eaeaea;
-                .btn{
-                    width: 7.5rem;
-                    height: .88rem;
-                    background: #fff;
-                    position: absolute;
-                    left: 0;
-                    bottom: 0;
-                    border-top: 0.01rem solid #eaeaea;
-                    display: flex;
-                    justify-content: space-around;
-                    align-items: center;
-                    div:nth-of-type(1){
-                        width: 50%;
-                        text-align: center;
-                        span{
-                            display: inline-block;
-                            width: 3rem;
-                            height: .5rem;
-                            line-height: .5rem;
-                            text-align: center;
-                            font-size: .3rem;
-                            background: #aaa;
-                            color: #fff;
-                            border-radius: .05rem;
-                        }
-                    }
-                    div:nth-of-type(2){
-                       width: 50%;
-                       text-align: center;
-                        span{
-                            display: inline-block;
-                            width: 3rem;
-                            height: .5rem;
-                            line-height: .5rem;
-                            text-align: center;
-                            font-size: .3rem;
-                            background: #7bb5ff;
-                            color: #fff;
-                            border-radius: .05rem;
-                        }
-                    }
-                }
-                .two{
-                    -webkit-tap-highlight-color: rgba(0,0,0,0);
-                    background: #fff;
-                    width: 2.95rem;
-                    height: 5rem;
-                    border-right: .01rem solid #eaeaea;
-                    overflow: scroll;
-                    .twoChild{
-                        text-align: center;
-                        height: .78rem;
-                        line-height: .78rem;
-                        font-size: .3rem;
-                        border-bottom: .01rem solid #fff;
-                        &.cur{
-                            span{
-                                display: inline-block;
-                                width: 100%;
-                                height: 100%;
-                                color: #7bb5ff;
-                            }
-                        }
-                        .three{
-                            -webkit-tap-highlight-color: rgba(0,0,0,0);
-                            background: #fff;
-                            width: 4rem;
-                            height: 5rem;
-                            padding-left: .54rem;
-                            position: absolute;
-                            left: 2.96rem;
-                            top: 0;
-                            text-align: left;
-                            background: #f7f8fa;
-                            overflow: scroll;
-                            li{
-                              height: .78rem;
-                              line-height: .78rem;
-                              font-size: .3rem;
-                              &.cur{
-                                color: #7bb5ff;
-                              }
-                            }
-                        }
-                    }
-                }
-               .four{
-                    -webkit-tap-highlight-color: rgba(0,0,0,0);
-                    background: #fff;
-                    height: 5rem;
-                    width: 7.5rem;
-                    overflow: auto;
-                    &>li{
-                        margin-left: .55rem;
-                        height: .78rem;
-                        margin-right: .4rem;
-                        line-height: .78rem;
-                        font-size: .3rem;
-                        border-bottom: .01rem solid #fff;
-                        &.cur{
-                            color: #7bb5ff;
-                        }
-                    }
-                }
-            }
-        }
-    }
-}
-/*列表*/
-.shoplist{
-    width: 7.5rem;
-    margin-top: 1.88rem;
-    background: #fff;
-    z-index: 9;
-    .detail{
-        ul{
-            li{
-                width: 6.9rem;
-                height: 2.58rem;
-                background: #fff;
-                padding-top: .3rem;
-                margin: 0 auto;
-                border-bottom: 1px solid #eee;
-                .lisyImg{
-                    width: 2.4rem;
-                    height: 1.8rem;
-                    float: left;
-                    margin-right: .2rem;
-                    img{
-                        width: 2.4rem;
-                        height: 1.8rem;
-                        border-radius: 8px;
-                    }
-                }
-                .listBox{
-                    width: 4.3rem;
-                    float: left;
-                    overflow: hidden;
-                    h3{
-                        width: 4.3rem;
-                        font-size: .32rem;
-                        font-family: PingFangSC-Medium,PingFangSC;
-                        font-weight: 500;
-                        color: #222;
-                        line-height: .44rem;
-                        overflow: hidden;
-                        text-overflow: ellipsis;
-                        white-space: nowrap;
-                    }
-                    h5{
-                        font-size: .26rem;
-                        font-family: PingFangSC-Regular,PingFangSC;
-                        font-weight: 400;
-                        color: #666;
-                        line-height: .36rem;
-                        margin: .06rem 0 .08rem;
-                    }
-                    h6{
-                        font-size: .26rem;
-                        font-family: PingFangSC-Regular,PingFangSC;
-                        font-weight: 400;
-                        color: #222;
-                        line-height: .36rem;
-                        span{
-                            color: #666;
-                        }
-                    }
-                    p{
-                        font-size: .26rem;
-                        font-family: PingFangSC-Medium,PingFangSC;
-                        font-weight: 500;
-                        color: #f16752;
-                        line-height: .36rem;
-                        span{
-                            color: #222;
-                        }
-                    }
-                    .tags{
-                        margin: .2rem auto .12rem;
-                        span{
-                            height: .32rem;
-                            line-height: .32rem;
-                            padding: 0 .1rem;
-                            background: #edf4ff;
-                            display: inline-block;
-                            margin-right: .1rem;
-                            font-size: .22rem;
-                            font-family: PingFangSC-Medium,PingFangSC;
-                            font-weight: 500;
-                            color: #67b0ff;
-                            line-height: .32rem;
-                        }
-                    }
-                }
-            }
-        }
-    }
-    .noMore{
-        width: 7.5rem;
-        line-height: .8rem;
-        font-size: .3rem;
-        text-align: center;
-    }
-}
-/*无数据*/
-.noData{
-    padding-top: 1.5rem;
-    width: 7.5rem;
-    height: 90vh;
-    .noOrderTop{
-        height: .9rem;
-        text-align: center;
-        background: #fff;
-        border-bottom: 0.02rem solid #eee;
-        position: relative;
-        h3{
-            width: 75%;
-            line-height: 1rem;
-            font-size: 0.36rem;
-            color: #333;
-            float: left;
-            text-align: center;
-        }
-        i{
-            display: inline-block;
-            width: 13%;
-            height: 1rem;
-            line-height: 1rem;
-            float: left;
-            img{
-                width: 0.4rem;
-                height: 0.4rem;
-            }
-        }
-    }
-    dl{
-        width: 7.5rem;
-        text-align: center;
-        dt{
-            margin-top: 1.4rem;
-            img{
-                width: 3rem;
-                height: 3rem;
-            }
-        }
-        p{
-            font-size: .28rem;
-            color: #898989;
-            margin-top: .38rem;
-            margin-bottom: .5rem;
-        }
-        dd{
-            -webkit-tap-highlight-color: rgba(0,0,0,0);
-            span{
-                -webkit-tap-highlight-color: rgba(0,0,0,0);
-                display: inline-block;
-                width: 3rem;
-                height: .89rem;
-                background: #47abff;
-                line-height: .89rem;
-                color: #fff;
-                font-size: .34rem;
-                border-radius: 5px;
-            }
-        }
-    }
+.shopWrap{
+    width: 7.5rem;
+}
+.shopTop{
+    width: 7.5rem;
+    height: 1.88rem;
+    position: fixed;
+    left: auto;
+    top: 0;
+    z-index: 10;
+}
+/*搜索框*/
+.searchNav{
+    width: 7.5rem;
+    height: .88rem;
+    padding-top: .2rem;
+    background: #f6f6f6;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    dt{
+        width: .2rem;
+        height: .34rem;
+        float: left;
+        margin: .16rem .48rem 0;
+        img{
+            width: .2rem;
+            height: .34rem;
+        }
+    }
+    dd{
+        width: 6.06rem;
+        height: .68rem;
+        background: #fff;
+        float: left;
+        border-radius: 8px;
+        text-align: center;
+        line-height: .68rem;
+        img{
+            width: .32rem;
+            height: .32rem;
+            position: relative;
+            left: .01rem;
+            top: -.04rem;
+        }
+        span{
+            font-size: .3rem;
+            font-family: PingFangSC-Regular,PingFangSC;
+            font-weight: 400;
+            color: #999;
+            line-height: .68rem;
+        }
+    }
+}
+/*筛选列表*/
+.shaixuan{
+    position: relative;
+    width: 7.5rem;
+    height: .8rem;
+    z-index: 11;
+    background: #fff;
+    border-bottom: 1px solid #eee;
+    .list{
+        width: 7.5rem;
+        height: .8rem;
+        display: flex;
+        background: #fff;
+        div{
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            width: 25%;
+            height: .8rem;
+            line-height: .8rem;
+            font-size: .3rem;
+            justify-content: space-around;
+            text-align: center;
+            background: #fff;
+            position: relative;
+            span{
+                display: inline-block;
+                width: .8rem;
+                font-size: .28rem;
+                font-family: PingFangSC-Medium,PingFangSC;
+                font-weight: 500;
+                color: #222;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                margin-right: .1rem;
+                text-align: center;
+            }
+            &.cur{
+                span{
+                    color: #2f7af7;
+                }
+                .deltaBlue{
+                    display: block;
+                    display: inline-block;
+                    width: 0;
+                    height: 0;
+                    border-left: 4px solid transparent;
+                    border-right: 4px solid transparent;
+                    border-top: 4px solid #2f7af7;
+                    position: absolute;
+                    right: .3rem;
+                    top: .35rem;
+                }
+                .deltaBlack{
+                    display: none;
+                }
+            }
+            .deltaBlack{
+                display: inline-block;
+                width: 0;
+                height: 0;
+                border-left: 4px solid transparent;
+                border-right: 4px solid transparent;
+                border-bottom: 4px solid #ddd;
+                position: absolute;
+                right: .3rem;
+                top: .35rem;
+            }
+            .deltaBlue{
+                display: none;
+            }
+        }
+        .listTxt{
+            span{
+                display: inline-block;
+                width: .88rem;
+                font-size: .28rem;
+                font-family: PingFangSC-Medium,PingFangSC;
+                font-weight: 500;
+                color: #2f7af7;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                margin-right: .1rem;
+            }
+            i{
+                display: inline-block;
+                width: 0;
+                height: 0;
+                border-left: 4px solid transparent;
+                border-right: 4px solid transparent;
+                border-top: 4px solid #2f7af7;
+                position: absolute;
+                right: .3rem;
+                top: .35rem;
+            }
+        }
+    }
+    .listContent{
+        position: relative;
+        top: .01rem;
+        ul.one{
+            position: absolute;
+            background: #fff;
+            left: 0;
+            top: 0rem;
+            z-index:2;
+            overflow: hidden;
+            .oneList{
+                width: 7.5rem;
+                height: 5rem;
+                border-bottom: 1px solid #eaeaea;
+                .btn{
+                    width: 7.5rem;
+                    height: .88rem;
+                    background: #fff;
+                    position: absolute;
+                    left: 0;
+                    bottom: 0;
+                    border-top: 0.01rem solid #eaeaea;
+                    display: flex;
+                    justify-content: space-around;
+                    align-items: center;
+                    div:nth-of-type(1){
+                        width: 50%;
+                        text-align: center;
+                        span{
+                            display: inline-block;
+                            width: 3rem;
+                            height: .5rem;
+                            line-height: .5rem;
+                            text-align: center;
+                            font-size: .3rem;
+                            background: #aaa;
+                            color: #fff;
+                            border-radius: .05rem;
+                        }
+                    }
+                    div:nth-of-type(2){
+                       width: 50%;
+                       text-align: center;
+                        span{
+                            display: inline-block;
+                            width: 3rem;
+                            height: .5rem;
+                            line-height: .5rem;
+                            text-align: center;
+                            font-size: .3rem;
+                            background: #7bb5ff;
+                            color: #fff;
+                            border-radius: .05rem;
+                        }
+                    }
+                }
+                .two{
+                    -webkit-tap-highlight-color: rgba(0,0,0,0);
+                    background: #fff;
+                    width: 2.95rem;
+                    height: 5rem;
+                    border-right: .01rem solid #eaeaea;
+                    overflow: scroll;
+                    .twoChild{
+                        text-align: center;
+                        height: .78rem;
+                        line-height: .78rem;
+                        font-size: .3rem;
+                        border-bottom: .01rem solid #fff;
+                        &.cur{
+                            span{
+                                display: inline-block;
+                                width: 100%;
+                                height: 100%;
+                                color: #7bb5ff;
+                            }
+                        }
+                        .three{
+                            -webkit-tap-highlight-color: rgba(0,0,0,0);
+                            background: #fff;
+                            width: 4rem;
+                            height: 5rem;
+                            padding-left: .54rem;
+                            position: absolute;
+                            left: 2.96rem;
+                            top: 0;
+                            text-align: left;
+                            background: #f7f8fa;
+                            overflow: scroll;
+                            li{
+                              height: .78rem;
+                              line-height: .78rem;
+                              font-size: .3rem;
+                              &.cur{
+                                color: #7bb5ff;
+                              }
+                            }
+                        }
+                    }
+                }
+               .four{
+                    -webkit-tap-highlight-color: rgba(0,0,0,0);
+                    background: #fff;
+                    height: 5rem;
+                    width: 7.5rem;
+                    overflow: auto;
+                    &>li{
+                        margin-left: .55rem;
+                        height: .78rem;
+                        margin-right: .4rem;
+                        line-height: .78rem;
+                        font-size: .3rem;
+                        border-bottom: .01rem solid #fff;
+                        &.cur{
+                            color: #7bb5ff;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+/*列表*/
+.shoplist{
+    width: 7.5rem;
+    margin-top: 1.88rem;
+    background: #fff;
+    z-index: 9;
+    .detail{
+        ul{
+            li{
+                width: 6.9rem;
+                height: 2.58rem;
+                background: #fff;
+                padding-top: .3rem;
+                margin: 0 auto;
+                border-bottom: 1px solid #eee;
+                .lisyImg{
+                    width: 2.4rem;
+                    height: 1.8rem;
+                    float: left;
+                    margin-right: .2rem;
+                    img{
+                        width: 2.4rem;
+                        height: 1.8rem;
+                        border-radius: 8px;
+                    }
+                }
+                .listBox{
+                    width: 4.3rem;
+                    float: left;
+                    overflow: hidden;
+                    h3{
+                        width: 4.3rem;
+                        font-size: .32rem;
+                        font-family: PingFangSC-Medium,PingFangSC;
+                        font-weight: 500;
+                        color: #222;
+                        line-height: .44rem;
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        white-space: nowrap;
+                    }
+                    h5{
+                        font-size: .26rem;
+                        font-family: PingFangSC-Regular,PingFangSC;
+                        font-weight: 400;
+                        color: #666;
+                        line-height: .36rem;
+                        margin: .06rem 0 .08rem;
+                    }
+                    h6{
+                        font-size: .26rem;
+                        font-family: PingFangSC-Regular,PingFangSC;
+                        font-weight: 400;
+                        color: #222;
+                        line-height: .36rem;
+                        span{
+                            color: #666;
+                        }
+                    }
+                    p{
+                        font-size: .26rem;
+                        font-family: PingFangSC-Medium,PingFangSC;
+                        font-weight: 500;
+                        color: #f16752;
+                        line-height: .36rem;
+                        span{
+                            color: #222;
+                        }
+                    }
+                    .tags{
+                        margin: .2rem auto .12rem;
+                        span{
+                            height: .32rem;
+                            line-height: .32rem;
+                            padding: 0 .1rem;
+                            background: #edf4ff;
+                            display: inline-block;
+                            margin-right: .1rem;
+                            font-size: .22rem;
+                            font-family: PingFangSC-Medium,PingFangSC;
+                            font-weight: 500;
+                            color: #67b0ff;
+                            line-height: .32rem;
+                        }
+                    }
+                }
+            }
+        }
+    }
+    .noMore{
+        width: 7.5rem;
+        line-height: .8rem;
+        font-size: .3rem;
+        text-align: center;
+    }
+}
+/*无数据*/
+.noData{
+    padding-top: 1.5rem;
+    width: 7.5rem;
+    height: 90vh;
+    .noOrderTop{
+        height: .9rem;
+        text-align: center;
+        background: #fff;
+        border-bottom: 0.02rem solid #eee;
+        position: relative;
+        h3{
+            width: 75%;
+            line-height: 1rem;
+            font-size: 0.36rem;
+            color: #333;
+            float: left;
+            text-align: center;
+        }
+        i{
+            display: inline-block;
+            width: 13%;
+            height: 1rem;
+            line-height: 1rem;
+            float: left;
+            img{
+                width: 0.4rem;
+                height: 0.4rem;
+            }
+        }
+    }
+    dl{
+        width: 7.5rem;
+        text-align: center;
+        dt{
+            margin-top: 1.4rem;
+            img{
+                width: 3rem;
+                height: 3rem;
+            }
+        }
+        p{
+            font-size: .28rem;
+            color: #898989;
+            margin-top: .38rem;
+            margin-bottom: .5rem;
+        }
+        dd{
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            span{
+                -webkit-tap-highlight-color: rgba(0,0,0,0);
+                display: inline-block;
+                width: 3rem;
+                height: .89rem;
+                background: #47abff;
+                line-height: .89rem;
+                color: #fff;
+                font-size: .34rem;
+                border-radius: 5px;
+            }
+        }
+    }
 }

static/js/bus.js

@@ -1,2 +1,2 @@
-import Vue from 'vue'
-export default new Vue;
+import Vue from 'vue'
+export default new Vue;

static/js/common.js

@@ -1,124 +1,124 @@
-function getQueryString(name) {
-  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
-  var r = window.location.search.substr(1).match(reg);
-  if (r != null) return unescape(r[2]);
-  return null;
-}
-
-
-function getUrlId(name){
-  var reg = new RegExp("(^|&)"+name+"=([^&]*)(&|$)");
-  var result = window.location.search.substr(1).match(reg);
-  return result?decodeURIComponent(result[2]):null;
-}
-
-function GetRequest() {
-  var url = location.search; //获取url中"?"符后的字串
-  var theRequest = new Object();
-  if (url.indexOf("?") != -1) {
-    var str = url.substr(1);
-    var strs = str.split("&");
-    for (var i = 0; i < strs.length; i++) {
-      theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
-    }
-  }
-  return theRequest;
-}
-
-//正则验证手机号
-function isPoneAvailable(str) {
-  var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
-  if (!myreg.test(str)) {
-    return false;
-  } else {
-    return true;
-  }
-}
-
-
-//获得年月日      得到日期oTime
-function getMyDate(str){
-  function getzf(num){
-    if(parseInt(num) < 10){
-      num = '0'+num;
-    }
-    return num;
-  }
-  var oDate = new Date(str),
-    oYear = oDate.getFullYear(),
-    oMonth = oDate.getMonth()+1,
-    oDay = oDate.getDate(),
-    oHour = oDate.getHours(),
-    oMin = oDate.getMinutes(),
-    oSen = oDate.getSeconds(),
-    oTime = oYear +'-'+ getzf(oMonth) +'-'+ getzf(oDay) +' '+ getzf(oHour) +':'+ getzf(oMin) +':'+getzf(oSen);//最后拼接时间
-  return oTime;
-};
-//补0操作
-
-
-
-
-//获得年月日      得到日期oTime
-function getNewDate(str){
-  function getzf(num){
-    if(parseInt(num) < 10){
-      num = '0'+num;
-    }
-    return num;
-  }
-  var oDate = new Date(str),
-    oYear = oDate.getFullYear(),
-    oMonth = oDate.getMonth()+1,
-    oDay = oDate.getDate(),
-    oHour = oDate.getHours(),
-    oMin = oDate.getMinutes(),
-    oSen = oDate.getSeconds(),
-    oTime = oYear +'-'+ getzf(oMonth) +'-'+ getzf(oDay);//最后拼接时间
-  return oTime;
-};
-
-//判断是不是微信浏览器
-function isWeiXin(){
-  //window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息，这个属性可以用来判断浏览器类型
-  var ua = window.navigator.userAgent.toLowerCase();
-  //通过正则表达式匹配ua中是否含有MicroMessenger字符串
-  if(ua.match(/MicroMessenger/i) == 'micromessenger'){
-    return true;
-  }else{
-    return false;
-  }
-}
-
-//去除空格
-function Trim(str)
-{
-  return str.replace(/(^\s*)|(\s*$)/g, "");
-}
-//正则验证手机号
-function isPoneAvailable(str) {
-  var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
-  if (!myreg.test(str)) {
-    return false;
-  } else {
-    return true;
-  }
-}
-
-//60s倒计时
-var countdown;
-function settime(val) {
-  if (countdown == 0) {
-    val.removeAttribute("disabled");
-    val.value = "免费获取验证码";
-    countdown = 60;
-  } else {
-    val.setAttribute("disabled", true);
-    val.value = "重新发送(" + countdown + ")";
-    countdown--;
-    setTimeout(function () {
-      settime(val)
-    }, 1000)
-  }
-}
-
+function getQueryString(name) {
+  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
+  var r = window.location.search.substr(1).match(reg);
+  if (r != null) return unescape(r[2]);
+  return null;
+}
+
+
+function getUrlId(name){
+  var reg = new RegExp("(^|&)"+name+"=([^&]*)(&|$)");
+  var result = window.location.search.substr(1).match(reg);
+  return result?decodeURIComponent(result[2]):null;
+}
+
+function GetRequest() {
+  var url = location.search; //获取url中"?"符后的字串
+  var theRequest = new Object();
+  if (url.indexOf("?") != -1) {
+    var str = url.substr(1);
+    var strs = str.split("&");
+    for (var i = 0; i < strs.length; i++) {
+      theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
+    }
+  }
+  return theRequest;
+}
+
+//正则验证手机号
+function isPoneAvailable(str) {
+  var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
+  if (!myreg.test(str)) {
+    return false;
+  } else {
+    return true;
+  }
+}
+
+
+//获得年月日      得到日期oTime
+function getMyDate(str){
+  function getzf(num){
+    if(parseInt(num) < 10){
+      num = '0'+num;
+    }
+    return num;
+  }
+  var oDate = new Date(str),
+    oYear = oDate.getFullYear(),
+    oMonth = oDate.getMonth()+1,
+    oDay = oDate.getDate(),
+    oHour = oDate.getHours(),
+    oMin = oDate.getMinutes(),
+    oSen = oDate.getSeconds(),
+    oTime = oYear +'-'+ getzf(oMonth) +'-'+ getzf(oDay) +' '+ getzf(oHour) +':'+ getzf(oMin) +':'+getzf(oSen);//最后拼接时间
+  return oTime;
+};
+//补0操作
+
+
+
+
+//获得年月日      得到日期oTime
+function getNewDate(str){
+  function getzf(num){
+    if(parseInt(num) < 10){
+      num = '0'+num;
+    }
+    return num;
+  }
+  var oDate = new Date(str),
+    oYear = oDate.getFullYear(),
+    oMonth = oDate.getMonth()+1,
+    oDay = oDate.getDate(),
+    oHour = oDate.getHours(),
+    oMin = oDate.getMinutes(),
+    oSen = oDate.getSeconds(),
+    oTime = oYear +'-'+ getzf(oMonth) +'-'+ getzf(oDay);//最后拼接时间
+  return oTime;
+};
+
+//判断是不是微信浏览器
+function isWeiXin(){
+  //window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息，这个属性可以用来判断浏览器类型
+  var ua = window.navigator.userAgent.toLowerCase();
+  //通过正则表达式匹配ua中是否含有MicroMessenger字符串
+  if(ua.match(/MicroMessenger/i) == 'micromessenger'){
+    return true;
+  }else{
+    return false;
+  }
+}
+
+//去除空格
+function Trim(str)
+{
+  return str.replace(/(^\s*)|(\s*$)/g, "");
+}
+//正则验证手机号
+function isPoneAvailable(str) {
+  var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
+  if (!myreg.test(str)) {
+    return false;
+  } else {
+    return true;
+  }
+}
+
+//60s倒计时
+var countdown;
+function settime(val) {
+  if (countdown == 0) {
+    val.removeAttribute("disabled");
+    val.value = "免费获取验证码";
+    countdown = 60;
+  } else {
+    val.setAttribute("disabled", true);
+    val.value = "重新发送(" + countdown + ")";
+    countdown--;
+    setTimeout(function () {
+      settime(val)
+    }, 1000)
+  }
+}
+

static/js/font.js

@@ -1,17 +1,17 @@
-(function (doc, win) {
-    var docEl = doc.documentElement,
-        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
-        recalc = function () {
-            var clientWidth = docEl.clientWidth;
-            if (!clientWidth) return;
-            if(clientWidth>=750){
-                docEl.style.fontSize = '100px';
-            }else{
-                docEl.style.fontSize = 100 * (clientWidth /750) + 'px';
-            }
-        };
-
-    if (!doc.addEventListener) return;
-    win.addEventListener(resizeEvt, recalc, false);
-    doc.addEventListener('DOMContentLoaded', recalc, false);
-})(document, window);
+(function (doc, win) {
+    var docEl = doc.documentElement,
+        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
+        recalc = function () {
+            var clientWidth = docEl.clientWidth;
+            if (!clientWidth) return;
+            if(clientWidth>=750){
+                docEl.style.fontSize = '100px';
+            }else{
+                docEl.style.fontSize = 100 * (clientWidth /750) + 'px';
+            }
+        };
+
+    if (!doc.addEventListener) return;
+    win.addEventListener(resizeEvt, recalc, false);
+    doc.addEventListener('DOMContentLoaded', recalc, false);
+})(document, window);

static/js/host/host.js

@@ -1,20 +1,20 @@
-// 封装动态域名
-
-exports.install = function (Vue, options) {
-    Vue.prototype.changeData = function () {
-      var curWwwPath = window.document.location.href;    //  http://localhost:8080/abc-cloud/
-      var pathName = window.document.location.pathname;   //  /abc-cloud/
-      var hostname = window.document.location.hostname;  //localhost
-      var protocol = window.document.location.protocol;   //http:
-      var pos = curWwwPath.indexOf(pathName);
-      var localhostPatht = curWwwPath.substring(0, pos);   //  http://localhost:8080
-      var projectName = pathName.substring(0, pathName.substr(1).indexOf('/') + 1) //   /abc-cloud
-      // alert(curWwwPath+'------'+pathName+'------'+localhostPatht+'--------'+projectName+'----------'+hostname+'-------'+protocol);
-      
-      
-      return "http://api.youpu100.cn"; // 正式
-      // return "http://39.106.34.107:8081"; // 正式
-      // return "http://47.93.63.193:8081"; // 测试
-
-      }
-};
+// 封装动态域名
+
+exports.install = function (Vue, options) {
+    Vue.prototype.changeData = function () {
+      var curWwwPath = window.document.location.href;    //  http://localhost:8080/abc-cloud/
+      var pathName = window.document.location.pathname;   //  /abc-cloud/
+      var hostname = window.document.location.hostname;  //localhost
+      var protocol = window.document.location.protocol;   //http:
+      var pos = curWwwPath.indexOf(pathName);
+      var localhostPatht = curWwwPath.substring(0, pos);   //  http://localhost:8080
+      var projectName = pathName.substring(0, pathName.substr(1).indexOf('/') + 1) //   /abc-cloud
+      // alert(curWwwPath+'------'+pathName+'------'+localhostPatht+'--------'+projectName+'----------'+hostname+'-------'+protocol);
+      
+      
+      return "http://api.youpu100.cn"; // 正式
+      // return "http://39.106.34.107:8081"; // 正式
+      // return "http://47.93.63.193:8081"; // 测试
+
+      }
+};