diff options
| author | Andrew <saintruler@gmail.com> | 2019-07-23 12:42:26 +0400 |
|---|---|---|
| committer | Andrew <saintruler@gmail.com> | 2019-07-23 12:42:26 +0400 |
| commit | 6888339cdb678c017cd23d542f15942a5047330e (patch) | |
| tree | bbafd6d2526bb34a9540d05c6357e0f65fab3f84 /day9/task5_vue/src/components/EditFormBox.vue | |
| parent | 38055bcd23527a36d77468ce2dfd0b4766e7fc00 (diff) | |
Добавлена поддержка LESS для некоторых компонентов.
Убран лишний тег <form> из EditFromBox.
Diffstat (limited to 'day9/task5_vue/src/components/EditFormBox.vue')
| -rw-r--r-- | day9/task5_vue/src/components/EditFormBox.vue | 165 |
1 files changed, 81 insertions, 84 deletions
diff --git a/day9/task5_vue/src/components/EditFormBox.vue b/day9/task5_vue/src/components/EditFormBox.vue index c994656..f18bf69 100644 --- a/day9/task5_vue/src/components/EditFormBox.vue +++ b/day9/task5_vue/src/components/EditFormBox.vue @@ -1,107 +1,105 @@ <template> <div class="backgroundTint shown"> <div class="contentBox shown"> - <form ref="tableForm" action="/api/actionNotChanged" method="post"> - <div class="formRow"> - <div class="formRow-label">service_id</div> - - <div class="formRow-input"> - <input - v-if="formType === 'update'" - type="text" ref="service_id" class="formInput" - readonly="readonly" v-bind:value="tableRow['service_id']"> - <input - v-else-if="formType === 'create'" - type="text" ref="service_id" class="formInput" - v-bind:value="tableRow['service_id']"> - </div> + <div class="formRow"> + <div class="formRow-label">service_id</div> + + <div class="formRow-input"> + <input + v-if="formType === 'update'" + type="text" ref="service_id" class="formInput" + readonly="readonly" v-bind:value="tableRow['service_id']"> + <input + v-else-if="formType === 'create'" + type="text" ref="service_id" class="formInput" + v-bind:value="tableRow['service_id']"> </div> + </div> - <div class="formRow"> - <div class="formRow-label"> servtype </div> - <div class="formRow-input"> - <input type="text" ref="servtype" class="formInput" v-bind:value="tableRow['servtype']"> - </div> + <div class="formRow"> + <div class="formRow-label"> servtype </div> + <div class="formRow-input"> + <input type="text" ref="servtype" class="formInput" v-bind:value="tableRow['servtype']"> </div> + </div> - <div class="formRow"> - <div class="formRow-label"> subtype </div> - <div class="formRow-input"> - <input type="text" ref="subtype" class="formInput" v-bind:value="tableRow['subtype']"> - </div> + <div class="formRow"> + <div class="formRow-label"> subtype </div> + <div class="formRow-input"> + <input type="text" ref="subtype" class="formInput" v-bind:value="tableRow['subtype']"> </div> + </div> - <div class="formRow"> - <div class="formRow-label"> user_id </div> - <div class="formRow-input"> - <input type="text" ref="user_id" class="formInput" v-bind:value="tableRow['user_id']"> - </div> + <div class="formRow"> + <div class="formRow-label"> user_id </div> + <div class="formRow-input"> + <input type="text" ref="user_id" class="formInput" v-bind:value="tableRow['user_id']"> </div> + </div> - <div class="formRow"> - <div class="formRow-label"> referrer_user_id </div> - <div class="formRow-input"> - <input type="text" ref="referrer_user_id" class="formInput" v-bind:value="tableRow['referrer_user_id']"> - </div> + <div class="formRow"> + <div class="formRow-label"> referrer_user_id </div> + <div class="formRow-input"> + <input type="text" ref="referrer_user_id" class="formInput" v-bind:value="tableRow['referrer_user_id']"> </div> - - <div class="formRow"> - <div class="formRow-label"> state </div> - <div class="formRow-input"> - <select ref="state" v-bind:value="tableRow['state']"> - <option>N</option> - <option>A</option> - <option>S</option> - <option>D</option> - <option>O</option> - </select> - </div> + </div> + + <div class="formRow"> + <div class="formRow-label"> state </div> + <div class="formRow-input"> + <select ref="state" v-bind:value="tableRow['state']"> + <option>N</option> + <option>A</option> + <option>S</option> + <option>D</option> + <option>O</option> + </select> </div> + </div> - <div class="formRow"> - <div class="formRow-label"> creation_date </div> - <div class="formRow-input"> - <input type="date" ref="creation_date" class="formInput" v-bind:value="tableRow['creation_date']"> - </div> + <div class="formRow"> + <div class="formRow-label"> creation_date </div> + <div class="formRow-input"> + <input type="date" ref="creation_date" class="formInput" v-bind:value="tableRow['creation_date']"> </div> - <div class="formRow"> - <div class="formRow-label"> creation_time </div> - <div class="formRow-input"> - <input type="time" ref="creation_time" class="formInput" v-bind:value="tableRow['creation_time']"> - </div> + </div> + <div class="formRow"> + <div class="formRow-label"> creation_time </div> + <div class="formRow-input"> + <input type="time" ref="creation_time" class="formInput" v-bind:value="tableRow['creation_time']"> </div> - - <div class="formRow"> - <div class="formRow-label"> creation_request_sent_date </div> - <div class="formRow-input" style="display: flex; flex-direction: row"> - <input - type="date" ref="creation_request_sent_date" - class="formInput" style="width: 50%;" - v-bind:value="tableRow['creation_request_sent_date'].split(' ')[0]"> - <input - type="time" ref="creation_request_sent_time" - class="formInput" style="width: 50%;" - v-bind:value="tableRow['creation_request_sent_date'].split(' ')[1]"> - </div> - <div class="formRow-error" v-if="validationResponse.creation_request_sent_date !== null"> - {{ validationResponse.creation_request_sent_date }} - </div> + </div> + + <div class="formRow"> + <div class="formRow-label"> creation_request_sent_date </div> + <div class="formRow-input" style="display: flex; flex-direction: row"> + <input + type="date" ref="creation_request_sent_date" + class="formInput" style="width: 50%;" + v-bind:value="tableRow['creation_request_sent_date'].split(' ')[0]"> + <input + type="time" ref="creation_request_sent_time" + class="formInput" style="width: 50%;" + v-bind:value="tableRow['creation_request_sent_date'].split(' ')[1]"> </div> + <div class="formRow-error" v-if="validationResponse.creation_request_sent_date !== null"> + {{ validationResponse.creation_request_sent_date }} + </div> + </div> - <div class="formRow"> - <div class="formRow-label"> notified_about_expiration </div> - <div class="formRow-input"> - <input type="text" ref="notified_about_expiration" class="formInput" v-bind:value="tableRow['notified_about_expiration']"> - </div> + <div class="formRow"> + <div class="formRow-label"> notified_about_expiration </div> + <div class="formRow-input"> + <input type="text" ref="notified_about_expiration" class="formInput" v-bind:value="tableRow['notified_about_expiration']"> </div> + </div> - <div class="formButtons"> - <button type="button" @click="cancelCallback">Cancel</button> + <div class="formButtons"> + <button type="button" @click="cancelCallback">Cancel</button> - <button type="button" v-if="formType === 'update'" @click="submitForm">Update</button> - <button type="button" v-else-if="formType === 'create'" @click="submitForm">Create</button> - </div> - </form> + <button type="button" v-if="formType === 'update'" @click="submitForm">Update</button> + <button type="button" v-else-if="formType === 'create'" @click="submitForm">Create</button> + </div> </div> </div> </template> @@ -259,7 +257,6 @@ .contentBox { padding: 20px; width: 500px; - height: 695px; background-color: #f0f0f0; border-radius: 10px; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); |