viithiisys / School-Management-dashboard

1

1

2

<v-app id="pages-dasboard">

2

<v-app id="pages-dasboard">

3

<v-toolbar class="fixcolors" fixed app>

3

<v-toolbar class="fixcolors" fixed app>

4

<v-toolbar-title class="ml-0 pl-3">

4

<v-toolbar-title class="ml-0 pl-3">

5

<v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>

5

<v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>

6

</v-toolbar-title>

6

</v-toolbar-title>

7

7

8

<v-flex xs7 sm3 class="userSearch">

8

<v-flex xs7 sm3 class="userSearch">

9

<v-text-field

9

<v-text-field

10

flat

10

flat

11

append-icon="search"

11

append-icon="search"

12

label="Find your Students"

12

label="Find your Students"

13

v-model="search"

13

v-model="search"

14

color="white"

14

color="white"

15

dark

15

dark

16

></v-text-field>

16

></v-text-field>

17

</v-flex>

17

</v-flex>

18

<v-spacer></v-spacer>

18

<v-spacer></v-spacer>

19

<v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">

19

<v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">

20

<v-btn icon large flat slot="activator">

20

<v-btn icon large flat slot="activator">

21

<v-avatar size="40px">

21

<v-avatar size="40px">

22

22

23

</v-avatar>

23

</v-avatar>

24

</v-btn>

24

</v-btn>

25

<v-list class="pa-0">

25

<v-list class="pa-0">

26

<v-list-tile

26

<v-list-tile

27

v-for="(item,index) in items"

27

v-for="(item,index) in items"

28

:to="!item.href ? { name: item.name } : null"

28

:to="!item.href ? { name: item.name } : null"

29

:href="item.href"

29

:href="item.href"

30

@click="item.click"

30

@click="item.click"

31

ripple="ripple"

31

ripple="ripple"

32

:disabled="item.disabled"

32

:disabled="item.disabled"

33

:target="item.target"

33

:target="item.target"

34

rel="noopener"

34

rel="noopener"

35

:key="index"

35

:key="index"

36

>

36

>

37

<v-list-tile-action v-if="item.icon">

37

<v-list-tile-action v-if="item.icon">

38

<v-icon>{{ item.icon }}</v-icon>

38

<v-icon>{{ item.icon }}</v-icon>

39

</v-list-tile-action>

39

</v-list-tile-action>

40

<v-list-tile-content>

40

<v-list-tile-content>

41

<v-list-tile-title>{{ item.title }}</v-list-tile-title>

41

<v-list-tile-title>{{ item.title }}</v-list-tile-title>

42

</v-list-tile-content>

42

</v-list-tile-content>

43

</v-list-tile>

43

</v-list-tile>

44

</v-list>

44

</v-list>

45

</v-menu>

45

</v-menu>

46

</v-toolbar>

46

</v-toolbar>

47

<v-tabs grow slider-color="black">

47

<v-tabs grow slider-color="black">

48

<v-tab

48

<v-tab

49

ripple

49

ripple

50

@click="activeTab('existing')"

50

@click="activeTab('existing')"

51

v-bind:class="{ active: isActive }"

51

v-bind:class="{ active: isActive }"

52

id="tab"

52

id="tab"

53

class="subheading"

53

class="subheading"

54

>Existing Students</v-tab>

54

>Existing Students</v-tab>

55

<v-tab

55

<v-tab

56

ripple

56

ripple

57

@click="activeTab('new')"

57

@click="activeTab('new')"

58

v-bind:class="{ active: newActive }"

58

v-bind:class="{ active: newActive }"

59

id="tab1"

59

id="tab1"

60

User

60

User

61

class="subheading"

61

class="subheading"

62

>Add New Students</v-tab>

62

>Add New Students</v-tab>

63

64

64

65

66

<v-tab-item>

66

<v-tab-item>

67

<v-snackbar

67

<v-snackbar

68

:timeout="timeout"

68

:timeout="timeout"

69

:top="y === 'top'"

69

:top="y === 'top'"

70

:right="x === 'right'"

70

:right="x === 'right'"

71

:vertical="mode === 'vertical'"

71

:vertical="mode === 'vertical'"

72

v-model="snackbar"

72

v-model="snackbar"

73

color="success"

73

color="success"

74

>{{ text }}</v-snackbar>

74

>{{ text }}</v-snackbar>

75

<v-dialog v-model="dialog" max-width="1300px" scrollable>

75

<v-dialog v-model="dialog" max-width="1300px" scrollable>

76

<v-card flat style="height: 800px;">

76

<v-card flat style="height: 800px;">

77

<v-toolbar color="grey lighten-2" flat>

77

<v-toolbar color="grey lighten-2" flat>

78

<v-spacer></v-spacer>

78

<v-spacer></v-spacer>

79

<v-toolbar-title>

79

<v-toolbar-title>

80

<h3>Edit Student Profile</h3>

80

<h3>Edit Student Profile</h3>

81

</v-toolbar-title>

81

</v-toolbar-title>

82

<v-spacer></v-spacer>

82

<v-spacer></v-spacer>

83

</v-toolbar>

83

</v-toolbar>

84

<v-card-text >

84

<v-card-text>

85

<v-form ref="form">

85

<v-form ref="form">

86

<v-container fluid>

86

<v-container fluid>

87

<v-layout>

87

<v-layout>

88

<v-flex

88

<v-flex

89

xs12

89

xs12

90

class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"

90

class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"

91

>

91

>

92

<v-avatar size="160px">

92

<v-avatar size="160px">

93

<img

93

<img

94

src="/static/icon/user.png"

94

src="/static/icon/user.png"

95

v-if="!editedItem.profilePicUrl && !imageUrl"

95

v-if="!editedItem.profilePicUrl && !imageUrl"

96

/>

96

/>

97

<img

97

<img

98

:src="editedItem.profilePicUrl"

98

:src="editedItem.profilePicUrl"

99

v-else-if="editedItem.profilePicUrl && !imageUrl"

99

v-else-if="editedItem.profilePicUrl && !imageUrl"

100

/>

100

/>

101

<img

101

<img

102

v-if="imageUrl"

102

v-if="imageUrl"

103

:src="imageUrl"

103

:src="imageUrl"

104

height="150"

104

height="150"

105

style="border-radius:50%; width:200px"

105

style="border-radius:50%; width:200px"

106

/>

106

/>

107

</v-avatar>

107

</v-avatar>

108

<input

108

<input

109

type="file"

109

type="file"

110

style="display: none"

110

style="display: none"

111

ref="image"

111

ref="image"

112

accept="image/*"

112

accept="image/*"

113

@change="onFilePicked"

113

@change="onFilePicked"

114

/>

114

/>

115

</v-flex>

115

</v-flex>

116

</v-layout>

116

</v-layout>

117

<v-layout>

117

<v-layout>

118

<v-flex xs12 sm4>

118

<v-flex xs12 sm4>

119

<v-layout>

119

<v-layout>

120

<v-flex xs4 class="pt-4 subheading">

120

<v-flex xs4 class="pt-4 subheading">

121

<label class="right">Select Class:</label>

121

<label class="right">Select Class:</label>

122

</v-flex>

122

</v-flex>

123

<v-flex xs8 class="ml-3">

123

<v-flex xs8 class="ml-3">

124

<v-select

124

<v-select

125

:items="addclass"

125

:items="addclass"

126

label="Select Class"

126

label="Select Class"

127

v-model="editedItem.select"

127

v-model="editedItem.select"

128

item-text="classNum"

128

item-text="classNum"

129

item-value="_id"

129

item-value="_id"

130

name="Select Class"

130

name="Select Class"

131

@change="getSections(editedItem.select)"

131

@change="getSections(editedItem.select)"

132

required

132

required

133

></v-select>

133

></v-select>

134

</v-flex>

134

</v-flex>

135

</v-layout>

135

</v-layout>

136

</v-flex>

136

</v-flex>

137

<v-flex xs12 sm4>

137

<v-flex xs12 sm4>

138

<v-layout>

138

<v-layout>

139

<v-flex xs4 class="pt-4 subheading">

139

<v-flex xs4 class="pt-4 subheading">

140

<label class="right">Select Section:</label>

140

<label class="right">Select Section:</label>

141

</v-flex>

141

</v-flex>

142

<v-flex xs8 class="ml-3">

142

<v-flex xs8 class="ml-3">

143

<v-select

143

<v-select

144

:items="addSection"

144

:items="addSection"

145

label="Select Section"

145

label="Select Section"

146

v-model="editedItem.selectSection"

146

v-model="editedItem.selectSection"

147

item-text="name"

147

item-text="name"

148

item-value="_id"

148

item-value="_id"

149

name="Select Section"

149

name="Select Section"

150

required

150

required

151

></v-select>

151

></v-select>

152

</v-flex>

152

</v-flex>

153

</v-layout>

153

</v-layout>

154

</v-flex>

154

</v-flex>

155

<v-flex xs12 sm4>

155

<v-flex xs12 sm4>

156

<v-layout>

156

<v-layout>

157

<v-flex xs4 class="pt-4 subheading">

157

<v-flex xs4 class="pt-4 subheading">

158

158

159

</v-flex>

159

</v-flex>

160

<v-flex xs8 class="ml-3">

160

<v-flex xs8 class="ml-3">

161

<v-text-field

161

<v-text-field

162

v-model="editedItem.name"

162

v-model="editedItem.name"

163

placeholder="fill your full Name"

163

placeholder="fill your full Name"

164

name="name"

164

name="name"

165

type="text"

165

type="text"

166

required

166

required

167

></v-text-field>

167

></v-text-field>

168

</v-flex>

168

</v-flex>

169

</v-layout>

169

</v-layout>

170

</v-flex>

170

</v-flex>

171

</v-layout>

171

</v-layout>

172

<v-layout>

172

<v-layout>

173

<v-flex xs12 sm4>

173

<v-flex xs12 sm4>

174

<v-layout>

174

<v-layout>

175

<v-flex xs4 class="pt-4 subheading">

175

<v-flex xs4 class="pt-4 subheading">

176

<label class="right">Email ID:</label>

176

<label class="right">Email ID:</label>

177

</v-flex>

177

</v-flex>

178

<v-flex xs8 class="ml-3">

178

<v-flex xs8 class="ml-3">

179

<v-text-field

179

<v-text-field

180

placeholder="fill your email"

180

placeholder="fill your email"

181

v-model="editedItem.email"

181

v-model="editedItem.email"

182

type="text"

182

type="text"

183

name="email"

183

name="email"

184

required

184

required

185

></v-text-field>

185

></v-text-field>

186

</v-flex>

186

</v-flex>

187

</v-layout>

187

</v-layout>

188

</v-flex>

188

</v-flex>

189

<v-flex xs12 sm4>

189

<v-flex xs12 sm4>

190

<v-layout>

190

<v-layout>

191

<v-flex xs4 class="pt-4 subheading">

191

<v-flex xs4 class="pt-4 subheading">

192

<label class="right">Date of Birth:</label>

192

<label class="right">Date of Birth:</label>

193

</v-flex>

193

</v-flex>

194

<v-flex xs8 class="ml-3">

194

<v-flex xs8 class="ml-3">

195

<v-menu

195

<v-menu

196

ref="menu"

196

ref="menu"

197

:close-on-content-click="false"

197

:close-on-content-click="false"

198

v-model="menu1"

198

v-model="menu1"

199

:nudge-right="40"

199

:nudge-right="40"

200

lazy

200

lazy

201

transition="scale-transition"

201

transition="scale-transition"

202

offset-y

202

offset-y

203

full-width

203

full-width

204

min-width="290px"

204

min-width="290px"

205

>

205

>

206

<v-text-field

206

<v-text-field

207

slot="activator"

207

slot="activator"

208

v-model="editedItem.dob"

208

v-model="editedItem.dob"

209

placeholder="Select Dob"

209

placeholder="Select Dob"

210

></v-text-field>

210

></v-text-field>

211

<v-date-picker

211

<v-date-picker

212

ref="picker"

212

ref="picker"

213

v-model="editedItem.dob"

213

v-model="editedItem.dob"

214

:max="new Date().toISOString().substr(0, 10)"

214

:max="new Date().toISOString().substr(0, 10)"

215

min="1950-01-01"

215

min="1950-01-01"

216

@input="menu1 = false"

216

@input="menu1 = false"

217

></v-date-picker>

217

></v-date-picker>

218

</v-menu>

218

</v-menu>

219

</v-flex>

219

</v-flex>

220

</v-layout>

220

</v-layout>

221

</v-flex>

221

</v-flex>

222

<v-flex xs12 sm4>

222

<v-flex xs12 sm4>

223

<v-layout>

223

<v-layout>

224

<v-flex xs4 class="pt-4 subheading">

224

<v-flex xs4 class="pt-4 subheading">

225

225

226

</v-flex>

226

</v-flex>

227

<v-flex xs8 class="ml-3">

227

<v-flex xs8 class="ml-3">

228

<v-text-field

228

<v-text-field

229

v-model="editedItem.city"

229

v-model="editedItem.city"

230

placeholder="fill your City Name"

230

placeholder="fill your City Name"

231

name="City"

231

name="City"

232

type="text"

232

type="text"

233

required

233

required

234

></v-text-field>

234

></v-text-field>

235

</v-flex>

235

</v-flex>

236

</v-layout>

236

</v-layout>

237

</v-flex>

237

</v-flex>

238

</v-layout>

238

</v-layout>

239

<v-layout>

239

<v-layout>

240

<v-flex xs12 sm4>

240

<v-flex xs12 sm4>

241

<v-layout>

241

<v-layout>

242

<v-flex xs4 class="pt-4 subheading">

242

<v-flex xs4 class="pt-4 subheading">

243

<label class="right">Blood Group:</label>

243

<label class="right">Blood Group:</label>

244

</v-flex>

244

</v-flex>

245

<v-flex xs8 class="ml-3">

245

<v-flex xs8 class="ml-3">

246

<v-text-field

246

<v-text-field

247

v-model="editedItem.bloodGroup"

247

v-model="editedItem.bloodGroup"

248

placeholder="fill your BloodGroup"

248

placeholder="fill your BloodGroup"

249

name="state"

249

name="state"

250

type="text"

250

type="text"

251

required

251

required

252

></v-text-field>

252

></v-text-field>

253

</v-flex>

253

</v-flex>

254

</v-layout>

254

</v-layout>

255

</v-flex>

255

</v-flex>

256

<v-flex xs12 sm4>

256

<v-flex xs12 sm4>

257

<v-layout>

257

<v-layout>

258

<v-flex xs4 class="pt-4 subheading">

258

<v-flex xs4 class="pt-4 subheading">

259

<label class="right">Allergies:</label>

259

<label class="right">Allergies:</label>

260

</v-flex>

260

</v-flex>

261

<v-flex xs8 class="ml-3">

261

<v-flex xs8 class="ml-3">

262

<v-text-field

262

<v-text-field

263

v-model="editedItem.allergies"

263

v-model="editedItem.allergies"

264

placeholder="fill your Allergies"

264

placeholder="fill your Allergies"

265

name="pincode"

265

name="pincode"

266

required

266

required

267

></v-text-field>

267

></v-text-field>

268

</v-flex>

268

</v-flex>

269

</v-layout>

269

</v-layout>

270

</v-flex>

270

</v-flex>

271

<v-flex xs12 sm4>

271

<v-flex xs12 sm4>

272

<v-layout>

272

<v-layout>

273

<v-flex xs4 class="pt-4 subheading">

273

<v-flex xs4 class="pt-4 subheading">

274

<label class="right">Medical Notes:</label>

274

<label class="right">Medical Notes:</label>

275

</v-flex>

275

</v-flex>

276

<v-flex xs8 class="ml-3">

276

<v-flex xs8 class="ml-3">

277

<v-text-field

277

<v-text-field

278

v-model="editedItem.medicalNotes"

278

v-model="editedItem.medicalNotes"

279

placeholder="fill your medicalNotes"

279

placeholder="fill your medicalNotes"

280

name="mobileNo"

280

name="mobileNo"

281

required

281

required

282

></v-text-field>

282

></v-text-field>

283

</v-flex>

283

</v-flex>

284

</v-layout>

284

</v-layout>

285

</v-flex>

285

</v-flex>

286

</v-layout>

286

</v-layout>

287

<v-layout>

287

<v-layout>

288

<v-flex xs12 sm4>

288

<v-flex xs12 sm4>

289

<v-layout>

289

<v-layout>

290

<v-flex xs4 class="pt-4 subheading">

290

<v-flex xs4 class="pt-4 subheading">

291

<label class="right">Height:</label>

291

<label class="right">Height:</label>

292

</v-flex>

292

</v-flex>

293

<v-flex xs8 class="ml-3">

293

<v-flex xs8 class="ml-3">

294

<v-text-field

294

<v-text-field

295

v-model="editedItem.height"

295

v-model="editedItem.height"

296

placeholder="fill your Height"

296

placeholder="fill your Height"

297

name="state"

297

name="state"

298

type="text"

298

type="text"

299

required

299

required

300

></v-text-field>

300

></v-text-field>

301

</v-flex>

301

</v-flex>

302

</v-layout>

302

</v-layout>

303

</v-flex>

303

</v-flex>

304

<v-flex xs12 sm4>

304

<v-flex xs12 sm4>

305

<v-layout>

305

<v-layout>

306

<v-flex xs4 class="pt-4 subheading">

306

<v-flex xs4 class="pt-4 subheading">

307

<label class="right">Weight:</label>

307

<label class="right">Weight:</label>

308

</v-flex>

308

</v-flex>

309

<v-flex xs8 class="ml-3">

309

<v-flex xs8 class="ml-3">

310

<v-text-field

310

<v-text-field

311

v-model="editedItem.weight"

311

v-model="editedItem.weight"

312

placeholder="fill your Weight"

312

placeholder="fill your Weight"

313

name="pincode"

313

name="pincode"

314

required

314

required

315

></v-text-field>

315

></v-text-field>

316

</v-flex>

316

</v-flex>

317

</v-layout>

317

</v-layout>

318

</v-flex>

318

</v-flex>

319

<v-flex xs12 sm4>

319

<v-flex xs12 sm4>

320

<v-layout>

320

<v-layout>

321

<v-flex xs4 class="pt-4 subheading">

321

<v-flex xs4 class="pt-4 subheading">

322

<label class="right">Uplaod Image:</label>

322

<label class="right">Uplaod Image:</label>

323

</v-flex>

323

</v-flex>

324

<v-flex xs8 class="ml-3">

324

<v-flex xs8 class="ml-3">

325

<v-text-field

325

<v-text-field

326

label="Select Image"

326

label="Select Image"

327

@click="pickFile"

327

@click="pickFile"

328

v-model="imageName"

328

v-model="imageName"

329

append-icon="attach_file"

329

append-icon="attach_file"

330

></v-text-field>

330

></v-text-field>

331

</v-flex>

331

</v-flex>

332

</v-layout>

332

</v-layout>

333

</v-flex>

333

</v-flex>

334

</v-layout>

334

</v-layout>

335

<v-layout>

335

<v-layout>

336

<v-flex xs12 sm4>

336

<v-flex xs12 sm4>

337

<v-layout>

337

<v-layout>

338

<v-flex xs4 class="pt-4 subheading">

338

<v-flex xs4 class="pt-4 subheading">

339

<label class="right">State:</label>

339

<label class="right">State:</label>

340

</v-flex>

340

</v-flex>

341

<v-flex xs8 class="ml-3">

341

<v-flex xs8 class="ml-3">

342

<v-text-field

342

<v-text-field

343

v-model="editedItem.state"

343

v-model="editedItem.state"

344

placeholder="fill your State Name"

344

placeholder="fill your State Name"

345

name="state"

345

name="state"

346

type="text"

346

type="text"

347

required

347

required

348

></v-text-field>

348

></v-text-field>

349

</v-flex>

349

</v-flex>

350

</v-layout>

350

</v-layout>

351

</v-flex>

351

</v-flex>

352

<v-flex xs12 sm4>

352

<v-flex xs12 sm4>

353

<v-layout>

353

<v-layout>

354

<v-flex xs4 class="pt-4 subheading">

354

<v-flex xs4 class="pt-4 subheading">

355

<label class="right">Pincode:</label>

355

<label class="right">Pincode:</label>

356

</v-flex>

356

</v-flex>

357

<v-flex xs8 class="ml-3">

357

<v-flex xs8 class="ml-3">

358

<v-text-field

358

<v-text-field

359

v-model="editedItem.pincode"

359

v-model="editedItem.pincode"

360

placeholder="fill your pincode"

360

placeholder="fill your pincode"

361

name="pincode"

361

name="pincode"

362

type="number"

362

type="number"

363

required

363

required

364

></v-text-field>

364

></v-text-field>

365

</v-flex>

365

</v-flex>

366

</v-layout>

366

</v-layout>

367

</v-flex>

367

</v-flex>

368

<v-flex xs12 sm4>

368

<v-flex xs12 sm4>

369

<v-layout>

369

<v-layout>

370

<v-flex xs4 class="pt-4 subheading">

370

<v-flex xs4 class="pt-4 subheading">

371

<label class="right">Mobile No:</label>

371

<label class="right">Mobile No:</label>

372

</v-flex>

372

</v-flex>

373

<v-flex xs8 class="ml-3">

373

<v-flex xs8 class="ml-3">

374

<v-text-field

374

<v-text-field

375

v-model="editedItem.mobile"

375

v-model="editedItem.mobile"

376

placeholder="fill your MobileNo"

376

placeholder="fill your MobileNo"

377

name="mobileNo"

377

name="mobileNo"

378

type="number"

378

type="number"

379

required

379

required

380

></v-text-field>

380

></v-text-field>

381

</v-flex>

381

</v-flex>

382

</v-layout>

382

</v-layout>

383

</v-flex>

383

</v-flex>

384

</v-layout>

384

</v-layout>

385

<v-layout>

385

<v-layout>

386

<v-flex xs12 sm4>

386

<v-flex xs12 sm4>

387

<v-layout>

387

<v-layout>

388

<v-flex xs4 class="pt-4 subheading">

388

<v-flex xs4 class="pt-4 subheading">

389

<label class="right">Select Country:</label>

389

<label class="right">Select Country:</label>

390

</v-flex>

390

</v-flex>

391

<v-flex xs8 class="ml-3">

391

<v-flex xs8 class="ml-3">

392

<v-autocomplete

392

<v-autocomplete

393

v-model="editedItem.country"

393

v-model="editedItem.country"

394

:items="countries"

394

:items="countries"

395

placeholder="Select Country Name"

395

placeholder="Select Country Name"

396

required

396

required

397

></v-autocomplete>

397

></v-autocomplete>

398

</v-flex>

398

</v-flex>

399

</v-layout>

399

</v-layout>

400

</v-flex>

400

</v-flex>

401

<v-flex xs12 sm4>

401

<v-flex xs12 sm4>

402

<v-layout>

402

<v-layout>

403

<v-flex xs4 class="pt-4 subheading">

403

<v-flex xs4 class="pt-4 subheading">

404

<label class="right">Gender:</label>

404

<label class="right">Gender:</label>

405

</v-flex>

405

</v-flex>

406

<v-flex xs8 class="ml-3">

406

<v-flex xs8 class="ml-3">

407

<v-select

407

<v-select

408

:items="gender"

408

:items="gender"

409

v-model="editedItem.gender"

409

v-model="editedItem.gender"

410

placeholder="Select Gender"

410

placeholder="Select Gender"

411

required

411

required

412

></v-select>

412

></v-select>

413

</v-flex>

413

</v-flex>

414

</v-layout>

414

</v-layout>

415

</v-flex>

415

</v-flex>

416

<v-flex xs12 sm4>

417

<v-layout>

418

<v-flex xs4 class="pt-4 subheading">

419

<label class="right">Roll Number:</label>

420

</v-flex>

421

<v-flex xs8 class="ml-3">

422

<v-text-field

423

:items="gender"

424

v-model="editedItem.rollNo"

425

placeholder="fill roll number"

426

required

427

></v-text-field>

428

</v-flex>

429

</v-layout>

430

</v-flex>

416

</v-layout>

431

</v-layout>

417

<v-layout>

432

<v-layout>

418

<v-flex xs12>

433

<v-flex xs12>

419

<v-layout>

434

<v-layout>

420

<v-flex

435

<v-flex

421

xs1

436

xs1

422

class="pt-4 subheading"

437

class="pt-4 subheading"

423

style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"

438

style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"

424

>

439

>

425

<label class="right">Present Address:</label>

440

<label class="right">Present Address:</label>

426

</v-flex>

441

</v-flex>

427

<v-flex xs11 class="ml-2">

442

<v-flex xs11 class="ml-2">

428

<v-text-field

443

<v-text-field

429

v-model="editedItem.presentAddress"

444

v-model="editedItem.presentAddress"

430

placeholder="fill Your present Address"

445

placeholder="fill Your present Address"

431

required

446

required

432

></v-text-field>

447

></v-text-field>

433

</v-flex>

448

</v-flex>

434

</v-layout>

449

</v-layout>

435

</v-flex>

450

</v-flex>

436

</v-layout>

451

</v-layout>

437

<v-layout>

452

<v-layout>

438

<v-flex xs12>

453

<v-flex xs12>

439

<v-layout>

454

<v-layout>

440

<v-flex

455

<v-flex

441

xs1

456

xs1

442

class="pt-4 subheading"

457

class="pt-4 subheading"

443

style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"

458

style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"

444

>

459

>

445

<label class="right">Permanent Address:</label>

460

<label class="right">Permanent Address:</label>

446

</v-flex>

461

</v-flex>

447

<v-flex xs11 class="ml-2">

462

<v-flex xs11 class="ml-2">

448

<v-textarea

463

<v-textarea

449

rows="1"

464

rows="1"

450

v-model="editedItem.permanentAddress"

465

v-model="editedItem.permanentAddress"

451

placeholder="fill Your Permanent Address"

466

placeholder="fill Your Permanent Address"

452

required

467

required

453

></v-textarea>

468

></v-textarea>

454

</v-flex>

469

</v-flex>

455

</v-layout>

470

</v-layout>

456

</v-flex>

471

</v-flex>

457

</v-layout>

472

</v-layout>

458

<v-layout>

473

<v-layout>

459

<v-flex xs12 sm12>

474

<v-flex xs12 sm12>

460

<v-card-actions>

475

<v-card-actions>

461

<v-btn round dark @click.native="close">Cancel</v-btn>

476

<v-btn round dark @click.native="close">Cancel</v-btn>

462

<v-spacer></v-spacer>

477

<v-spacer></v-spacer>

463

<v-btn round dark @click="save">Save</v-btn>

478

<v-btn round dark @click="save">Save</v-btn>

464

</v-card-actions>

479

</v-card-actions>

465

</v-flex>

480

</v-flex>

466

</v-layout>

481

</v-layout>

467

</v-container>

482

</v-container>

468

</v-form>

483

</v-form>

469

</v-card-text>

484

</v-card-text>

470

</v-card>

485

</v-card>

471

</v-dialog>

486

</v-dialog>

472

487

473

488

474

489

475

<v-dialog v-model="dialog1" max-width="1100px" scrollable>

490

<v-dialog v-model="dialog1" max-width="1100px" scrollable>

476

<v-card style="height: 700px;">

491

<v-card style="height: 700px;">

477

<v-toolbar color="grey lighten-2" flat>

492

<v-toolbar color="grey lighten-2" flat>

478

<v-spacer></v-spacer>

493

<v-spacer></v-spacer>

479

<v-toolbar-title>Student Profile</v-toolbar-title>

494

<v-toolbar-title>Student Profile</v-toolbar-title>

480

<v-spacer></v-spacer>

495

<v-spacer></v-spacer>

481

<v-icon @click="close1">close</v-icon>

496

<v-icon @click="close1">close</v-icon>

482

</v-toolbar>

497

</v-toolbar>

483

<v-card-text>

498

<v-card-text>

484

<v-flex align-center justify-center layout text-xs-center class="mt-3">

499

<v-flex align-center justify-center layout text-xs-center class="mt-3">

485

<v-avatar size="160px">

500

<v-avatar size="160px">

486

501

487

502

488

</v-avatar>

503

</v-avatar>

489

</v-flex>

504

</v-flex>

490

<v-container grid-list-md>

505

<v-container grid-list-md>

491

<v-layout wrap>

506

<v-layout wrap>

492

<v-flex>

507

<v-flex>

493

<v-layout>

508

<v-layout>

494

<v-flex xs12 sm6>

509

<v-flex xs12 sm6>

495

<v-layout>

510

<v-layout>

496

<v-flex xs6 sm5>

511

<v-flex xs6 sm5>

497

512

498

513

499

</h5>

514

</h5>

500

</v-flex>

515

</v-flex>

501

<v-flex sm7 xs6>

516

<v-flex sm7 xs6>

502

<h5 class="my-1 left">{{ editedItem.name }}</h5>

517

<h5 class="my-1 left">{{ editedItem.name }}</h5>

503

</v-flex>

518

</v-flex>

504

</v-layout>

519

</v-layout>

505

</v-flex>

520

</v-flex>

506

<v-flex xs12 sm6>

521

<v-flex xs12 sm6>

507

<v-layout>

522

<v-layout>

508

<v-flex xs4 sm4>

523

<v-flex xs4 sm4>

509

524

510

<b>Email:</b>

525

<b>Email:</b>

511

</h5>

526

</h5>

512

</v-flex>

527

</v-flex>

513

<v-flex sm8 xs8>

528

<v-flex sm8 xs8>

514

<h5 class="my-1 left">{{ editedItem.email }}</h5>

529

<h5 class="my-1 left">{{ editedItem.email }}</h5>

515

</v-flex>

530

</v-flex>

516

</v-layout>

531

</v-layout>

517

</v-flex>

532

</v-flex>

518

</v-layout>

533

</v-layout>

519

<v-layout>

534

<v-layout>

520

<v-flex xs6 sm6>

535

<v-flex xs6 sm6>

521

<v-layout>

536

<v-layout>

522

<v-flex xs4 sm5>

537

<v-flex xs4 sm5>

523

<b>

538

<b>

524

539

525

<b>Gender:</b>

540

<b>Gender:</b>

526

</h5>

541

</h5>

527

</b>

542

</b>

528

</v-flex>

543

</v-flex>

529

<v-flex sm7 xs8>

544

<v-flex sm7 xs8>

530

<h5 class="my-1 left">{{ editedItem.gender }}</h5>

545

<h5 class="my-1 left">{{ editedItem.gender }}</h5>

531

</v-flex>

546

</v-flex>

532

</v-layout>

547

</v-layout>

533

</v-flex>

548

</v-flex>

534

<v-flex xs6 sm6>

549

<v-flex xs6 sm6>

535

<v-layout>

550

<v-layout>

536

<v-flex xs4 sm4>

551

<v-flex xs4 sm4>

537

<b>

552

<b>

538

553

539

554

540

</h5>

555

</h5>

541

</b>

556

</b>

542

</v-flex>

557

</v-flex>

543

<v-flex sm7 xs8>

558

<v-flex sm7 xs8>

544

<h5 class="my-1">{{ dates(editedItem.dob) }}</h5>

559

<h5 class="my-1">{{ dates(editedItem.dob) }}</h5>

545

</v-flex>

560

</v-flex>

546

</v-layout>

561

</v-layout>

547

</v-flex>

562

</v-flex>

548

</v-layout>

563

</v-layout>

549

<v-layout>

564

<v-layout>

550

<v-flex xs6 sm6>

565

<v-flex xs6 sm6>

551

<v-layout>

566

<v-layout>

552

<v-flex xs4 sm5>

567

<v-flex xs4 sm5>

553

<b>

568

<b>

554

569

555

<b>Blood Group:</b>

570

<b>Blood Group:</b>

556

</h5>

571

</h5>

557

</b>

572

</b>

558

</v-flex>

573

</v-flex>

559

<v-flex sm7 xs8>

574

<v-flex sm7 xs8>

560

<h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>

575

<h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>

561

</v-flex>

576

</v-flex>

562

</v-layout>

577

</v-layout>

563

</v-flex>

578

</v-flex>

564

<v-flex xs6 sm6>

579

<v-flex xs6 sm6>

565

<v-layout>

580

<v-layout>

566

<v-flex xs4 sm4>

581

<v-flex xs4 sm4>

567

<b>

582

<b>

568

583

569

<b>Allergies:</b>

584

<b>Allergies:</b>

570

</h5>

585

</h5>

571

</b>

586

</b>

572

</v-flex>

587

</v-flex>

573

<v-flex sm8 xs8>

588

<v-flex sm8 xs8>

574

<h5 class="my-1">{{ editedItem.allergies }}</h5>

589

<h5 class="my-1">{{ editedItem.allergies }}</h5>

575

</v-flex>

590

</v-flex>

576

</v-layout>

591

</v-layout>

577

</v-flex>

592

</v-flex>

578

</v-layout>

593

</v-layout>

579

<v-layout>

594

<v-layout>

580

<v-flex xs6 sm6>

595

<v-flex xs6 sm6>

581

<v-layout>

596

<v-layout>

582

<v-flex xs4 sm5>

597

<v-flex xs4 sm5>

583

<b>

598

<b>

584

599

585

<b>Height:</b>

600

<b>Height:</b>

586

</h5>

601

</h5>

587

</b>

602

</b>

588

</v-flex>

603

</v-flex>

589

<v-flex sm7 xs8>

604

<v-flex sm7 xs8>

590

<h5 class="my-1 left">{{ editedItem.height }}</h5>

605

<h5 class="my-1 left">{{ editedItem.height }}</h5>

591

</v-flex>

606

</v-flex>

592

</v-layout>

607

</v-layout>

593

</v-flex>

608

</v-flex>

594

<v-flex xs6 sm6>

609

<v-flex xs6 sm6>

595

<v-layout>

610

<v-layout>

596

<v-flex xs4 sm4>

611

<v-flex xs4 sm4>

597

<b>

612

<b>

598

613

599

<b>Weight:</b>

614

<b>Weight:</b>

600

</h5>

615

</h5>

601

</b>

616

</b>

602

</v-flex>

617

</v-flex>

603

<v-flex sm8 xs8>

618

<v-flex sm8 xs8>

604

<h5 class="my-1">{{ editedItem.weight }}</h5>

619

<h5 class="my-1">{{ editedItem.weight }}</h5>

605

</v-flex>

620

</v-flex>

606

</v-layout>

621

</v-layout>

607

</v-flex>

622

</v-flex>

608

</v-layout>

623

</v-layout>

609

<v-layout>

624

<v-layout>

610

<v-flex xs6 sm6>

625

<v-flex xs6 sm6>

611

<v-layout>

626

<v-layout>

612

<v-flex xs4 sm5>

627

<v-flex xs4 sm5>

613

<b>

628

<b>

614

629

615

630

616

</h5>

631

</h5>

617

</b>

632

</b>

618

</v-flex>

633

</v-flex>

619

<v-flex sm7 xs8>

634

<v-flex sm7 xs8>

620

<h5 class="my-1 left">{{ editedItem.city }}</h5>

635

<h5 class="my-1 left">{{ editedItem.city }}</h5>

621

</v-flex>

636

</v-flex>

622

</v-layout>

637

</v-layout>

623

</v-flex>

638

</v-flex>

624

<v-flex xs6 sm6>

639

<v-flex xs6 sm6>

625

<v-layout>

640

<v-layout>

626

<v-flex xs4 sm4>

641

<v-flex xs4 sm4>

627

<b>

642

<b>

628

643

629

<b>State:</b>

644

<b>State:</b>

630

</h5>

645

</h5>

631

</b>

646

</b>

632

</v-flex>

647

</v-flex>

633

<v-flex sm8 xs8>

648

<v-flex sm8 xs8>

634

<h5 class="my-1">{{ editedItem.state }}</h5>

649

<h5 class="my-1">{{ editedItem.state }}</h5>

635

</v-flex>

650

</v-flex>

636

</v-layout>

651

</v-layout>

637

</v-flex>

652

</v-flex>

638

</v-layout>

653

</v-layout>

639

<v-layout>

654

<v-layout>

640

<v-flex xs6 sm6>

655

<v-flex xs6 sm6>

641

<v-layout>

656

<v-layout>

642

<v-flex xs4 sm5>

657

<v-flex xs4 sm5>

643

<b>

658

<b>

644

659

645

<b>Pincode:</b>

660

<b>Pincode:</b>

646

</h5>

661

</h5>

647

</b>

662

</b>

648

</v-flex>

663

</v-flex>

649

<v-flex sm7 xs8>

664

<v-flex sm7 xs8>

650

<h5 class="my-1">{{ editedItem.pincode }}</h5>

665

<h5 class="my-1">{{ editedItem.pincode }}</h5>

651

</v-flex>

666

</v-flex>

652

</v-layout>

667

</v-layout>

653

</v-flex>

668

</v-flex>

654

<v-flex xs5 sm5>

669

<v-flex xs5 sm5>

655

<v-layout>

670

<v-layout>

656

<v-flex xs4 sm5>

671

<v-flex xs4 sm5>

657

<b>

672

<b>

658

673

659

<b>Country:</b>

674

<b>Country:</b>

660

</h5>

675

</h5>

661

</b>

676

</b>

662

</v-flex>

677

</v-flex>

663

<v-flex sm7 xs8>

678

<v-flex sm7 xs8>

664

<h5 class="my-1">{{ editedItem.country }}</h5>

679

<h5 class="my-1">{{ editedItem.country }}</h5>

665

</v-flex>

680

</v-flex>

666

</v-layout>

681

</v-layout>

667

</v-flex>

682

</v-flex>

668

</v-layout>

683

</v-layout>

669

<v-layout>

684

<v-layout>

670

<v-flex xs5 sm6>

685

<v-flex xs5 sm6>

671

<v-layout>

686

<v-layout>

672

<v-flex sm5 xs8>

687

<v-flex sm5 xs8>

673

<b>

688

<b>

674

689

675

<b>Mobile No:</b>

690

<b>Mobile No:</b>

676

</h5>

691

</h5>

677

</b>

692

</b>

678

</v-flex>

693

</v-flex>

679

<v-flex sm6 xs8>

694

<v-flex sm6 xs8>

680

<h5 class="my-1">{{ editedItem.mobile }}</h5>

695

<h5 class="my-1">{{ editedItem.mobile }}</h5>

681

</v-flex>

696

</v-flex>

682

</v-layout>

697

</v-layout>

683

</v-flex>

698

</v-flex>

684

<v-flex xs5 sm6>

699

<v-flex xs5 sm6>

685

<v-layout>

700

<v-layout>

686

<v-flex xs5 sm4>

701

<v-flex xs5 sm4>

687

<b>

702

<b>

688

703

689

<b>Fahter Name:</b>

704

<b>Fahter Name:</b>

690

</h5>

705

</h5>

691

</b>

706

</b>

692

</v-flex>

707

</v-flex>

693

<v-flex sm8 xs8>

708

<v-flex sm8 xs8>

694

<h5 class="my-1">{{ editedItem.fatherName }}</h5>

709

<h5 class="my-1">{{ editedItem.fatherName }}</h5>

695

</v-flex>

710

</v-flex>

696

</v-layout>

711

</v-layout>

697

</v-flex>

712

</v-flex>

698

</v-layout>

713

</v-layout>

699

<v-layout>

714

<v-layout>

700

<v-flex xs6 sm5>

715

<v-flex xs6 sm5>

701

<v-layout>

716

<v-layout>

702

<v-flex xs4 sm6>

717

<v-flex xs4 sm6>

703

<b>

718

<b>

704

719

705

<b>Mother Name:</b>

720

<b>Mother Name:</b>

706

</h5>

721

</h5>

707

</b>

722

</b>

708

</v-flex>

723

</v-flex>

709

<v-flex sm6 xs8>

724

<v-flex sm6 xs8>

710

<h5 class="my-1">{{ editedItem.motherName }}</h5>

725

<h5 class="my-1">{{ editedItem.motherName }}</h5>

711

</v-flex>

726

</v-flex>

712

</v-layout>

727

</v-layout>

713

</v-flex>

728

</v-flex>

714

<v-flex xs6 sm6>

729

<v-flex xs6 sm6>

715

<v-layout>

730

<v-layout>

716

<v-flex xs4 sm6>

731

<v-flex xs4 sm6>

717

<b>

732

<b>

718

733

719

<b>Father Cell No:</b>

734

<b>Father Cell No:</b>

720

</h5>

735

</h5>

721

</b>

736

</b>

722

</v-flex>

737

</v-flex>

723

<v-flex sm6 xs8>

738

<v-flex sm6 xs8>

724

<h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>

739

<h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>

725

</v-flex>

740

</v-flex>

726

</v-layout>

741

</v-layout>

727

</v-flex>

742

</v-flex>

728

</v-layout>

743

</v-layout>

729

<v-layout>

744

<v-layout>

730

<v-flex xs6 sm5>

745

<v-flex xs6 sm5>

731

<v-layout>

746

<v-layout>

732

<v-flex xs4 sm6>

747

<v-flex xs4 sm6>

733

<b>

748

<b>

734

749

735

<b>Mother Cell No:</b>

750

<b>Mother Cell No:</b>

736

</h5>

751

</h5>

737

</b>

752

</b>

738

</v-flex>

753

</v-flex>

739

<v-flex sm6 xs8>

754

<v-flex sm6 xs8>

740

<h5 class="my-1">{{ editedItem.motherCellNo }}</h5>

755

<h5 class="my-1">{{ editedItem.motherCellNo }}</h5>

741

</v-flex>

756

</v-flex>

742

</v-layout>

757

</v-layout>

743

</v-flex>

758

</v-flex>

744

<v-flex xs6 sm6>

759

<v-flex xs6 sm6>

745

<v-layout>

760

<v-layout>

746

<v-flex xs5 sm6>

761

<v-flex xs5 sm6>

747

<b>

762

<b>

748

763

749

<b>Academic Year:</b>

764

<b>Academic Year:</b>

750

</h5>

765

</h5>

751

</b>

766

</b>

752

</v-flex>

767

</v-flex>

753

<v-flex sm5 xs8>

768

<v-flex sm5 xs8>

754

<h5 class="my-1">{{ editedItem.establishmentYear }}</h5>

769

<h5 class="my-1">{{ editedItem.establishmentYear }}</h5>

755

</v-flex>

770

</v-flex>

756

</v-layout>

771

</v-layout>

757

</v-flex>

772

</v-flex>

758

</v-layout>

773

</v-layout>

759

<v-layout>

774

<v-layout>

760

<v-flex xs6 sm5>

775

<v-flex xs6 sm5>

761

<v-layout>

776

<v-layout>

762

<v-flex xs5 sm6>

777

<v-flex xs5 sm6>

763

<b>

778

<b>

764

779

765

<b>Medical Notes:</b>

780

<b>Medical Notes:</b>

766

</h5>

781

</h5>

767

</b>

782

</b>

768

</v-flex>

783

</v-flex>

769

<v-flex sm5 xs8>

784

<v-flex sm5 xs8>

770

<h5 class="my-1">{{ editedItem.medicalNotes }}</h5>

785

<h5 class="my-1">{{ editedItem.medicalNotes }}</h5>

771

</v-flex>

786

</v-flex>

772

</v-layout>

787

</v-layout>

773

</v-flex>

788

</v-flex>

774

<v-flex xs12 sm6>

789

<v-flex xs12 sm6>

775

<v-layout>

790

<v-layout>

776

<v-flex xs6 sm6>

791

<v-flex xs6 sm6>

777

<b>

792

<b>

778

793

779

<b>present Address:</b>

794

<b>Roll Number:</b>

780

</h5>

795

</h5>

781

</b>

796

</b>

782

</v-flex>

797

</v-flex>

783

<v-flex sm6 xs8>

798

<v-flex sm6 xs8>

784

<h5 class="my-1">{{ editedItem.presentAddress }}</h5>

799

<h5 class="my-1">{{ editedItem.rollNo }}</h5>

785

</v-flex>

800

</v-flex>

786

</v-layout>

801

</v-layout>

787

</v-flex>

802

</v-flex>

788

</v-layout>

803

</v-layout>

789

<v-layout>

804

<v-layout>

790

<v-flex xs12 sm12>

805

<v-flex xs6 sm5>

806

<v-layout>

807

<v-flex xs5 sm6>

808

<b>

809

810

<b>present Address:</b>

811

</h5>

812

</b>

813

</v-flex>

814

<v-flex sm5 xs8>

815

<h5 class="my-1">{{ editedItem.presentAddress }}</h5>

816

</v-flex>

817

</v-layout>

818

</v-flex>

819

<v-flex xs12 sm6>

820

<v-layout>

821

<v-flex xs6 sm6>

822

<b>

823

824

<b>present Address:</b>

825

</h5>

826

</b>

827

</v-flex>

828

<v-flex sm6 xs8>

829

<h5 class="my-1">{{ editedItem.permanentAddress }}</h5>

830

</v-flex>

831

</v-layout>

832

</v-flex>

833

<!-- <v-flex xs12 sm12>

791

<v-layout>

834

<v-layout>

792

<v-flex xs4 sm3>

835

<v-flex xs4 sm3>

793

<b>

836

<b>

794

837

795

<b>Permanent Address:</b>

838

<b>Permanent Address:</b>

796

</h5>

839

</h5>

797

</b>

840

</b>

798

</v-flex>

841

</v-flex>

799

<v-flex sm9 xs8>

842

<v-flex sm9 xs8>

800

<h5 class="my-1">{{ editedItem.permanentAddress }}</h5>

843

<h5 class="my-1">{{ editedItem.permanentAddress }}</h5>

801

</v-flex>

844

</v-flex>

802

</v-layout>

845

</v-layout>

803

</v-flex>

846

</v-flex>-->

804

</v-layout>

847

</v-layout>

805

</v-flex>

848

</v-flex>

806

</v-layout>

849

</v-layout>

807

</v-container>

850

</v-container>

808

</v-card-text>

851

</v-card-text>

809

</v-card>

852

</v-card>

810

</v-dialog>

853

</v-dialog>

811

854

812

<v-snackbar

855

<v-snackbar

813

:timeout="timeout"

856

:timeout="timeout"

814

:top="y === 'top'"

857

:top="y === 'top'"

815

:right="x === 'right'"

858

:right="x === 'right'"

816

:vertical="mode === 'vertical'"

859

:vertical="mode === 'vertical'"

817

v-model="snackbar"

860

v-model="snackbar"

818

color="success"

861

color="success"

819

>{{ text }}</v-snackbar>

862

>{{ text }}</v-snackbar>

820

863

821

864

822

<v-card flat>

865

<v-card flat>

823

<v-card-actions>

866

<v-card-actions>

824

<v-layout>

867

<v-layout>

825

<label class="right mt-4 ml-5">Select Class:</label>

868

<label class="right mt-4 ml-5">Select Class:</label>

826

<v-select

869

<v-select

827

:items="addclass"

870

:items="addclass"

828

label="Select Class"

871

label="Select Class"

829

v-model="selectStudents.select"

872

v-model="selectStudents.select"

830

item-text="classNum"

873

item-text="classNum"

831

item-value="_id"

874

item-value="_id"

832

name="Select Class"

875

name="Select Class"

833

:rules="classRules"

876

:rules="classRules"

834

@change="getSections(selectStudents.select)"

877

@change="getSections(selectStudents.select)"

835

class="px-4"

878

class="px-4"

836

required

879

required

837

></v-select>

880

></v-select>

838

<label class="right mt-4">Select Section:</label>

881

<label class="right mt-4">Select Section:</label>

839

<v-select

882

<v-select

840

:items="addSection"

883

:items="addSection"

841

label="Select Section"

884

label="Select Section"

842

v-model="selectStudents.selectSection"

885

v-model="selectStudents.selectSection"

843

item-text="name"

886

item-text="name"

844

item-value="_id"

887

item-value="_id"

845

name="Select Section"

888

name="Select Section"

846

:rules="sectionRules"

889

:rules="sectionRules"

847

class="pl-3"

890

class="pl-3"

848

required

891

required

849

></v-select>

892

></v-select>

850

</v-layout>

893

</v-layout>

851

<v-spacer></v-spacer>

894

<v-spacer></v-spacer>

852

<v-btn @click="findStudents()" round dark :loading="loading" class="left">Find</v-btn>

895

<v-btn @click="findStudents()" round dark :loading="loading" class="left">Find</v-btn>

853

</v-card-actions>

896

</v-card-actions>

854

</v-card>

897

</v-card>

855

<v-data-table

898

<v-data-table

856

:headers="headers"

899

:headers="headers"

857

:items="desserts"

900

:items="desserts"

858

:pagination.sync="pagination"

901

:pagination.sync="pagination"

859

:search="search"

902

:search="search"

860

>

903

>

861

904

862

<td id="td" class="text-xs-center">{{ props.index}}</td>

905

<td id="td" class="text-xs-center">{{ props.index}}</td>

863

906

864

<v-avatar>

907

<v-avatar>

865

908

866

909

867

</v-avatar>

910

</v-avatar>

868

</td>

911

</td>

869

<td id="td" class="text-xs-center">{{ props.item.name}}</td>

912

<td id="td" class="text-xs-center">{{ props.item.name}}</td>

870

<td id="td" class="text-xs-center">{{ props.item.email }}</td>

913

<td id="td" class="text-xs-center">{{ props.item.email }}</td>

871

<td id="td" class="text-xs-center">{{ dates(props.item.dob) }}</td>

914

<td id="td" class="text-xs-center">{{ dates(props.item.dob) }}</td>

872

<td id="td" class="text-xs-center">{{ props.item.gender }}</td>

915

<td id="td" class="text-xs-center">{{ props.item.gender }}</td>

873

<td id="td" class="text-xs-center">{{ props.item.parentId.fatherName }}</td>

916

<td id="td" class="text-xs-center">{{ props.item.parentId.fatherName }}</td>

874

<td id="td" class="text-xs-center">{{ props.item.parentId.motherName }}</td>

917

<td id="td" class="text-xs-center">{{ props.item.parentId.motherName }}</td>

875

<td id="td" class="text-xs-center">{{ props.item.establishmentYear }}</td>

918

<td id="td" class="text-xs-center">{{ props.item.establishmentYear }}</td>

876

<td id="td" class="text-xs-center">{{ props.item.mobile}}</td>

919

<td id="td" class="text-xs-center">{{ props.item.mobile}}</td>

877

920

878

921

879

<span>

922

<span>

880

<img

923

<img

881

style="cursor:pointer; width:25px; height:18px; "

924

style="cursor:pointer; width:25px; height:18px; "

882

class="mr-5"

925

class="mr-5"

883

@click="profile(props.item)"

926

@click="profile(props.item)"

884

src="/static/icon/eye1.png"

927

src="/static/icon/eye1.png"

885

/>

928

/>

886

<img

929

<img

887

style="cursor:pointer; width:20px; height:18px; "

930

style="cursor:pointer; width:20px; height:18px; "

888

class="mr-5"

931

class="mr-5"

889

@click="editItem(props.item)"

932

@click="editItem(props.item)"

890

src="/static/icon/edit1.png"

933

src="/static/icon/edit1.png"

891

/>

934

/>

892

<img

935

<img

893

style="cursor:pointer;width:20px; height:20px; "

936

style="cursor:pointer;width:20px; height:20px; "

894

class="mr-5"

937

class="mr-5"

895

@click="deleteItem(props.item)"

938

@click="deleteItem(props.item)"

896

src="/static/icon/delete1.png"

939

src="/static/icon/delete1.png"

897

/>

940

/>

898

</span>

941

</span>

899

</td>

942

</td>

900

</template>

943

</template>

901

<v-alert

944

<v-alert

902

slot="no-results"

945

slot="no-results"

903

:value="true"

946

:value="true"

904

color="error"

947

color="error"

905

icon="warning"

948

icon="warning"

906

>Your search for "{{ search }}" found no results.</v-alert>

949

>Your search for "{{ search }}" found no results.</v-alert>

907

</v-data-table>

950

</v-data-table>

908

</v-tab-item>

951

</v-tab-item>

909

952

910

953

911

<v-tab-item>

954

<v-tab-item>

912

<v-container fluid>

955

<v-container fluid>

913

<v-layout align-center justify-center fill-height>

956

<v-layout align-center justify-center fill-height>

914

<v-flex xs12 sm8 md7 lg8>

957

<v-flex xs12 sm8 md7 lg8>

915

<div>

958

<div>

916

<v-app>

959

<v-app>

917

<v-stepper v-model="e2">

960

<v-stepper v-model="e2">

918

<v-stepper-header>

961

<v-stepper-header>

919

<v-stepper-step :complete="e2 > 1" step="1">Fill parent Details</v-stepper-step>

962

<v-stepper-step :complete="e2 > 1" step="1">Fill parent Details</v-stepper-step>

920

<v-divider></v-divider>

963

<v-divider></v-divider>

921

<v-stepper-step step="2">Fill Student Details</v-stepper-step>

964

<v-stepper-step step="2">Fill Student Details</v-stepper-step>

922

</v-stepper-header>

965

</v-stepper-header>

923

<v-stepper-items>

966

<v-stepper-items>

924

<v-stepper-content step="1">

967

<v-stepper-content step="1">

925

<v-container fluid class>

968

<v-container fluid class>

926

<v-layout>

969

<v-layout>

927

<v-flex xs12>

970

<v-flex xs12>

928

<v-snackbar

971

<v-snackbar

929

:timeout="timeout"

972

:timeout="timeout"

930

:top="y === 'top'"

973

:top="y === 'top'"

931

:right="x === 'right'"

974

:right="x === 'right'"

932

:vertical="mode === 'vertical'"

975

:vertical="mode === 'vertical'"

933

v-model="snackbar"

976

v-model="snackbar"

934

color="success"

977

color="success"

935

>{{ text }}</v-snackbar>

978

>{{ text }}</v-snackbar>

936

<v-flex xs12 sm12>

979

<v-flex xs12 sm12>

937

<v-form ref="parentForm" v-model="valid" lazy-validation>

980

<v-form ref="parentForm" v-model="valid" lazy-validation>

938

<v-container fluid>

981

<v-container fluid>

939

<v-layout>

982

<v-layout>

940

<v-flex xs12 sm6>

983

<v-flex xs12 sm6>

941

<v-layout>

984

<v-layout>

942

<v-flex xs4 class="pt-4 subheading">

985

<v-flex xs4 class="pt-4 subheading">

943

<label class="right">Parent Email Id:</label>

986

<label class="right">Parent Email Id:</label>

944

</v-flex>

987

</v-flex>

945

<v-flex xs8 class="ml-3">

988

<v-flex xs8 class="ml-3">

946

<v-text-field

989

<v-text-field

947

placeholder="fill Parent email"

990

placeholder="fill Parent email"

948

:rules="emailRules"

991

:rules="emailRules"

949

v-model="parentData.email"

992

v-model.trim="parentData.email"

950

type="text"

993

type="text"

951

v-on:keyup="getParentDetails"

994

v-on:keyup="getParentDetails"

952

name="email"

995

name="email"

953

required

996

required

954

></v-text-field>

997

></v-text-field>

955

</v-flex>

998

</v-flex>

956

</v-layout>

999

</v-layout>

957

</v-flex>

1000

</v-flex>

958

<v-flex xs12 sm6>

1001

<v-flex xs12 sm6>

959

<v-layout>

1002

<v-layout>

960

<v-flex xs4 class="pt-4 subheading">

1003

<v-flex xs4 class="pt-4 subheading">

961

<label class="right">Father Name:</label>

1004

<label class="right">Father Name:</label>

962

</v-flex>

1005

</v-flex>

963

<v-flex xs8 class="ml-3">

1006

<v-flex xs8 class="ml-3">

964

<v-text-field

1007

<v-text-field

965

v-model="parentData.fatherName"

1008

v-model="parentData.fatherName"

966

:rules="fatherNameRules"

1009

:rules="fatherNameRules"

967

placeholder="Fill your father Name"

1010

placeholder="Fill your father Name"

968

required

1011

required

969

></v-text-field>

1012

></v-text-field>

970

</v-flex>

1013

</v-flex>

971

</v-layout>

1014

</v-layout>

972

</v-flex>

1015

</v-flex>

973

</v-layout>

1016

</v-layout>

974

<v-layout>

1017

<v-layout>

975

<v-flex xs12 sm6>

1018

<v-flex xs12 sm6>

976

<v-layout>

1019

<v-layout>

977

<v-flex xs4 class="pt-4 subheading">

1020

<v-flex xs4 class="pt-4 subheading">

978

<label class="right">Father Cell No:</label>

1021

<label class="right">Father Cell No:</label>

979

</v-flex>

1022

</v-flex>

980

<v-flex xs8 class="ml-3">

1023

<v-flex xs8 class="ml-3">

981

<v-text-field

1024

<v-text-field

982

v-model="parentData.fatherCellNo"

1025

v-model="parentData.fatherCellNo"

983

placeholder="fill your father Cell Number"

1026

placeholder="fill your father Cell Number"

984

name="state"

1027

name="state"

985

type="number"

1028

type="number"

986

:rules="fatheCellNoRules"

1029

:rules="fatheCellNoRules"

987

required

1030

required

988

></v-text-field>

1031

></v-text-field>

989

</v-flex>

1032

</v-flex>

990

</v-layout>

1033

</v-layout>

991

</v-flex>

1034

</v-flex>

992

<v-flex xs12 sm6>

1035

<v-flex xs12 sm6>

993

<v-layout>

1036

<v-layout>

994

<v-flex xs4 class="pt-4 subheading">

1037

<v-flex xs4 class="pt-4 subheading">

995

<label class="right">Mother Name:</label>

1038

<label class="right">Mother Name:</label>

996

</v-flex>

1039

</v-flex>

997

<v-flex xs8 class="ml-3">

1040

<v-flex xs8 class="ml-3">

998

<v-text-field

1041

<v-text-field

999

v-model="parentData.motherName"

1042

v-model="parentData.motherName"

1000

placeholder="fill your Mother Name"

1043

placeholder="fill your Mother Name"

1001

name="state"

1044

name="state"

1002

type="text"

1045

type="text"

1003

:rules="motherNameRules"

1046

:rules="motherNameRules"

1004

required

1047

required

1005

></v-text-field>

1048

></v-text-field>

1006

</v-flex>

1049

</v-flex>

1007

</v-layout>

1050

</v-layout>

1008

</v-flex>

1051

</v-flex>

1009

</v-layout>

1052

</v-layout>

1010

<v-layout>

1053

<v-layout>

1011

<v-flex xs12 sm6>

1054

<v-flex xs12 sm6>

1012

<v-layout>

1055

<v-layout>

1013

<v-flex xs4 class="pt-4 subheading">

1056

<v-flex xs4 class="pt-4 subheading">

1014

<label class="right">Mother Cell No:</label>

1057

<label class="right">Mother Cell No:</label>

1015

</v-flex>

1058

</v-flex>

1016

<v-flex xs8 class="ml-3">

1059

<v-flex xs8 class="ml-3">

1017

<v-text-field

1060

<v-text-field

1018

v-model="parentData.motherCellNo"

1061

v-model="parentData.motherCellNo"

1019

placeholder="fill your Mother Cell Number"

1062

placeholder="fill your Mother Cell Number"

1020

name="state"

1063

name="state"

1021

type="number"

1064

type="number"

1022

:rules="motherCellNoRules"

1065

:rules="motherCellNoRules"

1023

required

1066

required

1024

></v-text-field>

1067

></v-text-field>

1025

</v-flex>

1068

</v-flex>

1026

</v-layout>

1069

</v-layout>

1027

</v-flex>

1070

</v-flex>

1028

</v-layout>

1071

</v-layout>

1029

<v-flex xs12 sm12>

1072

<v-flex xs12 sm12>

1030

<v-card-actions>

1073

<v-card-actions>

1031

<v-spacer></v-spacer>

1074

<v-spacer></v-spacer>

1032

<v-btn

1075

<v-btn

1033

@click="submitParentDetails"

1076

@click="submitParentDetails"

1034

round

1077

round

1035

dark

1078

dark

1036

:loading="loading"

1079

:loading="loading"

1037

v-show="showParent"

1080

v-show="showParent"

1038

>Add</v-btn>

1081

>Add</v-btn>

1039

<v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn>

1082

<v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn>

1040

</v-card-actions>

1083

</v-card-actions>

1041

</v-flex>

1084

</v-flex>

1042

</v-container>

1085

</v-container>

1043

</v-form>

1086

</v-form>

1044

</v-flex>

1087

</v-flex>

1045

</v-flex>

1088

</v-flex>

1046

</v-layout>

1089

</v-layout>

1047

</v-container>

1090

</v-container>

1048

</v-stepper-content>

1091

</v-stepper-content>

1049

<v-stepper-content step="2">

1092

<v-stepper-content step="2">

1050

<v-container fluid>

1093

<v-container fluid>

1051

<v-snackbar

1094

<v-snackbar

1052

:timeout="timeout"

1095

:timeout="timeout"

1053

:top="y === 'top'"

1096

:top="y === 'top'"

1054

:right="x === 'right'"

1097

:right="x === 'right'"

1055

:vertical="mode === 'vertical'"

1098

:vertical="mode === 'vertical'"

1056

v-model="snackbar"

1099

v-model="snackbar"

1057

color="success"

1100

color="success"

1058

>{{ text }}</v-snackbar>

1101

>{{ text }}</v-snackbar>

1059

<v-flex xs12 sm12>

1102

<v-flex xs12 sm12>

1060

<v-form ref="form" v-model="valid" lazy-validation>

1103

<v-form ref="form" v-model="valid" lazy-validation>

1061

<v-container fluid>

1104

<v-container fluid>

1062

<v-layout>

1105

<v-layout>

1063

<v-flex

1106

<v-flex

1064

xs12

1107

xs12

1065

class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"

1108

class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"

1066

>

1109

>

1067

<v-avatar size="100px">

1110

<v-avatar size="100px">

1068

1111

1069

</v-avatar>

1112

</v-avatar>

1070

<input

1113

<input

1071

type="file"

1114

type="file"

1072

style="display: none"

1115

style="display: none"

1073

ref="image"

1116

ref="image"

1074

accept="image/*"

1117

accept="image/*"

1075

@change="onFilePicked"

1118

@change="onFilePicked"

1076

/>

1119

/>

1077

<img

1120

<img

1078

:src="imageData.imageUrl"

1121

:src="imageData.imageUrl"

1079

height="150"

1122

height="150"

1080

v-if="imageUrl"

1123

v-if="imageUrl"

1081

style="border-radius:50%; width:200px"

1124

style="border-radius:50%; width:200px"

1082

/>

1125

/>

1083

</v-flex>

1126

</v-flex>

1084

</v-layout>

1127

</v-layout>

1085

<v-layout>

1128

<v-layout>

1086

<v-flex xs12 sm6>

1129

<v-flex xs12 sm6>

1087

<v-layout>

1130

<v-layout>

1088

<v-flex xs4 class="pt-4 subheading">

1131

<v-flex xs4 class="pt-4 subheading">

1089

<label class="right">Select Class:</label>

1132

<label class="right">Select Class:</label>

1090

</v-flex>

1133

</v-flex>

1091

<v-flex xs8 class="ml-3">

1134

<v-flex xs8 class="ml-3">

1092

<v-select

1135

<v-select

1093

:items="addclass"

1136

:items="addclass"

1094

label="Select Class"

1137

label="Select Class"

1095

v-model="addStudents.select"

1138

v-model="addStudents.select"

1096

item-text="classNum"

1139

item-text="classNum"

1097

item-value="_id"

1140

item-value="_id"

1098

name="Select Class"

1141

name="Select Class"

1099

:rules="classRules"

1142

:rules="classRules"

1100

@change="getSection(addStudents.select)"

1143

@change="getSection(addStudents.select)"

1101

required

1144

required

1102

></v-select>

1145

></v-select>

1103

</v-flex>

1146

</v-flex>

1104

</v-layout>

1147

</v-layout>

1105

</v-flex>

1148

</v-flex>

1106

<v-flex xs12 sm6>

1149

<v-flex xs12 sm6>

1107

<v-layout>

1150

<v-layout>

1108

<v-flex xs4 class="pt-4 subheading">

1151

<v-flex xs4 class="pt-4 subheading">

1109

<label class="right">Select Section:</label>

1152

<label class="right">Select Section:</label>

1110

</v-flex>

1153

</v-flex>

1111

<v-flex xs8 class="ml-3">

1154

<v-flex xs8 class="ml-3">

1112

<v-select

1155

<v-select

1113

:items="addSection"

1156

:items="addSection"

1114

label="Select Section"

1157

label="Select Section"

1115

v-model="addStudents.selectSection"

1158

v-model="addStudents.selectSection"

1116

item-text="name"

1159

item-text="name"

1117

item-value="_id"

1160

item-value="_id"

1118

name="Select Section"

1161

name="Select Section"

1119

:rules="sectionRules"

1162

:rules="sectionRules"

1120

required

1163

required

1121

></v-select>

1164

></v-select>

1122

</v-flex>

1165

</v-flex>

1123

</v-layout>

1166

</v-layout>

1124

</v-flex>

1167

</v-flex>

1125

</v-layout>

1168

</v-layout>

1126

<v-layout>

1169

<v-layout>

1127

<v-flex xs12 sm6>

1170

<v-flex xs12 sm6>

1128

<v-layout>

1171

<v-layout>

1129

<v-flex xs4 class="pt-4 subheading">

1172

<v-flex xs4 class="pt-4 subheading">

1130

1173

1131

</v-flex>

1174

</v-flex>

1132

<v-flex xs8 class="ml-3">

1175

<v-flex xs8 class="ml-3">

1133

<v-text-field

1176

<v-text-field

1134

v-model="addStudents.name"

1177

v-model="addStudents.name"

1135

placeholder="fill your full Name"

1178

placeholder="fill your full Name"

1136

name="name"

1179

name="name"

1137

type="text"

1180

type="text"

1138

:rules="nameRules"

1181

:rules="nameRules"

1139

required

1182

required

1140

></v-text-field>

1183

></v-text-field>

1141

</v-flex>

1184

</v-flex>

1142

</v-layout>

1185

</v-layout>

1143

</v-flex>

1186

</v-flex>

1144

<v-flex xs12 sm6>

1187

<v-flex xs12 sm6>

1145

<v-layout>

1188

<v-layout>

1146

<v-flex xs4 class="pt-4 subheading">

1189

<v-flex xs4 class="pt-4 subheading">

1147

<label class="right">Email ID:</label>

1190

<label class="right">Email ID:</label>

1148

</v-flex>

1191

</v-flex>

1149

<v-flex xs8 class="ml-3">

1192

<v-flex xs8 class="ml-3">

1150

<v-text-field

1193

<v-text-field

1151

placeholder="fill your email"

1194

placeholder="fill your email"

1152

:rules="emailRules"

1195

:rules="emailRules"

1153

v-model="addStudents.email"

1196

v-model="addStudents.email"

1154

type="text"

1197

type="text"

1155

name="email"

1198

name="email"

1156

required

1199

required

1157

></v-text-field>

1200

></v-text-field>

1158

</v-flex>

1201

</v-flex>

1159

</v-layout>

1202

</v-layout>

1160

</v-flex>

1203

</v-flex>

1161

</v-layout>

1204

</v-layout>

1162

<v-layout>

1205

<v-layout>

1163

<v-flex xs12 sm6>

1206

<v-flex xs12 sm6>

1164

<v-layout>

1207

<v-layout>

1165

<v-flex xs4 class="pt-4 subheading">

1208

<v-flex xs4 class="pt-4 subheading">

1166

<label class="right">Date of Birth:</label>

1209

<label class="right">Date of Birth:</label>

1167

</v-flex>

1210

</v-flex>

1168

<v-flex xs8 class="ml-3">

1211

<v-flex xs8 class="ml-3">

1169

<v-menu

1212

<v-menu

1170

ref="menu"

1213

ref="menu"

1171

:close-on-content-click="false"

1214

:close-on-content-click="false"

1172

v-model="menu"

1215

v-model="menu"

1173

:nudge-right="40"

1216

:nudge-right="40"

1174

lazy

1217

lazy

1175

transition="scale-transition"

1218

transition="scale-transition"

1176

offset-y

1219

offset-y

1177

full-width

1220

full-width

1178

min-width="290px"

1221

min-width="290px"

1179

>

1222

>

1180

<v-text-field

1223

<v-text-field

1181

slot="activator"

1224

slot="activator"

1182

:rules="dateRules"

1225

:rules="dateRules"

1183

v-model="addStudents.date"

1226

v-model="addStudents.date"

1184

placeholder="Select date"

1227

placeholder="Select date"

1185

></v-text-field>

1228

></v-text-field>

1186

<v-date-picker

1229

<v-date-picker

1187

ref="picker"

1230

ref="picker"

1188

v-model="addStudents.date"

1231

v-model="addStudents.date"

1189

:max="new Date().toISOString().substr(0, 10)"

1232

:max="new Date().toISOString().substr(0, 10)"

1190

min="1950-01-01"

1233

min="1950-01-01"

1191

@input="menu = false"

1234

@input="menu = false"

1192

></v-date-picker>

1235

></v-date-picker>

1193

</v-menu>

1236

</v-menu>

1194

</v-flex>

1237

</v-flex>

1195

</v-layout>

1238

</v-layout>

1196

</v-flex>

1239

</v-flex>

1197

<v-flex xs12 sm6>

1240

<v-flex xs12 sm6>

1198

<v-layout>

1241

<v-layout>

1199

<v-flex xs4 class="pt-4 subheading">

1242

<v-flex xs4 class="pt-4 subheading">

1200

1243

1201

</v-flex>

1244

</v-flex>

1202

<v-flex xs8 class="ml-3">

1245

<v-flex xs8 class="ml-3">

1203

<v-text-field

1246

<v-text-field

1204

v-model="addStudents.city"

1247

v-model="addStudents.city"

1205

placeholder="fill your City Name"

1248

placeholder="fill your City Name"

1206

name="City"

1249

name="City"

1207

type="text"

1250

type="text"

1208

:rules="cityRules"

1251

:rules="cityRules"

1209

required

1252

required

1210

></v-text-field>

1253

></v-text-field>

1211

</v-flex>

1254

</v-flex>

1212

</v-layout>

1255

</v-layout>

1213

</v-flex>

1256

</v-flex>

1214

</v-layout>

1257

</v-layout>

1215

<v-layout>

1258

<v-layout>

1216

<v-flex xs12 sm6>

1259

<v-flex xs12 sm6>

1217

<v-layout>

1260

<v-layout>

1218

<v-flex xs4 class="pt-4 subheading">

1261

<v-flex xs4 class="pt-4 subheading">

1219

<label class="right">State:</label>

1262

<label class="right">State:</label>

1220

</v-flex>

1263

</v-flex>

1221

<v-flex xs8 class="ml-3">

1264

<v-flex xs8 class="ml-3">

1222

<v-text-field

1265

<v-text-field

1223

v-model="addStudents.state"

1266

v-model="addStudents.state"

1224

placeholder="fill your State Name"

1267

placeholder="fill your State Name"

1225

name="state"

1268

name="state"

1226

type="text"

1269

type="text"

1227

:rules="stateRules"

1270

:rules="stateRules"

1228

required

1271

required

1229

></v-text-field>

1272

></v-text-field>

1230

</v-flex>

1273

</v-flex>

1231

</v-layout>

1274

</v-layout>

1232

</v-flex>

1275

</v-flex>

1233

<v-flex xs12 sm6>

1276

<v-flex xs12 sm6>

1234

<v-layout>

1277

<v-layout>

1235

<v-flex xs4 class="pt-4 subheading">

1278

<v-flex xs4 class="pt-4 subheading">

1236

<label class="right">Pincode:</label>

1279

<label class="right">Pincode:</label>

1237

</v-flex>

1280

</v-flex>

1238

<v-flex xs8 class="ml-3">

1281

<v-flex xs8 class="ml-3">

1239

<v-text-field

1282

<v-text-field

1240

v-model="addStudents.pincode"

1283

v-model="addStudents.pincode"

1241

placeholder="fill your pincode"

1284

placeholder="fill your pincode"

1242

name="pincode"

1285

name="pincode"

1243

type="number"

1286

type="number"

1244

:rules="pincode"

1287

:rules="pincode"

1245

required

1288

required

1246

></v-text-field>

1289

></v-text-field>

1247

</v-flex>

1290

</v-flex>

1248

</v-layout>

1291

</v-layout>

1249

</v-flex>

1292

</v-flex>

1250

</v-layout>

1293

</v-layout>

1251

<v-layout>

1294

<v-layout>

1252

<v-flex xs12 sm6>

1295

<v-flex xs12 sm6>

1253

<v-layout>

1296

<v-layout>

1254

<v-flex xs4 class="pt-4 subheading">

1297

<v-flex xs4 class="pt-4 subheading">

1255

<label class="right">Mobile No:</label>

1298

<label class="right">Mobile No:</label>

1256

</v-flex>

1299

</v-flex>

1257

<v-flex xs8 class="ml-3">

1300

<v-flex xs8 class="ml-3">

1258

<v-text-field

1301

<v-text-field

1259

v-model="addStudents.mobile"

1302

v-model="addStudents.mobile"

1260

placeholder="fill your MobileNo"

1303

placeholder="fill your MobileNo"

1261

name="mobileNo"

1304

name="mobileNo"

1262

type="number"

1305

type="number"

1263

:rules="mobileNoRules"

1306

:rules="mobileNoRules"

1264

required

1307

required

1265

></v-text-field>

1308

></v-text-field>

1266

</v-flex>

1309

</v-flex>

1267

</v-layout>

1310

</v-layout>

1268

</v-flex>

1311

</v-flex>

1269

<v-flex xs12 sm6>

1312

<v-flex xs12 sm6>

1270

<v-layout>

1313

<v-layout>

1271

<v-flex xs4 class="pt-4 subheading">

1314

<v-flex xs4 class="pt-4 subheading">

1272

<label class="right">Select Country:</label>

1315

<label class="right">Select Country:</label>

1273

</v-flex>

1316

</v-flex>

1274

<v-flex xs8 class="ml-3">

1317

<v-flex xs8 class="ml-3">

1275

<v-autocomplete

1318

<v-autocomplete

1276

v-model="addStudents.country"

1319

v-model="addStudents.country"

1277

:rules="country"

1320

:rules="country"

1278

:items="countries"

1321

:items="countries"

1279

placeholder="Select Country Name"

1322

placeholder="Select Country Name"

1280

required

1323

required

1281

></v-autocomplete>

1324

></v-autocomplete>

1282

</v-flex>

1325

</v-flex>

1283

</v-layout>

1326

</v-layout>

1284

</v-flex>

1327

</v-flex>

1285

</v-layout>

1328

</v-layout>

1286

<v-layout>

1329

<v-layout>

1287

<v-flex xs12 sm6>

1330

<v-flex xs12 sm6>

1288

<v-layout>

1331

<v-layout>

1289

<v-flex xs4 class="pt-4 subheading">

1332

<v-flex xs4 class="pt-4 subheading">

1290

<label class="right">Gender:</label>

1333

<label class="right">Gender:</label>

1291

</v-flex>

1334

</v-flex>

1292

<v-flex xs8 class="ml-3">

1335

<v-flex xs8 class="ml-3">

1293

<v-select

1336

<v-select

1294

:items="gender"

1337

:items="gender"

1295

v-model="addStudents.gender"

1338

v-model="addStudents.gender"

1296

:rules="genderRules"

1339

:rules="genderRules"

1297

label="Select Gender"

1340

label="Select Gender"

1298

required

1341

required

1299

></v-select>

1342

></v-select>

1300

</v-flex>

1343

</v-flex>

1301

</v-layout>

1344

</v-layout>

1302

</v-flex>

1345

</v-flex>

1303

<v-flex xs12 sm6>

1346

<v-flex xs12 sm6>

1304

<v-layout>

1347

<v-layout>

1305

<v-flex xs4 class="pt-4 subheading">

1348

<v-flex xs4 class="pt-4 subheading">

1306

<label class="right">Blood Group:</label>

1349

<label class="right">Blood Group:</label>

1307

</v-flex>

1350

</v-flex>

1308

<v-flex xs8 class="ml-3">

1351

<v-flex xs8 class="ml-3">

1309

<v-text-field

1352

<v-text-field

1310

v-model="addStudents.bloodGroup"

1353

v-model="addStudents.bloodGroup"

1311

placeholder="Fill your Blood Group"

1354

placeholder="Fill your Blood Group"

1312

required

1355

required

1313

></v-text-field>

1356

></v-text-field>

1314

</v-flex>

1357

</v-flex>

1315

</v-layout>

1358

</v-layout>

1316

</v-flex>

1359

</v-flex>

1317

</v-layout>

1360

</v-layout>

1318

<v-layout>

1361

<v-layout>

1319

<v-flex xs12 sm6>

1362

<v-flex xs12 sm6>

1320

<v-layout>

1363

<v-layout>

1321

<v-flex xs4 class="pt-4 subheading">

1364

<v-flex xs4 class="pt-4 subheading">

1322

<label class="right">Allergies:</label>

1365

<label class="right">Allergies:</label>

1323

</v-flex>

1366

</v-flex>

1324

<v-flex xs8 class="ml-3">

1367

<v-flex xs8 class="ml-3">

1325

<v-text-field

1368

<v-text-field

1326

v-model="addStudents.allergies"

1369

v-model="addStudents.allergies"

1327

placeholder="Fill your Allergies"

1370

placeholder="Fill your Allergies"

1328

required

1371

required

1329

></v-text-field>

1372

></v-text-field>

1330

</v-flex>

1373

</v-flex>

1331

</v-layout>

1374

</v-layout>

1332

</v-flex>

1375

</v-flex>

1333

<v-flex xs12 sm6>

1376

<v-flex xs12 sm6>

1334

<v-layout>

1377

<v-layout>

1335

<v-flex xs4 class="pt-4 subheading">

1378

<v-flex xs4 class="pt-4 subheading">

1336

<label class="right">Medical Notes:</label>

1379

<label class="right">Medical Notes:</label>

1337

</v-flex>

1380

</v-flex>

1338

<v-flex xs8 class="ml-3">

1381

<v-flex xs8 class="ml-3">

1339

<v-text-field

1382

<v-text-field

1340

v-model="addStudents.medicalNotes"

1383

v-model="addStudents.medicalNotes"

1341

placeholder="Fill your Medical Notes"

1384

placeholder="Fill your Medical Notes"

1342

required

1385

required

1343

></v-text-field>

1386

></v-text-field>

1344

</v-flex>

1387

</v-flex>

1345

</v-layout>

1388

</v-layout>

1346

</v-flex>

1389

</v-flex>

1347

</v-layout>

1390

</v-layout>

1348

<v-layout>

1391

<v-layout>

1349

<v-flex xs12 sm6>

1392

<v-flex xs12 sm6>

1350

<v-layout>

1393

<v-layout>

1351

<v-flex xs4 class="pt-4 subheading">

1394

<v-flex xs4 class="pt-4 subheading">

1352

<label class="right">Height:</label>

1395

<label class="right">Height:</label>

1353

</v-flex>

1396

</v-flex>

1354

<v-flex xs8 class="ml-3">

1397

<v-flex xs8 class="ml-3">

1355

<v-text-field

1398

<v-text-field

1356

v-model="addStudents.height"

1399

v-model="addStudents.height"

1357

placeholder="Fill your Height"

1400

placeholder="Fill your Height"

1358

required

1401

required

1359

></v-text-field>

1402

></v-text-field>

1360

</v-flex>

1403

</v-flex>

1361

</v-layout>

1404

</v-layout>

1362

</v-flex>

1405

</v-flex>

1363

<v-flex xs12 sm6>

1406

<v-flex xs12 sm6>

1364

<v-layout>

1407

<v-layout>

1365

<v-flex xs4 class="pt-4 subheading">

1408

<v-flex xs4 class="pt-4 subheading">

1366

<label class="right">Weight:</label>

1409

<label class="right">Weight:</label>

1367

</v-flex>

1410

</v-flex>

1368

<v-flex xs8 class="ml-3">

1411

<v-flex xs8 class="ml-3">

1369

<v-text-field

1412

<v-text-field

1370

v-model="addStudents.weight"

1413

v-model="addStudents.weight"

1371

placeholder="Fill your Weight"

1414

placeholder="Fill your Weight"

1372

required

1415

required

1373

></v-text-field>

1416

></v-text-field>

1374

</v-flex>

1417

</v-flex>

1375

</v-layout>

1418

</v-layout>

1376

</v-flex>

1419

</v-flex>

1377

</v-layout>

1420

</v-layout>

1378

<v-layout>

1421

<v-layout>

1379

<v-flex xs12 sm6>

1422

<v-flex xs12 sm6>

1380

<v-layout>

1423

<v-layout>

1381

<v-flex xs4 class="pt-4 subheading">

1424

<v-flex xs4 class="pt-4 subheading">

1382

<label class="right">Uplaod Image:</label>

1425

<label class="right">Uplaod Image:</label>

1383

</v-flex>

1426

</v-flex>

1384

<v-flex xs8 class="ml-3">

1427

<v-flex xs8 class="ml-3">

1385

<v-text-field

1428

<v-text-field

1386

label="Select Image"

1429

label="Select Image"

1387

@click="pickFile"

1430

@click="pickFile"

1388

v-model="imageName"

1431

v-model="imageName"

1389

append-icon="attach_file"

1432

append-icon="attach_file"

1390

></v-text-field>

1433

></v-text-field>

1391

</v-flex>

1434

</v-flex>

1392

</v-layout>

1435

</v-layout>

1393

</v-flex>

1436

</v-flex>

1394

<v-flex xs12 sm6>

1437

<v-flex xs12 sm6>

1395

<v-layout>

1438

<v-layout>

1396

<v-flex xs4 class="pt-4 subheading">

1439

<v-flex xs4 class="pt-4 subheading">

1397

<label class="right">Academic Year:</label>

1440

<label class="right">Academic Year:</label>

1398

</v-flex>

1441

</v-flex>

1399

<v-flex xs8 class="ml-3">

1442

<v-flex xs8 class="ml-3">

1400

<v-text-field

1443

<v-text-field

1401

v-model="addStudents.establishmentYear"

1444

v-model="addStudents.establishmentYear"

1402

placeholder="fill your Academic Year"

1445

placeholder="fill your Academic Year"

1403

name="state"

1446

name="state"

1404

type="number"

1447

type="number"

1405

:rules="establishmentYearRules"

1448

:rules="establishmentYearRules"

1406

required

1449

required

1407

></v-text-field>

1450

></v-text-field>

1408

</v-flex>

1451

</v-flex>

1409

</v-layout>

1452

</v-layout>

1410

</v-flex>

1453

</v-flex>

1411

</v-layout>

1454

</v-layout>

1412

<v-layout>

1455

<v-layout>

1456

<v-flex xs12 sm6>

1457

<v-layout>

1458

<v-flex xs4 class="pt-4 subheading">

1459

<label class="right">Roll Number:</label>

1460

</v-flex>

1461

<v-flex xs8 class="ml-3">

1462

<v-text-field

1463

v-model="addStudents.rollNo"

1464

placeholder="Fill your Roll Number"

1465

required

1466

></v-text-field>

1467

</v-flex>

1468

</v-layout>

1469

</v-flex>

1470

</v-layout>

1471

<v-layout>

1413

<v-flex xs12 sm12>

1472

<v-flex xs12 sm12>

1414

<v-layout>

1473

<v-layout>

1415

<v-flex

1474

<v-flex

1416

xs3

1475

xs3

1417

class="pt-4 subheading pl-4"

1476

class="pt-4 subheading pl-4"

1418

style="max-width: 17%;"

1477

style="max-width: 17%;"

1419

>

1478

>

1420

<label class>Present Address:</label>

1479

<label class>Present Address:</label>

1421

</v-flex>

1480

</v-flex>

1422

<v-flex xs12>

1481

<v-flex xs12>

1423

<v-text-field

1482

<v-text-field

1424

name="input-4-3"

1483

name="input-4-3"

1425

v-model="addStudents.presentAddress"

1484

v-model="addStudents.presentAddress"

1426

:rules="presentAddress"

1485

:rules="presentAddress"

1427

placeholder="fill Your present Address"

1486

placeholder="fill Your present Address"

1428

required

1487

required

1429

></v-text-field>

1488

></v-text-field>

1430

</v-flex>

1489

</v-flex>

1431

</v-layout>

1490

</v-layout>

1432

</v-flex>

1491

</v-flex>

1433

<v-flex xs12 sm12>

1492

<v-flex xs12 sm12>

1434

<v-layout>

1493

<v-layout>

1435

<v-flex xs3 class="pt-4 subheading" style="max-width: 17%;">

1494

<v-flex xs3 class="pt-4 subheading" style="max-width: 17%;">

1436

<label>Permanent Address:</label>

1495

<label>Permanent Address:</label>

1437

</v-flex>

1496

</v-flex>

1438

<v-flex xs12>

1497

<v-flex xs12>

1439

<v-text-field

1498

<v-text-field

1440

name="input-4-3"

1499

name="input-4-3"

1441

v-model="addStudents.permanentAddress"

1500

v-model="addStudents.permanentAddress"

1442

:rules="permanentAddress"

1501

:rules="permanentAddress"

1443

placeholder="fill Your Permanent Address"

1502

placeholder="fill Your Permanent Address"

1444

required

1503

required

1445

></v-text-field>

1504

></v-text-field>

1446

</v-flex>

1505

</v-flex>

1447

</v-layout>

1506

</v-layout>

1448

</v-flex>

1507

</v-flex>

1449

</v-layout>

1508

</v-layout>

1450

<v-layout>

1509

<v-layout>

1451

<v-flex xs12 sm12>

1510

<v-flex xs12 sm12>

1452

<v-card-actions>

1511

<v-card-actions>

1453

1512

1454

<v-btn round dark @click="e2 = 1">

1513

<v-btn round dark @click="e2 = 1">

1455

<v-icon dark left>arrow_back</v-icon>Back

1514

<v-icon dark left>arrow_back</v-icon>Back

1456

</v-btn>

1515

</v-btn>

1457

<v-spacer></v-spacer>

1516

<v-spacer></v-spacer>

1458

<v-btn @click="submit" round dark :loading="loading">Add</v-btn>

1517

<v-btn @click="submit" round dark :loading="loading">Add</v-btn>

1459

</v-card-actions>

1518

</v-card-actions>

1460

</v-flex>

1519

</v-flex>

1461

</v-layout>

1520

</v-layout>

1462

</v-container>

1521

</v-container>

1463

</v-form>

1522

</v-form>

1464

</v-flex>

1523

</v-flex>

1465

</v-container>

1524

</v-container>

1466

</v-stepper-content>

1525

</v-stepper-content>

1467

</v-stepper-items>

1526

</v-stepper-items>

1468

</v-stepper>

1527

</v-stepper>

1469

</v-app>

1528

</v-app>

1470

</div>

1529

</div>

1471

</v-flex>

1530

</v-flex>

1472

</v-layout>

1531

</v-layout>

1473

</v-container>

1532

</v-container>

1474

</v-tab-item>

1533

</v-tab-item>

1475

</v-tabs>

1534

</v-tabs>

1476

1535

1477

<v-progress-circular indeterminate color="white"></v-progress-circular>

1536

<v-progress-circular indeterminate color="white"></v-progress-circular>

1478

</div>

1537

</div>

1479

</v-app>

1538

</v-app>

1480

</template>

1539

</template>

1481

1540

1482

1541

1483

import http from "@/Services/http.js";

1542

import http from "@/Services/http.js";

1484

import Util from "@/util";

1543

import Util from "@/util";

1485

import moment from "moment";

1544

import moment from "moment";

1486

1545

1487

export default {

1546

export default {

1488

data: () => ({

1547

data: () => ({

1489

e2: 0,

1548

e2: 0,

1490

showParent: true,

1549

showParent: true,

1491

showNext: false,

1550

showNext: false,

1492

snackbar: false,

1551

snackbar: false,

1493

y: "top",

1552

y: "top",

1494

x: "right",

1553

x: "right",

1495

mode: "",

1554

mode: "",

1496

timeout: 3000,

1555

timeout: 3000,

1497

text: "",

1556

text: "",

1498

showLoader: false,

1557

showLoader: false,

1499

loading: false,

1558

loading: false,

1500

date: null,

1559

date: null,

1501

search: "",

1560

search: "",

1502

menu: false,

1561

menu: false,

1503

menu1: false,

1562

menu1: false,

1504

dialog: false,

1563

dialog: false,

1505

dialog1: false,

1564

dialog1: false,

1506

valid: true,

1565

valid: true,

1507

isActive: true,

1566

isActive: true,

1508

newActive: false,

1567

newActive: false,

1509

addclass: [],

1568

addclass: [],

1510

addSection: [],

1569

addSection: [],

1511

gender: ["Male", "Female"],

1570

gender: ["Male", "Female"],

1512

AddUsercredentials: {},

1571

AddUsercredentials: {},

1513

pagination: {

1572

pagination: {

1514

rowsPerPage: 15

1573

rowsPerPage: 15

1515

},

1574

},

1516

imageData: {},

1575

imageData: {},

1517

imageName: "",

1576

imageName: "",

1518

imageUrl: "",

1577

imageUrl: "",

1519

imageFile: "",

1578

imageFile: "",

1520

nameRules: [v => !!v || " Full Name is required"],

1579

nameRules: [v => !!v || " Full Name is required"],

1521

dateRules: [v => !!v || " DOB is required"],

1580

dateRules: [v => !!v || " DOB is required"],

1522

cityRules: [v => !!v || " City Name is required"],

1581

cityRules: [v => !!v || " City Name is required"],

1523

pincode: [v => !!v || " Pincode is required"],

1582

pincode: [v => !!v || " Pincode is required"],

1524

country: [v => !!v || " Country Name is required"],

1583

country: [v => !!v || " Country Name is required"],

1525

permanentAddress: [v => !!v || " Permanent Address is required"],

1584

permanentAddress: [v => !!v || " Permanent Address is required"],

1526

presentAddress: [v => !!v || " Present Address is required"],

1585

presentAddress: [v => !!v || " Present Address is required"],

1527

mobileNoRules: [v => !!v || "Mobile Number is required"],

1586

mobileNoRules: [v => !!v || "Mobile Number is required"],

1528

stateRules: [v => !!v || "State Name is required"],

1587

stateRules: [v => !!v || "State Name is required"],

1529

classRules: [v => !!v || " Class Name is required"],

1588

classRules: [v => !!v || " Class Name is required"],

1530

sectionRules: [v => !!v || " Section Name is required"],

1589

sectionRules: [v => !!v || " Section Name is required"],

1531

genderRules: [v => !!v || " Select Gender is required"],

1590

genderRules: [v => !!v || " Select Gender is required"],

1532

fatherNameRules: [v => !!v || " Father Name is required"],

1591

fatherNameRules: [v => !!v || " Father Name is required"],

1533

fatheCellNoRules: [v => !!v || " father Cell Number is required"],

1592

fatheCellNoRules: [v => !!v || " father Cell Number is required"],

1534

motherNameRules: [v => !!v || " Mother Name is required"],

1593

motherNameRules: [v => !!v || " Mother Name is required"],

1535

motherCellNoRules: [v => !!v || " Mother Cell Number is required"],

1594

motherCellNoRules: [v => !!v || " Mother Cell Number is required"],

1536

establishmentYearRules: [v => !!v || " Academic Year is required"],

1595

establishmentYearRules: [v => !!v || " Academic Year is required"],

1537

errorMessages: "",

1596

errorMessages: "",

1538

emailRules: [

1597

emailRules: [

1539

v => !!v || "E-mail is required",

1598

v => !!v || "E-mail is required",

1540

v =>

1599

v =>

1541

/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||

1600

/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||

1542

"E-mail must be valid"

1601

"E-mail must be valid"

1543

],

1602

],

1544

countries: [

1603

countries: [

1545

"Afghanistan",

1604

"Afghanistan",

1546

"Albania",

1605

"Albania",

1547

"Algeria",

1606

"Algeria",

1548

"Andorra",

1607

"Andorra",

1549

"Angola",

1608

"Angola",

1550

"Anguilla",

1609

"Anguilla",

1551

"Antigua & Barbuda",

1610

"Antigua & Barbuda",

1552

"Argentina",

1611

"Argentina",

1553

"Armenia",

1612

"Armenia",

1554

"Aruba",

1613

"Aruba",

1555

"Australia",

1614

"Australia",

1556

"Austria",

1615

"Austria",

1557

"Azerbaijan",

1616

"Azerbaijan",

1558

"Bahamas",

1617

"Bahamas",

1559

"Bahrain",

1618

"Bahrain",

1560

"Bangladesh",

1619

"Bangladesh",

1561

"Barbados",

1620

"Barbados",

1562

"Belarus",

1621

"Belarus",

1563

"Belgium",

1622

"Belgium",

1564

"Belize",

1623

"Belize",

1565

"Benin",

1624

"Benin",

1566

"Bermuda",

1625

"Bermuda",

1567

"Bhutan",

1626

"Bhutan",

1568

"Bolivia",

1627

"Bolivia",

1569

"Bosnia & Herzegovina",

1628

"Bosnia & Herzegovina",

1570

"Botswana",

1629

"Botswana",

1571

"Brazil",

1630

"Brazil",

1572

"British Virgin Islands",

1631

"British Virgin Islands",

1573

"Brunei",

1632

"Brunei",

1574

"Bulgaria",

1633

"Bulgaria",

1575

"Burkina Faso",

1634

"Burkina Faso",

1576

"Burundi",

1635

"Burundi",

1577

"Cambodia",

1636

"Cambodia",

1578

"Cameroon",

1637

"Cameroon",

1579

"Cape Verde",

1638

"Cape Verde",

1580

"Cayman Islands",

1639

"Cayman Islands",

1581

"Chad",

1640

"Chad",

1582

"Chile",

1641

"Chile",

1583

"China",

1642

"China",

1584

"Colombia",

1643

"Colombia",

1585

"Congo",

1644

"Congo",

1586

"Cook Islands",

1645

"Cook Islands",

1587

"Costa Rica",

1646

"Costa Rica",

1588

"Cote D Ivoire",

1647

"Cote D Ivoire",

1589

"Croatia",

1648

"Croatia",

1590

"Cruise Ship",

1649

"Cruise Ship",

1591

"Cuba",

1650

"Cuba",

1592

"Cyprus",

1651

"Cyprus",

1593

"Czech Republic",

1652

"Czech Republic",

1594

"Denmark",

1653

"Denmark",

1595

"Djibouti",

1654

"Djibouti",

1596

"Dominica",

1655

"Dominica",

1597

"Dominican Republic",

1656

"Dominican Republic",

1598

"Ecuador",

1657

"Ecuador",

1599

"Egypt",

1658

"Egypt",

1600

"El Salvador",

1659

"El Salvador",

1601

"Equatorial Guinea",

1660

"Equatorial Guinea",

1602

"Estonia",

1661

"Estonia",

1603

"Ethiopia",

1662

"Ethiopia",

1604

"Falkland Islands",

1663

"Falkland Islands",

1605

"Faroe Islands",

1664

"Faroe Islands",

1606

"Fiji",

1665

"Fiji",

1607

"Finland",

1666

"Finland",

1608

"France",

1667

"France",

1609

"French Polynesia",

1668

"French Polynesia",

1610

"French West Indies",

1669

"French West Indies",

1611

"Gabon",

1670

"Gabon",

1612

"Gambia",

1671

"Gambia",

1613

"Georgia",

1672

"Georgia",

1614

"Germany",

1673

"Germany",

1615

"Ghana",

1674

"Ghana",

1616

"Gibraltar",

1675

"Gibraltar",

1617

"Greece",

1676

"Greece",

1618

"Greenland",

1677

"Greenland",

1619

"Grenada",

1678

"Grenada",

1620

"Guam",

1679

"Guam",

1621

"Guatemala",

1680

"Guatemala",

1622

"Guernsey",

1681

"Guernsey",

1623

"Guinea",

1682

"Guinea",

1624

"Guinea Bissau",

1683

"Guinea Bissau",

1625

"Guyana",

1684

"Guyana",

1626

"Haiti",

1685

"Haiti",

1627

"Honduras",

1686

"Honduras",

1628

"Hong Kong",

1687

"Hong Kong",

1629

"Hungary",

1688

"Hungary",

1630

"Iceland",

1689

"Iceland",

1631

"India",

1690

"India",

1632

"Indonesia",

1691

"Indonesia",

1633

"Iran",

1692

"Iran",

1634

"Iraq",

1693

"Iraq",

1635

"Ireland",

1694

"Ireland",

1636

"Isle of Man",

1695

"Isle of Man",

1637

"Israel",

1696

"Israel",

1638

"Italy",

1697

"Italy",

1639

"Jamaica",

1698

"Jamaica",

1640

"Japan",

1699

"Japan",

1641

"Jersey",

1700

"Jersey",

1642

"Jordan",

1701

"Jordan",

1643

"Kazakhstan",

1702

"Kazakhstan",

1644

"Kenya",

1703

"Kenya",

1645

"Kuwait",

1704

"Kuwait",

1646

"Kyrgyz Republic",

1705

"Kyrgyz Republic",

1647

"Laos",

1706

"Laos",

1648

"Latvia",

1707

"Latvia",

1649

"Lebanon",

1708

"Lebanon",

1650

"Lesotho",

1709

"Lesotho",

1651

"Liberia",

1710

"Liberia",

1652

"Libya",

1711

"Libya",

1653

"Liechtenstein",

1712

"Liechtenstein",

1654

"Lithuania",

1713

"Lithuania",

1655

"Luxembourg",

1714

"Luxembourg",

1656

"Macau",

1715

"Macau",

1657

"Macedonia",

1716

"Macedonia",

1658

"Madagascar",

1717

"Madagascar",

1659

"Malawi",

1718

"Malawi",

1660

"Malaysia",

1719

"Malaysia",

1661

"Maldives",

1720

"Maldives",

1662

"Mali",

1721

"Mali",

1663

"Malta",

1722

"Malta",

1664

"Mauritania",

1723

"Mauritania",

1665

"Mauritius",

1724

"Mauritius",

1666

"Mexico",

1725

"Mexico",

1667

"Moldova",

1726

"Moldova",

1668

"Monaco",

1727

"Monaco",

1669

"Mongolia",

1728

"Mongolia",

1670

"Montenegro",

1729

"Montenegro",

1671

"Montserrat",

1730

"Montserrat",

1672

"Morocco",

1731

"Morocco",

1673

"Mozambique",

1732

"Mozambique",

1674

"Namibia",

1733

"Namibia",

1675

"Nepal",

1734

"Nepal",

1676

"Netherlands",

1735

"Netherlands",

1677

"Netherlands Antilles",

1736

"Netherlands Antilles",

1678

"New Caledonia",

1737

"New Caledonia",

1679

"New Zealand",

1738

"New Zealand",

1680

"Nicaragua",

1739

"Nicaragua",

1681

"Niger",

1740

"Niger",

1682

"Nigeria",

1741

"Nigeria",

1683

"Norway",

1742

"Norway",

1684

"Oman",

1743

"Oman",

1685

"Pakistan",

1744

"Pakistan",

1686

"Palestine",

1745

"Palestine",

1687

"Panama",

1746

"Panama",

1688

"Papua New Guinea",

1747

"Papua New Guinea",

1689

"Paraguay",

1748

"Paraguay",

1690

"Peru",

1749

"Peru",

1691

"Philippines",

1750

"Philippines",

1692

"Poland",

1751

"Poland",

1693

"Portugal",

1752

"Portugal",

1694

"Puerto Rico",

1753

"Puerto Rico",

1695

"Qatar",

1754

"Qatar",

1696

"Reunion",

1755

"Reunion",

1697

"Romania",

1756

"Romania",

1698

"Russia",

1757

"Russia",

1699

"Rwanda",

1758

"Rwanda",

1700

"Saint Pierre & Miquelon",

1759

"Saint Pierre & Miquelon",

1701

"Samoa",

1760

"Samoa",

1702

"San Marino",

1761

"San Marino",

1703

"Satellite",

1762

"Satellite",

1704

"Saudi Arabia",

1763

"Saudi Arabia",

1705

"Senegal",

1764

"Senegal",

1706

"Serbia",

1765

"Serbia",

1707

"Seychelles",

1766

"Seychelles",

1708

"Sierra Leone",

1767

"Sierra Leone",

1709

"Singapore",

1768

"Singapore",

1710

"Slovakia",

1769

"Slovakia",

1711

"Slovenia",

1770

"Slovenia",

1712

"South Africa",

1771

"South Africa",

1713

"South Korea",

1772

"South Korea",

1714

"Spain",

1773

"Spain",

1715

"Sri Lanka",

1774

"Sri Lanka",

1716

"St Kitts & Nevis",

1775

"St Kitts & Nevis",

1717

"St Lucia",

1776

"St Lucia",

1718

"St Vincent",

1777

"St Vincent",

1719

"St. Lucia",

1778

"St. Lucia",

1720

"Sudan",

1779

"Sudan",

1721

"Suriname",

1780

"Suriname",

1722

"Swaziland",

1781

"Swaziland",

1723

"Sweden",

1782

"Sweden",

1724

"Switzerland",

1783

"Switzerland",

1725

"Syria",

1784

"Syria",

1726

"Taiwan",

1785

"Taiwan",

1727

"Tajikistan",

1786

"Tajikistan",

1728

"Tanzania",

1787

"Tanzania",

1729

"Thailand",

1788

"Thailand",

1730

"Timor L'Este",

1789

"Timor L'Este",

1731

"Togo",

1790

"Togo",

1732

"Tonga",

1791

"Tonga",

1733

"Trinidad & Tobago",

1792

"Trinidad & Tobago",

1734

"Tunisia",

1793

"Tunisia",

1735

"Turkey",

1794

"Turkey",

1736

"Turkmenistan",

1795

"Turkmenistan",

1737

"Turks & Caicos",

1796

"Turks & Caicos",

1738

"Uganda",

1797

"Uganda",

1739

"Ukraine",

1798

"Ukraine",

1740

"United Arab Emirates",

1799

"United Arab Emirates",

1741

"United Kingdom",

1800

"United Kingdom",

1742

"United States",

1801

"United States",

1743

"Uruguay",

1802

"Uruguay",

1744

"Uzbekistan",

1803

"Uzbekistan",

1745

"Venezuela",

1804

"Venezuela",

1746

"Vietnam",

1805

"Vietnam",

1747

"Virgin Islands (US)",

1806

"Virgin Islands (US)",

1748

"Yemen",

1807

"Yemen",

1749

"Zambia",

1808

"Zambia",

1750

"Zimbabwe"

1809

"Zimbabwe"

1751

],

1810

],

1752

headers: [

1811

headers: [

1753

{

1812

{

1754

text: "No",

1813

text: "No",

1755

align: "center",

1814

align: "center",

1756

sortable: false,

1815

sortable: false,

1757

value: "No"

1816

value: "No"

1758

},

1817

},

1759

{

1818

{

1760

text: "Profile Pic",

1819

text: "Profile Pic",

1761

value: "profilePicUrl",

1820

value: "profilePicUrl",

1762

sortable: false,

1821

sortable: false,

1763

align: "center"

1822

align: "center"

1764

},

1823

},

1765

{ text: "Name", value: "name", sortable: false, align: "center" },

1824

{ text: "Name", value: "name", sortable: false, align: "center" },

1766

{ text: "Email", value: "email", sortable: false, align: "center" },

1825

{ text: "Email", value: "email", sortable: false, align: "center" },

1767

{ text: "Dob", value: "dob", sortable: false, align: "center" },

1826

{ text: "Dob", value: "dob", sortable: false, align: "center" },

1768

{ text: "Gender", value: "gender", sortable: false, align: "center" },

1827

{ text: "Gender", value: "gender", sortable: false, align: "center" },

1769

{

1828

{

1770

text: "Father Name",

1829

text: "Father Name",

1771

value: "fatherName",

1830

value: "fatherName",

1772

sortable: false,

1831

sortable: false,

1773

align: "center"

1832

align: "center"

1774

},

1833

},

1775

{

1834

{

1776

text: "Mother Name",

1835

text: "Mother Name",

1777

value: "motherName",

1836

value: "motherName",

1778

sortable: false,

1837

sortable: false,

1779

align: "center"

1838

align: "center"

1780

},

1839

},

1781

{

1840

{

1782

text: "Academic Year",

1841

text: "Academic Year",

1783

value: "establishmentYear",

1842

value: "establishmentYear",

1784

sortable: false,

1843

sortable: false,

1785

align: "center"

1844

align: "center"

1786

},

1845

},

1787

{ text: "Mobile No", value: "mobile", sortable: false, align: "center" },

1846

{ text: "Mobile No", value: "mobile", sortable: false, align: "center" },

1788

{ text: "Action", value: "", sortable: false, align: "center" }

1847

{ text: "Action", value: "", sortable: false, align: "center" }

1789

],

1848

],

1790

desserts: [],

1849

desserts: [],

1791

parentId: "",

1850

parentId: "",

1792

editedIndex: -1,

1851

editedIndex: -1,

1793

parentData: {},

1852

parentData: {},

1794

addStudents: {

1853

addStudents: {

1795

role: "STUDENT",

1854

role: "STUDENT",

1796

1855

1797

email: "",

1856

email: "",

1798

date: "",

1857

date: "",

1799

city: "",

1858

city: "",

1800

pincode: "",

1859

pincode: "",

1801

country: "",

1860

country: "",

1802

permanentAddress: "",

1861

permanentAddress: "",

1803

presentAddress: "",

1862

presentAddress: "",

1804

mobile: "",

1863

mobile: "",

1805

state: "",

1864

state: "",

1806

gender: "",

1865

gender: "",

1807

select: "",

1866

select: "",

1808

selectSection: "",

1867

selectSection: "",

1809

bloodGroup: "",

1868

bloodGroup: "",

1810

allergies: "",

1869

allergies: "",

1811

medicalNotes: "",

1870

medicalNotes: "",

1812

height: "",

1871

height: "",

1813

weight: "",

1872

weight: "",

1873

rollNo: "",

1814

establishmentYear: new Date().getFullYear()

1874

establishmentYear: new Date().getFullYear()

1815

},

1875

},

1816

selectStudents: {

1876

selectStudents: {

1817

select: "",

1877

select: "",

1818

selectSection: ""

1878

selectSection: ""

1819

},

1879

},

1820

editedItem: {

1880

editedItem: {

1821

role: "STUDENT",

1881

role: "STUDENT",

1822

1882

1823

email: "",

1883

email: "",

1824

dob: "",

1884

dob: "",

1825

city: "",

1885

city: "",

1826

pincode: "",

1886

pincode: "",

1827

country: "",

1887

country: "",

1828

permanentAddress: "",

1888

permanentAddress: "",

1829

presentAddress: "",

1889

presentAddress: "",

1830

mobile: "",

1890

mobile: "",

1831

state: "",

1891

state: "",

1832

gender: "",

1892

gender: "",

1833

select: "",

1893

select: "",

1834

selectSection: "",

1894

selectSection: "",

1835

bloodGroup: "",

1895

bloodGroup: "",

1836

allergies: "",

1896

allergies: "",

1837

medicalNotes: "",

1897

medicalNotes: "",

1838

height: "",

1898

height: "",

1839

weight: "",

1899

weight: "",

1900

rollNo: "",

1840

establishmentYear: new Date().getFullYear()

1901

establishmentYear: new Date().getFullYear()

1841

},

1902

},

1842

defaultItem: {

1903

defaultItem: {

1843

role: "STUDENT",

1904

role: "STUDENT",

1844

1905

1845

email: ""

1906

email: ""

1846

},

1907

},

1847

userName: "",

1908

userName: "",

1848

items: [

1909

items: [

1849

{

1910

{

1850

href: "/changepassword",

1911

href: "/changepassword",

1851

title: "Change Password",

1912

title: "Change Password",

1852

click: e => {

1913

click: e => {

1853

console.log(e);

1914

console.log(e);

1854

}

1915

}

1855

},

1916

},

1856

{

1917

{

1857

href: "#",

1918

href: "#",

1858

title: "Logout",

1919

title: "Logout",

1859

click: e => {

1920

click: e => {

1860

window.getApp.$emit("APP_LOGOUT");

1921

window.getApp.$emit("APP_LOGOUT");

1861

}

1922

}

1862

}

1923

}

1863

]

1924

]

1864

}),

1925

}),

1865

watch: {

1926

watch: {

1866

menu(val) {

1927

menu(val) {

1867

val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));

1928

val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));

1868

},

1929

},

1869

menu1(val) {

1930

menu1(val) {

1870

val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));

1931

val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));

1871

}

1932

}

1872

},

1933

},

1873

methods: {

1934

methods: {

1874

findStudents() {

1935

findStudents() {

1875

this.showLoader = true;

1936

this.showLoader = true;

1876

http()

1937

http()

1877

.get("/getStudentWithClass", {

1938

.get("/getStudentWithClass", {

1878

params: {

1939

params: {

1879

classId: this.selectStudents.select,

1940

classId: this.selectStudents.select,

1880

sectionId: this.selectStudents.selectSection

1941

sectionId: this.selectStudents.selectSection

1881

}

1942

}

1882

})

1943

})

1883

.then(response => {

1944

.then(response => {

1884

this.desserts = response.data.data;

1945

this.desserts = response.data.data;

1885

this.showLoader = false;

1946

this.showLoader = false;

1886

console.log("getSectionsList=====>", this.addSection);

1947

console.log("getSectionsList=====>", this.addSection);

1887

})

1948

})

1888

.catch(err => {

1949

.catch(err => {

1889

console.log("err====>", err);

1950

console.log("err====>", err);

1890

this.showLoader = false;

1951

this.showLoader = false;

1891

});

1952

});

1892

},

1953

},

1893

getSections(_id) {

1954

getSections(_id) {

1894

var token = this.$store.state.token;

1955

var token = this.$store.state.token;

1895

http()

1956

http()

1896

.get(

1957

.get(

1897

"/getSectionsList",

1958

"/getSectionsList",

1898

{ params: { classId: _id } },

1959

{ params: { classId: _id } },

1899

{

1960

{

1900

headers: { Authorization: "Bearer " + token }

1961

headers: { Authorization: "Bearer " + token }

1901

}

1962

}

1902

)

1963

)

1903

.then(response => {

1964

.then(response => {

1904

this.addSection = response.data.data;

1965

this.addSection = response.data.data;

1905

console.log("getSectionsList=====>", this.addSection);

1966

console.log("getSectionsList=====>", this.addSection);

1906

})

1967

})

1907

.catch(err => {

1968

.catch(err => {

1908

// console.log("err====>", err);

1969

// console.log("err====>", err);

1909

// this.$router.replace({ path: '/' });

1970

// this.$router.replace({ path: '/' });

1910

});

1971

});

1911

},

1972

},

1912

getSection(_id) {

1973

getSection(_id) {

1913

var token = this.$store.state.token;

1974

var token = this.$store.state.token;

1914

http()

1975

http()

1915

.get(

1976

.get(

1916

"/getSectionsList",

1977

"/getSectionsList",

1917

{ params: { classId: _id } },

1978

{ params: { classId: _id } },

1918

{

1979

{

1919

headers: { Authorization: "Bearer " + token }

1980

headers: { Authorization: "Bearer " + token }

1920

}

1981

}

1921

)

1982

)

1922

.then(response => {

1983

.then(response => {

1923

this.addSection = response.data.data;

1984

this.addSection = response.data.data;

1924

console.log("getSectionsList=====>", this.addSection);

1985

console.log("getSectionsList=====>", this.addSection);

1925

})

1986

})

1926

.catch(err => {

1987

.catch(err => {

1927

// console.log("err====>", err);

1988

// console.log("err====>", err);

1928

// this.$router.replace({ path: '/' });

1989

// this.$router.replace({ path: '/' });

1929

});

1990

});

1930

},

1991

},

1931

pickFile() {

1992

pickFile() {

1932

this.$refs.image.click();

1993

this.$refs.image.click();

1933

},

1994

},

1934

dates: function(date) {

1995

dates: function(date) {

1935

return moment(date).format("MMMM DD, YYYY");

1996

return moment(date).format("MMMM DD, YYYY");

1936

},

1997

},

1937

onFilePicked(e) {

1998

onFilePicked(e) {

1938

// console.log(e)

1999

// console.log(e)

1939

const files = e.target.files;

2000

const files = e.target.files;

1940

this.imageData.upload = e.target.files[0];

2001

this.imageData.upload = e.target.files[0];

1941

if (files[0] !== undefined) {

2002

if (files[0] !== undefined) {

1942

this.imageName = files[0].name;

2003

this.imageName = files[0].name;

1943

if (this.imageName.lastIndexOf(".") <= 0) {

2004

if (this.imageName.lastIndexOf(".") <= 0) {

1944

return;

2005

return;

1945

}

2006

}

1946

const fr = new FileReader();

2007

const fr = new FileReader();

1947

fr.readAsDataURL(files[0]);

2008

fr.readAsDataURL(files[0]);

1948

fr.addEventListener("load", () => {

2009

fr.addEventListener("load", () => {

1949

this.imageUrl = fr.result;

2010

this.imageUrl = fr.result;

1950

this.imageFile = files[0]; // this is an image file that can be sent to server...

2011

this.imageFile = files[0]; // this is an image file that can be sent to server...

1951

this.imageData.imageUrl = URL.createObjectURL(this.imageFile);

2012

this.imageData.imageUrl = URL.createObjectURL(this.imageFile);

1952

});

2013

});

1953

} else {

2014

} else {

1954

this.imageName = "";

2015

this.imageName = "";

1955

this.imageFile = "";

2016

this.imageFile = "";

1956

this.imageUrl = "";

2017

this.imageUrl = "";

1957

}

2018

}

1958

},

2019

},

1959

// getStudentList() {

2020

// getStudentList() {

1960

// this.showLoader = true;

2021

// this.showLoader = true;

1961

// var token = this.$store.state.token;

2022

// var token = this.$store.state.token;

1962

// http()

2023

// http()

1963

// .get("/getStudentsList", {

2024

// .get("/getStudentsList", {

1964

// headers: { Authorization: "Bearer " + token }

2025

// headers: { Authorization: "Bearer " + token }

1965

// })

2026

// })

1966

// .then(response => {

2027

// .then(response => {

1967

// this.desserts = response.data.data;

2028

// this.desserts = response.data.data;

1968

// this.showLoader = false;

2029

// this.showLoader = false;

1969

// // console.log("getStudentList=====>",this.desserts)

2030

// // console.log("getStudentList=====>",this.desserts)

1970

// })

2031

// })

1971

// .catch(err => {

2032

// .catch(err => {

1972

// // console.log("err====>", err);

2033

// // console.log("err====>", err);

1973

// this.showLoader = false;

2034

// this.showLoader = false;

1974

// this.$router.replace({ path: "/" });

2035

// this.$router.replace({ path: "/" });

1975

// });

2036

// });

1976

// },

2037

// },

1977

editItem(item) {

2038

editItem(item) {

1978

this.editedIndex = this.desserts.indexOf(item);

2039

this.editedIndex = this.desserts.indexOf(item);

1979

this.editedItem = Object.assign({}, item);

2040

this.editedItem = Object.assign({}, item);

1980

this.editedItem.fatherName = item.parentId.fatherName;

2041

this.editedItem.fatherName = item.parentId.fatherName;

1981

this.editedItem.fatherCellNo = item.parentId.fatherCellNo;

2042

this.editedItem.fatherCellNo = item.parentId.fatherCellNo;

1982

this.editedItem.motherName = item.parentId.motherName;

2043

this.editedItem.motherName = item.parentId.motherName;

1983

this.editedItem.motherCellNo = item.parentId.motherCellNo;

2044

this.editedItem.motherCellNo = item.parentId.motherCellNo;

1984

// if(this.editedItem.dob != undefined){

2045

// if(this.editedItem.dob != undefined){

1985

// this.editedItem.dob = this.editedItem.dob.substring(0, 10)

2046

// this.editedItem.dob = this.editedItem.dob.substring(0, 10)

1986

// }else if(this.editedItem.dob = undefined){

2047

// }else if(this.editedItem.dob = undefined){

1987

// this.editedItem.dob = ''

2048

// this.editedItem.dob = ''

1988

// }

2049

// }

1989

this.editedItem.dob =

2050

this.editedItem.dob =

1990

this.editedItem.dob != undefined

2051

this.editedItem.dob != undefined

1991

? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))

2052

? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))

1992

: (this.editedItem.dob = "");

2053

: (this.editedItem.dob = "");

1993

this.dialog = true;

2054

this.dialog = true;

1994

},

2055

},

1995

profile(item) {

2056

profile(item) {

1996

console.log("item", item);

2057

console.log("item", item);

1997

this.editedIndex = this.desserts.indexOf(item);

2058

this.editedIndex = this.desserts.indexOf(item);

1998

this.editedItem = Object.assign({}, item);

2059

this.editedItem = Object.assign({}, item);

1999

this.editedItem.fatherName = item.parentId.fatherName;

2060

this.editedItem.fatherName = item.parentId.fatherName;

2000

this.editedItem.fatherCellNo = item.parentId.fatherCellNo;

2061

this.editedItem.fatherCellNo = item.parentId.fatherCellNo;

2001

this.editedItem.motherName = item.parentId.motherName;

2062

this.editedItem.motherName = item.parentId.motherName;

2002

this.editedItem.motherCellNo = item.parentId.motherCellNo;

2063

this.editedItem.motherCellNo = item.parentId.motherCellNo;

2003

2064

2004

this.dialog1 = true;

2065

this.dialog1 = true;

2005

},

2066

},

2006

deleteItem(item) {

2067

deleteItem(item) {

2007

let deleteStudent = {

2068

let deleteStudent = {

2008

studentId: item._id

2069

studentId: item._id

2009

};

2070

};

2010

http()

2071

http()

2011

.delete(

2072

.delete(

2012

"/deleteStudent",

2073

"/deleteStudent",

2013

confirm("Are you sure you want to delete this?") && {

2074

confirm("Are you sure you want to delete this?") && {

2014

params: deleteStudent

2075

params: deleteStudent

2015

}

2076

}

2016

)

2077

)

2017

.then(response => {

2078

.then(response => {

2018

// console.log("deleteUers",deleteStudent)

2079

// console.log("deleteUers",deleteStudent)

2019

if ((this.snackbar = true)) {

2080

if ((this.snackbar = true)) {

2020

this.text = "Successfully delete Existing Student";

2081

this.text = "Successfully delete Existing Student";

2021

}

2082

}

2022

this.getStudentList();

2083

this.getStudentList();

2023

})

2084

})

2024

.catch(error => {

2085

.catch(error => {

2025

// console.log(error);

2086

// console.log(error);

2026

});

2087

});

2027

},

2088

},

2028

activeTab(type) {

2089

activeTab(type) {

2029

switch (type) {

2090

switch (type) {

2030

case "existing":

2091

case "existing":

2031

this.newActive = false;

2092

this.newActive = false;

2032

this.isActive = true;

2093

this.isActive = true;

2033

break;

2094

break;

2034

2095

2035

default:

2096

default:

2036

this.newActive = true;

2097

this.newActive = true;

2037

this.isActive = false;

2098

this.isActive = false;

2038

break;

2099

break;

2039

}

2100

}

2040

},

2101

},

2041

close() {

2102

close() {

2042

this.dialog = false;

2103

this.dialog = false;

2043

setTimeout(() => {

2104

setTimeout(() => {

2044

this.editedItem = Object.assign({}, this.defaultItem);

2105

this.editedItem = Object.assign({}, this.defaultItem);

2045

this.editedIndex = -1;

2106

this.editedIndex = -1;

2046

}, 300);

2107

}, 300);

2047

},

2108

},

2048

close1() {

2109

close1() {

2049

this.dialog1 = false;

2110

this.dialog1 = false;

2050

},

2111

},

2051

submit() {

2112

submit() {

2052

if (this.$refs.form.validate()) {

2113

if (this.$refs.form.validate()) {

2053

let addStudent = {

2114

let addStudent = {

2054

parentId: this.parentId,

2115

parentId: this.parentId,

2055

2116

2056

email: this.addStudents.email,

2117

email: this.addStudents.email,

2057

role: this.addStudents.role,

2118

role: this.addStudents.role,

2058

dob: this.addStudents.date,

2119

dob: this.addStudents.date,

2059

city: this.addStudents.city,

2120

city: this.addStudents.city,

2060

pincode: this.addStudents.pincode,

2121

pincode: this.addStudents.pincode,

2061

country: this.addStudents.country,

2122

country: this.addStudents.country,

2062

permanentAddress: this.addStudents.permanentAddress,

2123

permanentAddress: this.addStudents.permanentAddress,

2063

presentAddress: this.addStudents.presentAddress,

2124

presentAddress: this.addStudents.presentAddress,

2064

mobile: this.addStudents.mobile,

2125

mobile: this.addStudents.mobile,

2065

state: this.addStudents.state,

2126

state: this.addStudents.state,

2066

gender: this.addStudents.gender,

2127

gender: this.addStudents.gender,

2067

establishmentYear: this.addStudents.establishmentYear,

2128

establishmentYear: this.addStudents.establishmentYear,

2068

classId: this.addStudents.select,

2129

classId: this.addStudents.select,

2069

sectionId: this.addStudents.selectSection,

2130

sectionId: this.addStudents.selectSection,

2070

bloodGroup: this.addStudents.bloodGroup,

2131

bloodGroup: this.addStudents.bloodGroup,

2071

allergies: this.addStudents.allergies,

2132

allergies: this.addStudents.allergies,

2072

medicalNotes: this.addStudents.medicalNotes,

2133

medicalNotes: this.addStudents.medicalNotes,

2073

height: this.addStudents.height,

2134

height: this.addStudents.height,

2074

weight: this.addStudents.weight

2135

weight: this.addStudents.weight,

2136

rollNo: this.addStudents.rollNo

2075

};

2137

};

2076

if (this.imageUrl) {

2138

if (this.imageUrl) {

2077

var str = this.imageUrl;

2139

var str = this.imageUrl;

2078

const [baseUrl, imageUrl] = str.split(/,/);

2140

const [baseUrl, imageUrl] = str.split(/,/);

2079

addStudent.upload = imageUrl;

2141

addStudent.upload = imageUrl;

2080

}

2142

}

2081

this.loading = true;

2143

this.loading = true;

2082

http()

2144

http()

2083

.post("/createStudent", addStudent)

2145

.post("/createStudent", addStudent)

2084

.then(response => {

2146

.then(response => {

2085

console.log(addStudent);

2147

console.log(addStudent);

2086

if ((this.snackbar = true)) {

2148

if ((this.snackbar = true)) {

2087

this.text = "New Student added successfully";

2149

this.text = "New Student added successfully";

2088

}

2150

}

2089

// this.getStudentList();

2151

// this.getStudentList();

2090

this.clear();

2152

this.clear();

2091

this.loading = false;

2153

this.loading = false;

2092

})

2154

})

2093

.catch(error => {

2155

.catch(error => {

2094

// console.log(error);

2156

// console.log(error);

2095

if ((this.snackbar = true)) {

2157

if ((this.snackbar = true)) {

2096

this.text = error.response.data.message;

2158

this.text = error.response.data.message;

2097

}

2159

}

2098

this.loading = false;

2160

this.loading = false;

2099

});

2161

});

2100

}

2162

}

2101

},

2163

},

2102

mail() {},

2164

mail() {},

2103

download() {},

2165

download() {},

2104

clear() {

2166

clear() {

2105

this.$refs.form.reset();

2167

this.$refs.form.reset();

2106

},

2168

},

2107

save() {

2169

save() {

2108

let editStudent = {

2170

let editStudent = {

2109

studentId: this.editedItem._id,

2171

studentId: this.editedItem._id,

2110

2172

2111

email: this.editedItem.email,

2173

email: this.editedItem.email,

2112

role: this.editedItem.role,

2174

role: this.editedItem.role,

2113

dob: this.editedItem.dob,

2175

dob: this.editedItem.dob,

2114

city: this.editedItem.city,

2176

city: this.editedItem.city,

2115

pincode: this.editedItem.pincode,

2177

pincode: this.editedItem.pincode,

2116

country: this.editedItem.country,

2178

country: this.editedItem.country,

2117

permanentAddress: this.editedItem.permanentAddress,

2179

permanentAddress: this.editedItem.permanentAddress,

2118

presentAddress: this.editedItem.presentAddress,

2180

presentAddress: this.editedItem.presentAddress,

2119

mobile: this.editedItem.mobile,

2181

mobile: this.editedItem.mobile,

2120

state: this.editedItem.state,

2182

state: this.editedItem.state,

2121

gender: this.editedItem.gender,

2183

gender: this.editedItem.gender,

2122

establishmentYear: this.editedItem.establishmentYear,

2184

establishmentYear: this.editedItem.establishmentYear,

2123

classId: this.editedItem.select,

2185

classId: this.editedItem.select,

2124

sectionId: this.editedItem.selectSection,

2186

sectionId: this.editedItem.selectSection,

2125

bloodGroup: this.editedItem.bloodGroup,

2187

bloodGroup: this.editedItem.bloodGroup,

2126

allergies: this.editedItem.allergies,

2188

allergies: this.editedItem.allergies,

2127

medicalNotes: this.editedItem.medicalNotes,

2189

medicalNotes: this.editedItem.medicalNotes,

2128

height: this.editedItem.height,

2190

height: this.editedItem.height,

2129

weight: this.editedItem.weight

2191

weight: this.editedItem.weight,

2192

rollNo: this.editedItem.rollNo

2130

};

2193

};

2131

if (this.imageUrl) {

2194

if (this.imageUrl) {

2132

var str = this.imageUrl;

2195

var str = this.imageUrl;

2133

const [baseUrl, imageUrl] = str.split(/,/);

2196

const [baseUrl, imageUrl] = str.split(/,/);

2134

editStudent.upload = imageUrl;

2197

editStudent.upload = imageUrl;

2135

}

2198

}

2136

http()

2199

http()

2137

.put("/updateStudent", editStudent)

2200

.put("/updateStudent", editStudent)

2138

.then(response => {

2201

.then(response => {

2139

if ((this.snackbar = true)) {

2202

if ((this.snackbar = true)) {

2140

this.text = "Successfully Student Existing User";

2203

this.text = "Successfully Student Existing User";

2141

}

2204

}

2142

this.findStudents();

2205

this.findStudents();

2143

this.close();

2206

this.close();

2144

})

2207

})

2145

.catch(error => {

2208

.catch(error => {

2146

// console.log(error);

2209

// console.log(error);

2147

if ((this.snackbar = true)) {

2210

if ((this.snackbar = true)) {

2148

this.text = error.response.data.statusText;

2211

this.text = error.response.data.statusText;

2149

}

2212

}

2150

});

2213

});

2151

},

2214

},

2152

submitParentDetails() {

2215

submitParentDetails() {

2153

if (this.$refs.parentForm.validate()) {

2216

if (this.$refs.parentForm.validate()) {

2154

let addparentDetails = {

2217

let addparentDetails = {

2155

email: this.parentData.email,

2218

email: this.parentData.email,

2156

fatherName: this.parentData.fatherName,

2219

fatherName: this.parentData.fatherName,

2157

fatherCellNo: this.parentData.fatherCellNo,

2220

fatherCellNo: this.parentData.fatherCellNo,

2158

motherName: this.parentData.motherName,

2221

motherName: this.parentData.motherName,

2159

motherCellNo: this.parentData.motherCellNo,

2222

motherCellNo: this.parentData.motherCellNo,

2160

role: "PARENT"

2223

role: "PARENT"

2161

};

2224

};

2162

this.loading = true;

2225

this.loading = true;

2163

http()

2226

http()

2164

.post("/createParent", addparentDetails)

2227

.post("/createParent", addparentDetails)

2165

.then(response => {

2228

.then(response => {

2166

this.parentId = response.data.data.id;

2229

this.parentId = response.data.data.id;

2167

this.e2 = 2;

2230

this.e2 = 2;

2168

if ((this.snackbar = true)) {

2231

if ((this.snackbar = true)) {

2169

this.text = "successfully";

2232

this.text = "successfully";

2170

}

2233

}

2171

// this.getStudentList();

2234

// this.getStudentList();

2172

this.clear();

2235

this.clear();

2173

this.loading = false;

2236

this.loading = false;

2174

})

2237

})

2175

.catch(error => {

2238

.catch(error => {

2176

console.log(error.response.data);

2239

console.log(error.response.data);

2177

if ((this.snackbar = true)) {

2240

if ((this.snackbar = true)) {

2178

this.text = error.response.data.message;

2241

this.text = error.response.data.message;

2179

this.text = error.response.data.statusText;

2242

this.text = error.response.data.statusText;

2180

}

2243

}

2181

this.loading = false;

2244

this.loading = false;

2182

});

2245

});

2183

}

2246

}

2184

},

2247

},

2185

getParentDetails() {

2248

getParentDetails() {

2186

if (this.parentData.email) {

2249

if (this.parentData.email) {

2187

http()

2250

http()

2188

.get("getParticularParent", {

2251

.get("getParticularParent", {

2189

params: { email: this.parentData.email },

2252

params: { email: this.parentData.email },

2190

headers: {

2253

headers: {

2191

Authorization: "Bearer " + this.$store.state.token

2254

Authorization: "Bearer " + this.$store.state.token

2192

}

2255

}

2193

})

2256

})

2194

.then(response => {

2257

.then(response => {

2195

this.showNext = true;

2258

this.showNext = true;

2196

this.showParent = false;

2259

this.showParent = false;

2197

this.parentData = response.data.data;

2260

this.parentData = response.data.data;

2198

this.parentId = response.data.data._id;

2261

this.parentId = response.data.data._id;

2199

})

2262

})

2200

.catch(error => {

2263

.catch(error => {

2201

console.log("err====>", error.response.data.message);

2264

console.log("err====>", error.response.data.message);

2202

});

2265

});

2203

}

2266

}

2204

},

2267

},

2205

handleDrawerToggle() {

2268

handleDrawerToggle() {

2206

window.getApp.$emit("APP_DRAWER_TOGGLED");

2269

window.getApp.$emit("APP_DRAWER_TOGGLED");

2207

},

2270

},

2208

handleFullScreen() {

2271

handleFullScreen() {

2209

Util.toggleFullScreen();

2272

Util.toggleFullScreen();

2210

}

2273

}

2211

},

2274

},

2212

mounted() {

2275

mounted() {

2213

// this.getStudentList();

2276

// this.getStudentList();

2214

var token = this.$store.state.token;

2277

var token = this.$store.state.token;

2215

http()

2278

http()

2216

.get("/getClassesList", {

2279

.get("/getClassesList", {

2217

headers: { Authorization: "Bearer " + token }

2280

headers: { Authorization: "Bearer " + token }

2218

})

2281

})

2219

.then(response => {

2282

.then(response => {

2220

this.addclass = response.data.data;

2283

this.addclass = response.data.data;

2221

})

2284

})

2222

.catch(err => {

2285

.catch(err => {

2223

// console.log("err====>", err);

2286

// console.log("err====>", err);

2224

this.$router.replace({ path: "/" });

2287

this.$router.replace({ path: "/" });

2225

});

2288

});

2226

},

2289

},

2227

2290

2228

// console.log("Id",this.$store.state.id)

2291

// console.log("Id",this.$store.state.id)

2229

// console.log("token",this.$store.state.token)

2292

// console.log("token",this.$store.state.token)

2230

computed: {

2293

computed: {

2231

toolbarColor() {

2294

toolbarColor() {

2232

return this.$vuetify.options.extra.mainNav;

2295

return this.$vuetify.options.extra.mainNav;

2233

}

2296

}

2234

}

2297

}

2235

};

2298

};

2236

</script>

2299

</script>

2237

2300

2238

.v-tabs__div {

2301

.v-tabs__div {

2239

text-transform: none;

2302

text-transform: none;

2240

}

2303

}

2241

.v-input__prepend-outer {

2304

.v-input__prepend-outer {

2242

margin-right: 0px !important;

2305

margin-right: 0px !important;

2243

}

2306

}

2244

.v-card__actions .v-btn {

2307

.v-card__actions .v-btn {

2245

margin: 0 15px;

2308

margin: 0 15px;

2246

min-width: 120px;

2309

min-width: 120px;

2247

}

2310

}

2248

.primary {

2311

.primary {

2249

background-color: #aaa !important;

2312

background-color: #aaa !important;

2250

border-color: #aaa !important;

2313

border-color: #aaa !important;

2251

}

2314

}

2252

h4 {

2315

h4 {

2253

background-repeat: no-repeat;

2316

background-repeat: no-repeat;

2254

padding: 8px;

2317

padding: 8px;

2255

margin: auto;

2318

margin: auto;

2256

font-size: 25px;

2319

font-size: 25px;

2257

}

2320

}

2258

#name {

2321

#name {

2259

position: absolute;

2322

position: absolute;

2260

left: 100px;

2323

left: 100px;

2261

top: 17px;

2324

top: 17px;

2262

}

2325

}

2263

#icon {

2326

#icon {

2264

position: absolute;

2327

position: absolute;

2265

right: 8px;

2328

right: 8px;

2266

top: 8px;

2329

top: 8px;

2267

}

2330

}

2268

#m {

2331

#m {

2269

position: relative;

2332

position: relative;

2270

left: 135px;

2333

left: 135px;

2271

top: -15px;

2334

top: -15px;

2272

}

2335

}

2273

#G {

2336

#G {

2274

position: absolute;

2337

position: absolute;

2275

top: 38px;

2338

top: 38px;

2276

color: white;

2339

color: white;

2277

}

2340

}

2278

#bt {

2341

#bt {

2279

position: relative;

2342

position: relative;

2280

top: -20px;

2343

top: -20px;

2281

left: 115px;

2344

left: 115px;

2282

}

2345

}

2283

#e {

2346

#e {

2284

position: relative;

2347

position: relative;

2285

top: 5px;

2348

top: 5px;

2286

right: -30px;

2349

right: -30px;

2287

height: 17px;

2350

height: 17px;

2288

cursor: pointer;

2351

cursor: pointer;

2289

}

2352

}

2290

#d {

2353

#d {

2291

position: relative;

2354

position: relative;

2292

top: 5px;

2355

top: 5px;

2293

right: -70px;

2356

right: -70px;

2294

height: 17px;

2357

height: 17px;

2295

cursor: pointer;

2358

cursor: pointer;

2296

}

2359

}

2297

#td {

2360

#td {

2298

border: 1px solid #dddddd;

2361

border: 1px solid #dddddd;

2299

text-align: left;

2362

text-align: left;

2300

padding: 8px;

2363

padding: 8px;

2301

}

2364

}

2302

#dialog {

2365

#dialog {

2303

height: 550px;

2366

height: 550px;

2304

}

2367

}

2305

.active {

2368

.active {

2306

background-color: black;

2369

background-color: black;

2307

color: white !important;

2370

color: white !important;

2308

}

2371

}

2309

.activebtn {

2372

.activebtn {

2310

color: black !important;

2373

color: black !important;

2311

}

2374

}

2312

#flex {

2375

#flex {

2313

height: 300px;

2376

height: 300px;

2314

}

2377

}

2315

.top {

2378

.top {

2316

margin-top: 100px;

2379

margin-top: 100px;

2317

}

2380

}

2318

.v-tabs__item a {

2381

.v-tabs__item a {

2319

font-size: 16px !important;

2382

font-size: 16px !important;

2320

}

2383

}

2321

@media screen and (max-width: 769px) {

2384

@media screen and (max-width: 769px) {

2322

.top {

2385

.top {

2323

margin-top: 0 !important;

2386

margin-top: 0 !important;

2324

}

2387

}

2325

.userSearch .v-icon {

2388

.userSearch .v-icon {

2326

font-size: 20px !important;

2389

font-size: 20px !important;

2327

margin-left: 20px;

2390

margin-left: 20px;

2328

}

2391

}

2329

}

2392

}

2330

@media screen and (max-width: 380px) {

2393

@media screen and (max-width: 380px) {

2331

.pl-3 {

2394

.pl-3 {

2332

padding-left: 0px !important;

2395

padding-left: 0px !important;

2333

}

2396

}

2334

.right {

2397

.right {

2335

float: none !important;

2398

float: none !important;

2336

}

2399

}

2337

.subheading {

2400

.subheading {

2338

font-size: 14px !important;

2401

font-size: 14px !important;

2339

}

2402

}

2340

.v-card__actions .v-btn {

2403

.v-card__actions .v-btn {

2341

margin: 0 0px;

2404

margin: 0 0px;

2342

min-width: 100px;

2405

min-width: 100px;

2343

}

2406

}

2344

/* .searchIcon .v-icon {

2407

/* .searchIcon .v-icon {

2345

font-size: 20px;

2408

font-size: 20px;

2346

margin-left: 20px;

2409

margin-left: 20px;

2347

} */

2410

} */

2348

.subheading {

2411

.subheading {

2349

font-size: 12px !important;

2412

font-size: 12px !important;

2350

}

2413

}

2351

h5 {

2414

h5 {

2352

font-size: 13px;

2415

font-size: 13px;

2353

}

2416

}

2354

}

2417

}

2355

.v-icon {

2418

.v-icon {

2356

font-size: 30px;

2419

font-size: 30px;

2357

}

2420

}

2358

@media screen and (min-width: 1270px) {

2421

@media screen and (min-width: 1270px) {

2359

.hide {

2422

.hide {

2360

display: none;

2423

display: none;

2361

}

2424

}

2362

/* }

2425

/* }

2363

@media screen and (max-width: 962px) {

2426

@media screen and (max-width: 962px) {

2364

.imglogo{

2427

.imglogo{

2365

position: absolute;

2428

position: absolute;

2366

top: 13px;

2429

top: 13px;

2367

left: 13px !important;

2430

left: 13px !important;

2368

width: 70px;

2431

width: 70px;

2369

height: 24px;

2432

height: 24px;

2370

} */

2433

} */

2371

}

2434

}

2372

@media screen and (max-width: 420px) {

2435

@media screen and (max-width: 420px) {

2373

.userSearch .v-text-field .v-label {

2436

.userSearch .v-text-field .v-label {

2374

line-height: 24px !important;

2437

line-height: 24px !important;

2375

}

2438

}

2376

.userSearch .v-label {

2439

.userSearch .v-label {

2377

font-size: 13px !important;

2440

font-size: 13px !important;

2378

}

2441

}

2379

.v-list__tile {

2442

.v-list__tile {

2380

font-size: 14px;

2443

font-size: 14px;

2381

padding: 0 10px;

2444

padding: 0 10px;

2382

}

2445

}

2383

.name {

2446

.name {

2384

font-size: 15px;

2447

font-size: 15px;

2385

}

2448

}

2386

}

2449

}

2387

</style>

2450

</style>

GITLAB

viithiisys / School-Management-dashboard

add field roll number in students

 <template>
   <v-app id="pages-dasboard">
     <v-toolbar class="fixcolors" fixed app>
       <v-toolbar-title class="ml-0 pl-3">
         <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>
       </v-toolbar-title>
       <!-- ****** SEARCH ALL EXISTING StudentS ****** -->
       <v-flex xs7 sm3 class="userSearch">
         <v-text-field
           flat
           append-icon="search"
           label="Find your Students"
           v-model="search"
           color="white"
           dark
         ></v-text-field>
       </v-flex>
       <v-spacer></v-spacer>
       <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">
         <v-btn icon large flat slot="activator">
           <v-avatar size="40px">
             <img src="/static/icon/user.png" />
           </v-avatar>
         </v-btn>
         <v-list class="pa-0">
           <v-list-tile
             v-for="(item,index) in items"
             :to="!item.href ? { name: item.name } : null"
             :href="item.href"
             @click="item.click"
             ripple="ripple"
             :disabled="item.disabled"
             :target="item.target"
             rel="noopener"
             :key="index"
           >
             <v-list-tile-action v-if="item.icon">
               <v-icon>{{ item.icon }}</v-icon>
             </v-list-tile-action>
             <v-list-tile-content>
               <v-list-tile-title>{{ item.title }}</v-list-tile-title>
             </v-list-tile-content>
           </v-list-tile>
         </v-list>
       </v-menu>
     </v-toolbar>
     <v-tabs grow slider-color="black">
       <v-tab
         ripple
         @click="activeTab('existing')"
         v-bind:class="{ active: isActive }"
         id="tab"
         class="subheading"
       >Existing Students</v-tab>
       <v-tab
         ripple
         @click="activeTab('new')"
         v-bind:class="{ active: newActive }"
         id="tab1"
         User
         class="subheading"
       >Add New Students</v-tab>
       <!-- ****** EDITS  STUDENTS DETAILS ****** -->
       <v-tab-item>
         <v-snackbar
           :timeout="timeout"
           :top="y === 'top'"
           :right="x === 'right'"
           :vertical="mode === 'vertical'"
           v-model="snackbar"
           color="success"
         >{{ text }}</v-snackbar>
         <v-dialog v-model="dialog" max-width="1300px" scrollable>
           <v-card flat style="height: 800px;">
             <v-toolbar color="grey lighten-2" flat>
               <v-spacer></v-spacer>
               <v-toolbar-title>
                 <h3>Edit Student Profile</h3>
               </v-toolbar-title>
               <v-spacer></v-spacer>
             </v-toolbar>
-            <v-card-text >
+            <v-card-text>
               <v-form ref="form">
                 <v-container fluid>
                   <v-layout>
                     <v-flex
                       xs12
                       class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
                     >
                       <v-avatar size="160px">
                         <img
                           src="/static/icon/user.png"
                           v-if="!editedItem.profilePicUrl && !imageUrl"
                         />
                         <img
                           :src="editedItem.profilePicUrl"
                           v-else-if="editedItem.profilePicUrl && !imageUrl"
                         />
                         <img
                           v-if="imageUrl"
                           :src="imageUrl"
                           height="150"
                           style="border-radius:50%; width:200px"
                         />
                       </v-avatar>
                       <input
                         type="file"
                         style="display: none"
                         ref="image"
                         accept="image/*"
                         @change="onFilePicked"
                       />
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Select Class:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-select
                             :items="addclass"
                             label="Select Class"
                             v-model="editedItem.select"
                             item-text="classNum"
                             item-value="_id"
                             name="Select Class"
                             @change="getSections(editedItem.select)"
                             required
                           ></v-select>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Select Section:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-select
                             :items="addSection"
                             label="Select Section"
                             v-model="editedItem.selectSection"
                             item-text="name"
                             item-value="_id"
                             name="Select Section"
                             required
                           ></v-select>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Full Name:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.name"
                             placeholder="fill your full Name"
                             name="name"
                             type="text"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Email ID:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             placeholder="fill your email"
                             v-model="editedItem.email"
                             type="text"
                             name="email"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Date of Birth:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-menu
                             ref="menu"
                             :close-on-content-click="false"
                             v-model="menu1"
                             :nudge-right="40"
                             lazy
                             transition="scale-transition"
                             offset-y
                             full-width
                             min-width="290px"
                           >
                             <v-text-field
                               slot="activator"
                               v-model="editedItem.dob"
                               placeholder="Select Dob"
                             ></v-text-field>
                             <v-date-picker
                               ref="picker"
                               v-model="editedItem.dob"
                               :max="new Date().toISOString().substr(0, 10)"
                               min="1950-01-01"
                               @input="menu1 = false"
                             ></v-date-picker>
                           </v-menu>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">City:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.city"
                             placeholder="fill your City Name"
                             name="City"
                             type="text"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Blood Group:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.bloodGroup"
                             placeholder="fill your BloodGroup"
                             name="state"
                             type="text"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Allergies:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.allergies"
                             placeholder="fill your Allergies"
                             name="pincode"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Medical Notes:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.medicalNotes"
                             placeholder="fill your medicalNotes"
                             name="mobileNo"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Height:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.height"
                             placeholder="fill your Height"
                             name="state"
                             type="text"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Weight:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.weight"
                             placeholder="fill your Weight"
                             name="pincode"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Uplaod Image:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             label="Select Image"
                             @click="pickFile"
                             v-model="imageName"
                             append-icon="attach_file"
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">State:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.state"
                             placeholder="fill your State Name"
                             name="state"
                             type="text"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Pincode:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.pincode"
                             placeholder="fill your pincode"
                             name="pincode"
                             type="number"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Mobile No:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="editedItem.mobile"
                             placeholder="fill your MobileNo"
                             name="mobileNo"
                             type="number"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Select Country:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-autocomplete
                             v-model="editedItem.country"
                             :items="countries"
                             placeholder="Select Country Name"
                             required
                           ></v-autocomplete>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                     <v-flex xs12 sm4>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right">Gender:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-select
                             :items="gender"
                             v-model="editedItem.gender"
                             placeholder="Select Gender"
                             required
                           ></v-select>
                         </v-flex>
                       </v-layout>
                     </v-flex>
+                    <v-flex xs12 sm4>
+                      <v-layout>
+                        <v-flex xs4 class="pt-4 subheading">
+                          <label class="right">Roll Number:</label>
+                        </v-flex>
+                        <v-flex xs8 class="ml-3">
+                          <v-text-field
+                            :items="gender"
+                            v-model="editedItem.rollNo"
+                            placeholder="fill roll number"
+                            required
+                          ></v-text-field>
+                        </v-flex>
+                      </v-layout>
+                    </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12>
                       <v-layout>
                         <v-flex
                           xs1
                           class="pt-4 subheading"
                           style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"
                         >
                           <label class="right">Present Address:</label>
                         </v-flex>
                         <v-flex xs11 class="ml-2">
                           <v-text-field
                             v-model="editedItem.presentAddress"
                             placeholder="fill Your present Address"
                             required
                           ></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12>
                       <v-layout>
                         <v-flex
                           xs1
                           class="pt-4 subheading"
                           style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"
                         >
                           <label class="right">Permanent Address:</label>
                         </v-flex>
                         <v-flex xs11 class="ml-2">
                           <v-textarea
                             rows="1"
                             v-model="editedItem.permanentAddress"
                             placeholder="fill Your Permanent Address"
                             required
                           ></v-textarea>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm12>
                       <v-card-actions>
                         <v-btn round dark @click.native="close">Cancel</v-btn>
                         <v-spacer></v-spacer>
                         <v-btn round dark @click="save">Save</v-btn>
                       </v-card-actions>
                     </v-flex>
                   </v-layout>
                 </v-container>
               </v-form>
             </v-card-text>
           </v-card>
         </v-dialog>
         <!-- ****** PROFILE VIEW STUDENTS DEATILS ******  -->
         <v-dialog v-model="dialog1" max-width="1100px" scrollable>
           <v-card style="height: 700px;">
             <v-toolbar color="grey lighten-2" flat>
               <v-spacer></v-spacer>
               <v-toolbar-title>Student Profile</v-toolbar-title>
               <v-spacer></v-spacer>
               <v-icon @click="close1">close</v-icon>
             </v-toolbar>
             <v-card-text>
               <v-flex align-center justify-center layout text-xs-center class="mt-3">
                 <v-avatar size="160px">
                   <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
                   <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
                 </v-avatar>
               </v-flex>
               <v-container grid-list-md>
                 <v-layout wrap>
                   <v-flex>
                     <v-layout>
                       <v-flex xs12 sm6>
                         <v-layout>
                           <v-flex xs6 sm5>
                             <h5 class="right my-1">
                               <b>Full Name:</b>
                             </h5>
                           </v-flex>
                           <v-flex sm7 xs6>
                             <h5 class="my-1 left">{{ editedItem.name }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs12 sm6>
                         <v-layout>
                           <v-flex xs4 sm4>
                             <h5 class="right my-1">
                               <b>Email:</b>
                             </h5>
                           </v-flex>
                           <v-flex sm8 xs8>
                             <h5 class="my-1 left">{{ editedItem.email }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm5>
                             <b>
                               <h5 class="right my-1">
                                 <b>Gender:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm7 xs8>
                             <h5 class="my-1 left">{{ editedItem.gender }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm4>
                             <b>
                               <h5 class="right my-1">
                                 <b>D.O.B:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm7 xs8>
                             <h5 class="my-1">{{ dates(editedItem.dob) }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm5>
                             <b>
                               <h5 class="right my-1">
                                 <b>Blood Group:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm7 xs8>
                             <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm4>
                             <b>
                               <h5 class="right my-1">
                                 <b>Allergies:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm8 xs8>
                             <h5 class="my-1">{{ editedItem.allergies }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm5>
                             <b>
                               <h5 class="right my-1">
                                 <b>Height:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm7 xs8>
                             <h5 class="my-1 left">{{ editedItem.height }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm4>
                             <b>
                               <h5 class="right my-1">
                                 <b>Weight:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm8 xs8>
                             <h5 class="my-1">{{ editedItem.weight }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm5>
                             <b>
                               <h5 class="right my-1">
                                 <b>City:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm7 xs8>
                             <h5 class="my-1 left">{{ editedItem.city }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm4>
                             <b>
                               <h5 class="right my-1">
                                 <b>State:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm8 xs8>
                             <h5 class="my-1">{{ editedItem.state }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm5>
                             <b>
                               <h5 class="right my-1">
                                 <b>Pincode:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm7 xs8>
                             <h5 class="my-1">{{ editedItem.pincode }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs5 sm5>
                         <v-layout>
                           <v-flex xs4 sm5>
                             <b>
                               <h5 class="right my-1">
                                 <b>Country:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm7 xs8>
                             <h5 class="my-1">{{ editedItem.country }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs5 sm6>
                         <v-layout>
                           <v-flex sm5 xs8>
                             <b>
                               <h5 class="right my-1">
                                 <b>Mobile No:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm6 xs8>
                             <h5 class="my-1">{{ editedItem.mobile }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs5 sm6>
                         <v-layout>
                           <v-flex xs5 sm4>
                             <b>
                               <h5 class="right my-1">
                                 <b>Fahter Name:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm8 xs8>
                             <h5 class="my-1">{{ editedItem.fatherName }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm5>
                         <v-layout>
                           <v-flex xs4 sm6>
                             <b>
                               <h5 class="right my-1">
                                 <b>Mother Name:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm6 xs8>
                             <h5 class="my-1">{{ editedItem.motherName }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs4 sm6>
                             <b>
                               <h5 class="right my-1">
                                 <b>Father Cell No:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm6 xs8>
                             <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm5>
                         <v-layout>
                           <v-flex xs4 sm6>
                             <b>
                               <h5 class="right my-1">
                                 <b>Mother Cell No:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm6 xs8>
                             <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs6 sm6>
                         <v-layout>
                           <v-flex xs5 sm6>
                             <b>
                               <h5 class="my-1 right">
                                 <b>Academic Year:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm5 xs8>
                             <h5 class="my-1">{{ editedItem.establishmentYear }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
                       <v-flex xs6 sm5>
                         <v-layout>
                           <v-flex xs5 sm6>
                             <b>
                               <h5 class="my-1 right">
                                 <b>Medical Notes:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm5 xs8>
                             <h5 class="my-1">{{ editedItem.medicalNotes }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                       <v-flex xs12 sm6>
                         <v-layout>
                           <v-flex xs6 sm6>
                             <b>
                               <h5 class="right my-1">
-                                <b>present Address:</b>
+                                <b>Roll Number:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm6 xs8>
-                            <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
+                            <h5 class="my-1">{{ editedItem.rollNo }}</h5>
                           </v-flex>
                         </v-layout>
                       </v-flex>
                     </v-layout>
                     <v-layout>
-                      <v-flex xs12 sm12>
+                      <v-flex xs6 sm5>
+                        <v-layout>
+                          <v-flex xs5 sm6>
+                            <b>
+                              <h5 class="my-1 right">
+                                <b>present Address:</b>
+                              </h5>
+                            </b>
+                          </v-flex>
+                          <v-flex sm5 xs8>
+                            <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
+                          </v-flex>
+                        </v-layout>
+                      </v-flex>
+                      <v-flex xs12 sm6>
+                        <v-layout>
+                          <v-flex xs6 sm6>
+                            <b>
+                              <h5 class="right my-1">
+                                <b>present Address:</b>
+                              </h5>
+                            </b>
+                          </v-flex>
+                          <v-flex sm6 xs8>
+                            <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
+                          </v-flex>
+                        </v-layout>
+                      </v-flex>
+                      <!-- <v-flex xs12 sm12>
                         <v-layout>
                           <v-flex xs4 sm3>
                             <b>
                               <h5 class="right my-1">
                                 <b>Permanent Address:</b>
                               </h5>
                             </b>
                           </v-flex>
                           <v-flex sm9 xs8>
                             <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
                           </v-flex>
                         </v-layout>
-                      </v-flex>
+                      </v-flex>-->
                     </v-layout>
                   </v-flex>
                 </v-layout>
               </v-container>
             </v-card-text>
           </v-card>
         </v-dialog>
         <v-snackbar
           :timeout="timeout"
           :top="y === 'top'"
           :right="x === 'right'"
           :vertical="mode === 'vertical'"
           v-model="snackbar"
           color="success"
         >{{ text }}</v-snackbar>
         <!-- ****** EXISTING-USERS STUDENTS TABLE ****** -->
         <v-card flat>
           <v-card-actions>
             <v-layout>
               <label class="right mt-4 ml-5">Select Class:</label>
               <v-select
                 :items="addclass"
                 label="Select Class"
                 v-model="selectStudents.select"
                 item-text="classNum"
                 item-value="_id"
                 name="Select Class"
                 :rules="classRules"
                 @change="getSections(selectStudents.select)"
                 class="px-4"
                 required
               ></v-select>
               <label class="right mt-4">Select Section:</label>
               <v-select
                 :items="addSection"
                 label="Select Section"
                 v-model="selectStudents.selectSection"
                 item-text="name"
                 item-value="_id"
                 name="Select Section"
                 :rules="sectionRules"
                 class="pl-3"
                 required
               ></v-select>
             </v-layout>
             <v-spacer></v-spacer>
             <v-btn @click="findStudents()" round dark :loading="loading" class="left">Find</v-btn>
           </v-card-actions>
         </v-card>
         <v-data-table
           :headers="headers"
           :items="desserts"
           :pagination.sync="pagination"
           :search="search"
         >
           <template slot="items" slot-scope="props">
             <td id="td" class="text-xs-center">{{ props.index}}</td>
             <td id="td" class="text-xs-center">
               <v-avatar>
                 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" />
                 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" />
               </v-avatar>
             </td>
             <td id="td" class="text-xs-center">{{ props.item.name}}</td>
             <td id="td" class="text-xs-center">{{ props.item.email }}</td>
             <td id="td" class="text-xs-center">{{ dates(props.item.dob) }}</td>
             <td id="td" class="text-xs-center">{{ props.item.gender }}</td>
             <td id="td" class="text-xs-center">{{ props.item.parentId.fatherName }}</td>
             <td id="td" class="text-xs-center">{{ props.item.parentId.motherName }}</td>
             <td id="td" class="text-xs-center">{{ props.item.establishmentYear }}</td>
             <td id="td" class="text-xs-center">{{ props.item.mobile}}</td>
             <td class="text-xs-center">
               <span>
                 <img
                   style="cursor:pointer; width:25px; height:18px; "
                   class="mr-5"
                   @click="profile(props.item)"
                   src="/static/icon/eye1.png"
                 />
                 <img
                   style="cursor:pointer; width:20px; height:18px; "
                   class="mr-5"
                   @click="editItem(props.item)"
                   src="/static/icon/edit1.png"
                 />
                 <img
                   style="cursor:pointer;width:20px; height:20px; "
                   class="mr-5"
                   @click="deleteItem(props.item)"
                   src="/static/icon/delete1.png"
                 />
               </span>
             </td>
           </template>
           <v-alert
             slot="no-results"
             :value="true"
             color="error"
             icon="warning"
           >Your search for "{{ search }}" found no results.</v-alert>
         </v-data-table>
       </v-tab-item>
       <!-- ****** ADD STUDENTS DETAILS****** -->
       <v-tab-item>
         <v-container fluid>
           <v-layout align-center justify-center fill-height>
             <v-flex xs12 sm8 md7 lg8>
               <div>
                 <v-app>
                   <v-stepper v-model="e2">
                     <v-stepper-header>
                       <v-stepper-step :complete="e2 > 1" step="1">Fill parent Details</v-stepper-step>
                       <v-divider></v-divider>
                       <v-stepper-step step="2">Fill Student Details</v-stepper-step>
                     </v-stepper-header>
                     <v-stepper-items>
                       <v-stepper-content step="1">
                         <v-container fluid class>
                           <v-layout>
                             <v-flex xs12>
                               <v-snackbar
                                 :timeout="timeout"
                                 :top="y === 'top'"
                                 :right="x === 'right'"
                                 :vertical="mode === 'vertical'"
                                 v-model="snackbar"
                                 color="success"
                               >{{ text }}</v-snackbar>
                               <v-flex xs12 sm12>
                                 <v-form ref="parentForm" v-model="valid" lazy-validation>
                                   <v-container fluid>
                                     <v-layout>
                                       <v-flex xs12 sm6>
                                         <v-layout>
                                           <v-flex xs4 class="pt-4 subheading">
                                             <label class="right">Parent Email Id:</label>
                                           </v-flex>
                                           <v-flex xs8 class="ml-3">
                                             <v-text-field
                                               placeholder="fill Parent email"
                                               :rules="emailRules"
-                                              v-model="parentData.email"
+                                              v-model.trim="parentData.email"
                                               type="text"
                                               v-on:keyup="getParentDetails"
                                               name="email"
                                               required
                                             ></v-text-field>
                                           </v-flex>
                                         </v-layout>
                                       </v-flex>
                                       <v-flex xs12 sm6>
                                         <v-layout>
                                           <v-flex xs4 class="pt-4 subheading">
                                             <label class="right">Father Name:</label>
                                           </v-flex>
                                           <v-flex xs8 class="ml-3">
                                             <v-text-field
                                               v-model="parentData.fatherName"
                                               :rules="fatherNameRules"
                                               placeholder="Fill your father Name"
                                               required
                                             ></v-text-field>
                                           </v-flex>
                                         </v-layout>
                                       </v-flex>
                                     </v-layout>
                                     <v-layout>
                                       <v-flex xs12 sm6>
                                         <v-layout>
                                           <v-flex xs4 class="pt-4 subheading">
                                             <label class="right">Father Cell No:</label>
                                           </v-flex>
                                           <v-flex xs8 class="ml-3">
                                             <v-text-field
                                               v-model="parentData.fatherCellNo"
                                               placeholder="fill your father Cell Number"
                                               name="state"
                                               type="number"
                                               :rules="fatheCellNoRules"
                                               required
                                             ></v-text-field>
                                           </v-flex>
                                         </v-layout>
                                       </v-flex>
                                       <v-flex xs12 sm6>
                                         <v-layout>
                                           <v-flex xs4 class="pt-4 subheading">
                                             <label class="right">Mother Name:</label>
                                           </v-flex>
                                           <v-flex xs8 class="ml-3">
                                             <v-text-field
                                               v-model="parentData.motherName"
                                               placeholder="fill your Mother Name"
                                               name="state"
                                               type="text"
                                               :rules="motherNameRules"
                                               required
                                             ></v-text-field>
                                           </v-flex>
                                         </v-layout>
                                       </v-flex>
                                     </v-layout>
                                     <v-layout>
                                       <v-flex xs12 sm6>
                                         <v-layout>
                                           <v-flex xs4 class="pt-4 subheading">
                                             <label class="right">Mother Cell No:</label>
                                           </v-flex>
                                           <v-flex xs8 class="ml-3">
                                             <v-text-field
                                               v-model="parentData.motherCellNo"
                                               placeholder="fill your  Mother Cell Number"
                                               name="state"
                                               type="number"
                                               :rules="motherCellNoRules"
                                               required
                                             ></v-text-field>
                                           </v-flex>
                                         </v-layout>
                                       </v-flex>
                                     </v-layout>
                                     <v-flex xs12 sm12>
                                       <v-card-actions>
                                         <v-spacer></v-spacer>
                                         <v-btn
                                           @click="submitParentDetails"
                                           round
                                           dark
                                           :loading="loading"
                                           v-show="showParent"
                                         >Add</v-btn>
                                         <v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn>
                                       </v-card-actions>
                                     </v-flex>
                                   </v-container>
                                 </v-form>
                               </v-flex>
                             </v-flex>
                           </v-layout>
                         </v-container>
                       </v-stepper-content>
                       <v-stepper-content step="2">
                         <v-container fluid>
                           <v-snackbar
                             :timeout="timeout"
                             :top="y === 'top'"
                             :right="x === 'right'"
                             :vertical="mode === 'vertical'"
                             v-model="snackbar"
                             color="success"
                           >{{ text }}</v-snackbar>
                           <v-flex xs12 sm12>
                             <v-form ref="form" v-model="valid" lazy-validation>
                               <v-container fluid>
                                 <v-layout>
                                   <v-flex
                                     xs12
                                     class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
                                   >
                                     <v-avatar size="100px">
                                       <img src="/static/icon/user.png" v-if="!imageUrl" />
                                     </v-avatar>
                                     <input
                                       type="file"
                                       style="display: none"
                                       ref="image"
                                       accept="image/*"
                                       @change="onFilePicked"
                                     />
                                     <img
                                       :src="imageData.imageUrl"
                                       height="150"
                                       v-if="imageUrl"
                                       style="border-radius:50%; width:200px"
                                     />
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Select Class:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-select
                                           :items="addclass"
                                           label="Select Class"
                                           v-model="addStudents.select"
                                           item-text="classNum"
                                           item-value="_id"
                                           name="Select Class"
                                           :rules="classRules"
                                           @change="getSection(addStudents.select)"
                                           required
                                         ></v-select>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Select Section:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-select
                                           :items="addSection"
                                           label="Select Section"
                                           v-model="addStudents.selectSection"
                                           item-text="name"
                                           item-value="_id"
                                           name="Select Section"
                                           :rules="sectionRules"
                                           required
                                         ></v-select>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Full Name:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.name"
                                           placeholder="fill your full Name"
                                           name="name"
                                           type="text"
                                           :rules="nameRules"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Email ID:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           placeholder="fill your email"
                                           :rules="emailRules"
                                           v-model="addStudents.email"
                                           type="text"
                                           name="email"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Date of Birth:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-menu
                                           ref="menu"
                                           :close-on-content-click="false"
                                           v-model="menu"
                                           :nudge-right="40"
                                           lazy
                                           transition="scale-transition"
                                           offset-y
                                           full-width
                                           min-width="290px"
                                         >
                                           <v-text-field
                                             slot="activator"
                                             :rules="dateRules"
                                             v-model="addStudents.date"
                                             placeholder="Select date"
                                           ></v-text-field>
                                           <v-date-picker
                                             ref="picker"
                                             v-model="addStudents.date"
                                             :max="new Date().toISOString().substr(0, 10)"
                                             min="1950-01-01"
                                             @input="menu = false"
                                           ></v-date-picker>
                                         </v-menu>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">City:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.city"
                                           placeholder="fill your City Name"
                                           name="City"
                                           type="text"
                                           :rules="cityRules"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">State:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.state"
                                           placeholder="fill your State Name"
                                           name="state"
                                           type="text"
                                           :rules="stateRules"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Pincode:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.pincode"
                                           placeholder="fill your pincode"
                                           name="pincode"
                                           type="number"
                                           :rules="pincode"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Mobile No:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.mobile"
                                           placeholder="fill your MobileNo"
                                           name="mobileNo"
                                           type="number"
                                           :rules="mobileNoRules"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Select Country:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-autocomplete
                                           v-model="addStudents.country"
                                           :rules="country"
                                           :items="countries"
                                           placeholder="Select Country Name"
                                           required
                                         ></v-autocomplete>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Gender:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-select
                                           :items="gender"
                                           v-model="addStudents.gender"
                                           :rules="genderRules"
                                           label="Select Gender"
                                           required
                                         ></v-select>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Blood Group:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.bloodGroup"
                                           placeholder="Fill your Blood Group"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Allergies:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.allergies"
                                           placeholder="Fill your Allergies"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Medical Notes:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.medicalNotes"
                                           placeholder="Fill your Medical Notes"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Height:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.height"
                                           placeholder="Fill your Height"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Weight:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.weight"
                                           placeholder="Fill your Weight"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Uplaod Image:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           label="Select Image"
                                           @click="pickFile"
                                           v-model="imageName"
                                           append-icon="attach_file"
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm6>
                                     <v-layout>
                                       <v-flex xs4 class="pt-4 subheading">
                                         <label class="right">Academic Year:</label>
                                       </v-flex>
                                       <v-flex xs8 class="ml-3">
                                         <v-text-field
                                           v-model="addStudents.establishmentYear"
                                           placeholder="fill your Academic Year"
                                           name="state"
                                           type="number"
                                           :rules="establishmentYearRules"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">Roll Number:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.rollNo"
+                                          placeholder="Fill your Roll Number"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout>
                                   <v-flex xs12 sm12>
                                     <v-layout>
                                       <v-flex
                                         xs3
                                         class="pt-4 subheading pl-4"
                                         style="max-width: 17%;"
                                       >
                                         <label class>Present Address:</label>
                                       </v-flex>
                                       <v-flex xs12>
                                         <v-text-field
                                           name="input-4-3"
                                           v-model="addStudents.presentAddress"
                                           :rules="presentAddress"
                                           placeholder="fill Your present Address"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                   <v-flex xs12 sm12>
                                     <v-layout>
                                       <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;">
                                         <label>Permanent Address:</label>
                                       </v-flex>
                                       <v-flex xs12>
                                         <v-text-field
                                           name="input-4-3"
                                           v-model="addStudents.permanentAddress"
                                           :rules="permanentAddress"
                                           placeholder="fill Your Permanent Address"
                                           required
                                         ></v-text-field>
                                       </v-flex>
                                     </v-layout>
                                   </v-flex>
                                 </v-layout>
                                 <v-layout>
                                   <v-flex xs12 sm12>
                                     <v-card-actions>
                                       <!-- <v-btn @click="clear" round dark>clear</v-btn> -->
                                       <v-btn round dark @click="e2 = 1">
                                         <v-icon dark left>arrow_back</v-icon>Back
                                       </v-btn>
                                       <v-spacer></v-spacer>
                                       <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
                                     </v-card-actions>
                                   </v-flex>
                                 </v-layout>
                               </v-container>
                             </v-form>
                           </v-flex>
                         </v-container>
                       </v-stepper-content>
                     </v-stepper-items>
                   </v-stepper>
                 </v-app>
               </div>
             </v-flex>
           </v-layout>
         </v-container>
       </v-tab-item>
     </v-tabs>
     <div class="loader" v-if="showLoader">
       <v-progress-circular indeterminate color="white"></v-progress-circular>
     </div>
   </v-app>
 </template>
 <script>
 import http from "@/Services/http.js";
 import Util from "@/util";
 import moment from "moment";
 export default {
   data: () => ({
     e2: 0,
     showParent: true,
     showNext: false,
     snackbar: false,
     y: "top",
     x: "right",
     mode: "",
     timeout: 3000,
     text: "",
     showLoader: false,
     loading: false,
     date: null,
     search: "",
     menu: false,
     menu1: false,
     dialog: false,
     dialog1: false,
     valid: true,
     isActive: true,
     newActive: false,
     addclass: [],
     addSection: [],
     gender: ["Male", "Female"],
     AddUsercredentials: {},
     pagination: {
       rowsPerPage: 15
     },
     imageData: {},
     imageName: "",
     imageUrl: "",
     imageFile: "",
     nameRules: [v => !!v || " Full Name is required"],
     dateRules: [v => !!v || " DOB is required"],
     cityRules: [v => !!v || " City Name is required"],
     pincode: [v => !!v || " Pincode is required"],
     country: [v => !!v || " Country Name is required"],
     permanentAddress: [v => !!v || " Permanent Address is required"],
     presentAddress: [v => !!v || " Present Address  is required"],
     mobileNoRules: [v => !!v || "Mobile Number is required"],
     stateRules: [v => !!v || "State Name is required"],
     classRules: [v => !!v || " Class Name is required"],
     sectionRules: [v => !!v || " Section Name is required"],
     genderRules: [v => !!v || " Select Gender is required"],
     fatherNameRules: [v => !!v || " Father Name is required"],
     fatheCellNoRules: [v => !!v || " father Cell Number  is required"],
     motherNameRules: [v => !!v || " Mother Name  is required"],
     motherCellNoRules: [v => !!v || " Mother Cell Number is required"],
     establishmentYearRules: [v => !!v || " Academic Year  is required"],
     errorMessages: "",
     emailRules: [
       v => !!v || "E-mail is required",
       v =>
         /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||
         "E-mail must be valid"
     ],
     countries: [
       "Afghanistan",
       "Albania",
       "Algeria",
       "Andorra",
       "Angola",
       "Anguilla",
       "Antigua &amp; Barbuda",
       "Argentina",
       "Armenia",
       "Aruba",
       "Australia",
       "Austria",
       "Azerbaijan",
       "Bahamas",
       "Bahrain",
       "Bangladesh",
       "Barbados",
       "Belarus",
       "Belgium",
       "Belize",
       "Benin",
       "Bermuda",
       "Bhutan",
       "Bolivia",
       "Bosnia &amp; Herzegovina",
       "Botswana",
       "Brazil",
       "British Virgin Islands",
       "Brunei",
       "Bulgaria",
       "Burkina Faso",
       "Burundi",
       "Cambodia",
       "Cameroon",
       "Cape Verde",
       "Cayman Islands",
       "Chad",
       "Chile",
       "China",
       "Colombia",
       "Congo",
       "Cook Islands",
       "Costa Rica",
       "Cote D Ivoire",
       "Croatia",
       "Cruise Ship",
       "Cuba",
       "Cyprus",
       "Czech Republic",
       "Denmark",
       "Djibouti",
       "Dominica",
       "Dominican Republic",
       "Ecuador",
       "Egypt",
       "El Salvador",
       "Equatorial Guinea",
       "Estonia",
       "Ethiopia",
       "Falkland Islands",
       "Faroe Islands",
       "Fiji",
       "Finland",
       "France",
       "French Polynesia",
       "French West Indies",
       "Gabon",
       "Gambia",
       "Georgia",
       "Germany",
       "Ghana",
       "Gibraltar",
       "Greece",
       "Greenland",
       "Grenada",
       "Guam",
       "Guatemala",
       "Guernsey",
       "Guinea",
       "Guinea Bissau",
       "Guyana",
       "Haiti",
       "Honduras",
       "Hong Kong",
       "Hungary",
       "Iceland",
       "India",
       "Indonesia",
       "Iran",
       "Iraq",
       "Ireland",
       "Isle of Man",
       "Israel",
       "Italy",
       "Jamaica",
       "Japan",
       "Jersey",
       "Jordan",
       "Kazakhstan",
       "Kenya",
       "Kuwait",
       "Kyrgyz Republic",
       "Laos",
       "Latvia",
       "Lebanon",
       "Lesotho",
       "Liberia",
       "Libya",
       "Liechtenstein",
       "Lithuania",
       "Luxembourg",
       "Macau",
       "Macedonia",
       "Madagascar",
       "Malawi",
       "Malaysia",
       "Maldives",
       "Mali",
       "Malta",
       "Mauritania",
       "Mauritius",
       "Mexico",
       "Moldova",
       "Monaco",
       "Mongolia",
       "Montenegro",
       "Montserrat",
       "Morocco",
       "Mozambique",
       "Namibia",
       "Nepal",
       "Netherlands",
       "Netherlands Antilles",
       "New Caledonia",
       "New Zealand",
       "Nicaragua",
       "Niger",
       "Nigeria",
       "Norway",
       "Oman",
       "Pakistan",
       "Palestine",
       "Panama",
       "Papua New Guinea",
       "Paraguay",
       "Peru",
       "Philippines",
       "Poland",
       "Portugal",
       "Puerto Rico",
       "Qatar",
       "Reunion",
       "Romania",
       "Russia",
       "Rwanda",
       "Saint Pierre &amp; Miquelon",
       "Samoa",
       "San Marino",
       "Satellite",
       "Saudi Arabia",
       "Senegal",
       "Serbia",
       "Seychelles",
       "Sierra Leone",
       "Singapore",
       "Slovakia",
       "Slovenia",
       "South Africa",
       "South Korea",
       "Spain",
       "Sri Lanka",
       "St Kitts &amp; Nevis",
       "St Lucia",
       "St Vincent",
       "St. Lucia",
       "Sudan",
       "Suriname",
       "Swaziland",
       "Sweden",
       "Switzerland",
       "Syria",
       "Taiwan",
       "Tajikistan",
       "Tanzania",
       "Thailand",
       "Timor L'Este",
       "Togo",
       "Tonga",
       "Trinidad &amp; Tobago",
       "Tunisia",
       "Turkey",
       "Turkmenistan",
       "Turks &amp; Caicos",
       "Uganda",
       "Ukraine",
       "United Arab Emirates",
       "United Kingdom",
       "United States",
       "Uruguay",
       "Uzbekistan",
       "Venezuela",
       "Vietnam",
       "Virgin Islands (US)",
       "Yemen",
       "Zambia",
       "Zimbabwe"
     ],
     headers: [
       {
         text: "No",
         align: "center",
         sortable: false,
         value: "No"
       },
       {
         text: "Profile Pic",
         value: "profilePicUrl",
         sortable: false,
         align: "center"
       },
       { text: "Name", value: "name", sortable: false, align: "center" },
       { text: "Email", value: "email", sortable: false, align: "center" },
       { text: "Dob", value: "dob", sortable: false, align: "center" },
       { text: "Gender", value: "gender", sortable: false, align: "center" },
       {
         text: "Father Name",
         value: "fatherName",
         sortable: false,
         align: "center"
       },
       {
         text: "Mother Name",
         value: "motherName",
         sortable: false,
         align: "center"
       },
       {
         text: "Academic Year",
         value: "establishmentYear",
         sortable: false,
         align: "center"
       },
       { text: "Mobile No", value: "mobile", sortable: false, align: "center" },
       { text: "Action", value: "", sortable: false, align: "center" }
     ],
     desserts: [],
     parentId: "",
     editedIndex: -1,
     parentData: {},
     addStudents: {
       role: "STUDENT",
       name: "",
       email: "",
       date: "",
       city: "",
       pincode: "",
       country: "",
       permanentAddress: "",
       presentAddress: "",
       mobile: "",
       state: "",
       gender: "",
       select: "",
       selectSection: "",
       bloodGroup: "",
       allergies: "",
       medicalNotes: "",
       height: "",
       weight: "",
+      rollNo: "",
       establishmentYear: new Date().getFullYear()
     },
     selectStudents: {
       select: "",
       selectSection: ""
     },
     editedItem: {
       role: "STUDENT",
       name: "",
       email: "",
       dob: "",
       city: "",
       pincode: "",
       country: "",
       permanentAddress: "",
       presentAddress: "",
       mobile: "",
       state: "",
       gender: "",
       select: "",
       selectSection: "",
       bloodGroup: "",
       allergies: "",
       medicalNotes: "",
       height: "",
       weight: "",
+      rollNo: "",
       establishmentYear: new Date().getFullYear()
     },
     defaultItem: {
       role: "STUDENT",
       name: "",
       email: ""
     },
     userName: "",
     items: [
       {
         href: "/changepassword",
         title: "Change Password",
         click: e => {
           console.log(e);
         }
       },
       {
         href: "#",
         title: "Logout",
         click: e => {
           window.getApp.$emit("APP_LOGOUT");
         }
       }
     ]
   }),
   watch: {
     menu(val) {
       val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
     },
     menu1(val) {
       val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
     }
   },
   methods: {
     findStudents() {
       this.showLoader = true;
       http()
         .get("/getStudentWithClass", {
           params: {
             classId: this.selectStudents.select,
             sectionId: this.selectStudents.selectSection
           }
         })
         .then(response => {
           this.desserts = response.data.data;
           this.showLoader = false;
           console.log("getSectionsList=====>", this.addSection);
         })
         .catch(err => {
           console.log("err====>", err);
           this.showLoader = false;
         });
     },
     getSections(_id) {
       var token = this.$store.state.token;
       http()
         .get(
           "/getSectionsList",
           { params: { classId: _id } },
           {
             headers: { Authorization: "Bearer " + token }
           }
         )
         .then(response => {
           this.addSection = response.data.data;
           console.log("getSectionsList=====>", this.addSection);
         })
         .catch(err => {
           // console.log("err====>", err);
           // this.$router.replace({ path: '/' });
         });
     },
     getSection(_id) {
       var token = this.$store.state.token;
       http()
         .get(
           "/getSectionsList",
           { params: { classId: _id } },
           {
             headers: { Authorization: "Bearer " + token }
           }
         )
         .then(response => {
           this.addSection = response.data.data;
           console.log("getSectionsList=====>", this.addSection);
         })
         .catch(err => {
           // console.log("err====>", err);
           // this.$router.replace({ path: '/' });
         });
     },
     pickFile() {
       this.$refs.image.click();
     },
     dates: function(date) {
       return moment(date).format("MMMM DD, YYYY");
     },
     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 = "";
       }
     },
     // getStudentList() {
     //   this.showLoader = true;
     //   var token = this.$store.state.token;
     //   http()
     //     .get("/getStudentsList", {
     //       headers: { Authorization: "Bearer " + token }
     //     })
     //     .then(response => {
     //       this.desserts = response.data.data;
     //       this.showLoader = false;
     //       // console.log("getStudentList=====>",this.desserts)
     //     })
     //     .catch(err => {
     //       // console.log("err====>", err);
     //       this.showLoader = false;
     //       this.$router.replace({ path: "/" });
     //     });
     // },
     editItem(item) {
       this.editedIndex = this.desserts.indexOf(item);
       this.editedItem = Object.assign({}, item);
       this.editedItem.fatherName = item.parentId.fatherName;
       this.editedItem.fatherCellNo = item.parentId.fatherCellNo;
       this.editedItem.motherName = item.parentId.motherName;
       this.editedItem.motherCellNo = item.parentId.motherCellNo;
       // if(this.editedItem.dob != undefined){
       //     this.editedItem.dob = this.editedItem.dob.substring(0, 10)
       // }else if(this.editedItem.dob = undefined){
       //     this.editedItem.dob = ''
       // }
       this.editedItem.dob =
         this.editedItem.dob != undefined
           ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))
           : (this.editedItem.dob = "");
       this.dialog = true;
     },
     profile(item) {
       console.log("item", item);
       this.editedIndex = this.desserts.indexOf(item);
       this.editedItem = Object.assign({}, item);
       this.editedItem.fatherName = item.parentId.fatherName;
       this.editedItem.fatherCellNo = item.parentId.fatherCellNo;
       this.editedItem.motherName = item.parentId.motherName;
       this.editedItem.motherCellNo = item.parentId.motherCellNo;
       this.dialog1 = true;
     },
     deleteItem(item) {
       let deleteStudent = {
         studentId: item._id
       };
       http()
         .delete(
           "/deleteStudent",
           confirm("Are you sure you want to delete this?") && {
             params: deleteStudent
           }
         )
         .then(response => {
           // console.log("deleteUers",deleteStudent)
           if ((this.snackbar = true)) {
             this.text = "Successfully delete Existing Student";
           }
           this.getStudentList();
         })
         .catch(error => {
           // console.log(error);
         });
     },
     activeTab(type) {
       switch (type) {
         case "existing":
           this.newActive = false;
           this.isActive = true;
           break;
         default:
           this.newActive = true;
           this.isActive = false;
           break;
       }
     },
     close() {
       this.dialog = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
     close1() {
       this.dialog1 = false;
     },
     submit() {
       if (this.$refs.form.validate()) {
         let addStudent = {
           parentId: this.parentId,
           name: this.addStudents.name,
           email: this.addStudents.email,
           role: this.addStudents.role,
           dob: this.addStudents.date,
           city: this.addStudents.city,
           pincode: this.addStudents.pincode,
           country: this.addStudents.country,
           permanentAddress: this.addStudents.permanentAddress,
           presentAddress: this.addStudents.presentAddress,
           mobile: this.addStudents.mobile,
           state: this.addStudents.state,
           gender: this.addStudents.gender,
           establishmentYear: this.addStudents.establishmentYear,
           classId: this.addStudents.select,
           sectionId: this.addStudents.selectSection,
           bloodGroup: this.addStudents.bloodGroup,
           allergies: this.addStudents.allergies,
           medicalNotes: this.addStudents.medicalNotes,
           height: this.addStudents.height,
-          weight: this.addStudents.weight
+          weight: this.addStudents.weight,
+          rollNo: this.addStudents.rollNo
         };
         if (this.imageUrl) {
           var str = this.imageUrl;
           const [baseUrl, imageUrl] = str.split(/,/);
           addStudent.upload = imageUrl;
         }
         this.loading = true;
         http()
           .post("/createStudent", addStudent)
           .then(response => {
             console.log(addStudent);
             if ((this.snackbar = true)) {
               this.text = "New Student added successfully";
             }
             // this.getStudentList();
             this.clear();
             this.loading = false;
           })
           .catch(error => {
             // console.log(error);
             if ((this.snackbar = true)) {
               this.text = error.response.data.message;
             }
             this.loading = false;
           });
       }
     },
     mail() {},
     download() {},
     clear() {
       this.$refs.form.reset();
     },
     save() {
       let editStudent = {
         studentId: this.editedItem._id,
         name: this.editedItem.name,
         email: this.editedItem.email,
         role: this.editedItem.role,
         dob: this.editedItem.dob,
         city: this.editedItem.city,
         pincode: this.editedItem.pincode,
         country: this.editedItem.country,
         permanentAddress: this.editedItem.permanentAddress,
         presentAddress: this.editedItem.presentAddress,
         mobile: this.editedItem.mobile,
         state: this.editedItem.state,
         gender: this.editedItem.gender,
         establishmentYear: this.editedItem.establishmentYear,
         classId: this.editedItem.select,
         sectionId: this.editedItem.selectSection,
         bloodGroup: this.editedItem.bloodGroup,
         allergies: this.editedItem.allergies,
         medicalNotes: this.editedItem.medicalNotes,
         height: this.editedItem.height,
-        weight: this.editedItem.weight
+        weight: this.editedItem.weight,
+        rollNo: this.editedItem.rollNo
       };
       if (this.imageUrl) {
         var str = this.imageUrl;
         const [baseUrl, imageUrl] = str.split(/,/);
         editStudent.upload = imageUrl;
       }
       http()
         .put("/updateStudent", editStudent)
         .then(response => {
           if ((this.snackbar = true)) {
             this.text = "Successfully Student Existing User";
           }
           this.findStudents();
           this.close();
         })
         .catch(error => {
           // console.log(error);
           if ((this.snackbar = true)) {
             this.text = error.response.data.statusText;
           }
         });
     },
     submitParentDetails() {
       if (this.$refs.parentForm.validate()) {
         let addparentDetails = {
           email: this.parentData.email,
           fatherName: this.parentData.fatherName,
           fatherCellNo: this.parentData.fatherCellNo,
           motherName: this.parentData.motherName,
           motherCellNo: this.parentData.motherCellNo,
           role: "PARENT"
         };
         this.loading = true;
         http()
           .post("/createParent", addparentDetails)
           .then(response => {
             this.parentId = response.data.data.id;
             this.e2 = 2;
             if ((this.snackbar = true)) {
               this.text = "successfully";
             }
             // this.getStudentList();
             this.clear();
             this.loading = false;
           })
           .catch(error => {
             console.log(error.response.data);
             if ((this.snackbar = true)) {
               this.text = error.response.data.message;
               this.text = error.response.data.statusText;
             }
             this.loading = false;
           });
       }
     },
     getParentDetails() {
       if (this.parentData.email) {
         http()
           .get("getParticularParent", {
             params: { email: this.parentData.email },
             headers: {
               Authorization: "Bearer " + this.$store.state.token
             }
           })
           .then(response => {
             this.showNext = true;
             this.showParent = false;
             this.parentData = response.data.data;
             this.parentId = response.data.data._id;
           })
           .catch(error => {
             console.log("err====>", error.response.data.message);
           });
       }
     },
     handleDrawerToggle() {
       window.getApp.$emit("APP_DRAWER_TOGGLED");
     },
     handleFullScreen() {
       Util.toggleFullScreen();
     }
   },
   mounted() {
     // this.getStudentList();
     var token = this.$store.state.token;
     http()
       .get("/getClassesList", {
         headers: { Authorization: "Bearer " + token }
       })
       .then(response => {
         this.addclass = response.data.data;
       })
       .catch(err => {
         // console.log("err====>", err);
         this.$router.replace({ path: "/" });
       });
   },
   // console.log("Id",this.$store.state.id)
   // console.log("token",this.$store.state.token)
   computed: {
     toolbarColor() {
       return this.$vuetify.options.extra.mainNav;
     }
   }
 };
 </script>
 <style scoped>
 .v-tabs__div {
   text-transform: none;
 }
 .v-input__prepend-outer {
   margin-right: 0px !important;
 }
 .v-card__actions .v-btn {
   margin: 0 15px;
   min-width: 120px;
 }
 .primary {
   background-color: #aaa !important;
   border-color: #aaa !important;
 }
 h4 {
   background-repeat: no-repeat;
   padding: 8px;
   margin: auto;
   font-size: 25px;
 }
 #name {
   position: absolute;
   left: 100px;
   top: 17px;
 }
 #icon {
   position: absolute;
   right: 8px;
   top: 8px;
 }
 #m {
   position: relative;
   left: 135px;
   top: -15px;
 }
 #G {
   position: absolute;
   top: 38px;
   color: white;
 }
 #bt {
   position: relative;
   top: -20px;
   left: 115px;
 }
 #e {
   position: relative;
   top: 5px;
   right: -30px;
   height: 17px;
   cursor: pointer;
 }
 #d {
   position: relative;
   top: 5px;
   right: -70px;
   height: 17px;
   cursor: pointer;
 }
 #td {
   border: 1px solid #dddddd;
   text-align: left;
   padding: 8px;
 }
 #dialog {
   height: 550px;
 }
 .active {
   background-color: black;
   color: white !important;
 }
 .activebtn {
   color: black !important;
 }
 #flex {
   height: 300px;
 }
 .top {
   margin-top: 100px;
 }
 .v-tabs__item a {
   font-size: 16px !important;
 }
 @media screen and (max-width: 769px) {
   .top {
     margin-top: 0 !important;
   }
   .userSearch .v-icon {
     font-size: 20px !important;
     margin-left: 20px;
   }
 }
 @media screen and (max-width: 380px) {
   .pl-3 {
     padding-left: 0px !important;
   }
   .right {
     float: none !important;
   }
   .subheading {
     font-size: 14px !important;
   }
   .v-card__actions .v-btn {
     margin: 0 0px;
     min-width: 100px;
   }
   /* .searchIcon .v-icon {
     font-size: 20px;
     margin-left: 20px;
 } */
   .subheading {
     font-size: 12px !important;
   }
   h5 {
     font-size: 13px;
   }
 }
 .v-icon {
   font-size: 30px;
 }
 @media screen and (min-width: 1270px) {
   .hide {
     display: none;
   }
   /* }
 @media screen and (max-width: 962px) {
 .imglogo{
     position: absolute;
     top: 13px;
     left: 13px !important;
     width: 70px;
     height: 24px;
 } */
 }
 @media screen and (max-width: 420px) {
   .userSearch .v-text-field .v-label {
     line-height: 24px !important;
   }
   .userSearch .v-label {
     font-size: 13px !important;
   }
   .v-list__tile {
     font-size: 14px;
     padding: 0 10px;
   }
   .name {
     font-size: 15px;
   }
 }
 </style>