multi-site-simulators

A widget to simulate shares in a french cooperative (SCOP).

That's a widget you can include in any html page...

How to integrate widgets

Widgets need two files in order to work :

app.js
app.css

Add those two files to your html head, like this if the widget code is deployed on https://multi-site-simulator-test.netlify.app:

<script src="https://multi-site-simulator-test.netlify.app/js/app.js" type="text/javascript"></script>

<link type="text/css" href="ttps://multi-site-simulator-test.netlify.app/js/app.css" rel="stylesheet">

Widgets can then be called directly into the page as custom html elements.

Widget config

The widget's tag is : <multi-shares-simulator/>

The widget takes several parameters, following this structure :

  <multi-shares-simulator 
    locale="fr"
    cooperative="MultiPass"
    partvalue="25"
    minbenefs="0"
    benefs="100000"
    repart='{
      "reserves":40,
      "participation":50,
      "dividendes":10
    }'
    team='[
      { "name":"Joe Black", "parts":100, "workTime":100, "yearTime": 12 }, 
      { "name":"Julian Assange", "parts":100, "workTime":100, "yearTime": 12 }, 
      { "name":"Thomas Piketti", "parts":40, "workTime":40, "yearTime": 7 }, 
      { "name":"Pierre Larrouturou", "parts":100, "workTime":60, "yearTime": 7 }, 
      { "name":"Quentin Tarantino", "parts": 100, "workTime":80, "yearTime": 7 }
    ]'
  />

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.

Stack

Technologies used for multi-site-simulator are the followiing :

Vue.js - js framework ;
Buefy - vue css framework based on Bulma css framework ;
vue-custom-element - custom web component wrapper for vue.js ;

multi-coop/multi-site-simulator