diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..1daaa9a --- /dev/null +++ b/.babelrc @@ -0,0 +1,9 @@ +{ + "presets": [ + ["env", { + "modules": false + }], + "stage-2" + ], + "plugins": ["transform-runtime"] +} diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..9d08a1a --- /dev/null +++ b/.editorconfig @@ -0,0 +1,9 @@ +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..e1fcc9c --- /dev/null +++ b/.eslintignore @@ -0,0 +1,4 @@ +/build/ +/config/ +/dist/ +/*.js diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..d6d0938 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,28 @@ +// https://eslint.org/docs/user-guide/configuring + +module.exports = { + root: true, + parser: 'babel-eslint', + parserOptions: { + sourceType: 'module' + }, + env: { + browser: true + }, + // https://github.com/standard/standard/blob/master/docs/RULES-en.md + extends: 'standard', + // required to lint *.vue files + plugins: [ + 'html', + 'pug' + ], + // add your custom rules here + 'rules': { + // allow paren-less arrow functions + 'arrow-parens': 0, + // allow async-await + 'generator-star-spacing': 0, + // allow debugger during development + 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0 + } +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..c329299 --- /dev/null +++ b/.gitignore @@ -0,0 +1,17 @@ +.DS_Store +node_modules/ +/dist/ +npm-debug.log* +yarn-debug.log* +yarn-error.log* +package-lock.json +yarn.lock + +# Editor directories and files +.idea +.vscode +*.suo +*.ntvs* +*.njsproj +*.sln +/package-lock.json diff --git a/.postcssrc.js b/.postcssrc.js new file mode 100644 index 0000000..249472d --- /dev/null +++ b/.postcssrc.js @@ -0,0 +1,9 @@ +// https://github.com/michael-ciniawsky/postcss-load-config + +module.exports = { + "plugins": { + // to edit target browsers: use "browserslist" field in package.json + "postcss-import": {}, + "autoprefixer": {} + } +} diff --git a/README.md b/README.md new file mode 100644 index 0000000..0a965a2 --- /dev/null +++ b/README.md @@ -0,0 +1,21 @@ +# mc + +> 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). diff --git a/build/build.js b/build/build.js new file mode 100644 index 0000000..30f036a --- /dev/null +++ b/build/build.js @@ -0,0 +1,41 @@ +'use strict' +require('./check-versions')() + +process.env.NODE_ENV = 'production' + +const ora = require('ora') +const rm = require('rimraf') +const path = require('path') +const chalk = require('chalk') +const webpack = require('webpack') +const config = require('../config') +const webpackConfig = require('./webpack.prod.conf') + +const spinner = ora('building for production...') +spinner.start() + +rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => { + if (err) throw err + webpack(webpackConfig, function (err, stats) { + spinner.stop() + if (err) throw err + process.stdout.write(stats.toString({ + colors: true, + modules: false, + children: false, + 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' + )) + }) +}) diff --git a/build/check-versions.js b/build/check-versions.js new file mode 100644 index 0000000..7b81a4b --- /dev/null +++ b/build/check-versions.js @@ -0,0 +1,50 @@ +'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) + } +} diff --git a/build/logo.png b/build/logo.png new file mode 100644 index 0000000..f3d2503 Binary files /dev/null and b/build/logo.png differ diff --git a/build/utils.js b/build/utils.js new file mode 100644 index 0000000..55c301f --- /dev/null +++ b/build/utils.js @@ -0,0 +1,98 @@ +'use strict' +const path = require('path') +const config = require('../config') +const ExtractTextPlugin = require('extract-text-webpack-plugin') +const pkg = 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 + } + } + + var postcssLoader = { + loader: 'postcss-loader', + options: { + sourceMap: options.sourceMap + } + } + + // generate loader string to be used with extract text plugin + function generateLoaders (loader, loaderOptions) { + const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader] + if (loader) { + loaders.push({ + loader: loader + '-loader', + options: Object.assign({}, loaderOptions, { + sourceMap: options.sourceMap + }) + }) + } + + // Extract CSS when that option is specified + // (which is the case during production build) + if (options.extract) { + return ExtractTextPlugin.extract({ + use: loaders, + fallback: 'vue-style-loader' + }) + } else { + return ['vue-style-loader'].concat(loaders) + } + } + + // https://vue-loader.vuejs.org/en/configurations/extract-css.html + return { + css: generateLoaders(), + postcss: generateLoaders(), + less: generateLoaders('less'), + sass: generateLoaders('sass', { indentedSyntax: true }), + scss: generateLoaders('sass'), + stylus: generateLoaders('stylus'), + styl: generateLoaders('stylus') + } +} + +// Generate loaders for standalone style files (outside of .vue) +exports.styleLoaders = function (options) { + const output = [] + const loaders = exports.cssLoaders(options) + for (const extension in loaders) { + const loader = loaders[extension] + output.push({ + test: new RegExp('\\.' + extension + '$'), + use: loader + }) + } + return output +} + +exports.createNotifierCallback = function () { + 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: pkg.name, + message: severity + ': ' + error.name, + subtitle: filename || '', + icon: path.join(__dirname, 'logo.png') + }) + } +} diff --git a/build/vue-loader.conf.js b/build/vue-loader.conf.js new file mode 100644 index 0000000..181463c --- /dev/null +++ b/build/vue-loader.conf.js @@ -0,0 +1,22 @@ +'use strict' +const utils = require('./utils') +const config = require('../config') +const isProduction = process.env.NODE_ENV === 'production' +const sourceMapEnabled = isProduction + ? config.build.productionSourceMap + : config.dev.cssSourceMap + +module.exports = { + loaders: utils.cssLoaders({ + sourceMap: sourceMapEnabled, + extract: isProduction + }), + cssSourceMap: sourceMapEnabled, + cacheBusting: config.dev.cacheBusting, + transformToRequire: { + video: 'src', + source: 'src', + img: 'src', + image: 'xlink:href' + } +} diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js new file mode 100644 index 0000000..74cc44c --- /dev/null +++ b/build/webpack.base.conf.js @@ -0,0 +1,83 @@ +'use strict' +const path = require('path') +const merge = require('webpack-merge') +const utils = require('./utils') +const config = require('../config') +const vueLoaderConfig = require('./vue-loader.conf') + +function resolve (dir) { + return path.join(__dirname, '..', dir) +} + +module.exports = { + context: path.resolve(__dirname, '../'), + entry: { + app: './src/main.js' + }, + output: { + path: config.build.assetsRoot, + filename: '[name].js', + publicPath: process.env.NODE_ENV === 'production' + ? config.build.assetsPublicPath + : config.dev.assetsPublicPath + }, + resolve: { + extensions: ['.js', '.vue', '.json'], + alias: { + 'vue$': 'vue/dist/vue.esm.js', + '@': resolve('src') + } + }, + module: { + rules: [ + ...(config.dev.useEslint ? [{ + test: /\.(js|vue)$/, + loader: 'eslint-loader', + enforce: 'pre', + include: [resolve('src'), resolve('test')], + options: { + formatter: require('eslint-friendly-formatter'), + emitWarning: !config.dev.showEslintErrorsInOverlay + } + }] : []), + { + test: /\.vue$/, + loader: 'vue-loader', + options: merge(vueLoaderConfig, { + loaders: { + i18n: '@kazupon/vue-i18n-loader' + } + }) + }, + { + test: /\.js$/, + loader: 'babel-loader', + include: [resolve('src'), resolve('test')] + }, + { + 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]') + } + } + ] + } +} diff --git a/build/webpack.dev.conf.js b/build/webpack.dev.conf.js new file mode 100644 index 0000000..21c0901 --- /dev/null +++ b/build/webpack.dev.conf.js @@ -0,0 +1,81 @@ +'use strict' +const utils = require('./utils') +const webpack = require('webpack') +const config = require('../config') +const merge = require('webpack-merge') +const baseWebpackConfig = require('./webpack.base.conf') +const HtmlWebpackPlugin = require('html-webpack-plugin') +const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') +const portfinder = require('portfinder') + +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: true, + hot: true, + compress: true, + host: process.env.HOST || config.dev.host, + port: process.env.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 + }) + ] +}) + +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://${config.dev.host}:${port}`] + }, + onErrors: config.dev.notifyOnErrors + ? utils.createNotifierCallback() + : undefined + })) + + resolve(devWebpackConfig) + } + }) +}) diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js new file mode 100644 index 0000000..3fca888 --- /dev/null +++ b/build/webpack.prod.conf.js @@ -0,0 +1,145 @@ +'use strict' +const path = require('path') +const utils = require('./utils') +const webpack = require('webpack') +const config = require('../config') +const merge = require('webpack-merge') +const baseWebpackConfig = require('./webpack.base.conf') +const CopyWebpackPlugin = require('copy-webpack-plugin') +const HtmlWebpackPlugin = require('html-webpack-plugin') +const ExtractTextPlugin = require('extract-text-webpack-plugin') +const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') + +const 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 + }), + // UglifyJs do not support ES6+, you can also use babel-minify for better treeshaking: https://github.com/babel/minify + new webpack.optimize.UglifyJsPlugin({ + compress: { + warnings: false + }, + sourceMap: config.build.productionSourceMap, + parallel: true + }), + // extract css into its own file + new ExtractTextPlugin({ + filename: utils.assetsPath('css/[name].[contenthash].css'), + // set the following option to `true` if you want to extract CSS from + // codesplit chunks into this main css file as well. + // This will result in *all* of your app's CSS being loaded upfront. + allChunks: false + }), + // Compress extracted CSS. We are using this plugin so that possible + // duplicated CSS from different components can be deduped. + new OptimizeCSSPlugin({ + cssProcessorOptions: config.build.productionSourceMap + ? { + safe: true, + map: { inline: false } + } + : { safe: true } + }), + // generate dist index.html with correct asset hash for caching. + // you can customize output by editing /index.html + // see https://github.com/ampedandwired/html-webpack-plugin + new HtmlWebpackPlugin({ + filename: config.build.index, + template: 'index.html', + inject: true, + minify: { + removeComments: true, + collapseWhitespace: true, + removeAttributeQuotes: true + // more options: + // https://github.com/kangax/html-minifier#options-quick-reference + }, + // necessary to consistently work with multiple chunks via CommonsChunkPlugin + chunksSortMode: 'dependency' + }), + // keep module.id stable when vender 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: function (module) { + // any required modules inside node_modules are extracted to vendor + return ( + module.resource && + /\.js$/.test(module.resource) && + module.resource.indexOf( + path.join(__dirname, '../node_modules') + ) === 0 + ) + } + }), + // extract webpack runtime and module manifest to its own file in order to + // prevent vendor hash from being updated whenever app bundle is updated + new webpack.optimize.CommonsChunkPlugin({ + name: 'manifest', + minChunks: Infinity + }), + // This instance extracts shared chunks from code splitted chunks and bundles them + // in a separate chunk, similar to the vendor chunk + // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk + new webpack.optimize.CommonsChunkPlugin({ + name: 'app', + async: 'vendor-async', + children: true, + minChunks: 3 + }), + + // copy custom static assets + new CopyWebpackPlugin([ + { + from: path.resolve(__dirname, '../static'), + to: config.build.assetsSubDirectory, + ignore: ['.*'] + } + ]) + ] +}) + +if (config.build.productionGzip) { + const CompressionWebpackPlugin = require('compression-webpack-plugin') + + webpackConfig.plugins.push( + new CompressionWebpackPlugin({ + asset: '[path].gz[query]', + algorithm: 'gzip', + test: new RegExp( + '\\.(' + + config.build.productionGzipExtensions.join('|') + + ')$' + ), + threshold: 10240, + minRatio: 0.8 + }) + ) +} + +if (config.build.bundleAnalyzerReport) { + const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin + webpackConfig.plugins.push(new BundleAnalyzerPlugin()) +} + +module.exports = webpackConfig diff --git a/config/dev.env.js b/config/dev.env.js new file mode 100644 index 0000000..a736e0f --- /dev/null +++ b/config/dev.env.js @@ -0,0 +1,9 @@ +'use strict' +const merge = require('webpack-merge') +const prodEnv = require('./prod.env') + +module.exports = merge(prodEnv, { + NODE_ENV: '"development"', + API_URL: '"http://clearsight.protel.com.tr/api"', + PORT: '"9000"' +}) diff --git a/config/index.js b/config/index.js new file mode 100644 index 0000000..959b24f --- /dev/null +++ b/config/index.js @@ -0,0 +1,81 @@ +'use strict' +// Template version: 1.2.4 +// see http://vuejs-templates.github.io/webpack for documentation. + +const path = require('path') + +module.exports = { + dev: { + + // Paths + assetsSubDirectory: 'static', + assetsPublicPath: '/', + proxyTable: {}, + + // Various Dev Server settings + host: 'localhost', // can be overwritten by process.env.HOST + port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined + autoOpenBrowser: false, + errorOverlay: true, + notifyOnErrors: true, + poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions- + + // Use Eslint Loader? + // If true, your code will be linted during bundling and + // linting errors and warnings will be shown in the console. + useEslint: true, + // If true, eslint errors and warnings will also be shown in the error overlay + // in the browser. + showEslintErrorsInOverlay: false, + + /** + * Source Maps + */ + + // https://webpack.js.org/configuration/devtool/#development + devtool: '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, + + // CSS Sourcemaps off by default because relative paths are "buggy" + // with this option, according to the CSS-Loader README + // (https://github.com/webpack/css-loader#sourcemaps) + // In our experience, they generally work as expected, + // just be aware of this issue when enabling this option. + cssSourceMap: false + }, + + 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 + } +} diff --git a/config/prod.env.js b/config/prod.env.js new file mode 100644 index 0000000..3995ddf --- /dev/null +++ b/config/prod.env.js @@ -0,0 +1,5 @@ +'use strict' +module.exports = { + NODE_ENV: '"production"', + API_URL: '"..."' +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..f70272f --- /dev/null +++ b/index.html @@ -0,0 +1,11 @@ + + + + + + Project Name + + +
+ + diff --git a/package.json b/package.json new file mode 100644 index 0000000..8b0d0ec --- /dev/null +++ b/package.json @@ -0,0 +1,84 @@ +{ + "name": "mc", + "version": "1.0.0", + "description": "A Vue.js project", + "author": "Adem ilter ", + "private": true, + "scripts": { + "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", + "start": "yarn run dev", + "test": "echo 'No tests.'; exit 0;", + "lint": "eslint --ext .js,.vue src", + "build": "node build/build.js" + }, + "dependencies": { + "axios": "^0.17.1", + "eslint-plugin-pug": "^1.1.1", + "lodash": "^4.17.4", + "vee-validate": "^2.0.0-rc.25", + "vue": "^2.5.2", + "vue-i18n": "^7.3.2", + "vue-router": "^3.0.1", + "vue-the-mask": "^0.11.1", + "vuex": "^3.0.1", + "vuex-loading": "^0.1.14", + "vuex-persistedstate": "^2.4.2" + }, + "devDependencies": { + "@kazupon/vue-i18n-loader": "^0.2.1", + "autoprefixer": "^7.1.2", + "babel-core": "^6.22.1", + "babel-eslint": "^7.1.1", + "babel-loader": "^7.1.1", + "babel-plugin-transform-runtime": "^6.22.0", + "babel-preset-env": "^1.3.2", + "babel-preset-stage-2": "^6.22.0", + "babel-register": "^6.22.0", + "chalk": "^2.0.1", + "copy-webpack-plugin": "^4.0.1", + "css-loader": "^0.28.0", + "eslint": "^3.19.0", + "eslint-config-standard": "^10.2.1", + "eslint-friendly-formatter": "^3.0.0", + "eslint-loader": "^1.7.1", + "eslint-plugin-html": "^3.0.0", + "eslint-plugin-import": "^2.7.0", + "eslint-plugin-node": "^5.2.0", + "eslint-plugin-promise": "^3.4.0", + "eslint-plugin-standard": "^3.0.1", + "eventsource-polyfill": "^0.9.6", + "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.7.2", + "optimize-css-assets-webpack-plugin": "^3.2.0", + "ora": "^1.2.0", + "portfinder": "^1.0.13", + "postcss-import": "^11.0.0", + "postcss-loader": "^2.0.8", + "pug": "^2.0.0-rc.4", + "rimraf": "^2.6.0", + "sass-loader": "^6.0.6", + "semver": "^5.3.0", + "shelljs": "^0.7.6", + "url-loader": "^0.5.8", + "vue-loader": "^13.3.0", + "vue-style-loader": "^3.0.1", + "vue-template-compiler": "^2.5.2", + "webpack": "^3.6.0", + "webpack-bundle-analyzer": "^2.9.0", + "webpack-dev-server": "^2.9.1", + "webpack-merge": "^4.1.1" + }, + "engines": { + "node": ">= 4.0.0", + "npm": ">= 3.0.0" + }, + "browserslist": [ + "> 1%", + "last 1 versions", + "not ie <= 8" + ] +} diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 0000000..65dc662 --- /dev/null +++ b/src/App.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/src/i18n/index.js b/src/i18n/index.js new file mode 100644 index 0000000..7136ad6 --- /dev/null +++ b/src/i18n/index.js @@ -0,0 +1,8 @@ +import Vue from 'vue' +import VueI18n from 'vue-i18n' + +Vue.use(VueI18n) + +export default new VueI18n({ + locale: 'tr' +}) diff --git a/src/i18n/store/index.js b/src/i18n/store/index.js new file mode 100644 index 0000000..1cbae4d --- /dev/null +++ b/src/i18n/store/index.js @@ -0,0 +1,30 @@ +export default { + namespaced: true, + state: { + langDefault: localStorage.lang, + langFallback: 'tr', + langSupport: ['tr', 'en'] + }, + getters: { + langDefault: state => { + if (state.langSupport.indexOf(state.langDefault) === -1) { + return state.langFallback + } + return state.langDefault + }, + langSupport: state => state.langSupport + }, + actions: { + langChange: ({ commit }, payload) => { + commit('LANG_CHANGE', payload) + } + }, + mutations: { + LANG_CHANGE (state, { lang, app }) { + state.langDefault = lang + localStorage.setItem('lang', lang) + app.$root.$i18n.locale = lang + app.$root.$validator.localize(lang) + } + } +} diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..2626144 --- /dev/null +++ b/src/main.js @@ -0,0 +1,26 @@ +import Vue from 'vue' +import App from './App' +import router from './router' +import i18n from './i18n' +import store from '@/store' +import VeeValidate, { Validator } from 'vee-validate' +import tr from 'vee-validate/dist/locale/tr' + +Validator.localize('tr', tr) + +const config = { + events: 'input' +} + +Vue.use(VeeValidate, config) +Vue.config.productionTip = false + +/* eslint-disable no-new */ +new Vue({ + el: '#app', + router, + i18n, + store, + template: '', + components: {App} +}) diff --git a/src/router/auth.js b/src/router/auth.js new file mode 100644 index 0000000..3be6052 --- /dev/null +++ b/src/router/auth.js @@ -0,0 +1,18 @@ +import _isEmpty from 'lodash/isEmpty' +import _has from 'lodash/has' + +export default (to, from, next) => { + const STORE = JSON.parse(localStorage.vuex || '{}') + + if (to.matched.some(record => record.meta.requireLogin)) { + if (_isEmpty(STORE) || !_has(STORE, 'Auth.customer.id')) { + next({ + name: 'Customer' + }) + } else { + next() + } + } else { + next() + } +} diff --git a/src/router/index.js b/src/router/index.js new file mode 100644 index 0000000..2c6f023 --- /dev/null +++ b/src/router/index.js @@ -0,0 +1,22 @@ +import Vue from 'vue' +import Router from 'vue-router' +import authMiddleware from './auth' + +// Pages +import Home from '@/view/pages/home' + +Vue.use(Router) + +const router = new Router({ + routes: [ + { + path: '/', + name: 'Home', + component: Home + } + ] +}) + +router.beforeEach(authMiddleware) + +export default router diff --git a/src/store/index.js b/src/store/index.js new file mode 100644 index 0000000..c330221 --- /dev/null +++ b/src/store/index.js @@ -0,0 +1,38 @@ +import Vue from 'vue' +import Vuex from 'vuex' +import createPersistedState from 'vuex-persistedstate' +import { createVuexLoader } from 'vuex-loading' + +// Global +import i18n from '@/i18n/store' + +// Pages +import Auth from '@/view/pages/home/store' + +// Component +// import Discount from '@/view/components/Discount/store' + +const VuexLoading = createVuexLoader({ + moduleName: 'loader', + componentName: 'v-loading' +}) + +Vue.use(Vuex) +Vue.use(VuexLoading) + +const debug = process.env.NODE_ENV !== 'production' + +export default new Vuex.Store({ + modules: { + // Globals + i18n, + // Pages + Auth + // Component + }, + strict: debug, + plugins: [ + VuexLoading.Store, + createPersistedState() + ] +}) diff --git a/src/stylesheet/app.scss b/src/stylesheet/app.scss new file mode 100644 index 0000000..009c126 --- /dev/null +++ b/src/stylesheet/app.scss @@ -0,0 +1,11 @@ +// CONFIG +@import "config/variables"; +@import "config/mixin"; +// RESET +@import "reset/normalize"; +@import "reset/formalize"; +// HELPER +@import "helper/typography"; +@import "helper/global"; +@import "helper/utility"; +@import "helper/form"; diff --git a/src/stylesheet/config/mixin.scss b/src/stylesheet/config/mixin.scss new file mode 100644 index 0000000..877674d --- /dev/null +++ b/src/stylesheet/config/mixin.scss @@ -0,0 +1,19 @@ +%press { + transition: 50ms; + &:active { + transform: scale(.95); + transform-origin: 50% 50%; + } +} + +@mixin placeholder { + @each $prefix in ( + "::-webkit-input-placeholder", + "::-moz-placeholder", + ":-ms-input-placeholder", + ":-moz-placeholder") { + &#{$prefix} { + @content; + } + } +} diff --git a/src/stylesheet/config/variables.scss b/src/stylesheet/config/variables.scss new file mode 100644 index 0000000..72146ba --- /dev/null +++ b/src/stylesheet/config/variables.scss @@ -0,0 +1,18 @@ +// GLOBAL +$transition: 130ms; +$finger-size: 42px; +$border-radius: 4px; + +// COLOR +$color-success: green; +$color-warning: yellow; + +// FONT +$font-family-fallback: "Helvetica Neue", Helvetica, Arial, sans-serif; +$font-family: $font-family-fallback; +$font-line-height: 1.4; +$font-size-normal: 16px; +$font-size-small: 14px; +$font-weight-light: 300; +$font-weight-normal: 400; +$font-weight-bold: 700; diff --git a/src/stylesheet/helper/form.scss b/src/stylesheet/helper/form.scss new file mode 100644 index 0000000..b0d9109 --- /dev/null +++ b/src/stylesheet/helper/form.scss @@ -0,0 +1,70 @@ +.btn, .text { + font-family: inherit; + font-weight: $font-weight-normal; + line-height: normal; +} + +.btn { + user-select: none; + height: $finger-size; + display: inline-flex; + align-items: center; + justify-content: center; + padding-left: 20px; + padding-right: 20px; + color: white; + background-color: $color-success; + border-radius: $border-radius; + + &:disabled, + &-disabled { + cursor: not-allowed !important; + background-color: #e6e6e6 !important; + color: darken(#e6e6e6, 30%) !important; + border-color: #e6e6e6 !important; + } + + &-full { + display: flex; + width: 100%; + } + + &-blue { + color: white; + background-color: $color-success; + } + + &-ghost { + color: $color-warning; + border: 1px solid; + background-color: white; + + &:active, &:focus { + background-color: $color-warning; + color: #FFF; + border-color: $color-warning; + } + } + + &-icon { + width: $finger-size; + padding-left: 0; + padding-right: 0; + } + +} + +.txt { + display: block; + width: 100%; + padding-left: 10px; + padding-right: 10px; + color: $color-success; + border: 1px solid rgba($color-warning, .1); + background-color: transparent; + border-radius: $border-radius; + + &:focus { + border-color: rgba($color-warning, .4); + } +} diff --git a/src/stylesheet/helper/global.scss b/src/stylesheet/helper/global.scss new file mode 100644 index 0000000..aeddbea --- /dev/null +++ b/src/stylesheet/helper/global.scss @@ -0,0 +1,9 @@ +.icon { + display: inline-block; + vertical-align: middle; + width: 24px; + height: 24px; + stroke-width: 0; + stroke: currentColor; + fill: currentColor; +} diff --git a/src/stylesheet/helper/typography.scss b/src/stylesheet/helper/typography.scss new file mode 100644 index 0000000..c09415d --- /dev/null +++ b/src/stylesheet/helper/typography.scss @@ -0,0 +1,14 @@ +body { + font-family: $font-family; + font-weight: $font-weight-normal; + font-size: $font-size-normal; + line-height: 1; +} + +h1, h2, h3, h4, h5, h6, b, strong, label { + font-weight: $font-weight-bold; +} + +small { + font-size: $font-size-small; +} diff --git a/src/stylesheet/helper/utility.scss b/src/stylesheet/helper/utility.scss new file mode 100644 index 0000000..a52c87e --- /dev/null +++ b/src/stylesheet/helper/utility.scss @@ -0,0 +1,26 @@ +.v-loading { + position: absolute; + left: 0; + top: 0; + right: 0; + bottom: 0; + z-index: 20; + display: flex; + align-items: center; + justify-content: center; + background-color: #FFF; + opacity: 1; + visibility: visible; + transition: opacity 0.2s linear, visibility 0.2s linear; + + svg { + width: 30px; + height: 30px; + margin: 0 10px; + } + + &.hidden { + opacity: 0; + visibility: hidden; + } +} diff --git a/src/stylesheet/reset/formalize.scss b/src/stylesheet/reset/formalize.scss new file mode 100644 index 0000000..a7cb2d0 --- /dev/null +++ b/src/stylesheet/reset/formalize.scss @@ -0,0 +1,59 @@ +/*! formalize.css | MIT License | github.com/interacthings/formalize */ + +* { + &, + &:before, + &:after { + box-sizing: inherit; + } +} + +html { + box-sizing: border-box; + text-rendering: optimizeLegibility; +} + +body { + overflow-x: hidden; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +a { + color: inherit; + text-decoration: none; +} + +img { + vertical-align: middle; +} + +blockquote, dl, dd, h1, h2, h3, h4, h5, h6, figure, p, pre, fieldset, ul, ol, menu, form { + margin: 0; +} + +button, fieldset, iframe { + border: 0; +} + +fieldset, ul, ol, button, menu { + padding: 0; +} + +ol, ul { + list-style: none; +} + +textarea { + resize: vertical; +} + +table { + width: 100%; + border-collapse: collapse; + border-spacing: 0; +} + +td { + padding: 0; +} diff --git a/src/stylesheet/reset/normalize.scss b/src/stylesheet/reset/normalize.scss new file mode 100644 index 0000000..fa4e73d --- /dev/null +++ b/src/stylesheet/reset/normalize.scss @@ -0,0 +1,447 @@ +/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in + * IE on Windows Phone and in iOS. + */ + +html { + line-height: 1.15; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/* Sections + ========================================================================== */ + +/** + * Remove the margin in all browsers (opinionated). + */ + +body { + margin: 0; +} + +/** + * Add the correct display in IE 9-. + */ + +article, +aside, +footer, +header, +nav, +section { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + * 1. Add the correct display in IE. + */ + +figcaption, +figure, +main { /* 1 */ + display: block; +} + +/** + * Add the correct margin in IE 8. + */ + +figure { + margin: 1em 40px; +} + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ + +/** + * 1. Remove the gray background on active links in IE 10. + * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. + */ + +a { + background-color: transparent; /* 1 */ + -webkit-text-decoration-skip: objects; /* 2 */ +} + +/** + * 1. Remove the bottom border in Chrome 57- and Firefox 39-. + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ +} + +/** + * Prevent the duplicate application of `bolder` by the next rule in Safari 6. + */ + +b, +strong { + font-weight: inherit; +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** + * Add the correct font style in Android 4.3-. + */ + +dfn { + font-style: italic; +} + +/** + * Add the correct background and color in IE 9-. + */ + +mark { + background-color: #ff0; + color: #000; +} + +/** + * Add the correct font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + */ + +audio, +video { + display: inline-block; +} + +/** + * Add the correct display in iOS 4-7. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Remove the border on images inside links in IE 10-. + */ + +img { + border-style: none; +} + +/** + * Hide the overflow in IE. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* Forms + ========================================================================== */ + +/** + * 1. Change the font styles in all browsers (opinionated). + * 2. Remove the margin in Firefox and Safari. + */ + +button, +input, +optgroup, +select, +textarea { + font-family: sans-serif; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + +button, +input { /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + +button, +select { /* 1 */ + text-transform: none; +} + +/** + * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` + * controls in Android 4. + * 2. Correct the inability to style clickable types in iOS and Safari. + */ + +button, +html [type="button"], /* 1 */ +[type="reset"], +[type="submit"] { + -webkit-appearance: button; /* 2 */ +} + +/** + * Remove the inner border and padding in Firefox. + */ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ + +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** + * 1. Add the correct display in IE 9-. + * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + +progress { + display: inline-block; /* 1 */ + vertical-align: baseline; /* 2 */ +} + +/** + * Remove the default vertical scrollbar in IE. + */ + +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10-. + * 2. Remove the padding in IE 10-. + */ + +[type="checkbox"], +[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** + * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. + */ + +[type="search"]::-webkit-search-cancel-button, +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ + +/* + * Add the correct display in IE 9-. + * 1. Add the correct display in Edge, IE, and Firefox. + */ + +details, /* 1 */ +menu { + display: block; +} + +/* + * Add the correct display in all browsers. + */ + +summary { + display: list-item; +} + +/* Scripting + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + */ + +canvas { + display: inline-block; +} + +/** + * Add the correct display in IE. + */ + +template { + display: none; +} + +/* Hidden + ========================================================================== */ + +/** + * Add the correct display in IE 10-. + */ + +[hidden] { + display: none; +} diff --git a/src/utils/helper.js b/src/utils/helper.js new file mode 100644 index 0000000..e078c5f --- /dev/null +++ b/src/utils/helper.js @@ -0,0 +1,10 @@ +export const isDev = () => process.env.NODE_ENV === 'development' + +export const Print = function (title, data, type = true) { + if (isDev()) { + console.group(title) + if (type) console.log(data) + else console.error(data) + console.groupEnd() + } +} diff --git a/src/utils/http.js b/src/utils/http.js new file mode 100644 index 0000000..73187e3 --- /dev/null +++ b/src/utils/http.js @@ -0,0 +1,7 @@ +import axios from 'axios' + +export const HTTP = axios.create({ + baseURL: process.env.NODE_ENV +}) + +export default HTTP diff --git a/src/utils/loading.js b/src/utils/loading.js new file mode 100644 index 0000000..439220d --- /dev/null +++ b/src/utils/loading.js @@ -0,0 +1,10 @@ +export async function startLoading (dispatcher, loaderMessage, callback) { + dispatcher('loader/load', loaderMessage, { root: true }) + const response = await callback() + dispatcher('loader/end', loaderMessage, { root: true }) + return response +} + +export async function stopLoading (dispatcher, loaderMessage) { + dispatcher('loader/end', loaderMessage, { root: true }) +} diff --git a/src/view/global/footer/index.vue b/src/view/global/footer/index.vue new file mode 100644 index 0000000..d2ed8e7 --- /dev/null +++ b/src/view/global/footer/index.vue @@ -0,0 +1,53 @@ + + + + + diff --git a/src/view/global/header/index.vue b/src/view/global/header/index.vue new file mode 100644 index 0000000..3533ef3 --- /dev/null +++ b/src/view/global/header/index.vue @@ -0,0 +1,22 @@ + + + + + diff --git a/src/view/pages/home/index.vue b/src/view/pages/home/index.vue new file mode 100644 index 0000000..709087a --- /dev/null +++ b/src/view/pages/home/index.vue @@ -0,0 +1,30 @@ + + { + "en": { + "welcome": "Welcome!" + }, + "tr": { + "welcome": "Hoş geldin!" + } + } + + + + + + + diff --git a/src/view/pages/home/store/index.js b/src/view/pages/home/store/index.js new file mode 100644 index 0000000..d77dd01 --- /dev/null +++ b/src/view/pages/home/store/index.js @@ -0,0 +1,56 @@ +import { Print } from '@/utils/helper' +import { startLoading, stopLoading } from '@/utils/loading' +import HTTP from '@/utils/http' + +export default { + namespaced: true, + state: { + user: {}, + org: {} + }, + getters: { + user: state => state.user, + org: state => state.org + }, + actions: { + async loginUser ({ commit, dispatch }, user) { + console.log(user) + try { + const RES = await startLoading(dispatch, 'loginUser', () => { + return HTTP.post('Customer/customer', { + params: user + }) + }) + Print('OK-loginUser', RES) + commit('LOGIN_USER', RES.data) + return RES + } catch (err) { + // stopLoading(dispatch, 'loginUser') + Print('ERROR-loginUser', err, false) + throw Error(err) + } + }, + async loginOrganization ({ commit, dispatch }, org) { + try { + const RES = await startLoading(dispatch, 'loginOrganization', () => { + return HTTP.post('organization', org) + }) + Print('OK-loginOrganization', RES) + commit('LOGIN_ORGANIZATION', RES.data) + return RES + } catch (err) { + stopLoading(dispatch, 'loginOrganization') + Print('ERROR-loginOrganization', err, false) + throw Error(err) + } + } + }, + mutations: { + LOGIN_USER (state, user) { + state.user = user + }, + LOGIN_ORGANIZATION (state, org) { + state.org = org + } + } +} diff --git a/static/.gitkeep b/static/.gitkeep new file mode 100644 index 0000000..e69de29