| 1 |
- {"remainingRequest":"C:\\Vue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Vue\\src\\views\\Todos.vue?vue&type=script&lang=js&","dependencies":[{"path":"C:\\Vue\\src\\views\\Todos.vue","mtime":1607763420742},{"path":"C:\\Vue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Vue\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"C:\\Vue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Vue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\nimport TodoList from \"@/components/TodoList\";\nimport AddTodo from \"@/components/AddTodo\";\nimport Loader from \"@/components/Loader\";\nexport default {\n name: \"app\",\n data() {\n return {\n todos: [],\n loading: true,\n filter: \"all\",\n };\n },\n mounted() {\n fetch(\"https://jsonplaceholder.typicode.com/todos?_limit=3\")\n .then((response) => response.json())\n .then((json) => {\n setTimeout(() => {\n this.todos = json;\n this.loading = false;\n }, 1000);\n });\n },\n // watch: {\n // filter(value) {\n // console.log(value)\n // }\n // },\n computed: {\n filteredTodos() {\n if (this.filter === \"all\") {\n return this.todos;\n }\n\n if (this.filter === \"completed\") {\n return this.todos.filter((t) => t.completed);\n }\n\n if (this.filter === \"not-completed\") {\n return this.todos.filter((t) => !t.completed);\n }\n\n if (this.filter === \"not-important\") {\n return this.todos.filter((t) => !t.important);\n }\n\n if (this.filter === \"important\") {\n return this.todos.filter((t) => t.important);\n }\n },\n },\n methods: {\n removeTodo(id) {\n this.todos = this.todos.filter((t) => t.id !== id);\n },\n addTodo(todo) {\n this.todos.push(todo);\n },\n },\n components: {\n TodoList,\n AddTodo,\n Loader,\n },\n};\n",{"version":3,"sources":["Todos.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"Todos.vue","sourceRoot":"src/views","sourcesContent":["<template>\n <div>\n <h2>Notes application</h2>\n <router-link to=\"/\">Home</router-link>\n <hr />\n <AddTodo @add-todo=\"addTodo\" />\n <select v-model=\"filter\">\n <option value=\"all\">All</option>\n <option value=\"completed\">Completed</option>\n <option value=\"not-completed\">Not Completed</option>\n <option value=\"important\">Important</option>\n <option value=\"not-important\">Not Important</option> \n </select>\n <label class=\"right\"><input type=\"radio\" class=\"radio\" v-on:change=\"todo.important = true\">Important</label>\n <template v-for=\"user in users\">\n <input type=\"radio\" v-bind:value=\"user\" v-model=\"selectedUser\">\n <label>{{user.name}}</label><br>\n </template>\n <span v-if=\"selectedUser!==null\">Выбрано: {{selectedUser.name}} - {{selectedUser.age}}</span>\n <hr />\n <Loader v-if=\"loading\" />\n <TodoList\n v-else-if=\"filteredTodos.length\"\n v-bind:todos=\"filteredTodos\"\n @remove-todo=\"removeTodo\"\n />\n <p v-else>No todos!</p>\n </div>\n</template>\n\n<script>\nimport TodoList from \"@/components/TodoList\";\nimport AddTodo from \"@/components/AddTodo\";\nimport Loader from \"@/components/Loader\";\nexport default {\n name: \"app\",\n data() {\n return {\n todos: [],\n loading: true,\n filter: \"all\",\n };\n },\n mounted() {\n fetch(\"https://jsonplaceholder.typicode.com/todos?_limit=3\")\n .then((response) => response.json())\n .then((json) => {\n setTimeout(() => {\n this.todos = json;\n this.loading = false;\n }, 1000);\n });\n },\n // watch: {\n // filter(value) {\n // console.log(value)\n // }\n // },\n computed: {\n filteredTodos() {\n if (this.filter === \"all\") {\n return this.todos;\n }\n\n if (this.filter === \"completed\") {\n return this.todos.filter((t) => t.completed);\n }\n\n if (this.filter === \"not-completed\") {\n return this.todos.filter((t) => !t.completed);\n }\n\n if (this.filter === \"not-important\") {\n return this.todos.filter((t) => !t.important);\n }\n\n if (this.filter === \"important\") {\n return this.todos.filter((t) => t.important);\n }\n },\n },\n methods: {\n removeTodo(id) {\n this.todos = this.todos.filter((t) => t.id !== id);\n },\n addTodo(todo) {\n this.todos.push(todo);\n },\n },\n components: {\n TodoList,\n AddTodo,\n Loader,\n },\n};\n</script>\n\n<style scoped>\nselect {\n margin-right:100px;\n}\n .right {\n margin-right: 20px;\n }\n</style>\n"]}]}
|