Node js+ sequelize (tedious MSSQL)+angularjs Прошу помощи разобраться к кнопкой
Запрос в БД происходит корректно. Поля на странице для добавлении данных в Бд работают корректно и данные пишутся в БД. Кнопка отобразить все данные работает и на страницу по запросу все данные выводятся. Но у меня задача в том, чтобы не все данные вывести а только данные по фильтру.
server.js
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var urlencodedParser = bodyParser.urlencoded({ extended:false});
app.use(bodyParser.json());
app.use(express.static('resources'));
global.__basedir = __dirname;
const db = require('./app/config/db.config.js');
// force: true очистит таблицу - если она существует
db.sequelize.sync({}).then(() => {
console.log('Подключение к MSSQL успешно ...');
});
require('./app/routes/user.route.js')(app);
// Создание сервера
var server = app.listen(3000, function () {
var host = server.address().address
var port = server.address().port
console.log("Сервер доступен по адресу: http://localhost:3000")
});
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Отчёт входящие звонки</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/main.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script src="/static/js/controller.js"></script>
</head>
<body>
<h3>Отчёт входящие звонки</h3>
<div class="container" ng-app="app">
<div ng-controller="postController">
<form name="userForm" ng-submit="submitUserForm()">
<label for="userForm">Форма заполнения данных:</label>
<div class="block"></div>
<input ng-model="data" type="date" class="form-control" id="date" value=""/>
<input ng-model="nomer" type="text" class="form-control" id="nomer" placeholder="Номер" required/>
<input ng-model="operator" type="text" class="form-control" id="operator" placeholder="Оператор" required/>
<input ng-model="name" type="text" class="form-control" id="name" placeholder="Имя" required/>
<input ng-model="povod" type="text" class="form-control" id="povod" placeholder="Повод" required/>
<input ng-model="istochnik" type="text" class="form-control" id="Istochnik" placeholder="Источник" required/>
<input ng-model="zapis" type="text" class="form-control" id="Zapis" placeholder="Запись" required/>
<input ng-model="status" type="text" class="form-control" id="Status" placeholder="Статус" required/>
<input ng-model="fio" type="text" class="form-control" id="fio" placeholder="ФИО" required/>
<button type="submit" class="btn btn-default">Сохранить</button>
</div>
</form>
<!--<div>{{postMsg}}{{postErrMsg}}</div>-->
<div class="new"></div>
<div ng-controller="getController">
<form name="userForm" ng-submit="submitUserForm()">
<label for="userForm">Фильтр:</label>
<div class="block"></div>
<button ng-click="getAllUsers()" type="button" class="btn btn-default">Найти все записи</button>
</form>
<form name="userForm" ng-submit="submitUserForm()">
<input type="text" name="daterange" class="form-control" value="01/01/2020 - 01/01/2020" id="data"/>
<select ng-model="zapis" class="form-control" id="zapis" name="zapis">
<option value="">Все типы обращений</option>
<option value="0">Первичные</option>
<option value="1">Вторичные</option>
</select>
<button ng-click="getAllUsers()" type="button" class="btn btn-default">Найти </button>
</form>
<table border="1" class='report'>
<tbody>
<thead>
<tr>
<th>id</th>
<th>Дата</th>
<th>Номер</th>
<th>Имя</th>
<th>Повод</th>
<th>Источник</th>
<th>Запись</th>
<th>Статус</th>
<th>ФИО</th>
</thead>
<tr ng-repeat="usr in users">
<td>{{usr.id}}</td>
<td>{{usr.data}}</td>
<td>{{usr.nomer}}</td>
<td>{{usr.name}}</td>
<td>{{usr.povod}}</td>
<td>{{usr.istochnik}}</td>
<td>{{usr.zapis}}</td>
<td>{{usr.status}}</td>
<td>{{usr.fio}}</td>
</tbody>
<tfoot>
</tfoot></table>
<div>Кол-во звонков: {{ numCalls }}</div>
<div>{{getErrMsg}}</div>
</div>
</div>
user.route.JS
module.exports = function(app) {
var express = require("express");
var router = express.Router();
const users = require('../controllers/user.controller.js');
var path = __basedir + '/views/';
router.use(function (req,res,next) {
console.log("/" + req.method);
next();
});
app.get('/', (req,res) => {
res.sendFile(path + "index.html");
});
// Сохранить данные в MySQL
app.post('/api/users/save', users.save);
//Найти все данные
app.get('/api/users/all', users.findAll);
app.use("/",router);
app.use("*", (req,res) => {
res.sendFile(path + "404.html");
});
}
user.controller.js
const db = require('../config/db.config.js');
const User = db.user;
// Сохранение или создание данных формы в MySQL
exports.save = (req, res) => {
console.log('Сохранение данных: ' + JSON.stringify(req.body));
User.create({
data: req.body.data,
nomer: req.body.nomer,
operator: req.body.operator,
name: req.body.name,
povod: req.body.povod,
istochnik: req.body.istochnik,
zapis: req.body.zapis,
status: req.body.status,
fio: req.body.fio,
},{
attributes: {include: ['data', 'nomer', 'operator', 'name', 'povod', 'istochnik', 'zapis', 'status', 'fio']}
}).then(user => {
res.send(user);
})
};
// Получить все данные
exports.findAll = (req, res) => {
console.log("Получить все данные");
User.findAll({
attributes: ['id', 'data', 'nomer', 'operator', 'name', 'povod', 'istochnik', 'zapis', 'status', 'fio']
}).then(users => {
res.send(users);
});
};
controller.js
var app = angular.module('app', []);
//app.controller('postcontroller', function($scope, $http, $location) {
app.controller('postController', ($scope, $http, $location) => {
$scope.submitUserForm = function(){
var url = "/api/users/save";
var config = {
headers : {
'Accept': 'text/plain'
}
}
var data = {
data: $scope.data,
nomer: $scope.nomer,
operator: $scope.operator,
name: $scope.name,
povod: $scope.povod,
istochnik: $scope.istochnik,
zapis: $scope.zapis,
status: $scope.status,
fio: $scope.fio
};
//$http.post(url, data, config).then(function (response) {
$http.post(url, data, config).then((response) => {
var user = response.data;
$scope.postMsg = "Запись данных: " + user.data + " " + user.nomer + " " + user.operator + " " + user.name + " " + user.povod + " " + user.istochnik + " " + user.zapis + " " + user.status + " " + user.fio;
}, (response) => {
$scope.postErrMsg = "Ошибка: " + response.statusText;
});
// reset data fields
$scope.data = "";
$scope.nomer = "";
$scope.operator= "";
$scope.name= "";
$scope.povod= "";
$scope.istochnik= "";
$scope.zapis= "";
$scope.status= "";
$scope.fio= "";
}
});
app.controller('getController', ($scope, $http, $location) =>{
$scope.getAllUsers = function(){
var url = "/api/users/all";
$http.get(url).then((response) => {
$scope.users = response.data;
}, (response) => {
$scope.getErrMsg = "Ошибка: " + response.statusText;
});
}
});