Content deleted Content added
expand with other response options, use ids that match template code |
tweak styles, add method to actually make the edit (for now just resolves a promise) |
||
Line 8:
EFFPRH.init = function () {
mw.loader.using(
[ 'vue', 'wvui', 'mediawiki.util', 'mediawiki.api', 'es6-polyfills' ],
EFFPRH.run
);
Line 44:
mw.util.addCSS(`
.script-EFFPRH-handler {
background-color: #
border: 1px solid black;
margin: 10px 0 10px 0;
Line 60:
.wvui-dropdown {
margin-bottom: 10px;
}
/* Reduce vertical space in the dropdown options */
.wvui-options-menu__item {
line-height: 1em;
}
`);
Line 146 ⟶ 150:
selectedResponse: 'none',
commentValue: '',
reloadUrl: mw.util.getUrl( mw.config.get( 'wgPageName' ) + '#' + reporterName ),
// Overall state
haveSubmitted: false,
editMade: false,
editError: false
};
},
Line 162 ⟶ 169:
submitHandler: function () {
this.haveSubmitted = true;
EFFPRH.respondToReport(
this.sectionNum,
this.selectedResponse,
this.commentValue
).then(
// arrow functions to simplify `this`
() => this.editMade = true,
() => this.editError = true
);
},
cancelHandler: function () {
Line 182 ⟶ 197:
<wvui-input :value="commentValue" v-on:input="onCommentChange" placeholder="Comment" :disabled="haveSubmitted" />
<br />
<ul v-show="haveSubmitted">
<li>Submitting...</li>
<li v-show="editMade">Success! <a :href="reloadUrl"><strong>Reload the page</strong></a></li>
<li v-show="editError">Uh-oh, something went wrong. Please check the console for details.</li>
</ul>
<wvui-button type="primary" action="progressive" :disabled="!canSubmit" v-on:click="submitHandler">Submit</wvui-button>
<wvui-button type="primary" action="destructive" :disabled="haveSubmitted" v-on:click="cancelHandler">Cancel</wvui-button>
Line 188 ⟶ 208:
vueAppInstance = Vue.createMwApp( handlerApp );
vueAppInstance.mount( '#' + targetDivId );
};
/**
* Actually make the page edit to respond to the report. Returns a promise
* for the edit succeeding or not.
*/
EFFPRH.respondToReport = function ( sectionNum, responseOption, extraComment ) {
return new Promise( function ( resolve, reject ) {
console.log( 'Should respond: ', sectionNum, responseOption, extraComment );
resolve();
} );
};
| |||