viithiisys / School-Management-dashboard

1

1

2

<v-container fluid class="body-color">

2

<v-container fluid class="body-color">

3

3

4

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

4

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

5

<v-card flat class="card-style pa-2" dark>

5

<v-card flat class="card-style pa-2" dark>

6

<v-layout>

6

<v-layout>

7

<v-flex xs12>

7

<v-flex xs12>

8

<label class="title text-xs-center">Edit Student Details</label>

8

<label class="title text-xs-center">Edit Student Details</label>

9

<v-icon size="24" class="right" @click="editStudentDialog = false">cancel</v-icon>

9

<v-icon size="24" class="right" @click="editStudentDialog = false">cancel</v-icon>

10

</v-flex>

10

</v-flex>

11

</v-layout>

11

</v-layout>

12

<v-card-text>

12

<v-card-text>

13

<v-form ref="form">

13

<v-form ref="form">

14

<v-container fluid>

14

<v-container fluid>

15

<v-layout>

15

<v-layout>

16

<v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center">

16

<v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center">

17

<v-avatar size="100px" v-if="!editedItem.profilePicUrl && !editImageUrl">

17

<v-avatar size="100px" v-if="!editedItem.profilePicUrl && !editImageUrl">

18

18

19

</v-avatar>

19

</v-avatar>

20

<img

20

<img

21

:src="editedItem.profilePicUrl"

21

:src="editedItem.profilePicUrl"

22

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

22

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

23

height="150"

23

height="150"

24

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

24

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

25

/>

25

/>

26

<img

26

<img

27

v-if="editImageUrl"

27

v-if="editImageUrl"

28

:src="editImageUrl"

28

:src="editImageUrl"

29

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

29

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

30

/>

30

/>

31

<input

31

<input

32

type="file"

32

type="file"

33

style="display: none"

33

style="display: none"

34

ref="editDataImage"

34

ref="editDataImage"

35

accept="image/*"

35

accept="image/*"

36

@change="onEditFilePicked"

36

@change="onEditFilePicked"

37

/>

37

/>

38

</v-flex>

38

</v-flex>

39

</v-layout>

39

</v-layout>

40

<v-layout wrap>

40

<v-layout wrap>

41

<v-flex xs12 sm4>

41

<v-flex xs12 sm4>

42

<v-layout>

42

<v-layout>

43

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

43

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

44

<label class="right hidden-xs-only hidden-sm-only">Select Class:</label>

44

<label class="right hidden-xs-only hidden-sm-only">Select Class:</label>

45

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>

45

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>

46

</v-flex>

46

</v-flex>

47

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

47

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

48

<v-select

48

<v-select

49

:items="addclass"

49

:items="addclass"

50

label="Select Class"

50

label="Select Class"

51

v-model="editedItem.select"

51

v-model="editedItem.select"

52

item-text="classNum"

52

item-text="classNum"

53

item-value="_id"

53

item-value="_id"

54

name="Select Class"

54

name="Select Class"

55

@change="getSections(editedItem.select)"

55

@change="getSections(editedItem.select)"

56

required

56

required

57

></v-select>

57

></v-select>

58

</v-flex>

58

</v-flex>

59

</v-layout>

59

</v-layout>

60

</v-flex>

60

</v-flex>

61

<v-flex xs12 sm4>

61

<v-flex xs12 sm4>

62

<v-layout>

62

<v-layout>

63

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

63

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

64

<label class="right hidden-xs-only hidden-sm-only">Select Section:</label>

64

<label class="right hidden-xs-only hidden-sm-only">Select Section:</label>

65

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label>

65

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label>

66

</v-flex>

66

</v-flex>

67

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

67

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

68

<v-select

68

<v-select

69

:items="addSection"

69

:items="addSection"

70

label="Select Section"

70

label="Select Section"

71

v-model="editedItem.selectSection"

71

v-model="editedItem.selectSection"

72

item-text="name"

72

item-text="name"

73

item-value="_id"

73

item-value="_id"

74

name="Select Section"

74

name="Select Section"

75

required

75

required

76

></v-select>

76

></v-select>

77

</v-flex>

77

</v-flex>

78

</v-layout>

78

</v-layout>

79

</v-flex>

79

</v-flex>

80

<v-flex xs12 sm4>

80

<v-flex xs12 sm4>

81

<v-layout>

81

<v-layout>

82

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

82

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

83

83

84

84

85

</v-flex>

85

</v-flex>

86

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

86

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

87

<v-text-field

87

<v-text-field

88

v-model="editedItem.name"

88

v-model="editedItem.name"

89

placeholder="fill your full Name"

89

placeholder="fill your full Name"

90

name="name"

90

name="name"

91

type="text"

91

type="text"

92

required

92

required

93

></v-text-field>

93

></v-text-field>

94

</v-flex>

94

</v-flex>

95

</v-layout>

95

</v-layout>

96

</v-flex>

96

</v-flex>

97

</v-layout>

97

</v-layout>

98

<v-layout wrap>

98

<v-layout wrap>

99

<v-flex xs12 sm4>

99

<v-flex xs12 sm4>

100

<v-layout>

100

<v-layout>

101

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

101

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

102

<label class="right hidden-xs-only hidden-sm-only">Email Id:</label>

102

<label class="right hidden-xs-only hidden-sm-only">Email Id:</label>

103

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Email:</label>

103

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Email:</label>

104

</v-flex>

104

</v-flex>

105

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

105

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

106

<v-text-field

106

<v-text-field

107

placeholder="fill your email"

107

placeholder="fill your email"

108

v-model="editedItem.email"

108

v-model="editedItem.email"

109

type="text"

109

type="text"

110

name="email"

110

name="email"

111

required

111

required

112

></v-text-field>

112

></v-text-field>

113

</v-flex>

113

</v-flex>

114

</v-layout>

114

</v-layout>

115

</v-flex>

115

</v-flex>

116

<v-flex xs12 sm4>

116

<v-flex xs12 sm4>

117

<v-layout>

117

<v-layout>

118

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

118

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

119

<label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>

119

<label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>

120

120

121

</v-flex>

121

</v-flex>

122

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

122

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

123

<v-menu

123

<v-menu

124

ref="menu"

124

ref="menu"

125

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

125

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

126

v-model="menu1"

126

v-model="menu1"

127

:nudge-right="40"

127

:nudge-right="40"

128

lazy

128

lazy

129

transition="scale-transition"

129

transition="scale-transition"

130

offset-y

130

offset-y

131

full-width

131

full-width

132

min-width="290px"

132

min-width="290px"

133

>

133

>

134

<v-text-field

134

<v-text-field

135

slot="activator"

135

slot="activator"

136

v-model="editedItem.dob"

136

v-model="editedItem.dob"

137

placeholder="Select Dob"

137

placeholder="Select Dob"

138

></v-text-field>

138

></v-text-field>

139

<v-date-picker

139

<v-date-picker

140

ref="picker"

140

ref="picker"

141

v-model="editedItem.dob"

141

v-model="editedItem.dob"

142

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

142

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

143

min="1950-01-01"

143

min="1950-01-01"

144

@input="menu1 = false"

144

@input="menu1 = false"

145

></v-date-picker>

145

></v-date-picker>

146

</v-menu>

146

</v-menu>

147

</v-flex>

147

</v-flex>

148

</v-layout>

148

</v-layout>

149

</v-flex>

149

</v-flex>

150

<v-flex xs12 sm4>

150

<v-flex xs12 sm4>

151

<v-layout>

151

<v-layout>

152

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

152

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

153

153

154

</v-flex>

154

</v-flex>

155

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

155

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

156

<v-text-field

156

<v-text-field

157

v-model="editedItem.city"

157

v-model="editedItem.city"

158

placeholder="fill your City Name"

158

placeholder="fill your City Name"

159

name="City"

159

name="City"

160

type="text"

160

type="text"

161

required

161

required

162

></v-text-field>

162

></v-text-field>

163

</v-flex>

163

</v-flex>

164

</v-layout>

164

</v-layout>

165

</v-flex>

165

</v-flex>

166

</v-layout>

166

</v-layout>

167

<v-layout wrap>

167

<v-layout wrap>

168

<v-flex xs12 sm4>

168

<v-flex xs12 sm4>

169

<v-layout>

169

<v-layout>

170

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

170

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

171

<label class="right hidden-xs-only hidden-sm-only">Blood Group:</label>

171

<label class="right hidden-xs-only hidden-sm-only">Blood Group:</label>

172

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Blood:</label>

172

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Blood:</label>

173

</v-flex>

173

</v-flex>

174

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

174

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

175

<v-text-field

175

<v-text-field

176

v-model="editedItem.bloodGroup"

176

v-model="editedItem.bloodGroup"

177

placeholder="fill your BloodGroup"

177

placeholder="fill your BloodGroup"

178

name="state"

178

name="state"

179

type="text"

179

type="text"

180

required

180

required

181

></v-text-field>

181

></v-text-field>

182

</v-flex>

182

</v-flex>

183

</v-layout>

183

</v-layout>

184

</v-flex>

184

</v-flex>

185

<v-flex xs12 sm4>

185

<v-flex xs12 sm4>

186

<v-layout>

186

<v-layout>

187

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

187

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

188

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

188

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

189

</v-flex>

189

</v-flex>

190

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

190

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

191

<v-select

191

<v-select

192

:items="gender"

192

:items="gender"

193

v-model="editedItem.gender"

193

v-model="editedItem.gender"

194

placeholder="Select Gender"

194

placeholder="Select Gender"

195

required

195

required

196

></v-select>

196

></v-select>

197

</v-flex>

197

</v-flex>

198

</v-layout>

198

</v-layout>

199

</v-flex>

199

</v-flex>

200

<v-flex xs12 sm4>

200

<v-flex xs12 sm4>

201

<v-layout>

201

<v-layout>

202

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

202

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

203

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

203

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

204

</v-flex>

204

</v-flex>

205

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

205

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

206

<v-text-field

206

<v-text-field

207

v-model="editedItem.medicalNotes"

207

v-model="editedItem.medicalNotes"

208

placeholder="fill your medicalNotes"

208

placeholder="fill your medicalNotes"

209

required

209

required

210

></v-text-field>

210

></v-text-field>

211

</v-flex>

211

</v-flex>

212

</v-layout>

212

</v-layout>

213

</v-flex>

213

</v-flex>

214

</v-layout>

214

</v-layout>

215

<v-layout wrap>

215

<v-layout wrap>

216

<v-flex xs12 sm4>

216

<v-flex xs12 sm4>

217

<v-layout>

217

<v-layout>

218

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

218

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

219

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

219

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

220

</v-flex>

220

</v-flex>

221

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

221

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

222

<v-text-field

222

<v-text-field

223

v-model="editedItem.height"

223

v-model="editedItem.height"

224

placeholder="fill your Height"

224

placeholder="fill your Height"

225

name="state"

225

name="state"

226

type="text"

226

type="text"

227

required

227

required

228

></v-text-field>

228

></v-text-field>

229

</v-flex>

229

</v-flex>

230

</v-layout>

230

</v-layout>

231

</v-flex>

231

</v-flex>

232

<v-flex xs12 sm4>

232

<v-flex xs12 sm4>

233

<v-layout>

233

<v-layout>

234

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

234

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

235

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

235

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

236

</v-flex>

236

</v-flex>

237

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

237

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

238

<v-text-field

238

<v-text-field

239

v-model="editedItem.weight"

239

v-model="editedItem.weight"

240

placeholder="fill your Weight"

240

placeholder="fill your Weight"

241

name="pincode"

241

name="pincode"

242

required

242

required

243

></v-text-field>

243

></v-text-field>

244

</v-flex>

244

</v-flex>

245

</v-layout>

245

</v-layout>

246

</v-flex>

246

</v-flex>

247

<v-flex xs12 sm4>

247

<v-flex xs12 sm4>

248

<v-layout>

248

<v-layout>

249

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

249

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

250

<label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>

250

<label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>

251

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>

251

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>

252

</v-flex>

252

</v-flex>

253

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

253

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

254

<v-text-field

254

<v-text-field

255

label="Select Image"

255

label="Select Image"

256

@click="pickEditFile"

256

@click="pickEditFile"

257

v-model="editImageName"

257

v-model="editImageName"

258

append-icon="attach_file"

258

append-icon="attach_file"

259

></v-text-field>

259

></v-text-field>

260

</v-flex>

260

</v-flex>

261

</v-layout>

261

</v-layout>

262

</v-flex>

262

</v-flex>

263

</v-layout>

263

</v-layout>

264

<v-layout wrap>

264

<v-layout wrap>

265

<v-flex xs12 sm4>

265

<v-flex xs12 sm4>

266

<v-layout>

266

<v-layout>

267

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

267

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

268

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

268

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

269

</v-flex>

269

</v-flex>

270

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

270

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

271

<v-text-field

271

<v-text-field

272

v-model="editedItem.state"

272

v-model="editedItem.state"

273

placeholder="fill your State Name"

273

placeholder="fill your State Name"

274

name="state"

274

name="state"

275

type="text"

275

type="text"

276

required

276

required

277

></v-text-field>

277

></v-text-field>

278

</v-flex>

278

</v-flex>

279

</v-layout>

279

</v-layout>

280

</v-flex>

280

</v-flex>

281

<v-flex xs12 sm4>

281

<v-flex xs12 sm4>

282

<v-layout>

282

<v-layout>

283

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

283

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

284

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

284

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

285

</v-flex>

285

</v-flex>

286

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

286

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

287

<v-text-field

287

<v-text-field

288

v-model="editedItem.pincode"

288

v-model="editedItem.pincode"

289

placeholder="fill your pincode"

289

placeholder="fill your pincode"

290

name="pincode"

290

name="pincode"

291

type="number"

291

type="number"

292

required

292

required

293

></v-text-field>

293

></v-text-field>

294

</v-flex>

294

</v-flex>

295

</v-layout>

295

</v-layout>

296

</v-flex>

296

</v-flex>

297

<v-flex xs12 sm4>

297

<v-flex xs12 sm4>

298

<v-layout>

298

<v-layout>

299

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

299

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

300

<label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>

300

<label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>

301

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label>

301

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label>

302

</v-flex>

302

</v-flex>

303

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

303

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

304

<v-text-field

304

<v-text-field

305

v-model="editedItem.mobile"

305

v-model="editedItem.mobile"

306

placeholder="fill your MobileNo"

306

placeholder="fill your MobileNo"

307

name="mobileNo"

307

name="mobileNo"

308

type="number"

308

type="number"

309

required

309

required

310

></v-text-field>

310

></v-text-field>

311

</v-flex>

311

</v-flex>

312

</v-layout>

312

</v-layout>

313

</v-flex>

313

</v-flex>

314

</v-layout>

314

</v-layout>

315

<v-layout wrap>

315

<v-layout wrap>

316

<v-flex xs12 sm4>

316

<v-flex xs12 sm4>

317

<v-layout>

317

<v-layout>

318

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

318

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

319

<label class="right hidden-xs-only hidden-sm-only">Select Country:</label>

319

<label class="right hidden-xs-only hidden-sm-only">Select Country:</label>

320

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label>

320

<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label>

321

</v-flex>

321

</v-flex>

322

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

322

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

323

<v-autocomplete

323

<v-autocomplete

324

v-model="editedItem.country"

324

v-model="editedItem.country"

325

:items="countries"

325

:items="countries"

326

placeholder="Select Country Name"

326

placeholder="Select Country Name"

327

required

327

required

328

></v-autocomplete>

328

></v-autocomplete>

329

</v-flex>

329

</v-flex>

330

</v-layout>

330

</v-layout>

331

</v-flex>

331

</v-flex>

332

<v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only">

332

<v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only">

333

<v-layout>

333

<v-layout>

334

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

334

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

335

<label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>

335

<label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>

336

336

337

</v-flex>

337

</v-flex>

338

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

338

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

339

<v-text-field

339

<v-text-field

340

v-model="editedItem.rollNo"

340

v-model="editedItem.rollNo"

341

placeholder="fill roll number"

341

placeholder="fill roll number"

342

required

342

required

343

></v-text-field>

343

></v-text-field>

344

</v-flex>

344

</v-flex>

345

</v-layout>

345

</v-layout>

346

</v-flex>

346

</v-flex>

347

<v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only">

347

<v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only">

348

<v-layout>

348

<v-layout>

349

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

349

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

350

<label class="right hidden-xs-only hidden-sm-only">Permanent Address:</label>

350

<label class="right hidden-xs-only hidden-sm-only">Permanent Address:</label>

351

<label

351

<label

352

class="right hidden-lg-only hidden-md-only hidden-xl-only"

352

class="right hidden-lg-only hidden-md-only hidden-xl-only"

353

>Permanent Address:</label>

353

>Permanent Address:</label>

354

</v-flex>

354

</v-flex>

355

<v-flex xs12 sm8 class="ml-3">

355

<v-flex xs12 sm8 class="ml-3">

356

<v-text-field

356

<v-text-field

357

v-model="editedItem.permanentAddress"

357

v-model="editedItem.permanentAddress"

358

placeholder="fill Your Permanent Address"

358

placeholder="fill Your Permanent Address"

359

required

359

required

360

></v-text-field>

360

></v-text-field>

361

</v-flex>

361

</v-flex>

362

</v-layout>

362

</v-layout>

363

</v-flex>

363

</v-flex>

364

</v-layout>

364

</v-layout>

365

<v-layout class="hidden-xs-only hidden-sm-only">

365

<v-layout class="hidden-xs-only hidden-sm-only">

366

<v-flex xs12 sm4>

366

<v-flex xs12 sm4>

367

<v-layout>

367

<v-layout>

368

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

368

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

369

<label class="right hidden-xs-only hidden-sm-only">Present Address:</label>

369

<label class="right hidden-xs-only hidden-sm-only">Present Address:</label>

370

<label

370

<label

371

class="right hidden-lg-only hidden-md-only hidden-xl-only"

371

class="right hidden-lg-only hidden-md-only hidden-xl-only"

372

>Present Address:</label>

372

>Present Address:</label>

373

</v-flex>

373

</v-flex>

374

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

374

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

375

<v-text-field

375

<v-text-field

376

v-model="editedItem.presentAddress"

376

v-model="editedItem.presentAddress"

377

placeholder="Select Country Name"

377

placeholder="Select Country Name"

378

required

378

required

379

></v-text-field>

379

></v-text-field>

380

</v-flex>

380

</v-flex>

381

</v-layout>

381

</v-layout>

382

</v-flex>

382

</v-flex>

383

</v-layout>

383

</v-layout>

384

<v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>

384

<v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>

385

<v-flex xs12 sm12>

385

<v-flex xs12 sm12>

386

<v-layout>

386

<v-layout>

387

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

387

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

388

<label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>

388

<label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>

389

389

390

</v-flex>

390

</v-flex>

391

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

391

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

392

<v-text-field

392

<v-text-field

393

v-model="editedItem.rollNo"

393

v-model="editedItem.rollNo"

394

placeholder="fill roll number"

394

placeholder="fill roll number"

395

required

395

required

396

></v-text-field>

396

></v-text-field>

397

</v-flex>

397

</v-flex>

398

</v-layout>

398

</v-layout>

399

</v-flex>

399

</v-flex>

400

</v-layout>

400

</v-layout>

401

<v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>

401

<v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>

402

<v-flex xs12 sm12>

402

<v-flex xs12 sm12>

403

<v-layout>

403

<v-layout>

404

<v-flex xs12 sm3 class="pt-4 subheading text-xs-center">

404

<v-flex xs12 sm3 class="pt-4 subheading text-xs-center">

405

<label class>Present Address :</label>

405

<label class>Present Address :</label>

406

</v-flex>

406

</v-flex>

407

</v-layout>

407

</v-layout>

408

<v-layout>

408

<v-layout>

409

<v-flex xs12 sm12>

409

<v-flex xs12 sm12>

410

<v-textarea

410

<v-textarea

411

v-model="editedItem.presentAddress"

411

v-model="editedItem.presentAddress"

412

placeholder="fill Your present Address"

412

placeholder="fill Your present Address"

413

required

413

required

414

></v-textarea>

414

></v-textarea>

415

</v-flex>

415

</v-flex>

416

</v-layout>

416

</v-layout>

417

</v-flex>

417

</v-flex>

418

<v-flex xs12 sm12>

418

<v-flex xs12 sm12>

419

<v-layout>

419

<v-layout>

420

<v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">

420

<v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">

421

<label>Permanent addr:</label>

421

<label>Permanent addr:</label>

422

</v-flex>

422

</v-flex>

423

</v-layout>

423

</v-layout>

424

<v-layout>

424

<v-layout>

425

<v-flex xs12 sm12>

425

<v-flex xs12 sm12>

426

<v-textarea

426

<v-textarea

427

name="input-4-3"

427

name="input-4-3"

428

v-model="editedItem.permanentAddress"

428

v-model="editedItem.permanentAddress"

429

placeholder="fill Your Permanent Address"

429

placeholder="fill Your Permanent Address"

430

required

430

required

431

></v-textarea>

431

></v-textarea>

432

</v-flex>

432

</v-flex>

433

</v-layout>

433

</v-layout>

434

</v-flex>

434

</v-flex>

435

</v-layout>

435

</v-layout>

436

<v-layout>

436

<v-layout>

437

<v-flex xs12 sm12>

437

<v-flex xs12 sm12>

438

<v-layout class="right">

438

<v-layout class="right">

439

<v-btn @click="save" round dark :loading="editLoading" class="add-button">Save</v-btn>

439

<v-btn @click="save" round dark :loading="editLoading" class="add-button">Save</v-btn>

440

</v-layout>

440

</v-layout>

441

</v-flex>

441

</v-flex>

442

</v-layout>

442

</v-layout>

443

</v-container>

443

</v-container>

444

</v-form>

444

</v-form>

445

</v-card-text>

445

</v-card-text>

446

</v-card>

446

</v-card>

447

</v-dialog>

447

</v-dialog>

448

449

449

450

451

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

451

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

452

<v-card flat class="card-style pa-3" dark>

452

<v-card flat class="card-style pa-3" dark>

453

<v-layout>

453

<v-layout>

454

<v-flex xs12>

454

<v-flex xs12>

455

<label class="title text-xs-center">View Student Details</label>

455

<label class="title text-xs-center">View Student Details</label>

456

<v-icon size="24" class="right" @click="profileStudentDialog = false">cancel</v-icon>

456

<v-icon size="24" class="right" @click="profileStudentDialog = false">cancel</v-icon>

457

</v-flex>

457

</v-flex>

458

</v-layout>

458

</v-layout>

459

<v-card-text>

459

<v-card-text>

460

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

460

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

461

<v-avatar size="100px">

461

<v-avatar size="100px">

462

462

463

463

464

</v-avatar>

464

</v-avatar>

465

</v-flex>

465

</v-flex>

466

<v-container grid-list-md>

466

<v-container grid-list-md>

467

<v-layout wrap>

467

<v-layout wrap>

468

<v-flex xs12 sm5>

468

<v-flex xs12 sm5>

469

<v-layout>

469

<v-layout>

470

<v-flex xs6 sm6>

470

<v-flex xs6 sm6>

471

471

472

472

473

</h5>

473

</h5>

474

</v-flex>

474

</v-flex>

475

<v-flex sm6 xs6>

475

<v-flex sm6 xs6>

476

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

476

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

477

</v-flex>

477

</v-flex>

478

</v-layout>

478

</v-layout>

479

</v-flex>

479

</v-flex>

480

<v-flex xs12 sm7>

480

<v-flex xs12 sm7>

481

<v-layout>

481

<v-layout>

482

<v-flex xs6 sm4>

482

<v-flex xs6 sm4>

483

483

484

<b>Email:</b>

484

<b>Email:</b>

485

</h5>

485

</h5>

486

</v-flex>

486

</v-flex>

487

<v-flex sm8 xs6>

487

<v-flex sm8 xs6>

488

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

488

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

489

</v-flex>

489

</v-flex>

490

</v-layout>

490

</v-layout>

491

</v-flex>

491

</v-flex>

492

</v-layout>

492

</v-layout>

493

<v-layout wrap>

493

<v-layout wrap>

494

<v-flex xs12 sm5>

494

<v-flex xs12 sm5>

495

<v-layout>

495

<v-layout>

496

<v-flex xs6 sm6>

496

<v-flex xs6 sm6>

497

<b>

497

<b>

498

498

499

<b>Gender:</b>

499

<b>Gender:</b>

500

</h5>

500

</h5>

501

</b>

501

</b>

502

</v-flex>

502

</v-flex>

503

<v-flex sm6 xs6>

503

<v-flex sm6 xs6>

504

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

504

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

505

</v-flex>

505

</v-flex>

506

</v-layout>

506

</v-layout>

507

</v-flex>

507

</v-flex>

508

<v-flex xs12 sm7>

508

<v-flex xs12 sm7>

509

<v-layout>

509

<v-layout>

510

<v-flex xs6 sm4>

510

<v-flex xs6 sm4>

511

<b>

511

<b>

512

512

513

513

514

</h5>

514

</h5>

515

</b>

515

</b>

516

</v-flex>

516

</v-flex>

517

<v-flex sm8 xs6>

517

<v-flex sm8 xs6>

518

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

518

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

519

</v-flex>

519

</v-flex>

520

</v-layout>

520

</v-layout>

521

</v-flex>

521

</v-flex>

522

</v-layout>

522

</v-layout>

523

<v-layout wrap>

523

<v-layout wrap>

524

<v-flex xs12 sm5>

524

<v-flex xs12 sm5>

525

<v-layout>

525

<v-layout>

526

<v-flex xs6 sm6>

526

<v-flex xs6 sm6>

527

<b>

527

<b>

528

528

529

<b>BloodGroup:</b>

529

<b>BloodGroup:</b>

530

</h5>

530

</h5>

531

</b>

531

</b>

532

</v-flex>

532

</v-flex>

533

<v-flex sm6 xs6>

533

<v-flex sm6 xs6>

534

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

534

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

535

</v-flex>

535

</v-flex>

536

</v-layout>

536

</v-layout>

537

</v-flex>

537

</v-flex>

538

<v-flex xs12 sm7>

538

<v-flex xs12 sm7>

539

<v-layout>

539

<v-layout>

540

<v-flex xs6 sm4>

540

<v-flex xs6 sm4>

541

<b>

541

<b>

542

542

543

543

544

</h5>

544

</h5>

545

</b>

545

</b>

546

</v-flex>

546

</v-flex>

547

<v-flex sm8 xs6>

547

<v-flex sm8 xs6>

548

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

548

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

549

</v-flex>

549

</v-flex>

550

</v-layout>

550

</v-layout>

551

</v-flex>

551

</v-flex>

552

</v-layout>

552

</v-layout>

553

<v-layout wrap>

553

<v-layout wrap>

554

<v-flex xs12 sm5>

554

<v-flex xs12 sm5>

555

<v-layout>

555

<v-layout>

556

<v-flex xs6 sm6>

556

<v-flex xs6 sm6>

557

<b>

557

<b>

558

558

559

<b>Height:</b>

559

<b>Height:</b>

560

</h5>

560

</h5>

561

</b>

561

</b>

562

</v-flex>

562

</v-flex>

563

<v-flex sm6 xs6>

563

<v-flex sm6 xs6>

564

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

564

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

565

</v-flex>

565

</v-flex>

566

</v-layout>

566

</v-layout>

567

</v-flex>

567

</v-flex>

568

<v-flex xs12 sm7>

568

<v-flex xs12 sm7>

569

<v-layout>

569

<v-layout>

570

<v-flex xs6 sm4>

570

<v-flex xs6 sm4>

571

<b>

571

<b>

572

572

573

<b>Weight:</b>

573

<b>Weight:</b>

574

</h5>

574

</h5>

575

</b>

575

</b>

576

</v-flex>

576

</v-flex>

577

<v-flex sm8 xs6>

577

<v-flex sm8 xs6>

578

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

578

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

579

</v-flex>

579

</v-flex>

580

</v-layout>

580

</v-layout>

581

</v-flex>

581

</v-flex>

582

</v-layout>

582

</v-layout>

583

<v-layout wrap>

583

<v-layout wrap>

584

<v-flex xs12 sm5>

584

<v-flex xs12 sm5>

585

<v-layout>

585

<v-layout>

586

<v-flex xs6 sm6>

586

<v-flex xs6 sm6>

587

<b>

587

<b>

588

588

589

589

590

</h5>

590

</h5>

591

</b>

591

</b>

592

</v-flex>

592

</v-flex>

593

<v-flex sm6 xs6>

593

<v-flex sm6 xs6>

594

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

594

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

595

</v-flex>

595

</v-flex>

596

</v-layout>

596

</v-layout>

597

</v-flex>

597

</v-flex>

598

<v-flex xs12 sm7>

598

<v-flex xs12 sm7>

599

<v-layout>

599

<v-layout>

600

<v-flex xs6 sm4>

600

<v-flex xs6 sm4>

601

<b>

601

<b>

602

602

603

<b>State:</b>

603

<b>State:</b>

604

</h5>

604

</h5>

605

</b>

605

</b>

606

</v-flex>

606

</v-flex>

607

<v-flex sm8 xs6>

607

<v-flex sm8 xs6>

608

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

608

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

609

</v-flex>

609

</v-flex>

610

</v-layout>

610

</v-layout>

611

</v-flex>

611

</v-flex>

612

</v-layout>

612

</v-layout>

613

<v-layout wrap>

613

<v-layout wrap>

614

<v-flex xs12 sm5>

614

<v-flex xs12 sm5>

615

<v-layout>

615

<v-layout>

616

<v-flex xs6 sm6>

616

<v-flex xs6 sm6>

617

<b>

617

<b>

618

618

619

<b>Pincode:</b>

619

<b>Pincode:</b>

620

</h5>

620

</h5>

621

</b>

621

</b>

622

</v-flex>

622

</v-flex>

623

<v-flex sm6 xs6>

623

<v-flex sm6 xs6>

624

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

624

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

625

</v-flex>

625

</v-flex>

626

</v-layout>

626

</v-layout>

627

</v-flex>

627

</v-flex>

628

<v-flex xs12 sm7>

628

<v-flex xs12 sm7>

629

<v-layout>

629

<v-layout>

630

<v-flex xs6 sm4>

630

<v-flex xs6 sm4>

631

<b>

631

<b>

632

632

633

<b>Country:</b>

633

<b>Country:</b>

634

</h5>

634

</h5>

635

</b>

635

</b>

636

</v-flex>

636

</v-flex>

637

<v-flex sm7 xs6>

637

<v-flex sm7 xs6>

638

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

638

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

639

</v-flex>

639

</v-flex>

640

</v-layout>

640

</v-layout>

641

</v-flex>

641

</v-flex>

642

</v-layout>

642

</v-layout>

643

<v-layout wrap>

643

<v-layout wrap>

644

<v-flex xs12 sm5>

644

<v-flex xs12 sm5>

645

<v-layout>

645

<v-layout>

646

<v-flex sm6 xs6>

646

<v-flex sm6 xs6>

647

<b>

647

<b>

648

648

649

<b>Mobile No:</b>

649

<b>Mobile No:</b>

650

</h5>

650

</h5>

651

</b>

651

</b>

652

</v-flex>

652

</v-flex>

653

<v-flex sm6 xs6>

653

<v-flex sm6 xs6>

654

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

654

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

655

</v-flex>

655

</v-flex>

656

</v-layout>

656

</v-layout>

657

</v-flex>

657

</v-flex>

658

<v-flex xs12 sm7>

658

<v-flex xs12 sm7>

659

<v-layout>

659

<v-layout>

660

<v-flex xs6 sm4>

660

<v-flex xs6 sm4>

661

<b>

661

<b>

662

662

663

<b>FahterName:</b>

663

<b>FahterName:</b>

664

</h5>

664

</h5>

665

</b>

665

</b>

666

</v-flex>

666

</v-flex>

667

<v-flex sm8 xs6>

667

<v-flex sm8 xs6>

668

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

668

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

669

</v-flex>

669

</v-flex>

670

</v-layout>

670

</v-layout>

671

</v-flex>

671

</v-flex>

672

</v-layout>

672

</v-layout>

673

<v-layout wrap>

673

<v-layout wrap>

674

<v-flex xs12 sm5>

674

<v-flex xs12 sm5>

675

<v-layout>

675

<v-layout>

676

<v-flex xs6 sm6>

676

<v-flex xs6 sm6>

677

<b>

677

<b>

678

678

679

<b>MotherName:</b>

679

<b>MotherName:</b>

680

</h5>

680

</h5>

681

</b>

681

</b>

682

</v-flex>

682

</v-flex>

683

<v-flex sm6 xs6>

683

<v-flex sm6 xs6>

684

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

684

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

685

</v-flex>

685

</v-flex>

686

</v-layout>

686

</v-layout>

687

</v-flex>

687

</v-flex>

688

<v-flex xs12 sm7>

688

<v-flex xs12 sm7>

689

<v-layout>

689

<v-layout>

690

<v-flex xs6 sm4>

690

<v-flex xs6 sm4>

691

<b>

691

<b>

692

692

693

<b>FatherCellNo:</b>

693

<b>FatherCellNo:</b>

694

</h5>

694

</h5>

695

</b>

695

</b>

696

</v-flex>

696

</v-flex>

697

<v-flex sm6 xs6>

697

<v-flex sm6 xs6>

698

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

698

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

699

</v-flex>

699

</v-flex>

700

</v-layout>

700

</v-layout>

701

</v-flex>

701

</v-flex>

702

</v-layout>

702

</v-layout>

703

<v-layout wrap>

703

<v-layout wrap>

704

<v-flex xs12 sm5>

704

<v-flex xs12 sm5>

705

<v-layout>

705

<v-layout>

706

<v-flex xs6 sm6>

706

<v-flex xs6 sm6>

707

<b>

707

<b>

708

708

709

<b>MotherCellNo:</b>

709

<b>MotherCellNo:</b>

710

</h5>

710

</h5>

711

</b>

711

</b>

712

</v-flex>

712

</v-flex>

713

<v-flex sm6 xs6>

713

<v-flex sm6 xs6>

714

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

714

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

715

</v-flex>

715

</v-flex>

716

</v-layout>

716

</v-layout>

717

</v-flex>

717

</v-flex>

718

<v-flex xs12 sm7>

718

<v-flex xs12 sm7>

719

<v-layout>

719

<v-layout>

720

<v-flex xs6 sm4>

720

<v-flex xs6 sm4>

721

<b>

721

<b>

722

722

723

<b>AcademicYear:</b>

723

<b>AcademicYear:</b>

724

</h5>

724

</h5>

725

</b>

725

</b>

726

</v-flex>

726

</v-flex>

727

<v-flex sm5 xs8>

727

<v-flex sm5 xs8>

728

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

728

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

729

</v-flex>

729

</v-flex>

730

</v-layout>

730

</v-layout>

731

</v-flex>

731

</v-flex>

732

</v-layout>

732

</v-layout>

733

<v-layout wrap>

733

<v-layout wrap>

734

<v-flex xs12 sm5>

734

<v-flex xs12 sm5>

735

<v-layout>

735

<v-layout>

736

<v-flex xs6 sm6>

736

<v-flex xs6 sm6>

737

<b>

737

<b>

738

738

739

<b>MedicalNotes:</b>

739

<b>MedicalNotes:</b>

740

</h5>

740

</h5>

741

</b>

741

</b>

742

</v-flex>

742

</v-flex>

743

<v-flex sm5 xs6>

743

<v-flex sm5 xs6>

744

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

744

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

745

</v-flex>

745

</v-flex>

746

</v-layout>

746

</v-layout>

747

</v-flex>

747

</v-flex>

748

<v-flex xs12 sm7 class="hidden-xs-only">

748

<v-flex xs12 sm7 class="hidden-xs-only">

749

<v-layout wrap>

749

<v-layout wrap>

750

<v-flex sm4>

750

<v-flex sm4>

751

<b>

751

<b>

752

752

753

<b>present Address:</b>

753

<b>present Address:</b>

754

</h5>

754

</h5>

755

</b>

755

</b>

756

</v-flex>

756

</v-flex>

757

<v-flex sm8>

757

<v-flex sm8>

758

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

758

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

759

</v-flex>

759

</v-flex>

760

</v-layout>

760

</v-layout>

761

</v-flex>

761

</v-flex>

762

<v-flex sm6 class="hidden-xs-only">

762

<v-flex sm6 class="hidden-xs-only">

763

<v-layout wrap>

763

<v-layout wrap>

764

<v-flex sm5>

764

<v-flex sm5>

765

<b>

765

<b>

766

766

767

<b>Permanent Address:</b>

767

<b>Permanent Address:</b>

768

</h5>

768

</h5>

769

</b>

769

</b>

770

</v-flex>

770

</v-flex>

771

<v-flex sm7>

771

<v-flex sm7>

772

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

772

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

773

</v-flex>

773

</v-flex>

774

</v-layout>

774

</v-layout>

775

</v-flex>

775

</v-flex>

776

</v-layout>

776

</v-layout>

777

<v-layout wrap class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only">

777

<v-layout wrap class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only">

778

<v-flex xs12 sm5>

778

<v-flex xs12 sm5>

779

<v-layout wrap>

779

<v-layout wrap>

780

<v-flex xs12 sm6>

780

<v-flex xs12 sm6>

781

<b>

781

<b>

782

782

783

<b>present Address:-</b>

783

<b>present Address:-</b>

784

</h5>

784

</h5>

785

</b>

785

</b>

786

</v-flex>

786

</v-flex>

787

<v-flex sm5 xs12>

787

<v-flex sm5 xs12>

788

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

788

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

789

</v-flex>

789

</v-flex>

790

</v-layout>

790

</v-layout>

791

</v-flex>

791

</v-flex>

792

<v-flex xs12 sm6>

792

<v-flex xs12 sm6>

793

<v-layout wrap>

793

<v-layout wrap>

794

<v-flex xs12 sm6>

794

<v-flex xs12 sm6>

795

<b>

795

<b>

796

796

797

<b>Permanent Address:-</b>

797

<b>Permanent Address:-</b>

798

</h5>

798

</h5>

799

</b>

799

</b>

800

</v-flex>

800

</v-flex>

801

<v-flex sm6 xs12>

801

<v-flex sm6 xs12>

802

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

802

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

803

</v-flex>

803

</v-flex>

804

</v-layout>

804

</v-layout>

805

</v-flex>

805

</v-flex>

806

</v-layout>

806

</v-layout>

807

</v-container>

807

</v-container>

808

</v-card-text>

808

</v-card-text>

809

</v-card>

809

</v-card>

810

</v-dialog>

810

</v-dialog>

811

812

812

813

<v-toolbar color="transparent" flat>

813

<v-toolbar color="transparent" flat>

814

<v-btn

814

<v-btn

815

fab

815

fab

816

dark

816

dark

817

class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"

817

class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"

818

small

818

small

819

@click="addStudentDialog = true"

819

@click="addStudentDialog = true"

820

>

820

>

821

<v-icon dark>add</v-icon>

821

<v-icon dark>add</v-icon>

822

</v-btn>

822

</v-btn>

823

<v-btn

823

<v-btn

824

v-if="role != 'TEACHER' "

824

v-if="role != 'TEACHER' "

825

round

825

round

826

class="open-dialog-button hidden-sm-only hidden-xs-only"

826

class="open-dialog-button hidden-sm-only hidden-xs-only"

827

dark

827

dark

828

@click="addStudentDialog = true"

828

@click="addStudentDialog = true"

829

>

829

>

830

<v-icon class="white--text pr-1" size="20">add</v-icon>Add Student

830

<v-icon class="white--text pr-1" size="20">add</v-icon>Add Student

831

</v-btn>

831

</v-btn>

832

<v-card-actions class="hidden-xs-only hidden-sm-only">

832

<v-card-actions class="hidden-xs-only hidden-sm-only">

833

<v-flex md13 lg12>

833

<v-flex md13 lg12>

834

<v-layout>

834

<v-layout>

835

<v-flex lg3 md4>

835

<v-flex lg3 md4>

836

<v-select

836

<v-select

837

:items="addclass"

837

:items="addclass"

838

label="Select Class"

838

label="Select Class"

839

v-model="selectStudents.select"

839

v-model="selectStudents.select"

840

item-text="classNum"

840

item-text="classNum"

841

item-value="_id"

841

item-value="_id"

842

name="Select Class"

842

name="Select Class"

843

:rules="classRules"

843

:rules="classRules"

844

@change="getSections(selectStudents.select)"

844

@change="getSections(selectStudents.select)"

845

required

845

required

846

class="ml-2"

846

class="ml-2"

847

></v-select>

847

></v-select>

848

</v-flex>

848

</v-flex>

849

<v-flex lg3 md4 class="ml-2">

849

<v-flex lg3 md4 class="ml-2">

850

<v-layout>

850

<v-layout>

851

<v-select

851

<v-select

852

:items="addSection"

852

:items="addSection"

853

label="Select Section"

853

label="Select Section"

854

v-model="selectStudents.selectSection"

854

v-model="selectStudents.selectSection"

855

item-text="name"

855

item-text="name"

856

item-value="_id"

856

item-value="_id"

857

name="Select Section"

857

name="Select Section"

858

:rules="sectionRules"

858

:rules="sectionRules"

859

required

859

required

860

></v-select>

860

></v-select>

861

</v-layout>

861

</v-layout>

862

</v-flex>

862

</v-flex>

863

</v-layout>

863

</v-layout>

864

</v-flex>

864

</v-flex>

865

</v-card-actions>

865

</v-card-actions>

866

<v-spacer></v-spacer>

866

<v-spacer></v-spacer>

867

<v-btn

867

<v-btn

868

@click="findStudents()"

868

@click="findStudents()"

869

round

869

round

870

dark

870

dark

871

:loading="loading"

871

:loading="loading"

872

class="open-dialog-button hidden-xs-only hidden-sm-only"

872

class="open-dialog-button hidden-xs-only hidden-sm-only"

873

>Find</v-btn>

873

>Find</v-btn>

874

<v-card-title class="body-1" v-show="show">

874

<v-card-title class="body-1" v-show="show">

875

<v-btn icon large flat @click="displaySearch">

875

<v-btn icon large flat @click="displaySearch">

876

<v-avatar size="27">

876

<v-avatar size="27">

877

877

878

</v-avatar>

878

</v-avatar>

879

</v-btn>

879

</v-btn>

880

</v-card-title>

880

</v-card-title>

881

<v-flex xs8 sm7 lg2 md3 v-if="showSearch">

881

<v-flex xs8 sm7 lg2 md3 v-if="showSearch">

882

<v-layout>

882

<v-layout>

883

<v-text-field

883

<v-text-field

884

autofocus

884

autofocus

885

v-model="search"

885

v-model="search"

886

label="Search"

886

label="Search"

887

prepend-inner-icon="search"

887

prepend-inner-icon="search"

888

color="primary"

888

color="primary"

889

></v-text-field>

889

></v-text-field>

890

<v-icon @click="closeSearch" color="error">close</v-icon>

890

<v-icon @click="closeSearch" color="error">close</v-icon>

891

</v-layout>

891

</v-layout>

892

</v-flex>

892

</v-flex>

893

</v-toolbar>

893

</v-toolbar>

894

<v-card flat class="elevation-0 transparent">

894

<v-card flat class="elevation-0 transparent">

895

<v-flex class="hidden-xl-only hidden-lg-only hidden-md-only">

895

<v-flex class="hidden-xl-only hidden-lg-only hidden-md-only">

896

<v-layout>

896

<v-layout>

897

<v-flex xs4>

897

<v-flex xs4>

898

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

898

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

899

</v-flex>

899

</v-flex>

900

<v-flex xs8>

900

<v-flex xs8>

901

<v-select

901

<v-select

902

:items="addclass"

902

:items="addclass"

903

label="Select Class"

903

label="Select Class"

904

v-model="selectStudents.select"

904

v-model="selectStudents.select"

905

item-text="classNum"

905

item-text="classNum"

906

item-value="_id"

906

item-value="_id"

907

name="Select Class"

907

name="Select Class"

908

:rules="classRules"

908

:rules="classRules"

909

@change="getSections(selectStudents.select)"

909

@change="getSections(selectStudents.select)"

910

class="px-2"

910

class="px-2"

911

></v-select>

911

></v-select>

912

</v-flex>

912

</v-flex>

913

</v-layout>

913

</v-layout>

914

<v-layout>

914

<v-layout>

915

<v-flex xs4>

915

<v-flex xs4>

916

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

916

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

917

</v-flex>

917

</v-flex>

918

<v-flex xs8>

918

<v-flex xs8>

919

<v-select

919

<v-select

920

:items="addSection"

920

:items="addSection"

921

label="Select Section"

921

label="Select Section"

922

v-model="selectStudents.selectSection"

922

v-model="selectStudents.selectSection"

923

item-text="name"

923

item-text="name"

924

item-value="_id"

924

item-value="_id"

925

name="Select Section"

925

name="Select Section"

926

:rules="sectionRules"

926

:rules="sectionRules"

927

class="px-2"

927

class="px-2"

928

required

928

required

929

></v-select>

929

></v-select>

930

</v-flex>

930

</v-flex>

931

</v-layout>

931

</v-layout>

932

<v-layout>

932

<v-layout>

933

<v-flex xs5 class="mx-auto mb-2">

933

<v-flex xs5 class="mx-auto mb-2">

934

<v-btn

934

<v-btn

935

@click="findStudents()"

935

@click="findStudents()"

936

block

936

block

937

round

937

round

938

dark

938

dark

939

:loading="loading"

939

:loading="loading"

940

class="add-button"

940

class="add-button"

941

>Find</v-btn>

941

>Find</v-btn>

942

</v-flex>

942

</v-flex>

943

</v-layout>

943

</v-layout>

944

</v-flex>

944

</v-flex>

945

</v-card>

945

</v-card>

946

<v-data-table

946

<v-data-table

947

:headers="headers"

947

:headers="headers"

948

:items="studentsData"

948

:items="studentsData"

949

:pagination.sync="pagination"

949

:pagination.sync="pagination"

950

:search="search"

950

:search="search"

951

>

951

>

952

952

953

953

954

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

954

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

955

955

956

<v-avatar size="40">

956

<v-avatar size="40">

957

957

958

958

959

</v-avatar>

959

</v-avatar>

960

</td>

960

</td>

961

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

961

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

962

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

962

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

963

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

963

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

964

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

964

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

965

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

965

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

966

966

967

967

968

<v-switch

968

<v-switch

969

class="pl-3"

969

class="pl-3"

970

:disabled="role === 'TEACHER'"

970

:disabled="role === 'TEACHER'"

971

v-model="props.item.status"

971

v-model="props.item.status"

972

@change="suspendStudentStatus(props.item.status,props.item._id)"

972

@change="suspendStudentStatus(props.item.status,props.item._id)"

973

></v-switch>

973

></v-switch>

974

</td>

974

</td>

975

975

976

<span>

976

<span>

977

<v-tooltip top>

977

<v-tooltip top>

978

<img

978

<img

979

slot="activator"

979

slot="activator"

980

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

980

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

981

class="mr-3"

981

class="mr-3"

982

@click="profile(props.item)"

982

@click="profile(props.item)"

983

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

983

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

984

/>

984

/>

985

985

986

</v-tooltip>

986

</v-tooltip>

987

<v-tooltip top v-if="role != 'TEACHER' ">

987

<v-tooltip top v-if="role != 'TEACHER' ">

988

<img

988

<img

989

slot="activator"

989

slot="activator"

990

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

990

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

991

class="mr-3"

991

class="mr-3"

992

@click="editItem(props.item)"

992

@click="editItem(props.item)"

993

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

993

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

994

/>

994

/>

995

995

996

</v-tooltip>

996

</v-tooltip>

997

<v-tooltip top v-if="role != 'TEACHER' ">

997

<v-tooltip top v-if="role != 'TEACHER' ">

998

<img

998

<img

999

slot="activator"

999

slot="activator"

1000

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

1000

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

1001

class="mr-3"

1001

class="mr-3"

1002

@click="deleteItem(props.item)"

1002

@click="deleteItem(props.item)"

1003

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

1003

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

1004

/>

1004

/>

1005

<span>Delete</span>

1005

<span>Delete</span>

1006

</v-tooltip>

1006

</v-tooltip>

1007

</span>

1007

</span>

1008

</td>

1008

</td>

1009

</tr>

1009

</tr>

1010

</template>

1010

</template>

1011

<v-alert

1011

<v-alert

1012

slot="no-results"

1012

slot="no-results"

1013

:value="true"

1013

:value="true"

1014

color="error"

1014

color="error"

1015

icon="warning"

1015

icon="warning"

1016

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

1016

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

1017

</v-data-table>

1017

</v-data-table>

1018

1018

1019

<v-dialog v-model="addStudentDialog" max-width="1280">

1019

<v-dialog v-model="addStudentDialog" max-width="1280">

1020

<v-card flat class="card-style pa-2" dark>

1020

<v-card flat class="card-style pa-2" dark>

1021

<v-layout>

1021

<v-layout>

1022

<v-flex xs12>

1022

<v-flex xs12>

1023

<label class="title text-xs-center">Add Student</label>

1023

<label class="title text-xs-center">Add Student</label>

1024

<v-icon

1024

<v-icon

1025

size="24"

1025

size="24"

1026

class="right"

1026

class="right"

1027

@click="$refs.parentForm.reset();$refs.parentFormLgScr.reset();$refs.form.reset();e2 = 1;addStudentDialog = false"

1027

@click="$refs.parentForm.reset();$refs.parentFormLgScr.reset();$refs.form.reset();e2 = 1;addStudentDialog = false"

1028

>cancel</v-icon>

1028

>cancel</v-icon>

1029

</v-flex>

1029

</v-flex>

1030

</v-layout>

1030

</v-layout>

1031

<v-container fluid>

1031

<v-container fluid>

1032

<v-layout align-center>

1032

<v-layout align-center>

1033

<v-flex xs12>

1033

<v-flex xs12>

1034

<v-stepper v-model="e2" flat class="card-style elevation-0" dark>

1034

<v-stepper v-model="e2" flat class="card-style elevation-0" dark>

1035

<v-stepper-header>

1035

<v-stepper-header>

1036

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

1036

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

1037

<v-divider></v-divider>

1037

<v-divider></v-divider>

1038

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

1038

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

1039

</v-stepper-header>

1039

</v-stepper-header>

1040

<v-stepper-items>

1040

<v-stepper-items>

1041

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

1041

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

1042

<v-container fluid class>

1042

<v-container fluid class>

1043

<v-flex xs12 sm12 class="hidden-md-only hidden-lg-only hidden-xl-only">

1043

<v-flex xs12 sm12 class="hidden-md-only hidden-lg-only hidden-xl-only">

1044

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

1044

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

1045

<v-layout wrap>

1045

<v-layout wrap>

1046

<v-flex xs12 sm6>

1046

<v-flex xs12 sm6>

1047

<v-layout wrap>

1047

<v-layout wrap>

1048

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

1048

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

1049

<label>Father Cell No:</label>

1049

<label>Father Cell No:</label>

1050

</v-flex>

1050

</v-flex>

1051

<v-flex xs12>

1051

<v-flex xs12>

1052

<v-text-field

1052

<v-text-field

1053

v-model.trim="parentData.fatherCellNo"

1053

v-model.trim="parentData.fatherCellNo"

1054

placeholder="fill your father Cell Number"

1054

placeholder="fill your father Cell Number"

1055

type="number"

1055

type="number"

1056

:rules="fatheCellNoRules"

1056

:rules="fatheCellNoRules"

1057

counter="10"

1057

counter="10"

1058

v-on:keyup="getParentDetails()"

1058

v-on:keyup="getParentDetails()"

1059

required

1059

required

1060

></v-text-field>

1060

></v-text-field>

1061

</v-flex>

1061

</v-flex>

1062

</v-layout>

1062

</v-layout>

1063

</v-flex>

1063

</v-flex>

1064

<v-flex xs12 sm6>

1064

<v-flex xs12 sm6>

1065

<v-layout wrap>

1065

<v-layout wrap>

1066

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

1066

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

1067

<label>Parent Email Id:</label>

1067

<label>Parent Email Id:</label>

1068

</v-flex>

1068

</v-flex>

1069

<v-flex xs12>

1069

<v-flex xs12>

1070

<v-text-field

1070

<v-text-field

1071

placeholder="fill Parent email"

1071

placeholder="fill Parent email"

1072

v-model="parentData.email"

1072

v-model="parentData.email"

1073

type="text"

1073

type="text"

1074

required

1074

required

1075

></v-text-field>

1075

></v-text-field>

1076

</v-flex>

1076

</v-flex>

1077

</v-layout>

1077

</v-layout>

1078

</v-flex>

1078

</v-flex>

1079

</v-layout>

1079

</v-layout>

1080

<v-layout wrap>

1080

<v-layout wrap>

1081

<v-flex xs12 sm6>

1081

<v-flex xs12 sm6>

1082

<v-layout wrap>

1082

<v-layout wrap>

1083

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

1083

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

1084

<label>Father Name:</label>

1084

<label>Father Name:</label>

1085

</v-flex>

1085

</v-flex>

1086

<v-flex xs12>

1086

<v-flex xs12>

1087

<v-text-field

1087

<v-text-field

1088

v-model="parentData.fatherName"

1088

v-model="parentData.fatherName"

1089

placeholder="Fill your father Name"

1089

placeholder="Fill your father Name"

1090

required

1090

required

1091

></v-text-field>

1091

></v-text-field>

1092

</v-flex>

1092

</v-flex>

1093

</v-layout>

1093

</v-layout>

1094

</v-flex>

1094

</v-flex>

1095

<v-flex xs12 sm6>

1095

<v-flex xs12 sm6>

1096

<v-layout wrap>

1096

<v-layout wrap>

1097

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

1097

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

1098

<label>Mother Name:</label>

1098

<label>Mother Name:</label>

1099

</v-flex>

1099

</v-flex>

1100

<v-flex xs12>

1100

<v-flex xs12>

1101

<v-text-field

1101

<v-text-field

1102

v-model="parentData.motherName"

1102

v-model="parentData.motherName"

1103

placeholder="fill your Mother Name"

1103

placeholder="fill your Mother Name"

1104

type="text"

1104

type="text"

1105

required

1105

required

1106

></v-text-field>

1106

></v-text-field>

1107

</v-flex>

1107

</v-flex>

1108

</v-layout>

1108

</v-layout>

1109

</v-flex>

1109

</v-flex>

1110

</v-layout>

1110

</v-layout>

1111

<v-layout wrap>

1111

<v-layout wrap>

1112

<v-flex xs12 sm6>

1112

<v-flex xs12 sm6>

1113

<v-layout wrap>

1113

<v-layout wrap>

1114

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

1114

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

1115

<label>Mother Cell No:</label>

1115

<label>Mother Cell No:</label>

1116

</v-flex>

1116

</v-flex>

1117

<v-flex xs12>

1117

<v-flex xs12>

1118

<v-text-field

1118

<v-text-field

1119

v-model="parentData.motherCellNo"

1119

v-model="parentData.motherCellNo"

1120

placeholder="fill your Mother Cell Number"

1120

placeholder="fill your Mother Cell Number"

1121

type="number"

1121

type="number"

1122

required

1122

required

1123

></v-text-field>

1123

></v-text-field>

1124

</v-flex>

1124

</v-flex>

1125

</v-layout>

1125

</v-layout>

1126

</v-flex>

1126

</v-flex>

1127

<v-flex xs12 sm6>

1127

<v-flex xs12 sm6>

1128

<v-layout wrap>

1128

<v-layout wrap>

1129

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

1129

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

1130

<label>Father Profession:</label>

1130

<label>Father Profession:</label>

1131

</v-flex>

1131

</v-flex>

1132

<v-flex xs12>

1132

<v-flex xs12>

1133

<v-text-field

1133

<v-text-field

1134

v-model="parentData.fatherProfession"

1134

v-model="parentData.fatherProfession"

1135

placeholder="fill your father profession"

1135

placeholder="fill your father profession"

1136

></v-text-field>

1136

></v-text-field>

1137

</v-flex>

1137

</v-flex>

1138

</v-layout>

1138

</v-layout>

1139

</v-flex>

1139

</v-flex>

1140

</v-layout>

1140

</v-layout>

1141

<v-layout wrap>

1141

<v-layout wrap>

1142

<v-flex xs12 sm6>

1142

<v-flex xs12 sm6>

1143

<v-layout wrap>

1143

<v-layout wrap>

1144

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

1144

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

1145

<label>Mother Profession:</label>

1145

<label>Mother Profession:</label>

1146

</v-flex>

1146

</v-flex>

1147

<v-flex xs12>

1147

<v-flex xs12>

1148

<v-text-field

1148

<v-text-field

1149

v-model="parentData.motherProfession"

1149

v-model="parentData.motherProfession"

1150

placeholder="fill your mother profession"

1150

placeholder="fill your mother profession"

1151

></v-text-field>

1151

></v-text-field>

1152

</v-flex>

1152

</v-flex>

1153

</v-layout>

1153

</v-layout>

1154

</v-flex>

1154

</v-flex>

1155

<v-flex xs12 sm6>

1155

<v-flex xs12 sm6>

1156

<v-layout wrap>

1156

<v-layout wrap>

1157

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

1157

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

1158

<label>Password:</label>

1158

<label>Password:</label>

1159

</v-flex>

1159

</v-flex>

1160

<v-flex xs12>

1160

<v-flex xs12>

1161

<v-text-field

1161

<v-text-field

1162

v-model="parentData.password"

1162

v-model="parentData.password"

1163

placeholder="Enter Your Password"

1163

placeholder="Enter Your Password"

1164

></v-text-field>

1164

></v-text-field>

1165

</v-flex>

1165

</v-flex>

1166

</v-layout>

1166

</v-layout>

1167

</v-flex>

1167

</v-flex>

1168

</v-layout>

1168

</v-layout>

1169

<v-flex sm12 class="hidden-xs-only">

1169

<v-flex sm12 class="hidden-xs-only">

1170

<v-card-actions>

1170

<v-card-actions>

1171

<v-spacer></v-spacer>

1171

<v-spacer></v-spacer>

1172

<v-btn

1172

<v-btn

1173

@click="submitParentDetails"

1173

@click="submitParentDetails"

1174

round

1174

round

1175

dark

1175

dark

1176

:loading="loading"

1176

:loading="loading"

1177

v-show="showParent"

1177

v-show="showParent"

1178

class="add-button"

1178

class="add-button"

1179

>Add</v-btn>

1179

>Add</v-btn>

1180

<v-btn

1180

<v-btn

1181

v-show="showNext"

1181

v-show="showNext"

1182

@click="e2 = 2"

1182

@click="e2 = 2"

1183

round

1183

round

1184

dark

1184

dark

1185

class="add-button"

1185

class="add-button"

1186

>Next</v-btn>

1186

>Next</v-btn>

1187

</v-card-actions>

1187

</v-card-actions>

1188

</v-flex>

1188

</v-flex>

1189

<v-flex

1189

<v-flex

1190

xs6

1190

xs6

1191

class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"

1191

class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"

1192

>

1192

>

1193

<v-btn

1193

<v-btn

1194

@click="submitParentDetails"

1194

@click="submitParentDetails"

1195

round

1195

round

1196

dark

1196

dark

1197

:loading="loading"

1197

:loading="loading"

1198

v-show="showParent"

1198

v-show="showParent"

1199

class="add-button"

1199

class="add-button"

1200

>Add</v-btn>

1200

>Add</v-btn>

1201

<v-btn

1201

<v-btn

1202

v-show="showNext"

1202

v-show="showNext"

1203

@click="e2 = 2"

1203

@click="e2 = 2"

1204

round

1204

round

1205

dark

1205

dark

1206

class="add-button"

1206

class="add-button"

1207

>Next</v-btn>

1207

>Next</v-btn>

1208

</v-flex>

1208

</v-flex>

1209

</v-form>

1209

</v-form>

1210

</v-flex>

1210

</v-flex>

1211

<v-flex xs12 sm12 class="hidden-xs-only hidden-sm-only">

1211

<v-flex xs12 sm12 class="hidden-xs-only hidden-sm-only">

1212

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

1212

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

1213

<v-layout wrap>

1213

<v-layout wrap>

1214

<v-flex xs12 sm6>

1214

<v-flex xs12 sm6>

1215

<v-layout>

1215

<v-layout>

1216

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

1216

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

1217

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

1217

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

1218

</v-flex>

1218

</v-flex>

1219

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

1219

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

1220

<v-text-field

1220

<v-text-field

1221

v-model.trim="parentData.fatherCellNo"

1221

v-model.trim="parentData.fatherCellNo"

1222

placeholder="fill your father Cell Number"

1222

placeholder="fill your father Cell Number"

1223

type="number"

1223

type="number"

1224

:rules="fatheCellNoRules"

1224

:rules="fatheCellNoRules"

1225

counter="10"

1225

counter="10"

1226

required

1226

required

1227

v-on:keyup="getParentDetails()"

1227

v-on:keyup="getParentDetails()"

1228

></v-text-field>

1228

></v-text-field>

1229

</v-flex>

1229

</v-flex>

1230

</v-layout>

1230

</v-layout>

1231

</v-flex>

1231

</v-flex>

1232

<v-flex xs12 sm6>

1232

<v-flex xs12 sm6>

1233

<v-layout>

1233

<v-layout>

1234

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

1234

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

1235

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

1235

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

1236

</v-flex>

1236

</v-flex>

1237

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

1237

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

1238

<v-text-field

1238

<v-text-field

1239

placeholder="fill Parent email"

1239

placeholder="fill Parent email"

1240

v-model="parentData.email"

1240

v-model="parentData.email"

1241

type="text"

1241

type="text"

1242

required

1242

required

1243

></v-text-field>

1243

></v-text-field>

1244

</v-flex>

1244

</v-flex>

1245

</v-layout>

1245

</v-layout>

1246

</v-flex>

1246

</v-flex>

1247

</v-layout>

1247

</v-layout>

1248

<v-layout wrap>

1248

<v-layout wrap>

1249

<v-flex xs12 sm6>

1249

<v-flex xs12 sm6>

1250

<v-layout>

1250

<v-layout>

1251

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

1251

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

1252

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

1252

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

1253

</v-flex>

1253

</v-flex>

1254

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

1254

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

1255

<v-text-field

1255

<v-text-field

1256

v-model="parentData.fatherName"

1256

v-model="parentData.fatherName"

1257

placeholder="Fill your father Name"

1257

placeholder="Fill your father Name"

1258

required

1258

required

1259

></v-text-field>

1259

></v-text-field>

1260

</v-flex>

1260

</v-flex>

1261

</v-layout>

1261

</v-layout>

1262

</v-flex>

1262

</v-flex>

1263

<v-flex xs12 sm6>

1263

<v-flex xs12 sm6>

1264

<v-layout>

1264

<v-layout>

1265

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

1265

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

1266

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

1266

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

1267

</v-flex>

1267

</v-flex>

1268

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

1268

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

1269

<v-text-field

1269

<v-text-field

1270

v-model="parentData.motherName"

1270

v-model="parentData.motherName"

1271

placeholder="fill your Mother Name"

1271

placeholder="fill your Mother Name"

1272

type="text"

1272

type="text"

1273

required

1273

required

1274

></v-text-field>

1274

></v-text-field>

1275

</v-flex>

1275

</v-flex>

1276

</v-layout>

1276

</v-layout>

1277

</v-flex>

1277

</v-flex>

1278

</v-layout>

1278

</v-layout>

1279

<v-layout wrap>

1279

<v-layout wrap>

1280

<v-flex xs12 sm6>

1280

<v-flex xs12 sm6>

1281

<v-layout>

1281

<v-layout>

1282

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

1282

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

1283

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

1283

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

1284

</v-flex>

1284

</v-flex>

1285

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

1285

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

1286

<v-text-field

1286

<v-text-field

1287

v-model="parentData.motherCellNo"

1287

v-model="parentData.motherCellNo"

1288

placeholder="fill your Mother Cell Number"

1288

placeholder="fill your Mother Cell Number"

1289

type="number"

1289

type="number"

1290

required

1290

required

1291

></v-text-field>

1291

></v-text-field>

1292

</v-flex>

1292

</v-flex>

1293

</v-layout>

1293

</v-layout>

1294

</v-flex>

1294

</v-flex>

1295

<v-flex xs12 sm6>

1295

<v-flex xs12 sm6>

1296

<v-layout>

1296

<v-layout>

1297

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

1297

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

1298

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

1298

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

1299

</v-flex>

1299

</v-flex>

1300

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

1300

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

1301

<v-text-field

1301

<v-text-field

1302

v-model="parentData.fatherProfession"

1302

v-model="parentData.fatherProfession"

1303

placeholder="fill your father profession"

1303

placeholder="fill your father profession"

1304

></v-text-field>

1304

></v-text-field>

1305

</v-flex>

1305

</v-flex>

1306

</v-layout>

1306

</v-layout>

1307

</v-flex>

1307

</v-flex>

1308

</v-layout>

1308

</v-layout>

1309

<v-layout wrap>

1309

<v-layout wrap>

1310

<v-flex xs12 sm6>

1310

<v-flex xs12 sm6>

1311

<v-layout>

1311

<v-layout>

1312

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

1312

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

1313

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

1313

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

1314

</v-flex>

1314

</v-flex>

1315

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

1315

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

1316

<v-text-field

1316

<v-text-field

1317

v-model="parentData.motherProfession"

1317

v-model="parentData.motherProfession"

1318

placeholder="fill your mother profession"

1318

placeholder="fill your mother profession"

1319

></v-text-field>

1319

></v-text-field>

1320

</v-flex>

1320

</v-flex>

1321

</v-layout>

1321

</v-layout>

1322

</v-flex>

1322

</v-flex>

1323

<v-flex xs12 sm6>

1323

<v-flex xs12 sm6>

1324

<v-layout>

1324

<v-layout>

1325

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

1325

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

1326

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

1326

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

1327

</v-flex>

1327

</v-flex>

1328

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

1328

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

1329

<v-text-field

1329

<v-text-field

1330

:append-icon="e1 ? 'visibility_off' : 'visibility'"

1330

:append-icon="e1 ? 'visibility_off' : 'visibility'"

1331

:append-icon-cb="() => (e1 = !e1)"

1331

:append-icon-cb="() => (e1 = !e1)"

1332

:type="e1 ? 'password' : 'text'"

1332

:type="e1 ? 'password' : 'text'"

1333

:rules="password"

1333

:rules="password"

1334

v-model="parentData.password"

1334

v-model="parentData.password"

1335

placeholder="Enter Your Password"

1335

placeholder="Enter Your Password"

1336

:disabled="isFatherCellExists"

1336

:disabled="isFatherCellExists"

1337

required

1337

required

1338

></v-text-field>

1338

></v-text-field>

1339

</v-flex>

1339

</v-flex>

1340

</v-layout>

1340

</v-layout>

1341

</v-flex>

1341

</v-flex>

1342

</v-layout>

1342

</v-layout>

1343

<v-flex sm12 class="hidden-xs-only">

1343

<v-flex sm12 class="hidden-xs-only">

1344

<v-card-actions>

1344

<v-card-actions>

1345

<v-spacer></v-spacer>

1345

<v-spacer></v-spacer>

1346

<v-btn

1346

<v-btn

1347

@click="submitParentDetails"

1347

@click="submitParentDetails"

1348

round

1348

round

1349

dark

1349

dark

1350

:loading="loading"

1350

:loading="loading"

1351

v-show="showParent"

1351

v-show="showParent"

1352

class="add-button"

1352

class="add-button"

1353

>Add</v-btn>

1353

>Add</v-btn>

1354

<v-btn

1354

<v-btn

1355

v-show="showNext"

1355

v-show="showNext"

1356

@click="e2 = 2"

1356

@click="e2 = 2"

1357

round

1357

round

1358

dark

1358

dark

1359

class="add-button"

1359

class="add-button"

1360

>Next</v-btn>

1360

>Next</v-btn>

1361

</v-card-actions>

1361

</v-card-actions>

1362

</v-flex>

1362

</v-flex>

1363

<v-flex

1363

<v-flex

1364

xs6

1364

xs6

1365

class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"

1365

class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"

1366

>

1366

>

1367

<v-btn

1367

<v-btn

1368

@click="submitParentDetails"

1368

@click="submitParentDetails"

1369

round

1369

round

1370

dark

1370

dark

1371

:loading="loading"

1371

:loading="loading"

1372

v-show="showParent"

1372

v-show="showParent"

1373

class="add-button"

1373

class="add-button"

1374

>Add</v-btn>

1374

>Add</v-btn>

1375

<v-btn

1375

<v-btn

1376

v-show="showNext"

1376

v-show="showNext"

1377

@click="e2 = 2"

1377

@click="e2 = 2"

1378

round

1378

round

1379

dark

1379

dark

1380

class="add-button"

1380

class="add-button"

1381

>Next</v-btn>

1381

>Next</v-btn>

1382

</v-flex>

1382

</v-flex>

1383

</v-form>

1383

</v-form>

1384

</v-flex>

1384

</v-flex>

1385

</v-container>

1385

</v-container>

1386

</v-stepper-content>

1386

</v-stepper-content>

1387

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

1387

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

1388

<v-flex xs12 sm12>

1388

<v-flex xs12 sm12>

1389

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

1389

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

1390

<v-layout>

1390

<v-layout>

1391

<v-flex

1391

<v-flex

1392

xs12

1392

xs12

1393

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

1393

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

1394

>

1394

>

1395

<v-avatar size="100px">

1395

<v-avatar size="100px">

1396

1396

1397

</v-avatar>

1397

</v-avatar>

1398

<input

1398

<input

1399

type="file"

1399

type="file"

1400

style="display: none"

1400

style="display: none"

1401

ref="image"

1401

ref="image"

1402

accept="image/*"

1402

accept="image/*"

1403

@change="onFilePicked"

1403

@change="onFilePicked"

1404

/>

1404

/>

1405

<img

1405

<img

1406

:src="imageData.imageUrl"

1406

:src="imageData.imageUrl"

1407

height="150"

1407

height="150"

1408

v-if="imageUrl"

1408

v-if="imageUrl"

1409

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

1409

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

1410

/>

1410

/>

1411

</v-flex>

1411

</v-flex>

1412

</v-layout>

1412

</v-layout>

1413

<v-layout wrap>

1413

<v-layout wrap>

1414

<v-flex xs12 sm6>

1414

<v-flex xs12 sm6>

1415

<v-layout>

1415

<v-layout>

1416

<v-flex x4 sm4 class="pt-4 subheading">

1416

<v-flex x4 sm4 class="pt-4 subheading">

1417

<label class="right hidden-xs-only hidden-sm-only">Select Class:</label>

1417

<label class="right hidden-xs-only hidden-sm-only">Select Class:</label>

1418

<label

1418

<label

1419

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1419

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1420

>Class:</label>

1420

>Class:</label>

1421

</v-flex>

1421

</v-flex>

1422

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

1422

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

1423

<v-select

1423

<v-select

1424

:items="addclass"

1424

:items="addclass"

1425

label="Select Class"

1425

label="Select Class"

1426

v-model="addStudents.select"

1426

v-model="addStudents.select"

1427

item-text="classNum"

1427

item-text="classNum"

1428

item-value="_id"

1428

item-value="_id"

1429

name="Select Class"

1429

name="Select Class"

1430

:rules="classRules"

1430

:rules="classRules"

1431

@change="getSection(addStudents.select)"

1431

@change="getSection(addStudents.select)"

1432

required

1432

required

1433

></v-select>

1433

></v-select>

1434

</v-flex>

1434

</v-flex>

1435

</v-layout>

1435

</v-layout>

1436

</v-flex>

1436

</v-flex>

1437

<v-flex xs12 sm6>

1437

<v-flex xs12 sm6>

1438

<v-layout>

1438

<v-layout>

1439

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

1439

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

1440

<label class="right hidden-xs-only hidden-sm-only">Select Section:</label>

1440

<label class="right hidden-xs-only hidden-sm-only">Select Section:</label>

1441

<label

1441

<label

1442

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1442

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1443

>Section:</label>

1443

>Section:</label>

1444

</v-flex>

1444

</v-flex>

1445

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

1445

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

1446

<v-select

1446

<v-select

1447

:items="addSection"

1447

:items="addSection"

1448

label="Select Section"

1448

label="Select Section"

1449

v-model="addStudents.selectSection"

1449

v-model="addStudents.selectSection"

1450

item-text="name"

1450

item-text="name"

1451

item-value="_id"

1451

item-value="_id"

1452

name="Select Section"

1452

name="Select Section"

1453

:rules="sectionRules"

1453

:rules="sectionRules"

1454

required

1454

required

1455

></v-select>

1455

></v-select>

1456

</v-flex>

1456

</v-flex>

1457

</v-layout>

1457

</v-layout>

1458

</v-flex>

1458

</v-flex>

1459

</v-layout>

1459

</v-layout>

1460

<v-layout wrap>

1460

<v-layout wrap>

1461

<v-flex xs12 sm6>

1461

<v-flex xs12 sm6>

1462

<v-layout>

1462

<v-layout>

1463

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

1463

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

1464

1464

1465

<label

1465

<label

1466

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1466

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1467

>Name:</label>

1467

>Name:</label>

1468

</v-flex>

1468

</v-flex>

1469

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

1469

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

1470

<v-text-field

1470

<v-text-field

1471

v-model="addStudents.name"

1471

v-model="addStudents.name"

1472

placeholder="fill your full Name"

1472

placeholder="fill your full Name"

1473

name="name"

1473

name="name"

1474

type="text"

1474

type="text"

1475

:rules="nameRules"

1475

:rules="nameRules"

1476

required

1476

required

1477

></v-text-field>

1477

></v-text-field>

1478

</v-flex>

1478

</v-flex>

1479

</v-layout>

1479

</v-layout>

1480

</v-flex>

1480

</v-flex>

1481

<v-flex xs12 sm6>

1481

<v-flex xs12 sm6>

1482

<v-layout>

1482

<v-layout>

1483

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

1483

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

1484

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

1484

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

1485

</v-flex>

1485

</v-flex>

1486

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

1486

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

1487

<v-text-field

1487

<v-text-field

1488

placeholder="fill your email"

1488

placeholder="fill your email"

1489

v-model="addStudents.email"

1489

v-model="addStudents.email"

1490

type="text"

1490

type="text"

1491

name="email"

1491

name="email"

1492

required

1492

required

1493

></v-text-field>

1493

></v-text-field>

1494

</v-flex>

1494

</v-flex>

1495

</v-layout>

1495

</v-layout>

1496

</v-flex>

1496

</v-flex>

1497

</v-layout>

1497

</v-layout>

1498

<v-layout wrap>

1498

<v-layout wrap>

1499

<v-flex xs12 sm6>

1499

<v-flex xs12 sm6>

1500

<v-layout>

1500

<v-layout>

1501

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

1501

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

1502

<label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>

1502

<label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>

1503

<label

1503

<label

1504

class="right hidden-lg-only hidden-xl-only hidden-md-only"

1504

class="right hidden-lg-only hidden-xl-only hidden-md-only"

1505

>D.O.B:</label>

1505

>D.O.B:</label>

1506

</v-flex>

1506

</v-flex>

1507

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

1507

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

1508

<v-menu

1508

<v-menu

1509

ref="menu"

1509

ref="menu"

1510

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

1510

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

1511

v-model="menu"

1511

v-model="menu"

1512

:nudge-right="40"

1512

:nudge-right="40"

1513

lazy

1513

lazy

1514

transition="scale-transition"

1514

transition="scale-transition"

1515

offset-y

1515

offset-y

1516

full-width

1516

full-width

1517

min-width="290px"

1517

min-width="290px"

1518

>

1518

>

1519

<v-text-field

1519

<v-text-field

1520

slot="activator"

1520

slot="activator"

1521

:rules="dateRules"

1521

:rules="dateRules"

1522

v-model="addStudents.date"

1522

v-model="addStudents.date"

1523

placeholder="Select date"

1523

placeholder="Select date"

1524

></v-text-field>

1524

></v-text-field>

1525

<v-date-picker

1525

<v-date-picker

1526

ref="picker"

1526

ref="picker"

1527

v-model="addStudents.date"

1527

v-model="addStudents.date"

1528

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

1528

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

1529

min="1950-01-01"

1529

min="1950-01-01"

1530

@input="menu = false"

1530

@input="menu = false"

1531

></v-date-picker>

1531

></v-date-picker>

1532

</v-menu>

1532

</v-menu>

1533

</v-flex>

1533

</v-flex>

1534

</v-layout>

1534

</v-layout>

1535

</v-flex>

1535

</v-flex>

1536

<v-flex xs12 sm6>

1536

<v-flex xs12 sm6>

1537

<v-layout>

1537

<v-layout>

1538

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

1538

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

1539

1539

1540

</v-flex>

1540

</v-flex>

1541

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

1541

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

1542

<v-text-field

1542

<v-text-field

1543

v-model="addStudents.city"

1543

v-model="addStudents.city"

1544

placeholder="fill your City Name"

1544

placeholder="fill your City Name"

1545

name="City"

1545

name="City"

1546

type="text"

1546

type="text"

1547

:rules="cityRules"

1547

:rules="cityRules"

1548

required

1548

required

1549

></v-text-field>

1549

></v-text-field>

1550

</v-flex>

1550

</v-flex>

1551

</v-layout>

1551

</v-layout>

1552

</v-flex>

1552

</v-flex>

1553

</v-layout>

1553

</v-layout>

1554

<v-layout wrap>

1554

<v-layout wrap>

1555

<v-flex xs12 sm6>

1555

<v-flex xs12 sm6>

1556

<v-layout>

1556

<v-layout>

1557

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

1557

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

1558

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

1558

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

1559

</v-flex>

1559

</v-flex>

1560

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

1560

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

1561

<v-text-field

1561

<v-text-field

1562

v-model="addStudents.state"

1562

v-model="addStudents.state"

1563

placeholder="fill your State Name"

1563

placeholder="fill your State Name"

1564

name="state"

1564

name="state"

1565

type="text"

1565

type="text"

1566

:rules="stateRules"

1566

:rules="stateRules"

1567

required

1567

required

1568

></v-text-field>

1568

></v-text-field>

1569

</v-flex>

1569

</v-flex>

1570

</v-layout>

1570

</v-layout>

1571

</v-flex>

1571

</v-flex>

1572

<v-flex xs12 sm6>

1572

<v-flex xs12 sm6>

1573

<v-layout>

1573

<v-layout>

1574

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

1574

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

1575

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

1575

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

1576

</v-flex>

1576

</v-flex>

1577

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

1577

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

1578

<v-text-field

1578

<v-text-field

1579

v-model="addStudents.pincode"

1579

v-model="addStudents.pincode"

1580

placeholder="fill your pincode"

1580

placeholder="fill your pincode"

1581

name="pincode"

1581

name="pincode"

1582

type="number"

1582

type="number"

1583

:rules="pincode"

1583

:rules="pincode"

1584

required

1584

required

1585

></v-text-field>

1585

></v-text-field>

1586

</v-flex>

1586

</v-flex>

1587

</v-layout>

1587

</v-layout>

1588

</v-flex>

1588

</v-flex>

1589

</v-layout>

1589

</v-layout>

1590

<v-layout wrap>

1590

<v-layout wrap>

1591

<v-flex xs12 sm6>

1591

<v-flex xs12 sm6>

1592

<v-layout>

1592

<v-layout>

1593

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

1593

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

1594

<label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>

1594

<label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>

1595

<label

1595

<label

1596

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1596

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1597

>Mobile:</label>

1597

>Mobile:</label>

1598

</v-flex>

1598

</v-flex>

1599

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

1599

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

1600

<v-text-field

1600

<v-text-field

1601

v-model="addStudents.mobile"

1601

v-model="addStudents.mobile"

1602

placeholder="fill your MobileNo"

1602

placeholder="fill your MobileNo"

1603

name="mobileNo"

1603

name="mobileNo"

1604

type="number"

1604

type="number"

1605

></v-text-field>

1605

></v-text-field>

1606

</v-flex>

1606

</v-flex>

1607

</v-layout>

1607

</v-layout>

1608

</v-flex>

1608

</v-flex>

1609

<v-flex xs12 sm6>

1609

<v-flex xs12 sm6>

1610

<v-layout>

1610

<v-layout>

1611

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

1611

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

1612

<label class="right hidden-xs-only hidden-sm-only">Select Country:</label>

1612

<label class="right hidden-xs-only hidden-sm-only">Select Country:</label>

1613

<label

1613

<label

1614

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1614

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1615

>Country:</label>

1615

>Country:</label>

1616

</v-flex>

1616

</v-flex>

1617

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

1617

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

1618

<v-autocomplete

1618

<v-autocomplete

1619

v-model="addStudents.country"

1619

v-model="addStudents.country"

1620

:rules="country"

1620

:rules="country"

1621

:items="countries"

1621

:items="countries"

1622

placeholder="Select Country Name"

1622

placeholder="Select Country Name"

1623

required

1623

required

1624

></v-autocomplete>

1624

></v-autocomplete>

1625

</v-flex>

1625

</v-flex>

1626

</v-layout>

1626

</v-layout>

1627

</v-flex>

1627

</v-flex>

1628

</v-layout>

1628

</v-layout>

1629

<v-layout wrap>

1629

<v-layout wrap>

1630

<v-flex xs12 sm6>

1630

<v-flex xs12 sm6>

1631

<v-layout>

1631

<v-layout>

1632

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

1632

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

1633

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

1633

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

1634

</v-flex>

1634

</v-flex>

1635

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

1635

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

1636

<v-select

1636

<v-select

1637

:items="gender"

1637

:items="gender"

1638

v-model="addStudents.gender"

1638

v-model="addStudents.gender"

1639

:rules="genderRules"

1639

:rules="genderRules"

1640

label="Select Gender"

1640

label="Select Gender"

1641

required

1641

required

1642

></v-select>

1642

></v-select>

1643

</v-flex>

1643

</v-flex>

1644

</v-layout>

1644

</v-layout>

1645

</v-flex>

1645

</v-flex>

1646

<v-flex xs12 sm6>

1646

<v-flex xs12 sm6>

1647

<v-layout>

1647

<v-layout>

1648

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

1648

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

1649

<label class="right hidden-xs-only hidden-sm-only">Blood Group:</label>

1649

<label class="right hidden-xs-only hidden-sm-only">Blood Group:</label>

1650

<label

1650

<label

1651

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1651

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1652

>Blood:</label>

1652

>Blood:</label>

1653

</v-flex>

1653

</v-flex>

1654

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

1654

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

1655

<v-text-field

1655

<v-text-field

1656

v-model="addStudents.bloodGroup"

1656

v-model="addStudents.bloodGroup"

1657

placeholder="Fill your Blood Group"

1657

placeholder="Fill your Blood Group"

1658

required

1658

required

1659

></v-text-field>

1659

></v-text-field>

1660

</v-flex>

1660

</v-flex>

1661

</v-layout>

1661

</v-layout>

1662

</v-flex>

1662

</v-flex>

1663

</v-layout>

1663

</v-layout>

1664

<v-layout wrap>

1664

<v-layout wrap>

1665

<v-flex xs12 sm6>

1665

<v-flex xs12 sm6>

1666

<v-layout>

1666

<v-layout>

1667

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

1667

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

1668

<label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>

1668

<label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>

1669

<label

1669

<label

1670

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1670

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1671

>Roll No:</label>

1671

>Roll No:</label>

1672

</v-flex>

1672

</v-flex>

1673

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

1673

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

1674

<v-text-field

1674

<v-text-field

1675

v-model="addStudents.rollNo"

1675

v-model="addStudents.rollNo"

1676

placeholder="Fill your Roll Number"

1676

placeholder="Fill your Roll Number"

1677

:rules="rollNo"

1677

:rules="rollNo"

1678

required

1678

required

1679

></v-text-field>

1679

></v-text-field>

1680

</v-flex>

1680

</v-flex>

1681

</v-layout>

1681

</v-layout>

1682

</v-flex>

1682

</v-flex>

1683

<v-flex xs12 sm6>

1683

<v-flex xs12 sm6>

1684

<v-layout>

1684

<v-layout>

1685

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

1685

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

1686

<label class="right hidden-xs-only hidden-sm-only">Medical Notes:</label>

1686

<label class="right hidden-xs-only hidden-sm-only">Medical Notes:</label>

1687

<label

1687

<label

1688

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1688

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1689

>Medical:</label>

1689

>Medical:</label>

1690

</v-flex>

1690

</v-flex>

1691

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

1691

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

1692

<v-text-field

1692

<v-text-field

1693

v-model="addStudents.medicalNotes"

1693

v-model="addStudents.medicalNotes"

1694

placeholder="Fill your Medical Notes"

1694

placeholder="Fill your Medical Notes"

1695

required

1695

required

1696

></v-text-field>

1696

></v-text-field>

1697

</v-flex>

1697

</v-flex>

1698

</v-layout>

1698

</v-layout>

1699

</v-flex>

1699

</v-flex>

1700

</v-layout>

1700

</v-layout>

1701

<v-layout wrap>

1701

<v-layout wrap>

1702

<v-flex xs12 sm6>

1702

<v-flex xs12 sm6>

1703

<v-layout>

1703

<v-layout>

1704

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

1704

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

1705

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

1705

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

1706

</v-flex>

1706

</v-flex>

1707

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

1707

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

1708

<v-text-field

1708

<v-text-field

1709

v-model="addStudents.height"

1709

v-model="addStudents.height"

1710

placeholder="Fill your Height"

1710

placeholder="Fill your Height"

1711

required

1711

required

1712

></v-text-field>

1712

></v-text-field>

1713

</v-flex>

1713

</v-flex>

1714

</v-layout>

1714

</v-layout>

1715

</v-flex>

1715

</v-flex>

1716

<v-flex xs12 sm6>

1716

<v-flex xs12 sm6>

1717

<v-layout>

1717

<v-layout>

1718

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

1718

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

1719

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

1719

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

1720

</v-flex>

1720

</v-flex>

1721

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

1721

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

1722

<v-text-field

1722

<v-text-field

1723

v-model="addStudents.weight"

1723

v-model="addStudents.weight"

1724

placeholder="Fill your Weight"

1724

placeholder="Fill your Weight"

1725

required

1725

required

1726

></v-text-field>

1726

></v-text-field>

1727

</v-flex>

1727

</v-flex>

1728

</v-layout>

1728

</v-layout>

1729

</v-flex>

1729

</v-flex>

1730

</v-layout>

1730

</v-layout>

1731

<v-layout wrap>

1731

<v-layout wrap>

1732

<v-flex xs12 sm6>

1732

<v-flex xs12 sm6>

1733

<v-layout>

1733

<v-layout>

1734

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

1734

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

1735

<label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>

1735

<label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>

1736

<label

1736

<label

1737

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1737

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1738

>Uplaod :</label>

1738

>Uplaod :</label>

1739

</v-flex>

1739

</v-flex>

1740

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

1740

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

1741

<v-text-field

1741

<v-text-field

1742

label="Select Image"

1742

label="Select Image"

1743

@click="pickFile"

1743

@click="pickFile"

1744

v-model="imageName"

1744

v-model="imageName"

1745

append-icon="attach_file"

1745

append-icon="attach_file"

1746

></v-text-field>

1746

></v-text-field>

1747

</v-flex>

1747

</v-flex>

1748

</v-layout>

1748

</v-layout>

1749

</v-flex>

1749

</v-flex>

1750

<v-flex xs12 sm6>

1750

<v-flex xs12 sm6>

1751

<v-layout>

1751

<v-layout>

1752

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

1752

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

1753

<label class="right hidden-xs-only hidden-sm-only">Academic Year:</label>

1753

<label class="right hidden-xs-only hidden-sm-only">Academic Year:</label>

1754

<label

1754

<label

1755

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1755

class="right hidden-lg-only hidden-md-only hidden-xl-only"

1756

>Year:</label>

1756

>Year:</label>

1757

</v-flex>

1757

</v-flex>

1758

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

1758

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

1759

<v-text-field

1759

<v-text-field

1760

v-model="addStudents.establishmentYear"

1760

v-model="addStudents.establishmentYear"

1761

placeholder="fill your Academic Year"

1761

placeholder="fill your Academic Year"

1762

name="state"

1762

name="state"

1763

type="number"

1763

type="number"

1764

:rules="establishmentYearRules"

1764

:rules="establishmentYearRules"

1765

required

1765

required

1766

></v-text-field>

1766

></v-text-field>

1767

</v-flex>

1767

</v-flex>

1768

</v-layout>

1768

</v-layout>

1769

</v-flex>

1769

</v-flex>

1770

</v-layout>

1770

</v-layout>

1771

<v-layout wrap class="hidden-xs-only hidden-sm-only">

1771

<v-layout wrap class="hidden-xs-only hidden-sm-only">

1772

<v-flex xs12 sm6>

1772

<v-flex xs12 sm6>

1773

<v-layout>

1773

<v-layout>

1774

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

1774

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

1775

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

1775

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

1776

</v-flex>

1776

</v-flex>

1777

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

1777

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

1778

<v-text-field

1778

<v-text-field

1779

v-model="addStudents.presentAddress"

1779

v-model="addStudents.presentAddress"

1780

:rules="presentAddress"

1780

:rules="presentAddress"

1781

placeholder="fill Your present Address"

1781

placeholder="fill Your present Address"

1782

@keyup="copyData"

1782

@keyup="copyData"

1783

></v-text-field>

1783

></v-text-field>

1784

</v-flex>

1784

</v-flex>

1785

</v-layout>

1785

</v-layout>

1786

</v-flex>

1786

</v-flex>

1787

<v-flex xs12 sm6>

1787

<v-flex xs12 sm6>

1788

<v-layout>

1788

<v-layout>

1789

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

1789

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

1790

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

1790

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

1791

</v-flex>

1791

</v-flex>

1792

<v-flex xs12 sm8 class="ml-3">

1792

<v-flex xs12 sm8 class="ml-3">

1793

<v-switch

1793

<v-switch

1794

v-model="addStudents.permanentAddress"

1794

v-model="addStudents.permanentAddress"

1795

label="Select Permanent Address"

1795

label="Select Permanent Address"

1796

:value="addStudents.presentAddress"

1796

:value="addStudents.presentAddress"

1797

></v-switch>

1797

></v-switch>

1798

</v-flex>

1798

</v-flex>

1799

</v-layout>

1799

</v-layout>

1800

</v-flex>

1800

</v-flex>

1801

</v-layout>

1801

</v-layout>

1802

<v-layout class="hidden-xs-only hidden-sm-only">

1802

<v-layout class="hidden-xs-only hidden-sm-only">

1803

<v-flex xs12 sm6>

1803

<v-flex xs12 sm6>

1804

<v-layout>

1804

<v-layout>

1805

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

1805

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

1806

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

1806

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

1807

</v-flex>

1807

</v-flex>

1808

<v-flex xs12 sm8 class="ml-3">

1808

<v-flex xs12 sm8 class="ml-3">

1809

<v-text-field

1809

<v-text-field

1810

v-model="addStudents.permanentAddress"

1810

v-model="addStudents.permanentAddress"

1811

:rules="permanentAddress"

1811

:rules="permanentAddress"

1812

placeholder="fill Your Permanent Address"

1812

placeholder="fill Your Permanent Address"

1813

></v-text-field>

1813

></v-text-field>

1814

</v-flex>

1814

</v-flex>

1815

</v-layout>

1815

</v-layout>

1816

</v-flex>

1816

</v-flex>

1817

</v-layout>

1817

</v-layout>

1818

<v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>

1818

<v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>

1819

<v-flex xs12 sm12>

1819

<v-flex xs12 sm12>

1820

<v-layout>

1820

<v-layout>

1821

<v-flex xs12 sm12 class="pt-4 subheading text-xs-center">

1821

<v-flex xs12 sm12 class="pt-4 subheading text-xs-center">

1822

<label class>Present Address:</label>

1822

<label class>Present Address:</label>

1823

</v-flex>

1823

</v-flex>

1824

</v-layout>

1824

</v-layout>

1825

<v-layout>

1825

<v-layout>

1826

<v-flex xs12 sm12>

1826

<v-flex xs12 sm12>

1827

<v-textarea

1827

<v-textarea

1828

name="input-4-3"

1828

name="input-4-3"

1829

v-model="addStudents.presentAddress"

1829

v-model="addStudents.presentAddress"

1830

:rules="presentAddress"

1830

:rules="presentAddress"

1831

placeholder="fill Your present Address"

1831

placeholder="fill Your present Address"

1832

required

1832

required

1833

></v-textarea>

1833

></v-textarea>

1834

</v-flex>

1834

</v-flex>

1835

</v-layout>

1835

</v-layout>

1836

</v-flex>

1836

</v-flex>

1837

<v-flex xs12 sm12>

1837

<v-flex xs12 sm12>

1838

<v-layout>

1838

<v-layout>

1839

<v-flex

1839

<v-flex

1840

xs12

1840

xs12

1841

sm12

1841

sm12

1842

class="pt-4 pr-4 subheading text-xs-center addressForm"

1842

class="pt-4 pr-4 subheading text-xs-center addressForm"

1843

>

1843

>

1844

<label>Permanent Address:</label>

1844

<label>Permanent Address:</label>

1845

</v-flex>

1845

</v-flex>

1846

</v-layout>

1846

</v-layout>

1847

<v-layout>

1847

<v-layout>

1848

<v-flex xs12 sm12>

1848

<v-flex xs12 sm12>

1849

<v-textarea

1849

<v-textarea

1850

name="input-4-3"

1850

name="input-4-3"

1851

v-model="addStudents.permanentAddress"

1851

v-model="addStudents.permanentAddress"

1852

:rules="permanentAddress"

1852

:rules="permanentAddress"

1853

placeholder="fill Your Permanent Address"

1853

placeholder="fill Your Permanent Address"

1854

required

1854

required

1855

></v-textarea>

1855

></v-textarea>

1856

</v-flex>

1856

</v-flex>

1857

</v-layout>

1857

</v-layout>

1858

</v-flex>

1858

</v-flex>

1859

</v-layout>

1859

</v-layout>

1860

<v-layout>

1860

<v-layout>

1861

<v-flex xs12 sm12>

1861

<v-flex xs12 sm12>

1862

<v-layout class="right">

1862

<v-layout class="right">

1863

1863

1864

<v-btn round dark @click="e2 = 1" class="clear-button">Back</v-btn>

1864

<v-btn round dark @click="e2 = 1" class="clear-button">Back</v-btn>

1865

<!-- </v-flex>

1865

<!-- </v-flex>

1866

<v-flex xs6>-->

1866

<v-flex xs6>-->

1867

<v-btn

1867

<v-btn

1868

@click="submit"

1868

@click="submit"

1869

round

1869

round

1870

dark

1870

dark

1871

:loading="loading"

1871

:loading="loading"

1872

class="add-button"

1872

class="add-button"

1873

>Add</v-btn>

1873

>Add</v-btn>

1874

1874

1875

</v-layout>

1875

</v-layout>

1876

</v-flex>

1876

</v-flex>

1877

</v-layout>

1877

</v-layout>

1878

</v-form>

1878

</v-form>

1879

</v-flex>

1879

</v-flex>

1880

</v-stepper-content>

1880

</v-stepper-content>

1881

</v-stepper-items>

1881

</v-stepper-items>

1882

</v-stepper>

1882

</v-stepper>

1883

</v-flex>

1883

</v-flex>

1884

</v-layout>

1884

</v-layout>

1885

</v-container>

1885

</v-container>

1886

</v-card>

1886

</v-card>

1887

</v-dialog>

1887

</v-dialog>

1888

<v-snackbar

1888

<v-snackbar

1889

:timeout="timeout"

1889

:timeout="timeout"

1890

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

1890

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

1891

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

1891

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

1892

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

1892

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

1893

v-model="snackbar"

1893

v-model="snackbar"

1894

:color="color"

1894

:color="color"

1895

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

1895

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

1896

1896

1897

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

1897

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

1898

</div>

1898

</div>

1899

</v-container>

1899

</v-container>

1900

</template>

1900

</template>

1901

1902

1902

1903

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

1903

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

1904

import moment from "moment";

1904

import moment from "moment";

1905

import countryList from "@/script/country.js";

1905

import countryList from "@/script/country.js";

1906

import parent from "@/script/parents.js";

1906

import parent from "@/script/parents.js";

1907

1908

export default {

1908

export default {

1909

data: () => ({

1909

data: () => ({

1910

e1: true,

1910

e1: true,

1911

e2: 0,

1911

e2: 0,

1912

showParent: true,

1912

showParent: true,

1913

showNext: false,

1913

showNext: false,

1914

snackbar: false,

1914

snackbar: false,

1915

y: "top",

1915

y: "top",

1916

x: "right",

1916

x: "right",

1917

role: "",

1917

role: "",

1918

mode: "",

1918

mode: "",

1919

append: "",

1919

append: "",

1920

timeout: 3000,

1920

timeout: 3000,

1921

text: "",

1921

text: "",

1922

show: true,

1922

show: true,

1923

color: "",

1923

color: "",

1924

showSearch: false,

1924

showSearch: false,

1925

showLoader: false,

1925

showLoader: false,

1926

loading: false,

1926

loading: false,

1927

editLoading: false,

1927

editLoading: false,

1928

date: null,

1928

date: null,

1929

search: "",

1929

search: "",

1930

password: "",

1930

password: "",

1931

menu: false,

1931

menu: false,

1932

menu1: false,

1932

menu1: false,

1933

editStudentDialog: false,

1933

editStudentDialog: false,

1934

profileStudentDialog: false,

1934

profileStudentDialog: false,

1935

addStudentDialog: false,

1935

addStudentDialog: false,

1936

valid: true,

1936

valid: true,

1937

addclass: [],

1937

addclass: [],

1938

addSection: [],

1938

addSection: [],

1939

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

1939

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

1940

pagination: {

1940

pagination: {

1941

rowsPerPage: 10,

1941

rowsPerPage: 10,

1942

},

1942

},

1943

imageData: {},

1943

imageData: {},

1944

imageName: "",

1944

imageName: "",

1945

imageUrl: "",

1945

imageUrl: "",

1946

imageFile: "",

1946

imageFile: "",

1947

editImageName: "",

1947

editImageName: "",

1948

editImageUrl: "",

1948

editImageUrl: "",

1949

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

1949

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

1950

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

1950

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

1951

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

1951

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

1952

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

1952

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

1953

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

1953

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

1954

rollNo: [(v) => !!v || "Roll No is required"],

1954

rollNo: [(v) => !!v || "Roll No is required"],

1955

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

1955

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

1956

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

1956

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

1957

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

1957

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

1958

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

1958

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

1959

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

1959

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

1960

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

1960

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

1961

fatheCellNoRules: [

1961

fatheCellNoRules: [

1962

(v) => !!v || " father Cell Number is required",

1962

(v) => !!v || " father Cell Number is required",

1963

(v) => v <= 10000000000 || "Max 10 characters is required",

1963

(v) => v <= 10000000000 || "Max 10 characters is required",

1964

],

1964

],

1965

password: [

1965

password: [

1966

(v) => !!v || "Password field is Required.",

1966

(v) => !!v || "Password field is Required.",

1967

// v => (/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/).test(v) && v.length >= 8

1967

// v => (/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/).test(v) && v.length >= 8

1968

],

1968

],

1969

mobileNoRule: [(v) => !!v || " Mobile Number is required"],

1969

mobileNoRule: [(v) => !!v || " Mobile Number is required"],

1970

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

1970

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

1971

errorMessages: "",

1971

errorMessages: "",

1972

countries: [],

1972

countries: [],

1973

headers: [

1973

headers: [

1974

{

1974

{

1975

text: "Roll No.",

1975

text: "Roll No.",

1976

align: "center",

1976

align: "center",

1977

sortable: false,

1977

sortable: false,

1978

value: "rollNo",

1978

value: "rollNo",

1979

},

1979

},

1980

{

1980

{

1981

text: "Profile Pic",

1981

text: "Profile Pic",

1982

value: "profilePicUrl",

1982

value: "profilePicUrl",

1983

sortable: false,

1983

sortable: false,

1984

align: "center",

1984

align: "center",

1985

},

1985

},

1986

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

1986

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

1987

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

1987

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

1988

{

1988

{

1989

text: "Father Name",

1989

text: "Father Name",

1990

value: "fatherName",

1990

value: "fatherName",

1991

sortable: false,

1991

sortable: false,

1992

align: "center",

1992

align: "center",

1993

},

1993

},

1994

{

1994

{

1995

text: "Mother Name",

1995

text: "Mother Name",

1996

value: "motherName",

1996

value: "motherName",

1997

sortable: false,

1997

sortable: false,

1998

align: "center",

1998

align: "center",

1999

},

1999

},

2000

{

2000

{

2001

text: "Academic Year",

2001

text: "Academic Year",

2002

value: "establishmentYear",

2002

value: "establishmentYear",

2003

sortable: false,

2003

sortable: false,

2004

align: "center",

2004

align: "center",

2005

},

2005

},

2006

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

2006

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

2007

{

2007

{

2008

text: "Status",

2008

text: "Status",

2009

value: "status",

2009

value: "status",

2010

sortable: false,

2010

sortable: false,

2011

align: "center",

2011

align: "center",

2012

},

2012

},

2013

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

2013

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

2014

],

2014

],

2015

studentsData: [],

2015

studentsData: [],

2016

parentId: "",

2016

parentId: "",

2017

editedIndex: -1,

2017

editedIndex: -1,

2018

parentData: {},

2018

parentData: {},

2019

addStudents: {

2019

addStudents: {

2020

role: "STUDENT",

2020

role: "STUDENT",

2021

2021

2022

email: "",

2022

email: "",

2023

date: "",

2023

date: "",

2024

city: "",

2024

city: "",

2025

pincode: "",

2025

pincode: "",

2026

country: "",

2026

country: "",

2027

permanentAddress: "",

2027

permanentAddress: "",

2028

presentAddress: "",

2028

presentAddress: "",

2029

mobile: "",

2029

mobile: "",

2030

state: "",

2030

state: "",

2031

gender: "",

2031

gender: "",

2032

select: "",

2032

select: "",

2033

selectSection: "",

2033

selectSection: "",

2034

bloodGroup: "",

2034

bloodGroup: "",

2035

allergies: "",

2035

allergies: "",

2036

medicalNotes: "",

2036

medicalNotes: "",

2037

height: "",

2037

height: "",

2038

weight: "",

2038

weight: "",

2039

rollNo: "",

2039

rollNo: "",

2040

establishmentYear: new Date().getFullYear(),

2040

establishmentYear: new Date().getFullYear(),

2041

},

2041

},

2042

selectStudents: {

2042

selectStudents: {

2043

select: "",

2043

select: "",

2044

selectSection: "",

2044

selectSection: "",

2045

},

2045

},

2046

editedItem: {

2046

editedItem: {

2047

role: "STUDENT",

2047

role: "STUDENT",

2048

2048

2049

email: "",

2049

email: "",

2050

dob: "",

2050

dob: "",

2051

city: "",

2051

city: "",

2052

pincode: "",

2052

pincode: "",

2053

country: "",

2053

country: "",

2054

permanentAddress: "",

2054

permanentAddress: "",

2055

presentAddress: "",

2055

presentAddress: "",

2056

mobile: "",

2056

mobile: "",

2057

state: "",

2057

state: "",

2058

gender: "",

2058

gender: "",

2059

select: "",

2059

select: "",

2060

selectSection: "",

2060

selectSection: "",

2061

bloodGroup: "",

2061

bloodGroup: "",

2062

allergies: "",

2062

allergies: "",

2063

medicalNotes: "",

2063

medicalNotes: "",

2064

height: "",

2064

height: "",

2065

weight: "",

2065

weight: "",

2066

rollNo: "",

2066

rollNo: "",

2067

establishmentYear: new Date().getFullYear(),

2067

establishmentYear: new Date().getFullYear(),

2068

},

2068

},

2069

isFatherCellExists: false,

2069

isFatherCellExists: false,

2070

}),

2070

}),

2071

watch: {

2071

watch: {

2072

menu(val) {

2072

menu(val) {

2073

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

2073

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

2074

},

2074

},

2075

menu1(val) {

2075

menu1(val) {

2076

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

2076

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

2077

},

2077

},

2078

},

2078

},

2079

methods: {

2079

methods: {

2080

findStudents() {

2080

findStudents() {

2081

this.showLoader = true;

2081

this.showLoader = true;

2082

http()

2082

http()

2083

.get("/getStudentWithClass", {

2083

.get("/getStudentWithClass", {

2084

params: {

2084

params: {

2085

classId: this.selectStudents.select,

2085

classId: this.selectStudents.select,

2086

sectionId: this.selectStudents.selectSection,

2086

sectionId: this.selectStudents.selectSection,

2087

},

2087

},

2088

})

2088

})

2089

.then((response) => {

2089

.then((response) => {

2090

this.studentsData = response.data.data;

2090

this.studentsData = response.data.data;

2091

this.showLoader = false;

2091

this.showLoader = false;

2092

})

2092

})

2093

.catch((err) => {

2093

.catch((err) => {

2094

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

2094

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

2095

this.showLoader = false;

2095

this.showLoader = false;

2096

});

2096

});

2097

},

2097

},

2098

getSections(_id) {

2098

getSections(_id) {

2099

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

2099

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

2100

this.showLoader = true;

2100

this.showLoader = true;

2101

http()

2101

http()

2102

.get(

2102

.get(

2103

"/getSectionsList",

2103

"/getSectionsList",

2104

{ params: { classId: _id } },

2104

{ params: { classId: _id } },

2105

{

2105

{

2106

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

2106

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

2107

}

2107

}

2108

)

2108

)

2109

.then((response) => {

2109

.then((response) => {

2110

this.addSection = response.data.data;

2110

this.addSection = response.data.data;

2111

this.showLoader = false;

2111

this.showLoader = false;

2112

})

2112

})

2113

.catch((err) => {

2113

.catch((err) => {

2114

this.showLoader = false;

2114

this.showLoader = false;

2115

});

2115

});

2116

},

2116

},

2117

getSection(_id) {

2117

getSection(_id) {

2118

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

2118

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

2119

this.showLoader = true;

2119

this.showLoader = true;

2120

http()

2120

http()

2121

.get(

2121

.get(

2122

"/getSectionsList",

2122

"/getSectionsList",

2123

{ params: { classId: _id } },

2123

{ params: { classId: _id } },

2124

{

2124

{

2125

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

2125

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

2126

}

2126

}

2127

)

2127

)

2128

.then((response) => {

2128

.then((response) => {

2129

this.addSection = response.data.data;

2129

this.addSection = response.data.data;

2130

this.showLoader = false;

2130

this.showLoader = false;

2131

})

2131

})

2132

.catch((err) => {

2132

.catch((err) => {

2133

this.showLoader = false;

2133

this.showLoader = false;

2134

});

2134

});

2135

},

2135

},

2136

pickFile() {

2136

pickFile() {

2137

this.$refs.image.click();

2137

this.$refs.image.click();

2138

},

2138

},

2139

pickEditFile() {

2139

pickEditFile() {

2140

this.$refs.editDataImage.click();

2140

this.$refs.editDataImage.click();

2141

},

2141

},

2142

dates: function (date) {

2142

dates: function (date) {

2143

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

2143

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

2144

return date;

2144

return date;

2145

},

2145

},

2146

onFilePicked(e) {

2146

onFilePicked(e) {

2147

// console.log(e)

2147

// console.log(e)

2148

const files = e.target.files;

2148

const files = e.target.files;

2149

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

2149

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

2150

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

2150

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

2151

this.imageName = files[0].name;

2151

this.imageName = files[0].name;

2152

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

2152

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

2153

return;

2153

return;

2154

}

2154

}

2155

const fr = new FileReader();

2155

const fr = new FileReader();

2156

fr.readAsDataURL(files[0]);

2156

fr.readAsDataURL(files[0]);

2157

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

2157

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

2158

this.imageUrl = fr.result;

2158

this.imageUrl = fr.result;

2159

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

2159

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

2160

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

2160

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

2161

});

2161

});

2162

} else {

2162

} else {

2163

this.imageName = "";

2163

this.imageName = "";

2164

this.imageFile = "";

2164

this.imageFile = "";

2165

this.imageUrl = "";

2165

this.imageUrl = "";

2166

}

2166

}

2167

},

2167

},

2168

onEditFilePicked(e) {

2168

onEditFilePicked(e) {

2169

console.log(e);

2169

console.log(e);

2170

const files = e.target.files;

2170

const files = e.target.files;

2171

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

2171

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

2172

this.editImageName = files[0].name;

2172

this.editImageName = files[0].name;

2173

console.log("this.editImageName", this.editImageName);

2173

console.log("this.editImageName", this.editImageName);

2174

2175

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

2175

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

2176

return;

2176

return;

2177

}

2177

}

2178

const fr = new FileReader();

2178

const fr = new FileReader();

2179

fr.readAsDataURL(files[0]);

2179

fr.readAsDataURL(files[0]);

2180

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

2180

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

2181

this.editImageUrl = fr.result;

2181

this.editImageUrl = fr.result;

2182

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

2182

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

2183

});

2183

});

2184

} else {

2184

} else {

2185

this.editImageName = "";

2185

this.editImageName = "";

2186

this.editiImageFile = "";

2186

this.editiImageFile = "";

2187

}

2187

}

2188

},

2188

},

2189

editItem(item) {

2189

editItem(item) {

2190

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

2190

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

2191

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

2191

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

2192

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

2192

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

2193

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

2193

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

2194

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

2194

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

2195

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

2195

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

2196

this.editedItem.dob =

2196

this.editedItem.dob =

2197

this.editedItem.dob != undefined

2197

this.editedItem.dob != undefined

2198

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

2198

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

2199

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

2199

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

2200

this.editStudentDialog = true;

2200

this.editStudentDialog = true;

2201

},

2201

},

2202

profile(item) {

2202

profile(item) {

2203

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

2203

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

2204

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

2204

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

2205

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

2205

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

2206

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

2206

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

2207

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

2207

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

2208

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

2208

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

2209

2210

this.profileStudentDialog = true;

2210

this.profileStudentDialog = true;

2211

},

2211

},

2212

deleteItem(item) {

2212

deleteItem(item) {

2213

let deleteStudent = {

2213

let deleteStudent = {

2214

studentId: item._id,

2214

studentId: item._id,

2215

};

2215

};

2216

http()

2216

http()

2217

.delete(

2217

.delete(

2218

"/deleteStudent",

2218

"/deleteStudent",

2219

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

2219

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

2220

params: deleteStudent,

2220

params: deleteStudent,

2221

}

2221

}

2222

)

2222

)

2223

.then((response) => {

2223

.then((response) => {

2224

this.snackbar = true;

2224

this.snackbar = true;

2225

this.text = response.data.message;

2225

this.text = response.data.message;

2226

this.color = "green";

2226

this.color = "green";

2227

this.findStudents();

2227

this.findStudents();

2228

})

2228

})

2229

.catch((error) => {

2229

.catch((error) => {

2230

this.snackbar = true;

2230

this.snackbar = true;

2231

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

2231

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

2232

this.color = "error";

2232

this.color = "error";

2233

});

2233

});

2234

},

2234

},

2235

close() {

2235

close() {

2236

this.editStudentDialog = false;

2236

this.editStudentDialog = false;

2237

},

2237

},

2238

closeStudentProfile() {

2238

closeStudentProfile() {

2239

this.profileStudentDialog = false;

2239

this.profileStudentDialog = false;

2240

},

2240

},

2241

copyData() {

2241

copyData() {

2242

this.addStudents.permanentAddress = this.addStudents.presentAddress;

2242

this.addStudents.permanentAddress = this.addStudents.presentAddress;

2243

},

2243

},

2244

submit() {

2244

submit() {

2245

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

2245

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

2246

let addStudent = {

2246

let addStudent = {

2247

parentId: this.parentId,

2247

parentId: this.parentId,

2248

2248

2249

email: this.addStudents.email,

2249

email: this.addStudents.email,

2250

role: this.addStudents.role,

2250

role: this.addStudents.role,

2251

dob: this.addStudents.date,

2251

dob: this.addStudents.date,

2252

city: this.addStudents.city,

2252

city: this.addStudents.city,

2253

pincode: this.addStudents.pincode,

2253

pincode: this.addStudents.pincode,

2254

country: this.addStudents.country,

2254

country: this.addStudents.country,

2255

permanentAddress: this.addStudents.permanentAddress,

2255

permanentAddress: this.addStudents.permanentAddress,

2256

presentAddress: this.addStudents.presentAddress,

2256

presentAddress: this.addStudents.presentAddress,

2257

mobile: this.addStudents.mobile,

2257

mobile: this.addStudents.mobile,

2258

state: this.addStudents.state,

2258

state: this.addStudents.state,

2259

gender: this.addStudents.gender,

2259

gender: this.addStudents.gender,

2260

establishmentYear: this.addStudents.establishmentYear,

2260

establishmentYear: this.addStudents.establishmentYear,

2261

classId: this.addStudents.select,

2261

classId: this.addStudents.select,

2262

sectionId: this.addStudents.selectSection,

2262

sectionId: this.addStudents.selectSection,

2263

bloodGroup: this.addStudents.bloodGroup,

2263

bloodGroup: this.addStudents.bloodGroup,

2264

medicalNotes: this.addStudents.medicalNotes,

2264

medicalNotes: this.addStudents.medicalNotes,

2265

height: this.addStudents.height,

2265

height: this.addStudents.height,

2266

weight: this.addStudents.weight,

2266

weight: this.addStudents.weight,

2267

rollNo: this.addStudents.rollNo,

2267

rollNo: this.addStudents.rollNo,

2268

};

2268

};

2269

if (this.imageUrl) {

2269

if (this.imageUrl) {

2270

var str = this.imageUrl;

2270

var str = this.imageUrl;

2271

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

2271

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

2272

addStudent.upload = imageUrl;

2272

addStudent.upload = imageUrl;

2273

}

2273

}

2274

this.loading = true;

2274

this.loading = true;

2275

http()

2275

http()

2276

.post("/createStudent", addStudent)

2276

.post("/createStudent", addStudent)

2277

.then((response) => {

2277

.then((response) => {

2278

this.snackbar = true;

2278

this.snackbar = true;

2279

this.text = "New Student added successfully";

2279

this.text = "New Student added successfully";

2280

this.color = "green";

2280

this.color = "green";

2281

this.addStudentDialog = false;

2281

this.addStudentDialog = false;

2282

this.clear();

2282

this.$refs.parentForm.reset();

2283

this.clearParents();

2283

this.$refs.parentFormLgScr.reset();

2284

this.$refs.form.reset();

2285

this.e2 = 1;

2286

// this.clear();

2287

// this.clearParents();

2284

this.loading = false;

2288

this.loading = false;

2285

})

2289

})

2286

.catch((error) => {

2290

.catch((error) => {

2287

this.snackbar = true;

2291

this.snackbar = true;

2288

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

2292

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

2289

this.color = "error";

2293

this.color = "error";

2290

this.loading = false;

2294

this.loading = false;

2291

});

2295

});

2292

}

2296

}

2293

},

2297

},

2294

clear() {

2298

clear() {

2295

this.$refs.form.reset();

2299

this.$refs.form.reset();

2296

this.imageUrl = "";

2300

this.imageUrl = "";

2297

},

2301

},

2298

clearParents() {

2302

clearParents() {

2299

this.$refs.parentForm.reset();

2303

this.$refs.parentForm.reset();

2300

},

2304

},

2301

save() {

2305

save() {

2302

let editStudent = {

2306

let editStudent = {

2303

studentId: this.editedItem._id,

2307

studentId: this.editedItem._id,

2304

2308

2305

email: this.editedItem.email,

2309

email: this.editedItem.email,

2306

role: this.editedItem.role,

2310

role: this.editedItem.role,

2307

dob: this.editedItem.dob,

2311

dob: this.editedItem.dob,

2308

city: this.editedItem.city,

2312

city: this.editedItem.city,

2309

pincode: this.editedItem.pincode,

2313

pincode: this.editedItem.pincode,

2310

country: this.editedItem.country,

2314

country: this.editedItem.country,

2311

permanentAddress: this.editedItem.permanentAddress,

2315

permanentAddress: this.editedItem.permanentAddress,

2312

presentAddress: this.editedItem.presentAddress,

2316

presentAddress: this.editedItem.presentAddress,

2313

mobile: this.editedItem.mobile,

2317

mobile: this.editedItem.mobile,

2314

state: this.editedItem.state,

2318

state: this.editedItem.state,

2315

gender: this.editedItem.gender,

2319

gender: this.editedItem.gender,

2316

establishmentYear: this.editedItem.establishmentYear,

2320

establishmentYear: this.editedItem.establishmentYear,

2317

classId: this.editedItem.select,

2321

classId: this.editedItem.select,

2318

sectionId: this.editedItem.selectSection,

2322

sectionId: this.editedItem.selectSection,

2319

bloodGroup: this.editedItem.bloodGroup,

2323

bloodGroup: this.editedItem.bloodGroup,

2320

medicalNotes: this.editedItem.medicalNotes,

2324

medicalNotes: this.editedItem.medicalNotes,

2321

height: this.editedItem.height,

2325

height: this.editedItem.height,

2322

weight: this.editedItem.weight,

2326

weight: this.editedItem.weight,

2323

rollNo: this.editedItem.rollNo,

2327

rollNo: this.editedItem.rollNo,

2324

};

2328

};

2325

if (this.editImageUrl) {

2329

if (this.editImageUrl) {

2326

var str = this.editImageUrl;

2330

var str = this.editImageUrl;

2327

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

2331

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

2328

editStudent.upload = editImageUrl;

2332

editStudent.upload = editImageUrl;

2329

}

2333

}

2330

this.editLoading = true;

2334

this.editLoading = true;

2331

http()

2335

http()

2332

.put("/updateStudent", editStudent)

2336

.put("/updateStudent", editStudent)

2333

.then((response) => {

2337

.then((response) => {

2334

this.snackbar = true;

2338

this.snackbar = true;

2335

this.text = response.data.message;

2339

this.text = response.data.message;

2336

this.color = "green";

2340

this.color = "green";

2337

this.imageUrl = "";

2341

this.imageUrl = "";

2338

this.findStudents();

2342

this.findStudents();

2339

this.close();

2343

this.close();

2340

this.editLoading = false;

2344

this.editLoading = false;

2341

})

2345

})

2342

.catch((error) => {

2346

.catch((error) => {

2343

this.snackbar = true;

2347

this.snackbar = true;

2344

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

2348

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

2345

this.color = "error";

2349

this.color = "error";

2346

this.editLoading = false;

2350

this.editLoading = false;

2347

});

2351

});

2348

},

2352

},

2349

submitParentDetails() {

2353

submitParentDetails() {

2350

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

2354

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

2351

this.parentData.fatherCellNo = this.parentData.fatherCellNo;

2355

this.parentData.fatherCellNo = this.parentData.fatherCellNo;

2352

this.parentData.motherCellNo = this.parentData.motherCellNo;

2356

this.parentData.motherCellNo = this.parentData.motherCellNo;

2353

let addparentDetails = {

2357

let addparentDetails = {

2354

email: this.parentData.email,

2358

email: this.parentData.email,

2355

fatherName: this.parentData.fatherName,

2359

fatherName: this.parentData.fatherName,

2356

fatherCellNo: this.parentData.fatherCellNo,

2360

fatherCellNo: this.parentData.fatherCellNo,

2357

motherName: this.parentData.motherName,

2361

motherName: this.parentData.motherName,

2358

motherCellNo: this.parentData.motherCellNo,

2362

motherCellNo: this.parentData.motherCellNo,

2359

fatherProfession: this.parentData.fatherProfession,

2363

fatherProfession: this.parentData.fatherProfession,

2360

motherProfession: this.parentData.motherProfession,

2364

motherProfession: this.parentData.motherProfession,

2361

password: this.parentData.password,

2365

password: this.parentData.password,

2362

role: "PARENT",

2366

role: "PARENT",

2363

};

2367

};

2364

this.loading = true;

2368

this.loading = true;

2365

http()

2369

http()

2366

.post("/createParent", addparentDetails)

2370

.post("/createParent", addparentDetails)

2367

.then((response) => {

2371

.then((response) => {

2368

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

2372

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

2369

this.e2 = 2;

2373

this.e2 = 2;

2370

this.snackbar = true;

2374

this.snackbar = true;

2371

this.text = response.data.message;

2375

this.text = response.data.message;

2372

this.color = "green";

2376

this.color = "green";

2373

// this.getStudentList();

2377

// this.getStudentList();

2374

this.clear();

2378

this.clear();

2375

this.loading = false;

2379

this.loading = false;

2376

})

2380

})

2377

.catch((error) => {

2381

.catch((error) => {

2378

this.snackbar = true;

2382

this.snackbar = true;

2379

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

2383

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

2380

this.color = "error";

2384

this.color = "error";

2381

if (error.response.data.statusText) {

2385

if (error.response.data.statusText) {

2382

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

2386

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

2383

}

2387

}

2384

this.loading = false;

2388

this.loading = false;

2385

});

2389

});

2386

}

2390

}

2387

},

2391

},

2388

getParentDetails() {

2392

getParentDetails() {

2389

if (this.parentData.fatherCellNo.length > 9) {

2393

if (this.parentData.fatherCellNo.length > 9) {

2390

this.showLoader = true;

2394

this.showLoader = true;

2391

this.isFatherCellExists = false;

2395

this.isFatherCellExists = false;

2392

http()

2396

http()

2393

.get("getParticularParent", {

2397

.get("getParticularParent", {

2394

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

2398

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

2395

headers: {

2399

headers: {

2396

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

2400

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

2397

},

2401

},

2398

})

2402

})

2399

.then((response) => {

2403

.then((response) => {

2400

this.showNext = true;

2404

this.showNext = true;

2401

this.showParent = false;

2405

this.showParent = false;

2402

this.parentData = response.data.data;

2406

this.parentData = response.data.data;

2403

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

2407

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

2404

this.showLoader = false;

2408

this.showLoader = false;

2405

this.isFatherCellExists = true;

2409

this.isFatherCellExists = true;

2406

})

2410

})

2407

.catch((error) => {

2411

.catch((error) => {

2408

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

2412

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

2409

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

2413

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

2410

this.snackbar = true;

2414

this.snackbar = true;

2411

if (this.text === "Data not found!") {

2415

if (this.text === "Data not found!") {

2412

this.showNext = false;

2416

this.showNext = false;

2413

this.showParent = true;

2417

this.showParent = true;

2414

this.parentData.email = "";

2418

this.parentData.email = "";

2415

this.parentData.fatherName = "";

2419

this.parentData.fatherName = "";

2416

this.parentData.motherName = "";

2420

this.parentData.motherName = "";

2417

this.parentData.motherCellNo = "";

2421

this.parentData.motherCellNo = "";

2418

this.parentData.fatherProfession = "";

2422

this.parentData.fatherProfession = "";

2419

this.parentData.motherProfession = "";

2423

this.parentData.motherProfession = "";

2420

this.parentData.password = "";

2424

this.parentData.password = "";

2421

}

2425

}

2422

this.showLoader = false;

2426

this.showLoader = false;

2423

});

2427

});

2424

}

2428

}

2425

},

2429

},

2426

suspendStudentStatus(status, id) {

2430

suspendStudentStatus(status, id) {

2427

let suspendStudentData = {

2431

let suspendStudentData = {

2428

studentId: id,

2432

studentId: id,

2429

status: status,

2433

status: status,

2430

};

2434

};

2431

http()

2435

http()

2432

.put("/suspendStudentAccount", suspendStudentData)

2436

.put("/suspendStudentAccount", suspendStudentData)

2433

.then((response) => {

2437

.then((response) => {

2434

this.findStudents();

2438

this.findStudents();

2435

this.text = response.data.message;

2439

this.text = response.data.message;

2436

this.color = "green";

2440

this.color = "green";

2437

this.snackbar = true;

2441

this.snackbar = true;

2438

})

2442

})

2439

.catch((error) => {

2443

.catch((error) => {

2440

this.snackbar = true;

2444

this.snackbar = true;

2441

this.color = "error";

2445

this.color = "error";

2442

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

2446

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

2443

});

2447

});

2444

},

2448

},

2445

displaySearch() {

2449

displaySearch() {

2446

(this.show = false), (this.showSearch = true);

2450

(this.show = false), (this.showSearch = true);

2447

},

2451

},

2448

closeSearch() {

2452

closeSearch() {

2449

this.showSearch = false;

2453

this.showSearch = false;

2450

this.show = true;

2454

this.show = true;

2451

this.search = "";

2455

this.search = "";

2452

},

2456

},

2453

},

2457

},

2454

mounted() {

2458

mounted() {

2455

const getCountryList = countryList();

2459

const getCountryList = countryList();

2456

this.role = this.$store.state.role;

2460

this.role = this.$store.state.role;

2457

this.countries = getCountryList;

2461

this.countries = getCountryList;

2458

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

2462

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

2459

http()

2463

http()

2460

.get("/getClassesList", {

2464

.get("/getClassesList", {

2461

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

2465

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

2462

})

2466

})

2463

.then((response) => {

2467

.then((response) => {

2464

this.addclass = response.data.data;

2468

this.addclass = response.data.data;

2465

})

2469

})

2466

.catch((error) => {

2470

.catch((error) => {

2467

this.showLoader = false;

2471

this.showLoader = false;

2468

if (error.response.status === 401) {

2472

if (error.response.status === 401) {

2469

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

2473

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

2470

this.$store.dispatch("setToken", null);

2474

this.$store.dispatch("setToken", null);

2471

this.$store.dispatch("Id", null);

2475

this.$store.dispatch("Id", null);

2472

this.$store.dispatch("Role", null);

2476

this.$store.dispatch("Role", null);

2473

}

2477

}

2474

});

2478

});

2475

},

2479

},

2476

};

2480

};

2477

</script>

2481

</script>

2478

2482

2479

.active {

2483

.active {

2480

background-color: gray;

2484

background-color: gray;

2481

color: white !important;

2485

color: white !important;

2482

}

2486

}

2483

.activebtn {

2487

.activebtn {

2484

color: black !important;

2488

color: black !important;

2485

}

2489

}

2486

</style>

2490

</style>

GITLAB

viithiisys / School-Management-dashboard

bug for form reset

 <template>
   <v-container fluid class="body-color">
     <!-- ****** EDITS  STUDENTS DETAILS ****** -->
     <v-dialog v-model="editStudentDialog" max-width="1700px" scrollable>
       <v-card flat class="card-style pa-2" dark>
         <v-layout>
           <v-flex xs12>
             <label class="title text-xs-center">Edit Student Details</label>
             <v-icon size="24" class="right" @click="editStudentDialog = false">cancel</v-icon>
           </v-flex>
         </v-layout>
         <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">
                   <v-avatar size="100px" v-if="!editedItem.profilePicUrl && !editImageUrl">
                     <img src="/static/icon/user.png" />
                   </v-avatar>
                   <img
                     :src="editedItem.profilePicUrl"
                     v-else-if="editedItem.profilePicUrl && !editImageUrl"
                     height="150"
                     style="border-radius:50%; width:150px"
                   />
                   <img
                     v-if="editImageUrl"
                     :src="editImageUrl"
                     style="border-radius:50%; width:150px;height:150px"
                   />
                   <input
                     type="file"
                     style="display: none"
                     ref="editDataImage"
                     accept="image/*"
                     @change="onEditFilePicked"
                   />
                 </v-flex>
               </v-layout>
               <v-layout wrap>
                 <v-flex xs12 sm4>
                   <v-layout>
                     <v-flex xs4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">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 hidden-xs-only hidden-sm-only">Select Section:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">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 hidden-xs-only hidden-sm-only">Full Name:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">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 wrap>
                 <v-flex xs12 sm4>
                   <v-layout>
                     <v-flex xs4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Email Id:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Email:</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 hidden-sm-only hidden-xs-only">Date of Birth:</label>
                       <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</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 wrap>
                 <v-flex xs12 sm4>
                   <v-layout>
                     <v-flex xs4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Blood Group:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Blood:</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">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">Medical Notes:</label>
                     </v-flex>
                     <v-flex xs8 class="ml-3">
                       <v-text-field
                         v-model="editedItem.medicalNotes"
                         placeholder="fill your medicalNotes"
                         required
                       ></v-text-field>
                     </v-flex>
                   </v-layout>
                 </v-flex>
               </v-layout>
               <v-layout wrap>
                 <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 hidden-xs-only hidden-sm-only">Uplaod Image:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
                     </v-flex>
                     <v-flex xs8 class="ml-3">
                       <v-text-field
                         label="Select Image"
                         @click="pickEditFile"
                         v-model="editImageName"
                         append-icon="attach_file"
                       ></v-text-field>
                     </v-flex>
                   </v-layout>
                 </v-flex>
               </v-layout>
               <v-layout wrap>
                 <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 hidden-xs-only hidden-sm-only">Mobile No:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</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 wrap>
                 <v-flex xs12 sm4>
                   <v-layout>
                     <v-flex xs4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Select Country:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">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 class="hidden-xs-only hidden-sm-only">
                   <v-layout>
                     <v-flex xs4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Roll No:</label>
                     </v-flex>
                     <v-flex xs8 class="ml-3">
                       <v-text-field
                         v-model="editedItem.rollNo"
                         placeholder="fill roll number"
                         required
                       ></v-text-field>
                     </v-flex>
                   </v-layout>
                 </v-flex>
                 <v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only">
                   <v-layout>
                     <v-flex xs4 sm4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Permanent Address:</label>
                       <label
                         class="right hidden-lg-only hidden-md-only hidden-xl-only"
                       >Permanent Address:</label>
                     </v-flex>
                     <v-flex xs12 sm8 class="ml-3">
                       <v-text-field
                         v-model="editedItem.permanentAddress"
                         placeholder="fill Your Permanent Address"
                         required
                       ></v-text-field>
                     </v-flex>
                   </v-layout>
                 </v-flex>
               </v-layout>
               <v-layout class="hidden-xs-only hidden-sm-only">
                 <v-flex xs12 sm4>
                   <v-layout>
                     <v-flex xs4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Present Address:</label>
                       <label
                         class="right hidden-lg-only hidden-md-only hidden-xl-only"
                       >Present Address:</label>
                     </v-flex>
                     <v-flex xs8 class="ml-3">
                       <v-text-field
                         v-model="editedItem.presentAddress"
                         placeholder="Select Country Name"
                         required
                       ></v-text-field>
                     </v-flex>
                   </v-layout>
                 </v-flex>
               </v-layout>
               <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
                 <v-flex xs12 sm12>
                   <v-layout>
                     <v-flex xs4 class="pt-4 subheading">
                       <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>
                       <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Roll No:</label>
                     </v-flex>
                     <v-flex xs8 class="ml-3">
                       <v-text-field
                         v-model="editedItem.rollNo"
                         placeholder="fill roll number"
                         required
                       ></v-text-field>
                     </v-flex>
                   </v-layout>
                 </v-flex>
               </v-layout>
               <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
                 <v-flex xs12 sm12>
                   <v-layout>
                     <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
                       <label class>Present Address :</label>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm12>
                       <v-textarea
                         v-model="editedItem.presentAddress"
                         placeholder="fill Your present Address"
                         required
                       ></v-textarea>
                     </v-flex>
                   </v-layout>
                 </v-flex>
                 <v-flex xs12 sm12>
                   <v-layout>
                     <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">
                       <label>Permanent addr:</label>
                     </v-flex>
                   </v-layout>
                   <v-layout>
                     <v-flex xs12 sm12>
                       <v-textarea
                         name="input-4-3"
                         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-layout class="right">
                     <v-btn @click="save" round dark :loading="editLoading" class="add-button">Save</v-btn>
                   </v-layout>
                 </v-flex>
               </v-layout>
             </v-container>
           </v-form>
         </v-card-text>
       </v-card>
     </v-dialog>
     <!-- ****** PROFILE VIEW STUDENTS DEATILS ******  -->
     <v-dialog v-model="profileStudentDialog" max-width="1000px" scrollable>
       <v-card flat class="card-style pa-3" dark>
         <v-layout>
           <v-flex xs12>
             <label class="title text-xs-center">View Student Details</label>
             <v-icon size="24" class="right" @click="profileStudentDialog = false">cancel</v-icon>
           </v-flex>
         </v-layout>
         <v-card-text>
           <v-flex align-center justify-center layout text-xs-center class="mt-3">
             <v-avatar size="100px">
               <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 xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <h5 class="right my-1">
                       <b>Full Name:</b>
                     </h5>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1 left">{{ editedItem.name }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <h5 class="right my-1">
                       <b>Email:</b>
                     </h5>
                   </v-flex>
                   <v-flex sm8 xs6>
                     <h5 class="my-1 left">{{ editedItem.email }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="right my-1">
                         <b>Gender:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1 left">{{ editedItem.gender }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="right my-1">
                         <b>D.O.B:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm8 xs6>
                     <h5 class="my-1">{{ dates(editedItem.dob) }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="right my-1">
                         <b>BloodGroup:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="right my-1">
                         <b>Roll No. :</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm8 xs6>
                     <h5 class="my-1">{{ editedItem.rollNo }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="right my-1">
                         <b>Height:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1 left">{{ editedItem.height }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="right my-1">
                         <b>Weight:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm8 xs6>
                     <h5 class="my-1">{{ editedItem.weight }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="right my-1">
                         <b>City:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1 left">{{ editedItem.city }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="right my-1">
                         <b>State:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm8 xs6>
                     <h5 class="my-1">{{ editedItem.state }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="right my-1">
                         <b>Pincode:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1">{{ editedItem.pincode }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="right my-1">
                         <b>Country:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm7 xs6>
                     <h5 class="my-1">{{ editedItem.country }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex sm6 xs6>
                     <b>
                       <h5 class="right my-1">
                         <b>Mobile No:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1">{{ editedItem.mobile }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="right my-1">
                         <b>FahterName:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm8 xs6>
                     <h5 class="my-1">{{ editedItem.fatherName }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="right my-1">
                         <b>MotherName:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1">{{ editedItem.motherName }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="right my-1">
                         <b>FatherCellNo:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="right my-1">
                         <b>MotherCellNo:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs6>
                     <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7>
                 <v-layout>
                   <v-flex xs6 sm4>
                     <b>
                       <h5 class="my-1 right">
                         <b>AcademicYear:</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 wrap>
               <v-flex xs12 sm5>
                 <v-layout>
                   <v-flex xs6 sm6>
                     <b>
                       <h5 class="my-1 right">
                         <b>MedicalNotes:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm5 xs6>
                     <h5 class="my-1">{{ editedItem.medicalNotes }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm7 class="hidden-xs-only">
                 <v-layout wrap>
                   <v-flex sm4>
                     <b>
                       <h5 class="my-1 right">
                         <b>present Address:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm8>
                     <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex sm6 class="hidden-xs-only">
                 <v-layout wrap>
                   <v-flex sm5>
                     <b>
                       <h5 class="my-1 right">
                         <b>Permanent Address:</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm7>
                     <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
             <v-layout wrap class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only">
               <v-flex xs12 sm5>
                 <v-layout wrap>
                   <v-flex xs12 sm6>
                     <b>
                       <h5 class="my-1">
                         <b>present Address:-</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm5 xs12>
                     <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
               <v-flex xs12 sm6>
                 <v-layout wrap>
                   <v-flex xs12 sm6>
                     <b>
                       <h5 class="my-1">
                         <b>Permanent Address:-</b>
                       </h5>
                     </b>
                   </v-flex>
                   <v-flex sm6 xs12>
                     <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
                   </v-flex>
                 </v-layout>
               </v-flex>
             </v-layout>
           </v-container>
         </v-card-text>
       </v-card>
     </v-dialog>
     <!-- ****** STUDENTS TABLE ****** -->
     <v-toolbar color="transparent" flat>
       <v-btn
         fab
         dark
         class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
         small
         @click="addStudentDialog = true"
       >
         <v-icon dark>add</v-icon>
       </v-btn>
       <v-btn
         v-if="role != 'TEACHER' "
         round
         class="open-dialog-button hidden-sm-only hidden-xs-only"
         dark
         @click="addStudentDialog = true"
       >
         <v-icon class="white--text pr-1" size="20">add</v-icon>Add Student
       </v-btn>
       <v-card-actions class="hidden-xs-only hidden-sm-only">
         <v-flex md13 lg12>
           <v-layout>
             <v-flex lg3 md4>
               <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)"
                 required
                 class="ml-2"
               ></v-select>
             </v-flex>
             <v-flex lg3 md4 class="ml-2">
               <v-layout>
                 <v-select
                   :items="addSection"
                   label="Select Section"
                   v-model="selectStudents.selectSection"
                   item-text="name"
                   item-value="_id"
                   name="Select Section"
                   :rules="sectionRules"
                   required
                 ></v-select>
               </v-layout>
             </v-flex>
           </v-layout>
         </v-flex>
       </v-card-actions>
       <v-spacer></v-spacer>
       <v-btn
         @click="findStudents()"
         round
         dark
         :loading="loading"
         class="open-dialog-button hidden-xs-only hidden-sm-only"
       >Find</v-btn>
       <v-card-title class="body-1" v-show="show">
         <v-btn icon large flat @click="displaySearch">
           <v-avatar size="27">
             <img src="/static/icon/search.png" alt="icon" />
           </v-avatar>
         </v-btn>
       </v-card-title>
       <v-flex xs8 sm7 lg2 md3 v-if="showSearch">
         <v-layout>
           <v-text-field
             autofocus
             v-model="search"
             label="Search"
             prepend-inner-icon="search"
             color="primary"
           ></v-text-field>
           <v-icon @click="closeSearch" color="error">close</v-icon>
         </v-layout>
       </v-flex>
     </v-toolbar>
     <v-card flat class="elevation-0 transparent">
       <v-flex class="hidden-xl-only hidden-lg-only hidden-md-only">
         <v-layout>
           <v-flex xs4>
             <label class="right mt-4">Select Class:</label>
           </v-flex>
           <v-flex xs8>
             <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-2"
             ></v-select>
           </v-flex>
         </v-layout>
         <v-layout>
           <v-flex xs4>
             <label class="right mt-4">Select Section:</label>
           </v-flex>
           <v-flex xs8>
             <v-select
               :items="addSection"
               label="Select Section"
               v-model="selectStudents.selectSection"
               item-text="name"
               item-value="_id"
               name="Select Section"
               :rules="sectionRules"
               class="px-2"
               required
             ></v-select>
           </v-flex>
         </v-layout>
         <v-layout>
           <v-flex xs5 class="mx-auto mb-2">
             <v-btn
               @click="findStudents()"
               block
               round
               dark
               :loading="loading"
               class="add-button"
             >Find</v-btn>
           </v-flex>
         </v-layout>
       </v-flex>
     </v-card>
     <v-data-table
       :headers="headers"
       :items="studentsData"
       :pagination.sync="pagination"
       :search="search"
     >
       <template slot="items" slot-scope="props">
         <tr class="tr">
           <td class="text-xs-center td td-row">{{ props.item.rollNo}}</td>
           <td class="text-xs-center td td-row">
             <v-avatar size="40">
               <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 class="text-xs-center td td-row">{{ props.item.name}}</td>
           <td class="text-xs-center td td-row">{{ props.item.gender }}</td>
           <td class="text-xs-center td td-row">{{ props.item.parentId.fatherName }}</td>
           <td class="text-xs-center td td-row">{{ props.item.parentId.motherName }}</td>
           <td class="text-xs-center td td-row">{{ props.item.establishmentYear }}</td>
           <!-- <td class="text-xs-center td td-row">{{ props.item.mobile}}</td> -->
           <td class="text-xs-center td td-row">
             <v-switch
               class="pl-3"
               :disabled="role === 'TEACHER'"
               v-model="props.item.status"
               @change="suspendStudentStatus(props.item.status,props.item._id)"
             ></v-switch>
           </td>
           <td class="text-xs-center td td-row">
             <span>
               <v-tooltip top>
                 <img
                   slot="activator"
                   style="cursor:pointer; width:25px; height:25px; "
                   class="mr-3"
                   @click="profile(props.item)"
                   src="/static/icon/view.png"
                 />
                 <span>View</span>
               </v-tooltip>
               <v-tooltip top v-if="role != 'TEACHER' ">
                 <img
                   slot="activator"
                   style="cursor:pointer; width:20px; height:18px; "
                   class="mr-3"
                   @click="editItem(props.item)"
                   src="/static/icon/edit.png"
                 />
                 <span>Edit</span>
               </v-tooltip>
               <v-tooltip top v-if="role != 'TEACHER' ">
                 <img
                   slot="activator"
                   style="cursor:pointer; width:20px; height:20px; "
                   class="mr-3"
                   @click="deleteItem(props.item)"
                   src="/static/icon/delete.png"
                 />
                 <span>Delete</span>
               </v-tooltip>
             </span>
           </td>
         </tr>
       </template>
       <v-alert
         slot="no-results"
         :value="true"
         color="error"
         icon="warning"
       >Your search for "{{ search }}" found no results.</v-alert>
     </v-data-table>
     <!-- DIALOG -- ADD STUDENTS DETAILS -->
     <v-dialog v-model="addStudentDialog" max-width="1280">
       <v-card flat class="card-style pa-2" dark>
         <v-layout>
           <v-flex xs12>
             <label class="title text-xs-center">Add Student</label>
             <v-icon
               size="24"
               class="right"
               @click="$refs.parentForm.reset();$refs.parentFormLgScr.reset();$refs.form.reset();e2 = 1;addStudentDialog = false"
             >cancel</v-icon>
           </v-flex>
         </v-layout>
         <v-container fluid>
           <v-layout align-center>
             <v-flex xs12>
               <v-stepper v-model="e2" flat class="card-style elevation-0" dark>
                 <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-flex xs12 sm12 class="hidden-md-only hidden-lg-only hidden-xl-only">
                         <v-form ref="parentForm" v-model="valid" lazy-validation>
                           <v-layout wrap>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Father Cell No:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     v-model.trim="parentData.fatherCellNo"
                                     placeholder="fill your father Cell Number"
                                     type="number"
                                     :rules="fatheCellNoRules"
                                     counter="10"
                                     v-on:keyup="getParentDetails()"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Parent Email Id:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     placeholder="fill Parent email"
                                     v-model="parentData.email"
                                     type="text"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-layout wrap>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Father Name:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     v-model="parentData.fatherName"
                                     placeholder="Fill your father Name"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Mother Name:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     v-model="parentData.motherName"
                                     placeholder="fill your Mother Name"
                                     type="text"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-layout wrap>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Mother Cell No:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     v-model="parentData.motherCellNo"
                                     placeholder="fill your  Mother Cell Number"
                                     type="number"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Father Profession:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     v-model="parentData.fatherProfession"
                                     placeholder="fill your father profession"
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-layout wrap>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Mother Profession:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     v-model="parentData.motherProfession"
                                     placeholder="fill your mother profession"
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                             <v-flex xs12 sm6>
                               <v-layout wrap>
                                 <v-flex xs12 class="pt-4 subheading">
                                   <label>Password:</label>
                                 </v-flex>
                                 <v-flex xs12>
                                   <v-text-field
                                     v-model="parentData.password"
                                     placeholder="Enter Your Password"
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-flex sm12 class="hidden-xs-only">
                             <v-card-actions>
                               <v-spacer></v-spacer>
                               <v-btn
                                 @click="submitParentDetails"
                                 round
                                 dark
                                 :loading="loading"
                                 v-show="showParent"
                                 class="add-button"
                               >Add</v-btn>
                               <v-btn
                                 v-show="showNext"
                                 @click="e2 = 2"
                                 round
                                 dark
                                 class="add-button"
                               >Next</v-btn>
                             </v-card-actions>
                           </v-flex>
                           <v-flex
                             xs6
                             class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"
                           >
                             <v-btn
                               @click="submitParentDetails"
                               round
                               dark
                               :loading="loading"
                               v-show="showParent"
                               class="add-button"
                             >Add</v-btn>
                             <v-btn
                               v-show="showNext"
                               @click="e2 = 2"
                               round
                               dark
                               class="add-button"
                             >Next</v-btn>
                           </v-flex>
                         </v-form>
                       </v-flex>
                       <v-flex xs12 sm12 class="hidden-xs-only hidden-sm-only">
                         <v-form ref="parentFormLgScr" v-model="valid" lazy-validation>
                           <v-layout wrap>
                             <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.trim="parentData.fatherCellNo"
                                     placeholder="fill your father Cell Number"
                                     type="number"
                                     :rules="fatheCellNoRules"
                                     counter="10"
                                     required
                                     v-on:keyup="getParentDetails()"
                                   ></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">Parent Email Id:</label>
                                 </v-flex>
                                 <v-flex xs8 class="ml-3">
                                   <v-text-field
                                     placeholder="fill Parent email"
                                     v-model="parentData.email"
                                     type="text"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-layout wrap>
                             <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"
                                     placeholder="Fill your father Name"
                                     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"
                                     type="text"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-layout wrap>
                             <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"
                                     type="number"
                                     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 Profession:</label>
                                 </v-flex>
                                 <v-flex xs8 class="ml-3">
                                   <v-text-field
                                     v-model="parentData.fatherProfession"
                                     placeholder="fill your father profession"
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-layout wrap>
                             <v-flex xs12 sm6>
                               <v-layout>
                                 <v-flex xs4 class="pt-4 subheading">
                                   <label class="right">Mother Profession:</label>
                                 </v-flex>
                                 <v-flex xs8 class="ml-3">
                                   <v-text-field
                                     v-model="parentData.motherProfession"
                                     placeholder="fill your mother profession"
                                   ></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">Password:</label>
                                 </v-flex>
                                 <v-flex xs8 class="ml-3">
                                   <v-text-field
                                     :append-icon="e1 ? 'visibility_off' : 'visibility'"
                                     :append-icon-cb="() => (e1 = !e1)"
                                     :type="e1 ? 'password' : 'text'"
                                     :rules="password"
                                     v-model="parentData.password"
                                     placeholder="Enter Your Password"
                                     :disabled="isFatherCellExists"
                                     required
                                   ></v-text-field>
                                 </v-flex>
                               </v-layout>
                             </v-flex>
                           </v-layout>
                           <v-flex sm12 class="hidden-xs-only">
                             <v-card-actions>
                               <v-spacer></v-spacer>
                               <v-btn
                                 @click="submitParentDetails"
                                 round
                                 dark
                                 :loading="loading"
                                 v-show="showParent"
                                 class="add-button"
                               >Add</v-btn>
                               <v-btn
                                 v-show="showNext"
                                 @click="e2 = 2"
                                 round
                                 dark
                                 class="add-button"
                               >Next</v-btn>
                             </v-card-actions>
                           </v-flex>
                           <v-flex
                             xs6
                             class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"
                           >
                             <v-btn
                               @click="submitParentDetails"
                               round
                               dark
                               :loading="loading"
                               v-show="showParent"
                               class="add-button"
                             >Add</v-btn>
                             <v-btn
                               v-show="showNext"
                               @click="e2 = 2"
                               round
                               dark
                               class="add-button"
                             >Next</v-btn>
                           </v-flex>
                         </v-form>
                       </v-flex>
                     </v-container>
                   </v-stepper-content>
                   <v-stepper-content step="2">
                     <v-flex xs12 sm12>
                       <v-form ref="form" v-model="valid" lazy-validation>
                         <v-layout>
                           <v-flex
                             xs12
                             class="text-xs-center text-sm-center text-md-center text-lg-center"
                           >
                             <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 wrap>
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex x4 sm4 class="pt-4 subheading">
                                 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >Class:</label>
                               </v-flex>
                               <v-flex xs8 sm8 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 hidden-xs-only hidden-sm-only">Select Section:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >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 wrap>
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 sm4 class="pt-4 subheading">
                                 <label class="right hidden-xs-only hidden-sm-only">Full Name:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >Name:</label>
                               </v-flex>
                               <v-flex xs8 sm8 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 sm4 class="pt-4 subheading">
                                 <label class="right">Email:</label>
                               </v-flex>
                               <v-flex xs8 sm8 class="ml-3">
                                 <v-text-field
                                   placeholder="fill your email"
                                   v-model="addStudents.email"
                                   type="text"
                                   name="email"
                                   required
                                 ></v-text-field>
                               </v-flex>
                             </v-layout>
                           </v-flex>
                         </v-layout>
                         <v-layout wrap>
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 sm4 class="pt-4 subheading">
                                 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
                                 <label
                                   class="right hidden-lg-only hidden-xl-only hidden-md-only"
                                 >D.O.B:</label>
                               </v-flex>
                               <v-flex xs8 sm8 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 wrap>
                           <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 wrap>
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 class="pt-4 subheading">
                                 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >Mobile:</label>
                               </v-flex>
                               <v-flex xs8 class="ml-3">
                                 <v-text-field
                                   v-model="addStudents.mobile"
                                   placeholder="fill your MobileNo"
                                   name="mobileNo"
                                   type="number"
                                 ></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 hidden-xs-only hidden-sm-only">Select Country:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >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 wrap>
                           <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 hidden-xs-only hidden-sm-only">Blood Group:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >Blood:</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 wrap>
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 class="pt-4 subheading">
                                 <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >Roll No:</label>
                               </v-flex>
                               <v-flex xs8 class="ml-3">
                                 <v-text-field
                                   v-model="addStudents.rollNo"
                                   placeholder="Fill your Roll Number"
                                   :rules="rollNo"
                                   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 hidden-xs-only hidden-sm-only">Medical Notes:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >Medical:</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 wrap>
                           <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 wrap>
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 class="pt-4 subheading">
                                 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >Uplaod :</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 hidden-xs-only hidden-sm-only">Academic Year:</label>
                                 <label
                                   class="right hidden-lg-only hidden-md-only hidden-xl-only"
                                 >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 wrap class="hidden-xs-only hidden-sm-only">
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 sm4 class="pt-4 subheading">
                                 <label class="right">Present Address:</label>
                               </v-flex>
                               <v-flex xs8 sm8 class="ml-3">
                                 <v-text-field
                                   v-model="addStudents.presentAddress"
                                   :rules="presentAddress"
                                   placeholder="fill Your present Address"
                                   @keyup="copyData"
                                 ></v-text-field>
                               </v-flex>
                             </v-layout>
                           </v-flex>
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 sm4 class="pt-4 subheading addressForm">
                                 <label class="right">Permanent Address:</label>
                               </v-flex>
                               <v-flex xs12 sm8 class="ml-3">
                                 <v-switch
                                   v-model="addStudents.permanentAddress"
                                   label="Select Permanent Address"
                                   :value="addStudents.presentAddress"
                                 ></v-switch>
                               </v-flex>
                             </v-layout>
                           </v-flex>
                         </v-layout>
                         <v-layout class="hidden-xs-only hidden-sm-only">
                           <v-flex xs12 sm6>
                             <v-layout>
                               <v-flex xs4 sm4 class="pt-4 subheading addressForm">
                                 <label class="right">Permanent Address:</label>
                               </v-flex>
                               <v-flex xs12 sm8 class="ml-3">
                                 <v-text-field
                                   v-model="addStudents.permanentAddress"
                                   :rules="permanentAddress"
                                   placeholder="fill Your Permanent Address"
                                 ></v-text-field>
                               </v-flex>
                             </v-layout>
                           </v-flex>
                         </v-layout>
                         <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
                           <v-flex xs12 sm12>
                             <v-layout>
                               <v-flex xs12 sm12 class="pt-4 subheading text-xs-center">
                                 <label class>Present Address:</label>
                               </v-flex>
                             </v-layout>
                             <v-layout>
                               <v-flex xs12 sm12>
                                 <v-textarea
                                   name="input-4-3"
                                   v-model="addStudents.presentAddress"
                                   :rules="presentAddress"
                                   placeholder="fill Your present Address"
                                   required
                                 ></v-textarea>
                               </v-flex>
                             </v-layout>
                           </v-flex>
                           <v-flex xs12 sm12>
                             <v-layout>
                               <v-flex
                                 xs12
                                 sm12
                                 class="pt-4 pr-4 subheading text-xs-center addressForm"
                               >
                                 <label>Permanent Address:</label>
                               </v-flex>
                             </v-layout>
                             <v-layout>
                               <v-flex xs12 sm12>
                                 <v-textarea
                                   name="input-4-3"
                                   v-model="addStudents.permanentAddress"
                                   :rules="permanentAddress"
                                   placeholder="fill Your Permanent Address"
                                   required
                                 ></v-textarea>
                               </v-flex>
                             </v-layout>
                           </v-flex>
                         </v-layout>
                         <v-layout>
                           <v-flex xs12 sm12>
                             <v-layout class="right">
                               <!-- <v-flex xs6> -->
                               <v-btn round dark @click="e2 = 1" class="clear-button">Back</v-btn>
                               <!-- </v-flex>
                               <v-flex xs6>-->
                               <v-btn
                                 @click="submit"
                                 round
                                 dark
                                 :loading="loading"
                                 class="add-button"
                               >Add</v-btn>
                               <!-- </v-flex> -->
                             </v-layout>
                           </v-flex>
                         </v-layout>
                       </v-form>
                     </v-flex>
                   </v-stepper-content>
                 </v-stepper-items>
               </v-stepper>
             </v-flex>
           </v-layout>
         </v-container>
       </v-card>
     </v-dialog>
     <v-snackbar
       :timeout="timeout"
       :top="y === 'top'"
       :right="x === 'right'"
       :vertical="mode === 'vertical'"
       v-model="snackbar"
       :color="color"
     >{{ text }}</v-snackbar>
     <div class="loader" v-if="showLoader">
       <v-progress-circular indeterminate color="white"></v-progress-circular>
     </div>
   </v-container>
 </template>
 <script>
 import http from "@/Services/http.js";
 import moment from "moment";
 import countryList from "@/script/country.js";
 import parent from "@/script/parents.js";
 export default {
   data: () => ({
     e1: true,
     e2: 0,
     showParent: true,
     showNext: false,
     snackbar: false,
     y: "top",
     x: "right",
     role: "",
     mode: "",
     append: "",
     timeout: 3000,
     text: "",
     show: true,
     color: "",
     showSearch: false,
     showLoader: false,
     loading: false,
     editLoading: false,
     date: null,
     search: "",
     password: "",
     menu: false,
     menu1: false,
     editStudentDialog: false,
     profileStudentDialog: false,
     addStudentDialog: false,
     valid: true,
     addclass: [],
     addSection: [],
     gender: ["Male", "Female"],
     pagination: {
       rowsPerPage: 10,
     },
     imageData: {},
     imageName: "",
     imageUrl: "",
     imageFile: "",
     editImageName: "",
     editImageUrl: "",
     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"],
     rollNo: [(v) => !!v || "Roll No is required"],
     permanentAddress: [(v) => !!v || " Permanent Address is required"],
     presentAddress: [(v) => !!v || " Present Address  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"],
     fatheCellNoRules: [
       (v) => !!v || " father Cell Number  is required",
       (v) => v <= 10000000000 || "Max 10 characters is required",
     ],
     password: [
       (v) => !!v || "Password field is Required.",
       // v => (/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/).test(v) && v.length >= 8
     ],
     mobileNoRule: [(v) => !!v || " Mobile Number is required"],
     establishmentYearRules: [(v) => !!v || " Academic Year  is required"],
     errorMessages: "",
     countries: [],
     headers: [
       {
         text: "Roll No.",
         align: "center",
         sortable: false,
         value: "rollNo",
       },
       {
         text: "Profile Pic",
         value: "profilePicUrl",
         sortable: false,
         align: "center",
       },
       { text: "Name", value: "name", 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: "Status",
         value: "status",
         sortable: false,
         align: "center",
       },
       { text: "Action", value: "", sortable: false, align: "center" },
     ],
     studentsData: [],
     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(),
     },
     isFatherCellExists: false,
   }),
   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.studentsData = response.data.data;
           this.showLoader = false;
         })
         .catch((err) => {
           console.log("err====>", err);
           this.showLoader = false;
         });
     },
     getSections(_id) {
       var token = this.$store.state.token;
       this.showLoader = true;
       http()
         .get(
           "/getSectionsList",
           { params: { classId: _id } },
           {
             headers: { Authorization: "Bearer " + token },
           }
         )
         .then((response) => {
           this.addSection = response.data.data;
           this.showLoader = false;
         })
         .catch((err) => {
           this.showLoader = false;
         });
     },
     getSection(_id) {
       var token = this.$store.state.token;
       this.showLoader = true;
       http()
         .get(
           "/getSectionsList",
           { params: { classId: _id } },
           {
             headers: { Authorization: "Bearer " + token },
           }
         )
         .then((response) => {
           this.addSection = response.data.data;
           this.showLoader = false;
         })
         .catch((err) => {
           this.showLoader = false;
         });
     },
     pickFile() {
       this.$refs.image.click();
     },
     pickEditFile() {
       this.$refs.editDataImage.click();
     },
     dates: function (date) {
       return moment(date).format("MMMM DD, YYYY");
       return date;
     },
     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 = "";
       }
     },
     onEditFilePicked(e) {
       console.log(e);
       const files = e.target.files;
       if (files[0] !== undefined) {
         this.editImageName = files[0].name;
         console.log("this.editImageName", this.editImageName);
         if (this.editImageName.lastIndexOf(".") <= 0) {
           return;
         }
         const fr = new FileReader();
         fr.readAsDataURL(files[0]);
         fr.addEventListener("load", () => {
           this.editImageUrl = fr.result;
           this.editiImageFile = files[0]; // this is an image file that can be sent to server...
         });
       } else {
         this.editImageName = "";
         this.editiImageFile = "";
       }
     },
     editItem(item) {
       this.editedIndex = this.studentsData.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.editedItem.dob =
         this.editedItem.dob != undefined
           ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))
           : (this.editedItem.dob = "");
       this.editStudentDialog = true;
     },
     profile(item) {
       this.editedIndex = this.studentsData.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.profileStudentDialog = true;
     },
     deleteItem(item) {
       let deleteStudent = {
         studentId: item._id,
       };
       http()
         .delete(
           "/deleteStudent",
           confirm("Are you sure you want to delete this?") && {
             params: deleteStudent,
           }
         )
         .then((response) => {
           this.snackbar = true;
           this.text = response.data.message;
           this.color = "green";
           this.findStudents();
         })
         .catch((error) => {
           this.snackbar = true;
           this.text = error.response.data.message;
           this.color = "error";
         });
     },
     close() {
       this.editStudentDialog = false;
     },
     closeStudentProfile() {
       this.profileStudentDialog = false;
     },
     copyData() {
       this.addStudents.permanentAddress = this.addStudents.presentAddress;
     },
     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,
           medicalNotes: this.addStudents.medicalNotes,
           height: this.addStudents.height,
           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) => {
             this.snackbar = true;
             this.text = "New Student added successfully";
             this.color = "green";
             this.addStudentDialog = false;
-            this.clear();
+            this.$refs.parentForm.reset();
-            this.clearParents();
+            this.$refs.parentFormLgScr.reset();
+            this.$refs.form.reset();
+            this.e2 = 1;
+            // this.clear();
+            // this.clearParents();
             this.loading = false;
           })
           .catch((error) => {
             this.snackbar = true;
             this.text = error.response.data.message;
             this.color = "error";
             this.loading = false;
           });
       }
     },
     clear() {
       this.$refs.form.reset();
       this.imageUrl = "";
     },
     clearParents() {
       this.$refs.parentForm.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,
         medicalNotes: this.editedItem.medicalNotes,
         height: this.editedItem.height,
         weight: this.editedItem.weight,
         rollNo: this.editedItem.rollNo,
       };
       if (this.editImageUrl) {
         var str = this.editImageUrl;
         const [baseUrl, editImageUrl] = str.split(/,/);
         editStudent.upload = editImageUrl;
       }
       this.editLoading = true;
       http()
         .put("/updateStudent", editStudent)
         .then((response) => {
           this.snackbar = true;
           this.text = response.data.message;
           this.color = "green";
           this.imageUrl = "";
           this.findStudents();
           this.close();
           this.editLoading = false;
         })
         .catch((error) => {
           this.snackbar = true;
           this.text = error.response.data.statusText;
           this.color = "error";
           this.editLoading = false;
         });
     },
     submitParentDetails() {
       if (this.$refs.parentForm.validate()) {
         this.parentData.fatherCellNo = this.parentData.fatherCellNo;
         this.parentData.motherCellNo = this.parentData.motherCellNo;
         let addparentDetails = {
           email: this.parentData.email,
           fatherName: this.parentData.fatherName,
           fatherCellNo: this.parentData.fatherCellNo,
           motherName: this.parentData.motherName,
           motherCellNo: this.parentData.motherCellNo,
           fatherProfession: this.parentData.fatherProfession,
           motherProfession: this.parentData.motherProfession,
           password: this.parentData.password,
           role: "PARENT",
         };
         this.loading = true;
         http()
           .post("/createParent", addparentDetails)
           .then((response) => {
             this.parentId = response.data.data.id;
             this.e2 = 2;
             this.snackbar = true;
             this.text = response.data.message;
             this.color = "green";
             // this.getStudentList();
             this.clear();
             this.loading = false;
           })
           .catch((error) => {
             this.snackbar = true;
             this.text = error.response.data.message;
             this.color = "error";
             if (error.response.data.statusText) {
               this.text = error.response.data.statusText;
             }
             this.loading = false;
           });
       }
     },
     getParentDetails() {
       if (this.parentData.fatherCellNo.length > 9) {
         this.showLoader = true;
         this.isFatherCellExists = false;
         http()
           .get("getParticularParent", {
             params: { fatherCellNo: this.parentData.fatherCellNo },
             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;
             this.showLoader = false;
             this.isFatherCellExists = true;
           })
           .catch((error) => {
             console.log("err====>", error.response.data.message);
             this.text = error.response.data.message;
             this.snackbar = true;
             if (this.text === "Data not found!") {
               this.showNext = false;
               this.showParent = true;
               this.parentData.email = "";
               this.parentData.fatherName = "";
               this.parentData.motherName = "";
               this.parentData.motherCellNo = "";
               this.parentData.fatherProfession = "";
               this.parentData.motherProfession = "";
               this.parentData.password = "";
             }
             this.showLoader = false;
           });
       }
     },
     suspendStudentStatus(status, id) {
       let suspendStudentData = {
         studentId: id,
         status: status,
       };
       http()
         .put("/suspendStudentAccount", suspendStudentData)
         .then((response) => {
           this.findStudents();
           this.text = response.data.message;
           this.color = "green";
           this.snackbar = true;
         })
         .catch((error) => {
           this.snackbar = true;
           this.color = "error";
           this.text = error.response.data.message;
         });
     },
     displaySearch() {
       (this.show = false), (this.showSearch = true);
     },
     closeSearch() {
       this.showSearch = false;
       this.show = true;
       this.search = "";
     },
   },
   mounted() {
     const getCountryList = countryList();
     this.role = this.$store.state.role;
     this.countries = getCountryList;
     var token = this.$store.state.token;
     http()
       .get("/getClassesList", {
         headers: { Authorization: "Bearer " + token },
       })
       .then((response) => {
         this.addclass = response.data.data;
       })
       .catch((error) => {
         this.showLoader = false;
         if (error.response.status === 401) {
           this.$router.replace({ path: "/" });
           this.$store.dispatch("setToken", null);
           this.$store.dispatch("Id", null);
           this.$store.dispatch("Role", null);
         }
       });
   },
 };
 </script>
 <style scoped>
 .active {
   background-color: gray;
   color: white !important;
 }
 .activebtn {
   color: black !important;
 }
 </style>