Skip to content

wendachye/chope-vue-test

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Chope Assessment

Use VueJs

Please draw a floor plan of a restaurant. The restaurant has six tables, and the table area is separated by lines, as shown in the figure below. It is required to drag the table with the mouse to change the position of the table. The attribute data of the six tables and two lines are as follows:

  • table1:
    • Shape: Square; width: 60; height: 60; position x: 76; position y: 36;
  • table2:
    • Shape: square; width: 60; height: 60; position x: 173; position y: 36;
  • table3:
    • Shape: rectangle; width: 300; height: 60; position x: 278; position y: 36;
  • table4:
    • Shape: circle; width: 60; height: 60; position x: 82; position y: 210;
  • table5:
    • Shape: circle; width: 60; height: 60; position x: 180; position y: 210;
  • table6:
    • Shape: circle; width: 200; height: 100; position x: 353; position y: 190;
  • Horizontal line:
    • Shape: line; width: 300; height: 2; position x: 144; position y: 139;
  • Vertical line:
    • Shape: line; width: 2; height: 100; position x: 295; position y: 194;

Project setup

yarn install

Compiles and hot-reloads for development

yarn serve

Compiles and minifies for production

yarn build

Lints and fixes files

yarn lint

Customize configuration

See Configuration Reference.