当前位置: 首页 > article >正文

最近项目的笔记总结。

最近vue3的项目 后端.net-findUI组件页面一起写 所以遇到了很多问题 写个总结记录一下 方便后续查找以免忘掉。

1、千分位数据处理(包含四舍五入小数点保留4位)

if (num > 0) {
	num = Math.round(num * Math.pow(10, 4)) / Math.pow(10, 4); //四舍五入
	num = Number(num).toFixed(4); //补足位数
	let newNum = num.toString().split('.');
   let fomat = newNum[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
   fomat = fomat + '.' + newNum[1];
   return fomat;
}

如果有更好的处理方法也可以留言告诉我 欢迎!!!

2、A页面跳转B带参数后B页面接收并赋值给Tab页签组件

F.ready(function () {
	let url = window.location.search.split("&");
	if (url[1]) {//这里是为了判断是否有这个参数 因为有的页面是传2个或者3个这个需要看当前页面的需求来定
		if (url[1].split("=").indexOf("tabIndex") != -1) {//看带过来的参数是否包含tabIndex这个属性 也可以是其他的名字 你自己定
			 let indexNum = url[1].split("=");
			 let index = parseInt(indexNum[1]);
			 F.ui.hidIsexpiry.setValue(index); //取值后给Tab页签赋值。
             onSearch(null, 0, 0);//赋值之后查询数据。
		}
	}
})

3、A页面跳转到B页面需要带时间type来区分时间区间值

  var date = System.Web.HttpUtility.HtmlDecode(Context.Request.Query["date"]);
DateTime days = DateTime.Today;
DateTime endDays = DateTime.Today;
DateTime dt = DateTime.Now;
switch (date)
{ //如果需要获取带时分秒的 那么就用DateTime.Now.AddDays(-1)
  //本年
   case "0":
       days = new DateTime(dt.Year, 1, 1);
       endDays = DateTime.Today.AddDays(-1);
       break;
   //昨日
   case "2":
       days = DateTime.Today.AddDays(-1);
       endDays = DateTime.Today.AddSeconds(-1);
       break;
   //本月
   case "1":
       days = DateTime.Today.AddDays(-(DateTime.Today.Day - 1));
       endDays = DateTime.Today.AddDays(-1);
       break;
}

4.A页面跳转B带参数后B页面接收并赋值给下拉框绑定

//跳转后页面状态赋值
let url = window.location.search.split("&");
if (url[1].split("=").indexOf("status") != -1) {
    let code = url[1].split("=");
    F.ui.status.setValue(code[1]);
}

5.轮播图效果(包含自适应布局 大屏是一页3个 小屏是一页2个 项目需求是需要展示8个模块)

<a-carousel effect="fade">
	<div v-for="(item,index) in rowNum" :key="index">
		<a-row>
	        <a-col :span="12" v-for="(i,j) in 2" v-if="cardSpan==2&&(index+1)*2-(j+1)<filterName.length">
	            <div class="card" @@click="goHomePage(filterName[(index+1)*2-(j+1)])">
	                <div style="display:flex;">
	                    <img :src="'../res/images/0_'+filterName[(index+1)*2-(j+1)].dataType+'.png'" style="width:48px;height:48px;margin-right:10px;" />
	                    <div>
	                        <div>{{filterName[(index+1)*2-(j+1)].menuName}}</div>
	                        <div class="stockMoney" :title="filterName[(index+1)*2-(j+1)].totalMoney">{{filterName[(index+1)*2-(j+1)].totalMoney||0}}</div>
	                    </div>
	                </div>
	                <div style="margin-top:20px;">
	                    <div class="countNum">
	                        <span class="count">总品种数</span><span :title="filterName[(index+1)*2-(j+1)].productSum">{{filterName[(index+1)*2-(j+1)].productSum||0}}</span>
	                    </div>
	                    <div class="countNum">
	                        <span class="count">总数量</span><span :title="filterName[(index+1)*2-(j+1)].totalCount">{{filterName[(index+1)*2-(j+1)].totalCount||0}}</span>
	                    </div>
	                </div>
	            </div>
	        </a-col>
	        <a-col :span="8" v-for="(i,j) in 3" v-if="cardSpan==1&&(index+1)*3-(j+1)<filterName.length">
	            <div class="card" @@click="goHomePage(filterName[(index+1)*3-(j+1)])">
	                <div style="display:flex;">
	                    <img :src="'../res/images/0_'+filterName[(index+1)*3-(j+1)].dataType+'.png'" style="width:48px;height:48px;margin-right:10px;" />
	                    <div>
	                        <div>{{filterName[(index+1)*3-(j+1)].menuName}}</div>
	                        <div class="stockMoney" :title="filterName[(index+1)*2-(j+1)].totalMoney">{{filterName[(index+1)*3-(j+1)].totalMoney||0}}</div>
	                    </div>
	                </div>
	                <div style="margin-top:20px;">
	                    <div class="countNum"><span class="count">总品种数</span><span :title="filterName[(index+1)*2-(j+1)].productSum">{{formatNumber(filterName[(index+1)*2-(j+1)].productSum)||0}}</span></div>
	                    <div class="countNum"><span class="count">总数量</span><span :title="filterName[(index+1)*2-(j+1)].totalCount">{{formatNumber(filterName[(index+1)*2-(j+1)].totalCount)||0}}</span></div>
	                </div>
	            </div>
	        </a-col>
	    </a-row>
</div>
</a-carousel>

cardSpan 用来判断是大屏还是小屏,rowNum:0//低值耗材走马灯页数,(index+1)*2-(j+1)是用来获取当前页面的索引 不过因为我们的模块是固定8个 所以这个情况我没有测过如果只有3个模块下是否可以用 有时间我再测一下

let width = window.screen.availWidth;
if (width >= 1920) {
    this.rowNum = Math.ceil(lg / 3);
    console.log(this.rowNum, 'rowNum');
    this.cardSpan = 1;
} else {
    this.rowNum = Math.ceil(lg / 2);
    this.cardSpan = 2;
}

差不多就这些 明天开始继续写vue3的项目 后续有新笔记再更新。


http://www.kler.cn/news/351180.html

相关文章:

  • #每日一题#自动化 2024年10月
  • 【C++ 算法进阶】算法提升四
  • 软件设计模式------抽象工厂模式
  • Vulnhub打靶-Empire-LupinOne
  • 5.redis安装【Docker】
  • nosql课本习题
  • 私有变量、类函数、断言assert
  • vue播放flv和rtsp 格式视频
  • 找到你的乐趣,这六个网站不容错过!
  • 【算法题】62. 不同路径(LeetCode)
  • 安装vue发生异常:npm ERR! the command again as root/Administrator.
  • Docker 下安装 ElasticSearch 和 Kibana (单节点)
  • Python办公自动化案例:实现word表格转换成Excel表格
  • 【MySQL】入门篇—基本数据类型:使用WHERE子句进行数据过滤
  • conda新建环境中存在大量ros相关python包
  • SpinalHDL之设计错误(Design Errors)(二)
  • Sequelize 提示报错ERR_HTTP_HEADERS_SENT
  • 京存助力自动驾驶,打造智能出行未来
  • 使用git页面如何用旧项目创建一个新项目出来并且保留所有分支内容和提交历史
  • GC1277替代OCH477/灿瑞芯片在电脑散热风扇中的应用
  • 计算机网络—静态路由
  • set的基本用法 和 底层简单了解
  • 一个人走到一条岔路,不知道该往哪里走,前面有两个人,但是这两个人中其中一个人永远说真话,另一个人永远说假话
  • 【Linux进程信号】Linux信号机制深度解析:保存与处理技巧
  • Spring Boot图书管理:进销存系统的现代化解决方案
  • 基于Matlab使用蚁群算法寻找最优路径