Commit 502ed59c authored by Yoran Hillion's avatar Yoran Hillion
Browse files

Merge branch 'release/3.0.0'

parents a8b8e4a7 65fe4789
> 1%
last 2 versions
not ie <= 8
[*.{js,jsx,ts,tsx,vue}]
indent_style = space
indent_size = 2
end_of_line = lf
trim_trailing_whitespace = true
insert_final_newline = true
max_line_length = 100
NODE_ENV=development
VUE_APP_DEPLOYMENT_ENV=dev
VUE_APP_CAS_SERVER=https://cas6-dev.unistra.fr
NODE_ENV=production
VUE_APP_DEFAULT_LOCALE=fr
VUE_APP_DEPLOYMENT_ENV=preprod
VUE_APP_BASE_URL=https://dynamic-forms-pprd.unistra.fr
VUE_APP_JWT_SERVER=https://jwtserver-pprd.app.unistra.fr/api
VUE_APP_CAS_SERVER=https://cas.unistra.fr
NODE_ENV=production
VUE_APP_DEFAULT_LOCALE=fr
VUE_APP_DEPLOYMENT_ENV=prod
VUE_APP_BASE_URL=https://dynamic-forms.app.unistra.fr
VUE_APP_JWT_SERVER=https://jwtserver.app.unistra.fr/api
VUE_APP_CAS_SERVER=https://cas.unistra.fr
NODE_ENV=production
VUE_APP_DEFAULT_LOCALE=fr
VUE_APP_DEPLOYMENT_ENV=test
VUE_APP_BASE_URL=https://dynamic-forms-test.u-strasbg.fr
VUE_APP_JWT_SERVER=https://jwtserver-test.app.unistra.fr/api
VUE_APP_CAS_SERVER=https://cas6-dev.unistra.fr
module.exports = {
root: true,
env: {
node: true,
},
extends: [
'plugin:vue/essential',
'eslint:recommended'
'airbnb-base',
'plugin:vue/recommended',
'plugin:prettier/recommended',
],
// plugins: [
// 'vuetify',
// ],
rules: {
// 'vuetify/no-deprecated-classes': 'error',
// 'vuetify/grid-unknown-attributes': 'error',
// 'vuetify/no-legacy-grid': 'error',
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-param-reassign': ['error', {
props: true,
ignorePropertyModificationsFor: [
'state',
],
}],
},
parserOptions: {
parser: 'babel-eslint',
},
overrides: [
{
files: [
'**/__tests__/*.{j,t}s?(x)'
],
env: {
mocha: true
}
}
]
};
......@@ -6,6 +6,9 @@ node_modules
.env.local
.env.*.local
# Local packages manager conf file
.npmrc
# Log files
npm-debug.log*
yarn-debug.log*
......
unit test:
image: node:lts
stage: test
only:
- master
- develop
script:
- npm install --progress=false
- npm run test:unit:coverage
coverage: /All files\s*\|\s*([\d\.]+)/
module.exports = {
printWidth: 100,
singleQuote: true,
parser: "vue",
};
# vuerms
# unistra-formbuilder
## Project setup
```
npm install
```
A Vuejs plugin that provides form builder and renderer components.
### Compiles and hot-reloads for development
```
npm run serve
```
## How to install
### Compiles and minifies for production
```
npm run build
### Requirements
> * vue: ^2.6.12
> * vuetify: ^2.2.18
> * vuex: ^3.0.1
### Installation
As this library isn't hosted on the npmjs registry but on our gitlab npm registry, we need to configure npm.
#### NPM configuration
```javascript
// .npmrc
@vue-unistra:registry=https://git.unistra.fr/api/v4/packages/npm/
```
### Run your tests
#### Install
```
npm run test
npm install --save @vue-unistra/unistra-formbuilder
```
### Lints and fixes files
```
npm run lint
#### Configuration
##### Webpack :
Add `@vue-unistra/unistra-formbuilder` to the `transpileDependencies` array, and configure webpack to load only the host application webpack `vue` and `vuetify` instances (prevents the `$attrs is readonly` and `$listeners is readonly` error messages)
```javascript
// vue.config.js
const path = require('path');
module.exports = {
lintOnSave: false,
transpileDependencies: [
'vuetify',
'@vue-unistra/unistra-formbuilder',
],
configureWebpack: {
resolve: {
symlinks: false,
alias: {
'vue$': path.resolve(__dirname, './node_modules/vue/dist/vue.esm.js'),
'^vuetify': path.resolve(__dirname, './node_modules/vuetify'),
},
},
},
};
```
### Run your unit tests
##### Vuetify :
`VCard` component and `Ripple` directive have to be manually imported.
```javascript
// src/plugins/vuetify.js
import Vue from 'vue';
import Vuetify, { VCard } from 'vuetify/lib';
import Ripple from 'vuetify/lib/directives/ripple';
import fr from 'vuetify/es5/locale/fr';
Vue.use(Vuetify, {
components: {
VCard,
},
directives: {
Ripple,
},
});
export default new Vuetify({
lang: {
locales: { fr },
current: 'fr',
},
});
```
npm run test:unit
##### Unistra formbuilder :
Create the file `src/plugins/unistra-formbuilder.js` :
```javascript
// src/plugins/unistra-formbuilder.js
import Vue from 'vue';
import { unistraFormbuilder } from '@vue-unistra/unistra-formbuilder';
import store from '../store';
Vue.use(unistraFormbuilder, { store });
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
And import import it in `/src/main.js` just after the vuetify import :
```javascript
// src/main.js
import Vue from 'vue';
import vuetify from './plugins/vuetify';
import './plugins/unistra-formbuilder';
import App from './App.vue';
import store from './store';
Vue.config.productionTip = false;
new Vue({
store,
vuetify,
render: (h) => h(App),
}).$mount('#app');
```
## Usage
### usf-formbuilder
The `usf-formbuilder` component is used to create and edit forms. It's a drag and drop tool composed by an editor on the left side and control panel on the right side. Fields are added by dragging them from the control panel and dropping them to the editor. Fields order can be reorganized by drag and drop. Each field can be edited (display, validation, internationalization, ...) or removed. When working with authenticated forms, fields can also react to user properties.
#### Props
| Props | Type | Default | Description |
| :------------ | :------ |:------- | :------------------------------------------------------------------------------------------------------------------------------------- |
| fields | Array | [ ] | The array of fields to display. Contains field objects. |
| messages | Object | { } | The internationalization object. Contains for each localization the translations of fields properties (label, hint, placeholder, ...). |
| userTemplates | Object | { } | The user properties templates object. To react to user properties, fields need to know what properties are availabe |
| admin | Boolean | false | Admin users can protect fields (not editable/removable by regular users |
#### Events
| Name | Return | Description |
| :--- | :------------------------------------------- | :----------------------------------- |
| save | `{ fields: [ ], internationalization: { } }` | Emits when `SAVE` button is clicked. |
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset',
],
env: {
test: {
plugins: [
['istanbul', {
useInlineSourceMaps: false,
}],
],
},
},
};
module.exports = {
input: 'src/index.js',
output: {
extractCSS: false,
},
bundleNodeModules: true,
externals: [
'vue',
'vuex',
'vuetify/lib',
],
plugins: {
vue: true,
vuetify: true,
},
};
#!/bin/bash
set -e
PROJECT="vue-formbuilder"
TEMP=$(mktemp -d)
REPOSITORY=$(pwd)
DISTANT_REPO=$(git config --get remote.origin.url)
WORKING_DIR="$TEMP/git-clone"
TEST_STATIC=("root@django-test.u-strasbg.fr:/var/www/static/dynamicforms")
TEST_TEMPLATE=("root@django-test.u-strasbg.fr:/home/django/dynamic-forms-test.app.unistra.fr/current/dynamicforms/templates")
PREPROD_STATIC=("root@rp-dip-pprd-public.di.unistra.fr:/var/www/static/dynamicforms")
PREPROD_TEMPLATE=("root@django-pprd-w1:/home/django/dynamic-forms-pprd.unistra.fr/current/dynamicforms/templates" "root@django-pprd-w2:/home/django/dynamic-forms-pprd.unistra.fr/current/dynamicforms/templates")
PROD_STATIC=("root@rp-dip-public-m.di.unistra.fr:/var/www/static/dynamicforms" "root@rp-dip-public-s.di.unistra.fr:/var/www/static/dynamicforms")
PROD_TEMPLATE=("root@django-w3:/home/django/dynamic-forms.app.unistra.fr/current/dynamicforms/templates" "root@django-w4:/home/django/dynamic-forms.app.unistra.fr/current/dynamicforms/templates")
ENVIRONMENT="$2"
case "$ENVIRONMENT" in
test)
TARGET_STATIC=("${TEST_STATIC[@]}")
TARGET_TEMPLATE=("${TEST_TEMPLATE[@]}")
;;
preprod)
TARGET_STATIC=("${PREPROD_STATIC[@]}")
TARGET_TEMPLATE=("${PREPROD_TEMPLATE[@]}")
;;
prod)
TARGET_STATIC=("${PROD_STATIC[@]}")
TARGET_TEMPLATE=("${PROD_TEMPLATE[@]}")
;;
esac
cd "$TEMP"
echo "🍻 Cloning repository"
git clone "$REPOSITORY" "$WORKING_DIR"
cd "$WORKING_DIR"
echo
echo "🔀 Switching to target build"
git checkout $1
echo "🏗 Installing npm dependencies"
npm install
echo "📦 Packaging stuff"
npm run build:$ENVIRONMENT
echo "🚀 Deploying files"
echo $(pwd)
for i in "${TARGET_STATIC[@]}"; do
echo "Scp static files to $i"
scp -r "dist/css" "$i"
scp -r "dist/js" "$i"
done
for i in "${TARGET_TEMPLATE[@]}"; do
echo "Scp template to $i"
scp "dist/base.html" "$i"
done
# SENTRY
# Sentry needs gitlab repository to be origin
echo "🚧 Manipulating git distant repositories"
git remote remove origin
git remote add origin "$DISTANT_REPO"
PROJECT_VERSION=$(git describe --long)
# Create a release
echo "📌 Telling about $PROJECT_VERSION to Sentry"
sentry-cli releases new -p "$PROJECT" "$PROJECT_VERSION"
# Associate commits with the release
echo "🤖 Associating commits to version"
sentry-cli releases set-commits --auto "$PROJECT_VERSION"
# Declare deployment
echo "🔖 Telling Sentry that we are deploying $PROJECT_VERSION in $ENVIRONMENT"
sentry-cli releases deploys "$PROJECT_VERSION" new -e "$ENVIRONMENT"
echo "🎉 Successfully deployed"
module.exports = {
'check-coverage': false,
'per-file': true,
'skip-full': true,
all: true,
include: [
'src/**/*.{js,vue}',
],
exclude: [
'src/*.js',
'**/index.js',
'src/plugins/*',
'src/router/*',
],
reporter: [
'lcov',
'text',
'text-summary',
],
extension: [
'.js',
'.vue',
],
}
This diff is collapsed.
{
"name": "dynamic-forms",
"version": "2.0.6",
"description": "Dynamic form building and rendering helpers using Vuejs.",
"author": "Unistra - DNUM",
"name": "@vue-unistra/unistra-formbuilder",
"version": "3.0.0",
"main": "dist/index.js",
"files": [
"dist/*",
"src/*"
],
"license": "MIT",
"publishConfig": {
"@vue-unistra:registry": "https://git.unistra.fr/api/v4/projects/17878/packages/npm/"
},
"scripts": {
"serve": "vue-cli-service serve --mode dev",
"lint": "vue-cli-service lint",
"build:local": "vue-cli-service build --mode local",
"build:preprod": "vue-cli-service build --mode preprod",
"build:prod": "vue-cli-service build --mode prod",
"build:test": "vue-cli-service build --mode testenv",
"test:unit": "vue-cli-service test:unit",
"test:unit:coverage": "nyc vue-cli-service test:unit"
"build": "bili",
"lint": "eslint --ext .js,.vue src test",
"lint:fix": "eslint --ext .js,.vue src test --fix",
"lint:config": "eslint --print-config .eslintrc.js | eslint-config-prettier-check"
},
"main": "src/plugin.js",
"dependencies": {
"@sentry/browser": "^5.15.5",
"@sentry/integrations": "^5.15.5",
"core-js": "^3.4.4",
"gitmoji-cli": "^3.2.4",
"jwt-decode": "^3.0.0",
"date-fns": "^2.19.0",
"lodash": "^4.17.20",
"moment": "^2.24.0",
"normalizr": "^3.5.0",
"rich-text-editor-vuetify": "^1.1.6",
"tiptap": "^1.26.6",
"tiptap-extensions": "^1.28.6",
"unistra-box": "git+https://git.unistra.fr/vue/unistra-box.git#master",
"vue": "^2.6.10",
"vue-axios": "^2.1.4",
"vue-cas-authentication": "git+https://git.unistra.fr/vue/cas-authentication.git#1.4.1",
"vue-router": "^3.0.1",
"vuedraggable": "^2.23.2",
"vuelidate": "^0.7.5",
"vuetify": "^2.2.18",
"vuex": "^3.0.1"
"vuedraggable": "^2.23.2"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^4.1.2",
"@vue/cli-plugin-eslint": "^4.1.2",
"@vue/cli-plugin-unit-mocha": "^4.1.2",
"@vue/cli-service": "^4.2.3",
"@vue/eslint-config-airbnb": "^4.0.0",
"@vue/test-utils": "^1.0.0-beta.29",
"axios": "^0.19.0",
"babel-eslint": "^10.0.1",
"babel-plugin-istanbul": "^6.0.0",
"chai": "^4.1.2",
"eslint": "^5.8.0",
"eslint-plugin-vue": "^5.0.0",
"eslint-plugin-vuetify": "^1.0.0-beta.6",
"git-revision-webpack-plugin": "^3.0.3",
"moxios": "^0.4.0",
"nyc": "^15.0.0",
"sass": "^1.24.4",
"sass-loader": "^8.0.2",
"sinon": "^8.1.1",
"vue-cli-plugin-axios": "0.0.4",
"vue-cli-plugin-vuetify": "^2.0.3",
"vue-template-compiler": "^2.6.11",
"bili": "^5.0.5",
"eslint": "^7.13.0",
"eslint-config-airbnb-base": "^14.2.1",
"eslint-config-prettier": "^6.15.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-vue": "^7.1.0",
"prettier": "^2.2.1",
"rollup-plugin-vue": "5.1.9",
"rollup-plugin-vuetify": "^0.2.4",
"vue-template-compiler": "^2.6.12",
"vuetify-loader": "^1.4.3"
},
"bundledDependencies": [
"axios",
"moment",
"vue",
"vue-router",
"vuedraggable",
"vuetify",
"vuex",
"unistra-box"
],
"licence": "aGPL3.x"
"peerDependencies": {
"vue": "^2.6.12",
"vuetify": "^2.2.18",
"vuex": "^3.0.1"
}
}
module.exports = {
plugins: {
autoprefixer: {},
},
};
<!DOCTYPE html>
{% load static %}
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>Formulaires - Université de Strasbourg</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
<link rel="stylesheet"
href="https://s3.unistra.fr/master/common/assets/fonts/unistra-font/1.0.0/css/unistra-font.css?AWSAccessKeyId=M2M78RKXPAP75Y692QZX&Signature=Ros22u4Tp0Dy106qr0rRkGBPoJM=&Expires=1870971370">
<link rel="stylesheet"
href="https://s3.unistra.fr/master/common/assets/fonts/unistra-signature/3.0.1/css/sun.css?AWSAccessKeyId=M2M78RKXPAP75Y692QZX&Signature=CgIbptGflBu5hCjAQYmysfF3E4c%3D&Expires=1887617036">
<link rel="stylesheet"
href="https://s3.unistra.fr/master/common/assets/fonts/unistra-symbol/1.0.4/css/unistra-symbol.css?AWSAccessKeyId=M2M78RKXPAP75Y692QZX&Signature=lfTwAVnRXjgZc9ryRpAcWhiMbCA%3D&Expires=1876298241">
</head>
<body>
<noscript>
<strong>We're sorry but vuerms doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment