Skip to content

Commit e54bcd0

Browse files
codeByCandlelightcodeByCandlelight
authored
Merge pull request #20 from ziggrace/sean/snippet
Sean/snippet
2 parents ec4e74e + b113d60 commit e54bcd0

File tree

2 files changed

+101
-85
lines changed

2 files changed

+101
-85
lines changed

‎src/components/file_system_interface/ExportProject.vue

Lines changed: 79 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -223,86 +223,94 @@ export default {
223223
* @description imports child components into <script>
224224
*/
225225
writeScript (componentName, children) {
226-
// let str = ''
227-
// children.forEach(name => {
228-
// str += `import ${name} from '@/components/${name}.vue';\n`
229-
// })
230-
// let childrenComponentNames = ''
231-
// children.forEach(name => {
232-
// childrenComponentNames += `\t\t${name},\n`
233-
// })
234-
// return `\n\n<script>\n${str}\nexport default {\n\tname: '${componentName}'
235-
// ,\n\tcomponents: {\n${childrenComponentNames}\t}\n};\n<\/script>`
236-
// },
237226
// add import mapstate and mapactions if they exist
238-
let imports = ''
239-
if (this.activeComponentObj.actions.length || this.activeComponentObj.state.length){
240-
imports += 'import { '
241-
if (this.activeComponentObj.actions.length && this.activeComponentObj.state.length) {
242-
imports += 'mapState, mapActions'
243-
}
244-
else if (this.activeComponentObj.state.length) imports += 'mapState'
245-
else imports += 'mapActions'
246-
imports += ' } from "vuex"\n'
247-
}
248-
249-
// add imports for children
250-
children.forEach(name => {
251-
imports += `import ${name} from '@/components/${name}.vue';\n`
252-
})
253-
254-
// add components section
255-
let childrenComponentNames = ''
256-
children.forEach(name => {
257-
childrenComponentNames += ` ${name},\n`
258-
})
227+
const currentComponent = this.componentMap[componentName]
228+
const routes = Object.keys(this.routes)
229+
console.log(componentName)
230+
console.log(currentComponent)
231+
if (!routes.includes(componentName)){
232+
let imports = ''
233+
if (currentComponent.actions.length || currentComponent.state.length){
234+
imports += 'import { '
235+
if (currentComponent.actions.length && currentComponent.state.length) {
236+
imports += 'mapState, mapActions'
237+
}
238+
else if (currentComponent.state.length) imports += 'mapState'
239+
else imports += 'mapActions'
240+
imports += ' } from "vuex"\n'
241+
}
259242
260-
// if true add data section and populate with props
261-
let data = ''
262-
if (this.activeComponentObj.props.length){
263-
data += ' data () {\n return {'
264-
this.activeComponentObj.props.forEach(prop => {
265-
data += `\n ${prop}: "PLACEHOLDER FOR VALUE",`
243+
// add imports for children
244+
children.forEach(name => {
245+
imports += `import ${name} from '@/components/${name}.vue';\n`
266246
})
267-
data += '\n'
268-
data += ' }\n'
269-
data += ' },\n'
270-
}
271247
272-
// if true add computed section and populate with state
273-
let computed = ''
274-
if (this.activeComponentObj.state.length){
275-
computed += ' computed: {'
276-
computed += '\n ...mapState(['
277-
this.activeComponentObj.state.forEach((state) =>{
278-
computed += `\n "${state}",`
248+
// add components section
249+
let childrenComponentNames = ''
250+
children.forEach(name => {
251+
childrenComponentNames += ` ${name},\n`
279252
})
280-
computed += '\n ]),\n'
281-
computed += ' },\n'
253+
254+
// if true add data section and populate with props
255+
let data = ''
256+
if (currentComponent.props.length){
257+
data += ' data () {\n return {'
258+
currentComponent.props.forEach(prop => {
259+
data += `\n ${prop}: "PLACEHOLDER FOR VALUE",`
260+
})
261+
data += '\n'
262+
data += ' }\n'
263+
data += ' },\n'
264+
}
265+
266+
// if true add computed section and populate with state
267+
let computed = ''
268+
if (currentComponent.state.length){
269+
computed += ' computed: {'
270+
computed += '\n ...mapState(['
271+
currentComponent.state.forEach((state) =>{
272+
computed += `\n "${state}",`
273+
})
274+
computed += '\n ]),\n'
275+
computed += ' },\n'
276+
}
277+
278+
// if true add methods section and populate with actions
279+
let methods = ''
280+
if (currentComponent.actions.length){
281+
methods += ' methods: {'
282+
methods += '\n ...mapActions(['
283+
currentComponent.actions.forEach((action) => {
284+
methods += `\n "${action}",`
285+
})
286+
methods += '\n ]),\n'
287+
methods += ' },\n'
288+
}
289+
290+
// concat all code within script tags
291+
let output = '\n\n<script>\n'
292+
output += imports + '\nexport default {\n name: ' + componentName
293+
output += ',\n components: {\n'
294+
output += childrenComponentNames + ' },\n'
295+
output += data
296+
output += computed
297+
output += methods
298+
output += '};\n<\/script>'
299+
return output
282300
}
283301
284-
// if true add methods section and populate with actions
285-
let methods = ''
286-
if (this.activeComponentObj.actions.length){
287-
methods += ' methods: {'
288-
methods += '\n ...mapActions(['
289-
this.activeComponentObj.actions.forEach((action) => {
290-
methods += `\n "${action}",`
302+
else{
303+
let str = ''
304+
children.forEach(name => {
305+
str += `import ${name} from '@/components/${name}.vue';\n`
306+
})
307+
let childrenComponentNames = ''
308+
children.forEach(name => {
309+
childrenComponentNames += ` ${name},\n`
291310
})
292-
methods += '\n ]),\n'
293-
methods += ' },\n'
311+
return `\n\n<script>\n${str}\nexport default {\n name: '${componentName}',\n components: {\n${childrenComponentNames} }\n};\n<\/script>`
294312
}
295313
296-
// concat all code within script tags
297-
let output = '\n\n<script>\n'
298-
output += imports + '\nexport default {\n name: ' + componentName
299-
output += ',\n components: {\n'
300-
output += childrenComponentNames + ' },\n'
301-
output += data
302-
output += computed
303-
output += methods
304-
output += '};\n<\/script>'
305-
return output
306314
},
307315
/**
308316
* @description writes the <style> in vue component
@@ -472,7 +480,7 @@ export default {
472480
}
473481
},
474482
computed: {
475-
...mapState(['componentMap', 'imagePath', 'activeComponentObj'])
483+
...mapState(['componentMap', 'imagePath', 'routes'])
476484
}
477485
}
478486

‎src/store/mutations.js

Lines changed: 22 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -110,8 +110,11 @@ const mutations = {
110110
state.selectedActions = []
111111
// super weird code, minor changes to objects are not reactive
112112
// setting to null and then resetting to object makes it reactive
113-
state.activeComponentObj = null
114-
state.activeComponentObj = active
113+
// state.activeComponentObj = null;
114+
// state.activeComponentObj = active;
115+
state.activeComponentObj = Object.assign({}, active)
116+
117+
state.componentMap = Object.assign({}, state.componentMap, {[state.activeComponent]: state.activeComponentObj})
115118
},
116119

117120
[types.CREATE_PROP]: (state, payload) => {
@@ -140,9 +143,10 @@ const mutations = {
140143
}
141144
}
142145
}
143-
state.selectedProps = []
144-
state.activeComponentObj = null
145-
state.activeComponentObj = active
146+
state.selectedProps = [];
147+
state.activeComponentObj = Object.assign({}, active)
148+
149+
state.componentMap = Object.assign({}, state.componentMap, {[state.activeComponent]: state.activeComponentObj})
146150
},
147151

148152
[types.CREATE_STATE]: (state, payload) => {
@@ -157,10 +161,7 @@ const mutations = {
157161
},
158162

159163
[types.ADD_STATE_TO_COMPONENT]: (state, payload) => {
160-
// let active = (state.routes[state.activeRoute].filter(comp => {
161-
// return comp.componentName === state.activeComponent
162-
// })[0])
163-
let active = state.activeComponentObj
164+
let active = state.activeComponentObj;
164165

165166
if (!state.activeComponentObj.state) {
166167
state.activeComponentObj.state = payload
@@ -171,9 +172,12 @@ const mutations = {
171172
}
172173
}
173174
}
174-
state.selectedState = []
175-
state.activeComponentObj = null
176-
state.activeComponentObj = active
175+
state.selectedState = [];
176+
// state.activeComponentObj = null;
177+
// state.activeComponentObj = active;
178+
state.activeComponentObj = Object.assign({}, active)
179+
180+
state.componentMap = Object.assign({}, state.componentMap, {[state.activeComponent]: state.activeComponentObj})
177181
},
178182

179183
[types.DELETE_ACTION_FROM_COMPONENT]: (state, payload) => {
@@ -402,7 +406,8 @@ const mutations = {
402406
},
403407
// pushs new component to componentMap
404408
[types.ADD_COMPONENT_TO_COMPONENT_MAP]: (state, payload) => {
405-
const { componentName, htmlList, children, parent, isActive } = payload
409+
const { componentName, htmlList, children, parent, isActive, actions, props } = payload;
410+
const s = payload.state
406411
state.componentMap = Object.assign({}, state.componentMap, {
407412
[componentName]: {
408413
componentName,
@@ -414,7 +419,10 @@ const mutations = {
414419
children,
415420
parent,
416421
htmlList,
417-
isActive
422+
isActive,
423+
actions,
424+
props,
425+
state: s
418426
}
419427
})
420428
},

0 commit comments

Comments
 (0)