explainQspj.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226
  1. <template>
  2. <a-card size="small" :bordered="false" class="explainQspj-warp">
  3. <div class="explainQspj-cont">
  4. <p class="explain-tit">趋势平均法</p>
  5. <p class="explain-txt margin-b-30">趋势平均法是从过去各期实际销售量中,观察其增减变动的基本趋势并使其平均化,从而排除了某一个别销售期可能存在偶然因素的影响的一种销售预测法。</p>
  6. <div class="sub-tit">
  7. <img src="@/assets/explain/icon_sales.png" width="16" class="tit-icon" />
  8. <p class="txt">预计月销量</p>
  9. </div>
  10. <div class="item-cont">
  11. <p class="item-exp">预计月销量= = A + n×T</p>
  12. <div class="item-main">
  13. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  14. <p class="item-txt">其中 A 表示五期平均值,n 表示距离预测时间的期数,T 表示趋势平均值</p>
  15. </div>
  16. <div class="item-main">
  17. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  18. <p class="item-txt">如果是新产品,没有历史销量,则不会进行预测,下载结果的excel中显示为-</p>
  19. </div>
  20. <div class="item-main">
  21. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  22. <p class="item-txt">如果产品上线时间不长,历史销售量记录小于12个月,则取有记录的销量平均值作为预计月销量</p>
  23. </div>
  24. </div>
  25. <div class="sub-tit">
  26. <img src="@/assets/explain/icon_inventory.png" width="16" class="tit-icon" />
  27. <p class="txt">安全库存</p>
  28. </div>
  29. <div class="item-cont">
  30. <p class="item-exp">安全库存=需求的标准偏差 × 安全系数 × 交付前置期开方</p>
  31. <div class="item-main">
  32. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  33. <p class="item-txt">标准偏差是一个统计值,用来衡量一组个体值的离散程度,由希腊字母西格玛(σ)表示。在具体计算时,先计算出每个个体值的方差,加总后再开方便得到标准偏差。</p>
  34. </div>
  35. <div class="item-main">
  36. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  37. <p class="item-txt">安全系数与服务水平相关,服务水平越高,对应的安全系数就越大</p>
  38. </div>
  39. <div class="item-main">
  40. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  41. <p class="item-txt">交付前置期是订货周期/30</p>
  42. </div>
  43. </div>
  44. <div class="sub-tit">
  45. <img src="@/assets/explain/icon_mete.png" width="16" class="tit-icon" />
  46. <p class="txt">预计需求量</p>
  47. </div>
  48. <div class="item-cont">
  49. <p class="item-exp">预计需求量=预计月销量 × 交付前置期 + 安全库存</p>
  50. <div class="item-main">
  51. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  52. <p class="item-txt">交付前置期是订货周期/30</p>
  53. </div>
  54. </div>
  55. <div class="sub-tit">
  56. <img src="@/assets/explain/icon_example.png" width="16" class="tit-icon" />
  57. <p class="txt">示例</p>
  58. </div>
  59. <div class="item-cont">
  60. <div class="item-main">
  61. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  62. <p class="item-txt">某产品的订货周期为45天,最近12个月的实际销量如下表</p>
  63. </div>
  64. <div class="item-table">
  65. <a-table :columns="columns" :data-source="dataSource" bordered :pagination="false"></a-table>
  66. </div>
  67. <div class="item-main">
  68. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  69. <p class="item-txt">计算预计月销量 = 54.4 + 3 × (-0.2) = 53.8 ≈ 54(四舍五入)</p>
  70. </div>
  71. <div class="item-table">
  72. <a-table :columns="columnsXl" :data-source="dataSourceXl" bordered :pagination="false"></a-table>
  73. </div>
  74. <div class="item-main">
  75. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  76. <p class="item-txt">计算安全库存 = 73的开方 × 90%的服务水平对应的安全系数 × 45/30的开方 = 8.54 × 1.28 × 1.22 = 13.34 ≈ 13(四舍五入)</p>
  77. </div>
  78. <div class="item-table">
  79. <a-table :columns="columnsKc" :data-source="dataSourceKc" bordered :pagination="false"></a-table>
  80. </div>
  81. <div class="item-main">
  82. <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
  83. <p class="item-txt">计算预计需求量 = 54 × (45/30) + 13 = 94</p>
  84. </div>
  85. </div>
  86. <div style="text-align:center;padding: 20px;">
  87. <a-button type="default" @click="closePage">关闭</a-button>
  88. </div>
  89. </div>
  90. </a-card>
  91. </template>
  92. <script>
  93. export default {
  94. data () {
  95. return {
  96. columns: [
  97. { title: '1月', dataIndex: 'january', align: 'center' },
  98. { title: '2月', dataIndex: 'february', align: 'center' },
  99. { title: '3月', dataIndex: 'march', align: 'center' },
  100. { title: '4月', dataIndex: 'april', align: 'center' },
  101. { title: '5月', dataIndex: 'may', align: 'center' },
  102. { title: '6月', dataIndex: 'june', align: 'center' },
  103. { title: '7月', dataIndex: 'july', align: 'center' },
  104. { title: '8月', dataIndex: 'august', align: 'center' },
  105. { title: '9月', dataIndex: 'september', align: 'center' },
  106. { title: '10月', dataIndex: 'october', align: 'center' },
  107. { title: '11月', dataIndex: 'november', align: 'center' },
  108. { title: '12月', dataIndex: 'december', align: 'center' }
  109. ],
  110. dataSource: [
  111. { january: 55, february: 53, march: 54, april: 56, may: 58, june: 57, july: 52, august: 52, september: 56, october: 52, november: 53, december: 59 }
  112. ],
  113. columnsXl: [
  114. { title: '月份', dataIndex: 'title', align: 'center' },
  115. { title: '1月', dataIndex: 'january', align: 'center' },
  116. { title: '2月', dataIndex: 'february', align: 'center' },
  117. { title: '3月', dataIndex: 'march', align: 'center' },
  118. { title: '4月', dataIndex: 'april', align: 'center' },
  119. { title: '5月', dataIndex: 'may', align: 'center' },
  120. { title: '6月', dataIndex: 'june', align: 'center' },
  121. { title: '7月', dataIndex: 'july', align: 'center' },
  122. { title: '8月', dataIndex: 'august', align: 'center' },
  123. { title: '9月', dataIndex: 'september', align: 'center' },
  124. { title: '10月', dataIndex: 'october', align: 'center' },
  125. { title: '11月', dataIndex: 'november', align: 'center' },
  126. { title: '12月', dataIndex: 'december', align: 'center' }
  127. ],
  128. dataSourceXl: [
  129. { title: '实际销量', january: 55, february: 53, march: 54, april: 56, may: 58, june: 57, july: 52, august: 52, september: 56, october: 52, november: 53, december: 59 },
  130. { title: '五期平均值', january: '-', february: '-', march: 55.2, april: 55.6, may: 55.4, june: 55.0, july: 55.0, august: 53.8, september: 53.0, october: 54.4, november: '-', december: '-' },
  131. { title: '变动趋势值', january: '-', february: '-', march: '-', april: 0.4, may: -0.2, june: -0.4, july: 0, august: -1.2, september: -0.8, october: 1.4, november: '-', december: '-' },
  132. { title: '三期趋势平均值', january: '-', february: '-', march: '-', april: '-', may: -0.067, june: -0.2, july: -0.533, august: -0.667, september: -0.2, october: '-', november: '-', december: '-' }
  133. ],
  134. columnsKc: [
  135. { title: '月份', dataIndex: 'title', align: 'center' },
  136. { title: '1月', dataIndex: 'january', align: 'center' },
  137. { title: '2月', dataIndex: 'february', align: 'center' },
  138. { title: '3月', dataIndex: 'march', align: 'center' },
  139. { title: '4月', dataIndex: 'april', align: 'center' },
  140. { title: '5月', dataIndex: 'may', align: 'center' },
  141. { title: '6月', dataIndex: 'june', align: 'center' },
  142. { title: '7月', dataIndex: 'july', align: 'center' },
  143. { title: '8月', dataIndex: 'august', align: 'center' },
  144. { title: '9月', dataIndex: 'september', align: 'center' },
  145. { title: '10月', dataIndex: 'october', align: 'center' },
  146. { title: '11月', dataIndex: 'november', align: 'center' },
  147. { title: '12月', dataIndex: 'december', align: 'center' },
  148. { title: '求和', dataIndex: 'sum', align: 'center' }
  149. ],
  150. dataSourceKc: [
  151. { title: '实际销量', january: 55, february: 53, march: 54, april: 56, may: 58, june: 57, july: 52, august: 52, september: 56, october: 52, november: 53, december: 59, sum: '--' },
  152. { title: '实际销量', january: 54, february: 54, march: 54, april: 54, may: 54, june: 54, july: 54, august: 54, september: 54, october: 54, november: 54, december: 54, sum: '--' },
  153. { title: '实际销量', january: 1, february: -1, march: 0, april: 2, may: 4, june: 3, july: -2, august: -2, september: 2, october: -2, november: -1, december: 5, sum: '--' },
  154. { title: '实际销量', january: 1, february: 1, march: 0, april: 4, may: 16, june: 9, july: 4, august: 4, september: 4, october: 4, november: 1, december: 25, sum: 73 }
  155. ]
  156. }
  157. },
  158. methods:{
  159. closePage(){
  160. this.$emit('close')
  161. }
  162. }
  163. }
  164. </script>
  165. <style lang="less">
  166. .explainQspj-warp{
  167. .explainQspj-cont{
  168. width: 960px;
  169. margin: 0 auto;
  170. p{
  171. margin: 0;
  172. }
  173. .explain-tit{
  174. font-size: 18px;
  175. font-weight: bold;
  176. text-align: center;
  177. margin: 20px 0 30px;
  178. }
  179. .explain-txt{
  180. font-size: 13px;
  181. color: rgba(0,0,0,0.85);
  182. }
  183. .margin-b-30{
  184. margin-bottom: 30px;
  185. }
  186. .sub-tit{
  187. margin-bottom: 10px;
  188. .tit-icon{
  189. vertical-align: text-bottom;
  190. margin-right: 5px;
  191. }
  192. .txt{
  193. font-size: 16px;
  194. color: rgba(0, 21, 41, 1);
  195. display: inline-block;
  196. margin: 0;
  197. }
  198. }
  199. .item-cont{
  200. font-size: 13px;
  201. padding-left: 23px;
  202. line-height: 26px;
  203. margin-bottom: 25px;
  204. .item-exp{
  205. color: rgba(231, 0, 18, 0.85);
  206. }
  207. .item-main{
  208. position: relative;
  209. .item-icon{
  210. position: absolute;
  211. left: 0;
  212. top: 7px;
  213. }
  214. .item-txt{
  215. padding-left: 20px;
  216. }
  217. }
  218. .item-table{
  219. margin: 15px 0;
  220. }
  221. }
  222. }
  223. }
  224. </style>