Layuimini 资产管理系统源码
php+layuimini资产管理系统整站源码(带安装教程)
源码介绍：
这是一套基于layuimini开发的资产管理系统，保留了layuimini的绝大部分文件
安装教程：
1、新建站点，然后源码上传到站点根目录
2、新建数据库，然后导入根目录下的数据库文件 test.sql
3、修改数据库链接配置：/config.php
帐号：admin 密码：123456
注意事项：
PHP版本建议5.6，高版本可能EXCEL导入导出有问题
文件：590m.com/f/25127180-498367277-ced4e6（访问密码：551685）
以下内容无关：
-------------------------------------------分割线---------------------------------------------
PYTHON工业互联网应用实战18—前后端分离模式之JQUERY VS VUE
前面我们分三章来说明了使用django template与jquery的差别，通过jquery如何来实现前后端的分离，同时再9章节使用vue.js 我们浅尝辄止的介绍了JQuery到vue的切换，由于监控界面没有数据提交，无法很好的体现处我说的vue的优势，所以笔者增加本章节来进一步的对比两者异同点（没有对比就没有伤害），读者可以通过代码去体会vue的优势。vue作为精简版本的MVVM，完成双向绑定后我们编程的时候可以更专注于model本身，而不像JQuery还需要知道DOM元素的标签去读写值。两者都是前端脚本框架，实际项目中，有些时候我们会混合使用两者的。
1.1. 重构模板tasks.html
说干就干，我们通过重构tasks.html模板切换到vue模式下来理解和对比两者的差异吧，MVVM要点之一：MVVM 将数据双向绑定（data-binding）作为核心思想，View 和 Model 之间没有联系，它们通过 ViewModel 这个桥梁进行交互。
复制代码
{% csrf_token %}
<table id="id_task_table">
<tr>
<th>ID</th>
<th>任务号</th>
<th>源地址</th>
<th>目标地址</th>
<th>条码</th>
<th>状态</th>
<th>优先级</th>
<th>开始时间</th>
<th>结束时间</th>
<th>作业数量</th>
<th>操作</th>
</tr>
<tr v-for="task in taskList"> <!--①-->
<td>[[task.TaskId]]</td>
<td><a :href="task.TaskId + '/view/'">[[task.TaskNum]]</a></td>
<td>[[task.Source]]</td>
<td>[[task.Target]]</td>
<td>[[task.Barcode]]</td>
<td>[[task.State]]</td>
<td>[[task.Priority]]</td>
<td>[[task.BeginDate]]</td>
<td>[[task.EndDate]]</td>
<td>[[task.SystemDate]]</td>
<td>[[task.JobCount]]</td>
<td>[[task.JobCount]]</td>
<td><a :id="task.TaskId+'-decompose'" :href="task.TaskId+'/decompose/'">分解</a> <a :id="task.TaskId+'-start'" :href="task.TaskId+'/start/'">下达</a> <a :id="task.TaskId+'-change'" :href="task.TaskId+'/change/'">修改</a> <a :id="task.TaskId+'-delete'" href='#' @click="taskDel(task.TaskId)">删除</a></td>
</tr>
</table>
</div>
上代码如上菜，相对于一大堆原理图，阅读代码、比较代码如直接下筷！自行品味vue是否可口可乐！于笔者这个改变确实爽点很多！
1.1.1. 运行结果
代码改动不是很大的情况下，我们任务列表不知不觉中就迁移到MVVM模式下了，刚开始使用vue的时候没注意，后来vue是国人写的，那个眼睛瞪大了很久，只要写代码也能基本衣食无忧，我们还是能出牛人的嘛。哎，那帮踢球的不早就衣食无忧了！？
1.2. 重构模板taskChange.html
上面小节我们见识了Vue的model层变化后数据自动同步到view的方向，双向绑定的另一个面就是： View 的变化会自动同步到 Model，当用户操作 View，ViewModel 感知到变化，然后自动更新 Model层数据，我们提交数据到后台直接提交model层即可。下面我们来改造taskChange.html支持vue吧。
复制代码
任务详情
数据提交到后台同样也不在关注DOM上的元素和标签，直接操作model层即可，项目的实战中，为了简化交互赋值操作，我们常常采用获取的model修改属性值后直接提交回去的方式，这样就进一步简化了代码。
1.3. 简化提交代码
1.3.1. 前端代码
复制代码
saveData:function() {
//异步提交数据到后台
url_str = “/task/taskSave/” + this.pk + ‘/’
// ④ 不再判断处理直接通过model获取提交后台值
//data = {
// source: this.model.Source, target: this.model.Target, taskNum: this.model.TaskNum,
// barcode: this.model.Barcode, csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val()
//}
data = this.model
data.csrfmiddlewaretoken=$("[name='csrfmiddlewaretoken']").val()
$.ajax({
type: 'POST', url: url_str, data: data, success: function (result) {
window.location.replace("/task/");
}
});
},
复制代码
运行修改任务点击提交，调试窗口会提示后台服务器错误！
1.3.2. 后端代码
错误的原因主要是因为，model属性大小写的问题，我们进一步重构后台代码来支持这一提交模式的变更。
复制代码
def taskSave(request,pk):
if int(pk) > 0:
data={“Source”:request.POST[‘Source’],“Target”:request.POST[‘Target’]}
model = Task.objects.filter(pk=pk).update(**data)
else:
data={“Source”:request.POST[‘Source’],“Target”:request.POST[‘Target’],“Barcode”:request.POST[‘Barcode’],
“TaskNum”:request.POST[‘TaskNum’], “State”:1,“Priority”:1,}
model=Task.objects.create(**data)
data={'total':1,'success':True}
return JsonResponse(data)
复制代码
简单的调整后端获取参数大小写，前端技术栈切换到vue了，采用vue我们大大的简化了提交数据的操作，由于MVVM模式实现UI端的业务逻辑分层，model与view就聚焦专注相应的功能领域，大大的提高了开发和维护效率。高内聚、低耦合这个开发的底层逻辑应该是我们日常开发过程需要构建的核心的思维模型！
1.4. 小结
本章节vue vs jquery给我们总体的的印象也是好像改动不大嘛，咋个就切换技术栈了，当然没有完全说jquery就不用了，那个方便用那个，那个便于团队开发、协作和维护。代码写的简明又能搞定功能，应该是coder的追求之一吧。简单又好用，这点是vue成功的地方，也是该向vue的作者学习地方。