Blame view

src/pages/generalSetting/generalSetting.vue 9.42 KB
79583580d   Neeraj Sharma   implement task ma...
1
2
  <template>
    <v-app id="login">
d9bb52b5b   Neeraj Sharma   implement trello ...
3
      <v-container>
79583580d   Neeraj Sharma   implement task ma...
4
        <v-layout>
109a6218c   Neeraj Sharma   solve issue/bugs ...
5
          <v-flex xs12 sm12 md12 lg10 class="mt-5 mx-auto">
68d742034   Neeraj Sharma   implement new des...
6
7
8
9
10
11
            <v-card flat class="card-style pa-2" dark>
              <v-layout>
                <v-flex xs12>
                  <label class="title text-xs-center">General Setting</label>
                </v-flex>
              </v-layout>
79583580d   Neeraj Sharma   implement task ma...
12
13
14
              <v-card-text>
                <v-flex xs12>
                  <v-form class="mt-3" ref="form" v-model="valid" lazy-validation>
d9bb52b5b   Neeraj Sharma   implement trello ...
15
16
17
18
19
                    <v-layout>
                      <v-flex
                        xs12
                        class="text-xs-center text-sm-center text-md-center text-lg-center mb-4"
                      >
9b444e5c3   Neeraj Sharma   add logo in login...
20
21
22
23
24
25
                        <img
                          src="/static/default_thumb.png"
                          height="140"
                          width="140"
                          v-if="!imageData.imageUrl"
                        />
d9bb52b5b   Neeraj Sharma   implement trello ...
26
27
28
29
30
31
32
                        <input
                          type="file"
                          style="display: none"
                          ref="image"
                          accept="image/*"
                          @change="onFilePicked"
                        />
109a6218c   Neeraj Sharma   solve issue/bugs ...
33
34
35
36
37
38
                        <img
                          :src="imageData.imageUrl"
                          height="150"
                          width="150"
                          v-if="imageData.imageUrl"
                        />
d9bb52b5b   Neeraj Sharma   implement trello ...
39
40
                      </v-flex>
                    </v-layout>
79583580d   Neeraj Sharma   implement task ma...
41
42
                    <v-flex xs12>
                      <!-- <v-layout> -->
d9bb52b5b   Neeraj Sharma   implement trello ...
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
                      <v-flex xs12>
                        <v-layout>
                          <v-flex xs4 sm4>
                            <label class="subheading right pt-4">Site Title:</label>
                          </v-flex>
                          <v-flex xs8 sm5>
                            <v-text-field
                              class="ml-3"
                              placeholder="fill your Site title"
                              v-model="setting.name"
                            ></v-text-field>
                          </v-flex>
                        </v-layout>
                      </v-flex>
                      <v-flex xs12>
                        <v-layout>
                          <v-flex xs4 sm4>
                            <label class="subheading right pt-4">Phone:</label>
                          </v-flex>
                          <v-flex xs8 sm5>
                            <v-text-field
                              class="ml-3"
                              placeholder="fill your Phone number"
                              v-model="setting.mobile"
                            ></v-text-field>
                          </v-flex>
                        </v-layout>
                      </v-flex>
d9bb52b5b   Neeraj Sharma   implement trello ...
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
                      <v-flex xs12>
                        <v-layout>
                          <v-flex xs4 sm4>
                            <label class="subheading right pt-4">Email:</label>
                          </v-flex>
                          <v-flex xs8 sm5>
                            <v-text-field
                              class="ml-3"
                              placeholder="fill your email"
                              v-model="setting.email"
                            ></v-text-field>
                          </v-flex>
                        </v-layout>
                      </v-flex>
                      <v-flex xs12>
                        <v-layout>
                          <v-flex xs4 sm4>
                            <label class="subheading right pt-4">Address:</label>
                          </v-flex>
                          <v-flex xs8 sm5>
                            <v-text-field
                              class="ml-3"
                              placeholder="fill your Address"
                              v-model="setting.address"
                            ></v-text-field>
                          </v-flex>
                        </v-layout>
                      </v-flex>
                      <v-flex xs12>
                        <v-layout>
                          <v-flex xs4 sm4>
                            <label class="right hidden-xs-only hidden-sm-only pt-4">Uplaod Image:</label>
                            <label
                              class="right hidden-lg-only hidden-md-only hidden-xl-only pt-4"
                            >Uplaod :</label>
                          </v-flex>
                          <v-flex xs8 sm5>
                            <v-text-field
                              class="ml-3"
                              label="Select Image"
                              @click="pickFile"
                              v-model="imageName"
                              append-icon="attach_file"
                            ></v-text-field>
                          </v-flex>
                        </v-layout>
                      </v-flex>
79583580d   Neeraj Sharma   implement task ma...
118
119
120
121
122
123
124
                    </v-flex>
                  </v-form>
                </v-flex>
              </v-card-text>
              <v-card-actions>
                <v-flex text-xs-center>
                  <v-btn
68d742034   Neeraj Sharma   implement new des...
125
                    class="mt-3 add-button"
79583580d   Neeraj Sharma   implement task ma...
126
                    round
79583580d   Neeraj Sharma   implement task ma...
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
                    dark
                    large
                    :loading="loading"
                    @click="reset"
                  >submit</v-btn>
                </v-flex>
              </v-card-actions>
              <v-snackbar
                :timeout="timeout"
                :top="y === 'top'"
                :right="x === 'right'"
                :vertical="mode === 'vertical'"
                v-model="snackbar"
                :color="color"
              >{{ text }}</v-snackbar>
            </v-card>
          </v-flex>
        </v-layout>
      </v-container>
    </v-app>
  </template>
  <script>
  import http from "@/Services/http.js";
  
  export default {
    data() {
      return {
        snackbar: false,
        y: "top",
        x: "right",
        mode: "",
        timeout: 4000,
        text: "",
        color: "",
        setting: {},
        valid: true,
        loading: false,
d9bb52b5b   Neeraj Sharma   implement trello ...
164
165
166
167
168
        text: "",
        imageData: {},
        imageName: "",
        imageUrl: "",
        imageFile: ""
79583580d   Neeraj Sharma   implement task ma...
169
170
171
172
      };
    },
    mounted() {
      this.token = this.$store.state.token;
109a6218c   Neeraj Sharma   solve issue/bugs ...
173
      this.getParticularSchool();
79583580d   Neeraj Sharma   implement task ma...
174
175
    },
    methods: {
d9bb52b5b   Neeraj Sharma   implement trello ...
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
      pickFile() {
        this.$refs.image.click();
      },
      onFilePicked(e) {
        // console.log(e)
        const files = e.target.files;
        this.imageData.upload = e.target.files[0];
        if (files[0] !== undefined) {
          this.imageName = files[0].name;
          if (this.imageName.lastIndexOf(".") <= 0) {
            return;
          }
          const fr = new FileReader();
          fr.readAsDataURL(files[0]);
          fr.addEventListener("load", () => {
            this.imageUrl = fr.result;
            this.imageFile = files[0]; // this is an image file that can be sent to server...
            this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
          });
        } else {
          this.imageName = "";
          this.imageFile = "";
          this.imageUrl = "";
        }
      },
79583580d   Neeraj Sharma   implement task ma...
201
202
203
      reset() {
        if (this.$refs.form.validate()) {
          this.loading = true;
d9bb52b5b   Neeraj Sharma   implement trello ...
204
205
206
207
208
          if (this.imageUrl) {
            var str = this.imageUrl;
            const [baseUrl, imageUrl] = str.split(/,/);
            this.setting.upload = imageUrl;
          }
79583580d   Neeraj Sharma   implement task ma...
209
210
211
212
213
214
215
216
217
218
          this.setting.schoolId = this.$store.state.id;
          http()
            .put("/updateSchool", this.setting, {
              headers: { Authorization: "Bearer " + this.token }
            })
            .then(response => {
              this.loading = false;
              this.snackbar = true;
              this.text = response.data.message;
              this.color = "green";
d9bb52b5b   Neeraj Sharma   implement trello ...
219
              this.imageUrl = "";
79583580d   Neeraj Sharma   implement task ma...
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
            })
            .catch(error => {
              // console.log("err====>",err);
              this.snackbar = true;
              this.text = error.response.data.message;
              this.color = "error";
              this.loading = false;
            });
        }
      },
      // getRole() {
      //   this.showLoader = true;
      //   http()
      //     .get("/getRolesList", {
      //       headers: { Authorization: "Bearer " + this.token }
      //     })
      //     .then(response => {
      //       for (let i = 0; i < response.data.data.length; i++) {
      //         if (
      //           response.data.data[i].name != "SUPERADMIN" &&
      //           response.data.data[i].name != "ADMIN"
      //         ) {
      //           this.getRoles.push(response.data.data[i]);
      //           this.showLoader = false;
      //         }
      //       }
      //     })
      //     .catch(error => {
      //       this.showLoader = false;
      //       if (error.response.status === 401) {
      //         this.$router.replace({ path: "/" });
      //         this.$store.dispatch("setToken", null);
      //         this.$store.dispatch("Id", null);
      //       }
      //     });
      // },
109a6218c   Neeraj Sharma   solve issue/bugs ...
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
      getParticularSchool() {
        this.showLoader = true;
        http()
          .get("/getParticularSchool", {
            params: {
              schoolId: this.$store.state.id
            },
            headers: { Authorization: "Bearer " + this.token }
          })
          .then(response => {
            this.setting = response.data.data;
            this.imageData.imageUrl = response.data.data.schoolLogoUrl;
          })
          .catch(error => {
            this.showLoader = false;
            if (error.response.status === 401) {
              this.$router.replace({ path: "/" });
              this.$store.dispatch("setToken", null);
              this.$store.dispatch("Id", null);
            }
          });
79583580d   Neeraj Sharma   implement task ma...
277
      }
79583580d   Neeraj Sharma   implement task ma...
278
279
280
281
    }
  };
  </script>
  <style scoped>
79583580d   Neeraj Sharma   implement task ma...
282
283
284
285
286
287
288
289
290
291
292
  .v-btn--large {
    padding: 0px 74px;
  }
  @media screen and (max-width: 769px) {
    .v-btn--large {
      font-size: 14px;
      height: 44px;
      padding: 0 32px;
    }
  }
  </style>