WEBVTT 00:01.290 --> 00:06.690 So let's get started improving our front end to make it more obvious which charges have been refunded 00:06.690 --> 00:07.510 and which have not. 00:08.220 --> 00:15.480 Now, obviously, we have not updated our handler to set the status ID of a particular order to refunded 00:15.480 --> 00:16.290 when we refund it. 00:16.290 --> 00:17.380 But we'll get to that eventually. 00:17.400 --> 00:20.570 Right now, let's just work on the front end and make things a little prettier. 00:21.090 --> 00:23.460 So we'll start with this old sales page. 00:23.460 --> 00:28.230 And what we'll do is add a column here with a little badge that says if something is just a normal charge 00:28.230 --> 00:29.600 or if something has been refunded. 00:30.000 --> 00:37.150 So let's go back to our idea and let's look at the old sales page, which is right here. 00:38.140 --> 00:44.910 OK, so the first thing I'll do is just add a column right up here in the table and I'll call this status 00:46.350 --> 00:49.230 and then I'll go down to the part where we actually populate the table. 00:49.830 --> 00:51.900 And all I'll do here is inside this. 00:52.350 --> 00:59.480 This for each loop is I'll just add a new cell and that's going to be equal to newRow dot insert cell, 00:59.490 --> 01:00.320 same as before. 01:01.470 --> 01:09.630 And then we'll just make a decision if I dot status ID, if that's not equal to one, then we'll put 01:09.630 --> 01:15.070 some code in there else, put some other item on there. 01:15.750 --> 01:20.820 So in the first case, if it's not equal to one, in our case it's probably equal to two because those 01:20.820 --> 01:22.400 are the only two are actually handling. 01:22.710 --> 01:26.070 So we'll set new cells in our TMO 01:29.370 --> 01:39.660 equal to and I'll use bootstraps badge class spane class equals badge, BGU, Dash Dange, which makes 01:39.660 --> 01:47.430 it red and I'll say refund it, then close my span and close my back tax and then I'll copy this whole 01:47.430 --> 01:50.340 thing and paste it in here 01:53.310 --> 01:59.110 and change this to big success and we'll make that charged. 02:00.120 --> 02:06.480 OK, so let's go to our database and find an order that we've just refunded and we'll update its status 02:06.480 --> 02:06.770 ID. 02:06.870 --> 02:11.700 So back to our database and we'll look at orders and I'll refresh this. 02:12.300 --> 02:20.220 So the most recent one would be the highest ID, so I'll change its status ID to two and that should 02:20.220 --> 02:22.980 be refunded and it is OK. 02:23.640 --> 02:31.500 So let's stop our application like start started make start and just see if that looks OK. 02:33.840 --> 02:39.930 Back to my Web browser and I'll just reload this page and we have nothing in there, I must have closed 02:39.930 --> 02:42.000 something that left it incorrect. 02:45.090 --> 02:54.130 HTML, that's a bit of a mistake, so we'll save that mixed up next year. 02:55.660 --> 03:02.030 I'm not sure what inhered HTML is, but we don't want and reload this and it looks better. 03:02.050 --> 03:05.140 So this one's been refunded and that one has been charged. 03:05.150 --> 03:07.400 So the next step is when we go in here. 03:08.230 --> 03:12.670 If this has already been refunded, I probably should put a little message up here saying it's been 03:12.670 --> 03:17.980 refunded and I probably should hide this refund order button and we'll take care of that in the next 03:17.980 --> 03:18.370 lecture.