<?php
db_table::createView("imma", "IMMA");
Route::isJs(function () {
    ob_start();
?>
    <div style="background: rgba(255,255,255,0.7);flex:1;display: flex;">
        <div style="padding: 15px;width: 220px;display: flex;align-items: center;justify-content: flex-start;background: #fff;flex-direction: column;">
            <div ng-cloak>
                <w-form api="getimma" on-reset="" on-success="" on-end="" ng-model="ctrl.form">
                    <div class="row" style="width: 100%;margin: 0;padding: 0;">
                        <div class="col-xs-12" style="padding: 0;">
                            <div class="form-group avs">
                                <label style="display:block" class="control-label">Immatricule</label>
                                <input type="text" class="form-control avs" pattern="([0-9]{1,3} [Tt][Uu] [0-9]{1,4})|([Rr][Ss] [0-9]{1,6})" required name="imm" ng-model="ctrl.form.data.imm" placeholder="98 TU 700/RS 99991">
                            </div>
                        </div>
                        <div class="col-xs-12" style="padding: 0;">
                            <button class="btn btn-primary" type="submit">Valider</button>
                        </div>
                    </div>
                </w-form>
                <label ng-if="ctrl.form.res.vin" style="display:block;margin-top:10px" class="control-label">VIN :<h4><a style="cursor: pointer" ng-click="ijk(ctrl.form.res.vin)">{{ctrl.form.res.vin}}</a></h4></label>
                <label ng-if="ctrl.form.res.dmc" style="display:block;" class="control-label">DMC :<h4>{{ctrl.form.res.dmc}}</h4></label>
            </div>
        </div>
        <div style="padding: 15px;flex:1;display: flex;">
            <div ng-cloak style="display: flex;width: 100%;align-items: flex-start;flex:1;justify-content: flex-start;flex-direction: column;">
                <div ng-show="form.loading" style="display: flex;align-items: center;justify-content: center;flex:1;width: 100%;">
                    <b>Recherche en cours, veuillez patienter ...</b>
                </div>
                <div ng-hide="form.loading" style="width: 100%;">
                        <div>
                            <div ng-if="ctrl.form.res.fad[0].TYPE">
                                <table class="table table-striped table-bordered" style="background: #fff;">
                                    <tr>
                                        <th>TYPE</th>
                                        <th>MARQUE</th>
                                        <th>MODELE_NAME</th>
                                        <th>LIB_TYPE</th>
                                        <th>CAR_NAME</th>
                                        <th>Année</th>
                                        <th>CARROSSERIE</th>
                                        <th>CCM</th>
                                        <th>KW</th>
                                        <th>CH</th>
                                        <th>Carburant</th>
                                    </tr>
                                    <tr ng-repeat="item in ctrl.form.res.fad">
                                        <td><a style="cursor: pointer" ng-click="detailDialog.item.carName = item.CAR_NAME;detailDialog.item.carId=item.TYPE;detailDialog.show();">{{item.TYPE}}</a></td>
                                        <td>{{item.MARQUE}}</td>
                                        <td>{{item.MODELE_NAME}}</td>
                                        <td>{{item.LIB_TYPE}}</td>
                                        <td>{{item.CAR_NAME}}</td>
                                        <td>{{item.Annee}}</td>
                                        <td>{{item.CARROSSERIE}}</td>
                                        <td>{{item.CCM}}</td>
                                        <td>{{item.KW}}</td>
                                        <td>{{item.CH}}</td>
                                        <td>{{item.Carburant}}</td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                </div>
            </div>
        </div>
        <dialog ng-model="detailDialog" titre="Détail : {{detailDialog.item.carName}} " btn-fermer="true" width="fit-content">
            <listcar car-id="{{detailDialog.item.carId}}"></listcar>
        </dialog>
        <dialog ng-model="vinDialog" titre="VIN : {{vinDialog.id}} " btn-fermer="true" width="fit-content">
            <vinlist piece-id="{{vinDialog.id}}"></vinlist>
        </dialog>
    </div>
    <?php
    $code = ob_get_clean();
    ?>
    <script>
        app.directive('imma', [function() {
            return {
                restrict: 'EA',
                transclude: false,
                replace: false,
                template: <?= json_encode(preg_replace("/\t|\n|\r/i", "", $code)) ?>,
                scope: {},
                controller: function($scope,$sce) {
                    $scope.form = {};
                    $scope.ijk = (i) => {
                        var ll=document.getElementsByTagName('vinlist').length;
                        if(ll>0){
                            $scope.vinDialog.id = i;
                            $scope.vinDialog.show();
                            angular.element(document.getElementsByTagName('vinlist')[ll-1]).scope().$$childTail.wwc(i);
                        }
                    };
                },
                link: function(scope, iElement, iAttrs) {}
            };
        }]);
    </script>
<?php
});