标签：Vue return int res list id 联动 上传 public
一、一种写法
1、Domain=Model
2、Repository=Dal
3、Service=Bll
4、写成文件夹或直接做成方法可以清晰的分辨写作的代码模块
二、Dal层
//显示 查询
public List<DisPlayModel> GetShow(int? nid,string name)
{
var list = from a in db.UserModels
join b in db.TableModels on a.BNId equals b.NId
join c in db.TableModels on a.BPId equals c.PId
select new DisPlayModel
{
Id = a.Id,
Pictrue = a.Pictrue,
Number = a.Number,
Name = a.Name,
BNId = a.BNId,
BNName = b.TradeName,
Shop = a.Shop,
BPId = a.BPId,
BPName = c.TradeName,
SellingPrice = a.SellingPrice,
MarketPrice = a.MarketPrice,
Repertory = a.Repertory,
Weight = a.Weight,
IssueTime = a.IssueTime,
State = a.State,
NId = b.NId,
TradeName = b.TradeName,
PId = b.PId
};
if(nid!=null)
{
list = list.Where(p => p.NId == nid);
}
if(!string.IsNullOrEmpty(name))
{
list = list.Where(p => p.Name.Contains(name));
}
return list.ToList();
}
//添加
public int Adds(UserModel user)
{
db.UserModels.Add(user);
return db.SaveChanges();
}
//下拉框
public List<TableModel> GetXiaLa(int id)
{
return db.TableModels.Where(p => p.PId == id).ToList();
}
三、Bll层
//显示查询
public List<DisPlayModel> GetShow(int? nid, string name)
{
return userDal.GetShow(nid, name);
}
//添加
public int Adds(UserModel user)
{
return userDal.Adds(user);
}
//下拉框
public List<TableModel> GetXiaLa(int id)
{
return userDal.GetXiaLa(id);
}
四、控制器
//显示页面
public ActionResult Index()
{
return View();
}
//显示 查询
[HttpGet]
public ActionResult GetShow(int? nid, string name)
{
var list = userBll.GetShow(nid,name);
return Json(list,JsonRequestBehavior.AllowGet);
}
//添加页面
public ActionResult Add()
{
return View();
}
//添加功能
[HttpPost]
public ActionResult Adds(UserModel user)
{
return Json(userBll.Adds(user),JsonRequestBehavior.DenyGet);
}
//下拉框功能
[HttpGet]
public ActionResult GetXiaLa(int id)
{
return Json(userBll.GetXiaLa(id),JsonRequestBehavior.AllowGet);
}
//文件上传功能
[HttpPost]
public ActionResult UpLoad()
{
try
{
//一、获取前台传过来的文件
var file = Request.Files[0];
//将虚拟路径转成物理路径
var imgDir = Server.MapPath("/Images/");
//判断你要存储的文件夹是否存在，不存在创建
//需要引用System.IO
if (!Directory.Exists(imgDir))
{
//创建文件夹
Directory.CreateDirectory(imgDir);
}
//保存
file.SaveAs(imgDir + file.FileName);
return Json(new { code = 1, fileName = file.FileName, msg = "" },JsonRequestBehavior.DenyGet);
}
catch (Exception ex)
{
return Json(new { code = 0, fileName = "", msg = ex.Message }, JsonRequestBehavior.DenyGet);
}
}
五、页面显示
@*引用*@
<script src="~/Content/vue.js"></script>
<script src="~/Content/axios.js"></script>
<div id="app">
<table class="table table-bordered">
<tr>
<td>商品图:</td>
<td><input type="file" value="" v-on:change="UpLoad" /></td>
</tr>
<tr>
<td>商品编号:</td>
<td><input type="text" v-model="pageData.Number" value="" /></td>
</tr>
<tr>
<td>商品名称:</td>
<td><input type="text" v-model="pageData.Name" value="" /></td>
</tr>
<tr>
<td>商品分类:</td>
<td>
品牌:
<select v-model="pageData.BNId" v-on:change="getClassifys">
<option v-for="(item,index) in brands" :value="item.NId">{{item.TradeName}}</option>
</select>
所属分类:
<select v-model="pageData.BPId">
<option v-for="(item,index) in classifys" :value="item.NId">{{item.TradeName}}</option>
</select>
</td>
</tr>
<tr>
<td>商铺:</td>
<td><input type="text" v-model="pageData.Shop" value="" /></td>
</tr>
<tr>
<td>销售价:</td>
<td><input type="text" v-model="pageData.SellingPrice" value="" /></td>
</tr>
<tr>
<td>市场价:</td>
<td><input type="text" v-model="pageData.MarketPrice" value="" /></td>
</tr>
<tr>
<td>库存:</td>
<td><input type="text" v-model="pageData.Repertory" value="" /></td>
</tr>
<tr>
<td>重量:</td>
<td><input type="text" v-model="pageData.Weight" value="" /></td>
</tr>
<tr>
<td>发布时间:</td>
<td><input type="date" v-model="pageData.IssueTime" value="" /></td>
</tr>
<tr>
<td>上架状态:</td>
<td>
<input type="radio" name="name" v-model="pageData.State" value="1" />上架
<input type="radio" name="name" v-model="pageData.State" value="2" />下架
<input type="radio" name="name" v-model="pageData.State" value="3" />未上架
</td>
</tr>
<tr>
<td></td>
<td colspan="2"><input type="button" class="btn btn-success" v-on:click="PostAdd" value="新添" /></td>
</tr>
</table>
</div>
<script>
let app = new Vue({
el: "#app",
//类
data() {
return {
pageData: {
Pictrue: "",
Number: "",
Name: "",
BNId: "0",
BPId: "0",
Shop: "",
SellingPrice: "",
MarketPrice: "",
Repertory: "",
Weight: "",
IssueTime: "",
State: "",
},
brands: [],
classifys: [],
}
},
//方法
methods: {
//品牌
getBrand() {
axios.get('/User/GetXiaLa?id=0').then(res => {
this.brands = res.data;
this.brands.unshift({ "NId": "0", "TradeName": "请选择" });
});
},
//分类
getClassifys() {
if (this.pageData.BNId > 0) {
axios.get('/User/GetXiaLa?id=' + this.pageData.BNId).then(res => {
this.classifys = res.data;
this.classifys.unshift({ "NId": "0", "TradeName": "请选择" });
this.pageData.BPId = 0;
});
}
this.classifys = [];
},
//上传图片
UpLoad(event) {
//获取图片
let file = event.target.files[0];
//设置头部类型
//可不写 但不标准
let config = {
haders: {
'Context-Type': "multpart/form-data"
}
}
let fd = new FormData();
fd.append("file", file);
axios.post('/User/UpLoad', fd, config).then(res => {
if (res.data.code > 0) {
this.pageData.Pictrue = res.data.fileName;
alert("上传成功");
}
else {
alert(res.data.msg);
}
})
},
//添加
PostAdd() {
axios.post('/User/Adds', this.pageData).then(res => {
if (res.data > 0) {
alert("添加成功");
}
else {
alert("添加失败");
}
})
}
},
//文档就绪函数
created: function () {
this.getBrand();
}
})
</script>
待续......
标签：Vue,return,int,res,list,id,联动,上传,public 来源： https://www.cnblogs.com/sjt9/p/15163896.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。