增加点赞功能

.idea/Personal-Collections-Website.iml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="PYTHON_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

.idea/inspectionProfiles/profiles_settings.xml

@@ -0,0 +1,6 @@
+<component name="InspectionProjectProfileManager">
+  <settings>
+    <option name="USE_PROJECT_PROFILE" value="false" />
+    <version value="1.0" />
+  </settings>
+</component>

.idea/misc.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager" version="2" project-jdk-name="Python 3.7" project-jdk-type="Python SDK" />
+</project>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/Personal-Collections-Website.iml" filepath="$PROJECT_DIR$/.idea/Personal-Collections-Website.iml" />
+    </modules>
+  </component>
+</project>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>

.idea/workspace.xml

@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ChangeListManager">
+    <list default="true" id="ccd18ece-a4ed-4116-ada0-c6de56a9afb1" name="默认的" comment="" />
+    <option name="SHOW_DIALOG" value="false" />
+    <option name="HIGHLIGHT_CONFLICTS" value="true" />
+    <option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
+    <option name="LAST_RESOLUTION" value="IGNORE" />
+  </component>
+  <component name="Git.Settings">
+    <option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
+  </component>
+  <component name="ProjectId" id="1mhKD9KpVlX4td3NNUwfqIK7RXy" />
+  <component name="ProjectLevelVcsManager" settingsEditedManually="true" />
+  <component name="ProjectViewState">
+    <option name="hideEmptyMiddlePackages" value="true" />
+    <option name="showLibraryContents" value="true" />
+  </component>
+  <component name="PropertiesComponent">
+    <property name="RunOnceActivity.OpenProjectViewOnStart" value="true" />
+    <property name="RunOnceActivity.ShowReadmeOnStart" value="true" />
+    <property name="last_opened_file_path" value="$PROJECT_DIR$/../../../dataManage/proj3/bookstore" />
+  </component>
+  <component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" />
+  <component name="TaskManager">
+    <task active="true" id="Default" summary="默认任务">
+      <changelist id="ccd18ece-a4ed-4116-ada0-c6de56a9afb1" name="默认的" comment="" />
+      <created>1609940270186</created>
+      <option name="number" value="Default" />
+      <option name="presentableId" value="Default" />
+      <updated>1609940270186</updated>
+    </task>
+    <servers />
+  </component>
+</project>

APP/static/js/wsy.js

@@ -13,14 +13,14 @@ function sendRequest(url_suffix, data, func) {
             func(data);
         },
         error: function (XMLHttpRequest, textStatus, errorThrown) {
-            alert(XMLHttpRequest.status);
-            alert(XMLHttpRequest.readyState);
-            alert(textStatus);
             console.log(this);
         }
     });
+    return;
 }
 
+
+
 function GetRequest() {
     var url = location.search; //获取url中"?"符后的字串
     var theRequest = new Object();
@@ -34,159 +34,49 @@ function GetRequest() {
     return theRequest;
 }
 
-function getBlock() {
-    var url = "block/select";
-    var data = new FormData();
-    data.append("collection_id",id);
-    sendRequest(url, data,
-        function (data) {
-            var list = $("#textList");
-            var blocks = data.blocks;
-            for (i in blocks) {
-                var content;
-                var block = blocks[i];
-                if (block.type == 'img') {
-                    content = document.createElement('img');
-                    content.src = block.content;
-                }
-                else if (block.type == 'text') {
-                    content = document.createElement('div');
-                    content.innerText = block.content;
-                }
-                else {
-                    content = document.createElement('div');
-                    content.innerText = block.content;
-                }
-                content.id = block.id;
-                var block = gengerate_block(content,"block");
-                list.append(block);
-            }
-        });
-}
-
-function submit(obj, content, type, order) {
-    var url = "http://127.0.0.1:5000/block/add";
-    var data = new FormData();
-    data.append("content", content);
-    data.append('type', type);
-    data.append('order', order);
-    var that = obj;
-    $.ajax({
-        type: "post",
-        url: url,
-        data: data,
-        dataType: "json",
-        processData: false,
-        contentType: false,
-        success: function (data) {
-            that.id = data.id;
-        },
-
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-            alert(XMLHttpRequest.status);
-            alert(XMLHttpRequest.readyState);
-            alert(textStatus);
-            console.log(this);
+function add(type) {
+    var content = page.content;
+    var name = page.name;
+    var tag = page.tag;
+    var order = page.textList.length;
+    if (type == 'block') {
+        if (content == null) {
+            return;
         }
-    });
-}
-
-function swap(obj, dir,type) {
-    var url;
-    if (type == "block") {
-        url = "block/swap";
-    }
-    else {
-        url = "collection/swap";
-    }
-    var pos = obj.parentNode.id;
-    if (dir == 'up' && pos > 0) {
-        pos--;
-
-    }
-    if (dir == 'down' && dir < $("#textList").childElementCount - 1) {
-        pos++;
-    }
-    var data = new FormData();
-    data.append("new_order", pos);
-    data.append("id", obj.id);
-    if (type == "block") {
-        sendRequest(url, data, getBlock);    
-    }
-    else{
-        sendRequest(url, data, getCollection);
-    }
-    
-}
-function delete_block(obj,type) {
-    var url;
-    var data = new FormData();
-    data.append("collection_id", id);
-    if (type == "block") {
-        data.append("block_id", obj.id);
-        url = "block/delete";
-    }
-    else {
-        url = "collection/delete";
+        submit(content, 'text');
+        page.content = null;
+        return;
     }
-    
-    sendRequest(url, data, function () { ;});
-    
-}
-function gengerate_block(content,type) {
-    var obj = document.createElement("div");
-    obj.className = "standard-input";
-    obj.id = document.getElementById('textList').childElementCount;
-    var up = document.createElement("div");
-    up.addEventListener("click", function () { swap(content, 'up',type); });
-    up.innerText = "swap up";
-    obj.appendChild(up);
-    obj.appendChild(content);
-    var down = document.createElement("div");
-    down.addEventListener("click", function () { swap(content, 'down',type) });
-    down.innerText = "swap down";
-    obj.appendChild(down);
-    var delete_item = document.createElement("div");
-    delete_item.addEventListener("click", function () { delete_block(content,type); });
-    delete_item.innerText = "delete";
-    obj.appendChild(delete_item);
-    return obj;
-}
-
-function add(type) {
-    var text = $("#myInput").val();
-    $("#myInput").val("");
-    if (text == "") {
+    if (name == null) {
         return;
     }
-    let div = document.createElement('div');
-    div.innerText = text;
-    var block = gengerate_block(div,type)
-    $('#textList').append(block);
     var data = new FormData();
-    data.append('type', 'text');
-    data.append('name', text);
-    data.append('order', block.id);
-    data.append('content', text);
-
-    var url;
+    data.append('name', name);
+    data.append('tag', tag);
+    sendRequest('collection/add', data, function () {
+        getContent('collection');
+    });
+    page.content = null;
+    page.name = null;
+    page.tag = null;
+}
 
-    if (type == 'block') {
-        data.append('collection_id');
-        url = "block/add";
-    }
-    else {
-        url = "collection/add";
-    }
 
-    sendRequest(url,data,function (data) {
-        div.id = data.id;
+function submit(content, type,order) {
+    var url = "block/add";
+    var data = new FormData();
+    data.append("content", content);
+    data.append('type', type);
+    data.append('order', order);
+    sendRequest(url,data,function () {
+        getContent('block');
     })
 }
 
 
-function getCollection() {
-    var url = "collection/select";
+function getContent(type) {
+    var url;
+    url = type+"/select";
     var data = new FormData();
     if ("undefined" != typeof phonenum) {
         data.append('phonenum',phonenum);    
@@ -196,22 +86,155 @@ function getCollection() {
     if(name != ""){
         data.append('name',name);
     }
-    $("#textList").children().remove();
     sendRequest(url, data, function (data) {
-        console.log(data);
-        var list = $("#textList");
-        var collections = data.collections;
-        for (i in collections) {
-            var content = document.createElement('div');
-            var collection = collections[i];
-            content.innerText = collection.name;
-            content.onclick = function () {
-                console.log("?");
-                window.location.href = "add.html?id=" + collection.id + "&name=" + collection.name;
-            };
-            content.className = "standard-box";
-            content.id = collection.id;
-            $('#textList').append(gengerate_block(content,"collection"));
+        if (type == 'collection') {
+            page.textList = data.collections;
+        }
+        else {
+            page.textList = data.blocks;
+        }
+        for (i in page.textList) {
+            page.textList[i]['order'] = i;
+            if (type == 'block' && page.textList[i]['type'] == 'picture') {
+                page.textList[i]['content'] = get_url(page.textList[i]['content']);
+            }
+
         }
+        checkLike();
     });
-}
+}
+
+async function checkLike() {
+    for (i in page.textList) {
+        (function (i) {
+            var dt = new FormData();
+            var obj = page.textList[i];
+            dt.append('collection_id', obj['id']);
+            sendRequest('collection/isLike', dt, function (data) {
+                obj['isLike'] = data.isLike;
+                Vue.set(page.textList, obj['order'], obj);
+            });
+        })(i);
+        
+    }
+}
+function get_url(f) {
+    let reader = new FileReader();
+    reader.readAsDataURL(f);
+    reader.onload = function(e) {
+        return e.target.result;
+    };
+}
+
+
+var page = new Vue({
+    el: "#textList",
+    data: {
+        textList: [],
+        id: null,
+        name: null,
+        tag: null,
+        content: null,
+    },
+    methods: {
+        swap: function (obj_id, dir,type) {
+            var url = type+'/swap';
+            
+            var obj = this.textList[obj_id];
+            var pos = obj_id;
+            var origin_pos = pos;
+            if (dir == 'up' && pos > 0) {
+                pos--;
+            }
+            if (dir == 'down' && pos < this.textList.length-1) {
+                pos++;
+            }
+            obj['order'] = pos;
+            var swap_obj = this.textList[pos];
+            swap_obj['order'] = origin_pos;
+            Vue.set(this.textList, origin_pos, swap_obj);
+            Vue.set(this.textList, pos, obj);
+
+            var data = new FormData();
+            data.append("new_order", pos);
+            data.append("id", obj.id);
+            if (type == "block") {
+                sendRequest(url, data, getBlock);    
+            }
+            else{
+                sendRequest(url, data, getCollection);
+            }
+            
+        },
+        delete_item: function(order,type) {
+            var url;
+            var data = new FormData();
+            data.append("collection_id", this.id);
+            console.log(order);
+            if (type == "block") {
+                data.append("block_id", this.textList[order]['id']);
+                url = "block/delete";
+            }
+            else {
+                url = "collection/delete";
+            }
+            this.textList.splice(this.textList[order], 1);
+            sendRequest(url, data, function () { ;});
+            
+        },
+        jump_to: function (url,block_name,collection_id) {
+            window.location.href = url+"?name="+block_name+"&id="+collection_id;
+        },
+        edit: function (order,type) {
+            var obj = this.textList[order]
+            var pos = obj['order'];
+            var url = type + '/update';
+            var data = new FormData();
+            if (type == 'collection') {
+                if (this.name != null) {
+                    obj['name'] = this.name;
+                    data.append('name', this.name);
+                }
+                if (this.tag != null) {
+                    obj['tag'] = this.tag;
+                    data.append('tag', this.tag);
+                }
+            }
+            else {
+                if (this.content != null) {
+                    obj['content'] = this.content;
+                    data.append('content', this.content);
+                }
+            }
+            
+            Vue.set(this.textList, pos, obj);
+            sendRequest(url, data, function () { ; });
+
+            this.name = null;
+            this.tag = null;
+            this.content = null;
+        },
+        add_item:function (type) {
+            add(type);
+        },
+        like: function (order) {
+            var obj = this.textList[order];
+            obj['like']++;
+            obj['isLike'] = true;
+            Vue.set(this.textList, order, obj);
+            var data = new FormData();
+            data.append('collection_id', obj['id']);
+            sendRequest('collection/like', data, function () { ; });
+        },
+        unlike: function (order) {
+            var obj = this.textList[order];
+            obj['like']--;
+            obj['isLike'] = false;
+            Vue.set(this.textList, order, obj);
+            var data = new FormData();
+            data.append('collection_id', obj['id']);
+            sendRequest('collection/unlike', data, function () { ; });
+        }
+    }
+}
+)

APP/templates/personal.html

@@ -502,6 +502,7 @@
                                 </div>
                                 <div class="widget-numbers" v-on:click="jump_to('add.html',item.name,id);"><span>{{item.name}}</span></div><br>
                                 <div class="widget-subheading"><i class="fa fa-tags"></i>&nbsp;&nbsp;<span>{{item.tag}}</span></div>
+                                <div>点赞数：{{item.like}}</div>
                             </div>
                         </div>
                         <div class="col-md-4">

APP/templates/square.html

@@ -387,7 +387,11 @@
                                 <div class="card mb-3 bg-arielle-smile widget-chart text-white card-border">
                                     <div class="widget-numbers" v-on:click="jump_to('add.html',item.name,id);"><span>{{item.name}}</span></div><br>
                                     <div class="widget-subheading"><i class="fa fa-tags"></i>&nbsp;&nbsp;<span>{{item.tag}}</span></div>
+                                    <div>点赞数：{{item.like}}</div>
+                                <button v-if="item.isLike!=true" v-on:click="like(item.order)">点赞</button>
+                                <button v-if="item.isLike==true" v-on:click="unlike(item.order)">取消点赞</button>
                                 </div>
+                                
                             </div>
                         </div>
                     </div>