MonthGoalMerge.vue 36 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906
  1. <template>
  2. <div class="app-container">
  3. <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
  4. <el-form-item label="编码" prop="code">
  5. <el-input v-model="queryParams.code" placeholder="请输入编码" clearable @keyup.enter.native="handleQuery"/>
  6. </el-form-item>
  7. <el-form-item label="目标名称" prop="goalName">
  8. <el-input v-model="queryParams.goalName" placeholder="请输入目标名称" clearable @keyup.enter.native="handleQuery"/>
  9. </el-form-item>
  10. <el-form-item label="单据日期" prop="documentDate">
  11. <el-date-picker
  12. v-model="queryParams.documentDateRange"
  13. type="daterange"
  14. align="right"
  15. unlink-panels
  16. range-separator="至"
  17. start-placeholder="开始日期"
  18. end-placeholder="结束日期"
  19. value-format="yyyy-MM-dd"
  20. @keyup.enter.native="handleQuery"
  21. :picker-options="pickerOptions">
  22. </el-date-picker>
  23. </el-form-item>
  24. <el-form-item label="年度" prop="annual">
  25. <el-date-picker
  26. v-model="queryParams.annual"
  27. type="year"
  28. clearable
  29. value-format="yyyy"
  30. @keyup.enter.native="handleQuery"
  31. placeholder="请输入年度">
  32. </el-date-picker>
  33. </el-form-item>
  34. <el-form-item label="月份" prop="monthly">
  35. <el-date-picker
  36. v-model="queryParams.monthly"
  37. type="month"
  38. clearable
  39. value-format="M"
  40. @keyup.enter.native="handleQuery"
  41. placeholder="请输入月份">
  42. </el-date-picker>
  43. </el-form-item>
  44. <el-form-item label="制单人" prop="creator">
  45. <el-popover-select-v2 v-model="queryParams.creator" title="制单人" valueKey="name"
  46. referName="CONTACTS_PARAM"
  47. :dataMapping="{ creatorCode: 'code', creator: 'name'}"
  48. :source.sync="queryParams" placeholder="请输入制单人">
  49. </el-popover-select-v2>
  50. </el-form-item>
  51. <el-form-item label="部门" prop="dept">
  52. <el-popover-select-v2 v-model="queryParams.dept" title="部门" valueKey="name"
  53. referName="DEPT_PARAM"
  54. :dataMapping="{ deptCode: 'code', dept: 'name'}"
  55. :source.sync="queryParams" placeholder="请输入部门">
  56. </el-popover-select-v2>
  57. </el-form-item>
  58. <el-form-item label="目标类型" prop="goalCategory">
  59. <el-select v-model="queryParams.goalCategory" placeholder="请输入目标类型" @change="changeGoalCategory" @keyup.enter.native="handleQuery">
  60. <el-option
  61. v-for="item in goalCategoryList"
  62. :key="item.value"
  63. :label="item.label"
  64. :value="item.value">
  65. </el-option>
  66. </el-select>
  67. </el-form-item>
  68. <el-form-item v-if="queryParams.goalCategory === '客户维度'" label="客户" prop="custom">
  69. <el-popover-select-v2 v-model="queryParams.custom" title="客户" valueKey="name"
  70. referName="CUSTOMER_PARAM"
  71. :dataMapping="{ customCode: 'code', custom: 'name'}"
  72. :source.sync="queryParams" placeholder="请输入客户">
  73. </el-popover-select-v2>
  74. </el-form-item>
  75. <el-form-item v-if="queryParams.goalCategory === '销售区域'" label="销售区域" prop="saleZone">
  76. <el-popover-select-v2 v-model="queryParams.saleZoneCode" title="销售区域" valueKey="name"
  77. referName="DEPT_PARAM"
  78. :dataMapping="{ saleZoneCode: 'code', saleZone: 'name'}"
  79. :source.sync="queryParams" placeholder="请输入销售区域">
  80. </el-popover-select-v2>
  81. </el-form-item>
  82. <el-form-item v-if="queryParams.goalCategory === '一级分类'" label="一级分类" prop="oneLevelClassify">
  83. <el-select v-model="queryParams.oneLevelClassify" size="mini" clearable
  84. @focus="chooseTreeReferForQuery('MATERIALCLASSIFY_PARAM', false, '一级物料分类')"
  85. style="width: 200px">
  86. <el-option v-for="item in classOptions" :key="item.id" :label="item.name" :value="item.id" />
  87. </el-select>
  88. </el-form-item>
  89. <el-form-item v-if="queryParams.goalCategory === '二级分类'" label="二级分类" prop="custom">
  90. <el-select v-model="queryParams.twoLevelClassify" size="mini" clearable
  91. @focus="chooseTreeReferForQuery('MATERIALCLASSIFY_PARAM', false, '二级物料分类')"
  92. style="width: 200px">
  93. <el-option v-for="item in classOptions" :key="item.id" :label="item.name" :value="item.id" />
  94. </el-select>
  95. </el-form-item>
  96. <el-form-item>
  97. <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
  98. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
  99. </el-form-item>
  100. </el-form>
  101. <el-row :gutter="10" class="mb8">
  102. <el-col :span="1.5">
  103. <el-button
  104. type="primary"
  105. plain
  106. icon="el-icon-plus"
  107. size="mini"
  108. @click="handleAdd"
  109. v-hasPermi="['goal_management:monthGoalMerge:add']"
  110. >新增
  111. </el-button>
  112. </el-col>
  113. <el-col :span="1.5">
  114. <el-button
  115. type="danger"
  116. plain
  117. icon="el-icon-delete"
  118. size="mini"
  119. :disabled="multiple"
  120. @click="handleDelete"
  121. v-hasPermi="['goal_management:monthGoalMerge:remove']"
  122. >删除
  123. </el-button>
  124. </el-col>
  125. <el-col :span="1.5">
  126. <el-button
  127. type="warning"
  128. plain
  129. icon="el-icon-download"
  130. size="mini"
  131. @click="handleExport"
  132. v-hasPermi="['goal_management:monthGoalMerge:export']"
  133. >导出
  134. </el-button>
  135. </el-col>
  136. <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
  137. </el-row>
  138. <el-table v-loading="loading" :data="monthGoalMergeList" @selection-change="handleSelectionChange">
  139. <el-table-column type="selection" width="55" align="center"/>
  140. <el-table-column label="id唯一标识" align="center" prop="id"/>
  141. <el-table-column label="编码" align="center" prop="code"/>
  142. <el-table-column label="目标名称" align="center" prop="goalName"/>
  143. <el-table-column label="单据日期" align="center" prop="documentDate" width="180">
  144. <template slot-scope="scope">
  145. <span>{{ parseTime(scope.row.documentDate, '{y}-{m}-{d}') }}</span>
  146. </template>
  147. </el-table-column>
  148. <el-table-column label="年度" align="center" prop="annual"/>
  149. <el-table-column label="月份" align="center" prop="monthly"/>
  150. <el-table-column label="客户编码" align="center" prop="customCode"/>
  151. <el-table-column label="客户" align="center" prop="custom"/>
  152. <el-table-column label="制单人编码" align="center" prop="creatorCode"/>
  153. <el-table-column label="制单人" align="center" prop="creator"/>
  154. <el-table-column label="部门编码" align="center" prop="deptCode"/>
  155. <el-table-column label="部门" align="center" prop="dept"/>
  156. <el-table-column label="目标类型" align="center" prop="goalCategory"/>
  157. <el-table-column label="目标值合计" align="center" prop="goalSum"/>
  158. <el-table-column label="单据状态" align="center" prop="documentStatus"/>
  159. <el-table-column label="删除状态" align="center" prop="deleteStatus"/>
  160. <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
  161. <template slot-scope="scope">
  162. <el-button
  163. size="mini"
  164. type="text"
  165. icon="el-icon-edit"
  166. @click="handleUpdate(scope.row)"
  167. v-hasPermi="['goal_management:monthGoalMerge:edit']"
  168. >修改
  169. </el-button>
  170. <el-button
  171. size="mini"
  172. type="text"
  173. icon="el-icon-delete"
  174. @click="handleDelete(scope.row)"
  175. v-hasPermi="['goal_management:monthGoalMerge:remove']"
  176. >删除
  177. </el-button>
  178. </template>
  179. </el-table-column>
  180. </el-table>
  181. <pagination
  182. v-show="total>0"
  183. :total="total"
  184. :page.sync="queryParams.pageNum"
  185. :limit.sync="queryParams.pageSize"
  186. @pagination="getList"
  187. />
  188. <!-- 添加或修改月销售目标合并抽屉 -->
  189. <el-drawer :title="title" :visible.sync="open" direction="rtl" :before-close="handleClose" size="100%">
  190. <el-form ref="form" :model="form" :rules="rules" label-width="80px">
  191. <el-row :gutter="20">
  192. <el-col :span="6">
  193. <el-form-item label="编码" prop="code">
  194. <el-input v-model="form.code" placeholder="编码后端自动生成" disabled/>
  195. </el-form-item>
  196. </el-col>
  197. <el-col :span="6">
  198. <el-form-item label="目标名称" prop="goalName">
  199. <el-input v-model="form.goalName" placeholder="目标名称后端自动生成" disabled/>
  200. </el-form-item>
  201. </el-col>
  202. <el-col :span="6">
  203. <el-form-item label="单据日期" prop="documentDate">
  204. <el-date-picker clearable
  205. v-model="form.documentDate"
  206. type="date"
  207. value-format="yyyy-MM-dd"
  208. placeholder="请选择单据日期">
  209. </el-date-picker>
  210. </el-form-item>
  211. </el-col>
  212. <el-col :span="6">
  213. <el-form-item label="年度" prop="annual">
  214. <el-date-picker clearable
  215. v-model="form.annual"
  216. type="year"
  217. value-format="yyyy"
  218. placeholder="请输入年度">
  219. </el-date-picker>
  220. </el-form-item>
  221. </el-col>
  222. </el-row>
  223. <el-row :gutter="20">
  224. <el-col :span="6">
  225. <el-form-item label="月份" prop="monthly">
  226. <el-date-picker clearable
  227. v-model="form.monthly"
  228. type="month"
  229. value-format="M"
  230. placeholder="请输入月份">
  231. </el-date-picker>
  232. </el-form-item>
  233. </el-col>
  234. <el-col :span="6">
  235. <el-form-item label="制单人" prop="creator">
  236. <el-popover-select-v2 v-model="form.creator" title="制单人" valueKey="name"
  237. referName="CONTACTS_PARAM"
  238. :dataMapping="{ creatorCode: 'code', creator: 'name'}"
  239. :source.sync="form" placeholder="请输入制单人">
  240. </el-popover-select-v2>
  241. </el-form-item>
  242. </el-col>
  243. <el-col :span="6">
  244. <el-form-item label="部门" prop="dept">
  245. <el-popover-select-v2 v-model="form.dept" title="部门" valueKey="name"
  246. referName="DEPT_PARAM"
  247. :dataMapping="{ deptCode: 'code', dept: 'name'}"
  248. :source.sync="form" placeholder="请输入部门">
  249. </el-popover-select-v2>
  250. </el-form-item>
  251. </el-col>
  252. <el-col :span="6">
  253. <el-form-item label="目标类型" prop="goalCategory">
  254. <el-select v-model="form.goalCategory" placeholder="请输入目标类型" @change="changeGoalCategoryForm" @keyup.enter.native="handleQuery">
  255. <el-option
  256. v-for="item in goalCategoryList"
  257. :key="item.value"
  258. :label="item.label"
  259. :value="item.value">
  260. </el-option>
  261. </el-select>
  262. </el-form-item>
  263. </el-col>
  264. </el-row>
  265. <el-row :gutter="20">
  266. <el-col :span="6">
  267. <el-form-item label="目标值合计" prop="goalSum">
  268. <el-input v-model="form.goalSum" placeholder="目标值合计自动计算" disabled/>
  269. </el-form-item>
  270. </el-col>
  271. <el-col :span="6">
  272. <el-form-item v-if="form.goalCategory === '客户维度'" label="客户" prop="custom">
  273. <el-popover-select-v2 v-model="form.custom" title="客户" valueKey="name"
  274. referName="CUSTOMER_PARAM"
  275. :dataMapping="{ customCode: 'code', custom: 'name'}"
  276. :source.sync="form" placeholder="请输入客户">
  277. </el-popover-select-v2>
  278. </el-form-item>
  279. <el-form-item v-if="form.goalCategory === '销售区域'" label="销售区域" prop="saleZone">
  280. <el-popover-select-v2 v-model="form.saleZoneCode" title="销售区域" valueKey="name"
  281. referName="DEPT_PARAM"
  282. :dataMapping="{ saleZoneCode: 'code', saleZone: 'name'}"
  283. :source.sync="form" placeholder="请输入销售区域">
  284. </el-popover-select-v2>
  285. </el-form-item>
  286. <el-form-item v-if="form.goalCategory === '一级分类'" label="一级分类" prop="oneLevelClassify">
  287. <el-select v-model="form.oneLevelClassify" size="mini" clearable
  288. @focus="chooseTreeReferForQuery('MATERIALCLASSIFY_PARAM', false, '一级物料分类')"
  289. style="width: 200px">
  290. <el-option v-for="item in classOptions" :key="item.id" :label="item.name" :value="item.id" />
  291. </el-select>
  292. </el-form-item>
  293. <el-form-item v-if="form.goalCategory === '二级分类'" label="二级分类" prop="custom">
  294. <el-select v-model="form.twoLevelClassify" size="mini" clearable
  295. @focus="chooseTreeReferForQuery('MATERIALCLASSIFY_PARAM', false, '二级物料分类')"
  296. style="width: 200px">
  297. <el-option v-for="item in classOptions" :key="item.id" :label="item.name" :value="item.id" />
  298. </el-select>
  299. </el-form-item>
  300. </el-col>
  301. <el-col :span="6">
  302. <el-form-item label="操作">
  303. <el-button type="primary" @click="submitForm">确 定</el-button>
  304. <el-button @click="cancel">取 消</el-button>
  305. </el-form-item>
  306. </el-col>
  307. </el-row>
  308. </el-form>
  309. <el-row :gutter="10" class="mb8">
  310. <el-col :span="1.5">
  311. <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAddDetails">增行</el-button>
  312. </el-col>
  313. </el-row>
  314. <!-- v-loading="loading"-->
  315. <el-table :data="monthGoalMergeDetailsList" @selection-change="handleSelectionChange">
  316. <el-table-column type="selection" width="55" align="center" fixed />
  317. <el-table-column label="销售组织" align="center" prop="saleOrg" width="180">
  318. <template slot-scope="scope">
  319. <el-popover-select-v2 v-model="monthGoalMergeDetailsList[scope.$index].saleOrg" title="销售组织" valueKey="name"
  320. referName="CUSTOMER_PARAM"
  321. :dataMapping="{ saleOrgCode: 'code', saleOrg: 'name'}"
  322. :source.sync="monthGoalMergeDetailsList[scope.$index]" placeholder="请输入销售组织">
  323. </el-popover-select-v2>
  324. </template>
  325. </el-table-column>
  326. <el-table-column label="销售区域" align="center" prop="saleZone" width="180">
  327. <template slot-scope="scope">
  328. <el-popover-select-v2 v-model="monthGoalMergeDetailsList[scope.$index].saleZone" title="销售区域" valueKey="name"
  329. referName="CUSTOMER_PARAM"
  330. :dataMapping="{ saleZoneCode: 'code', saleZone: 'name'}"
  331. :source.sync="monthGoalMergeDetailsList[scope.$index]" placeholder="请输入销售区域">
  332. </el-popover-select-v2>
  333. </template>
  334. </el-table-column>
  335. <el-table-column label="客户" align="center" prop="custom" width="180">
  336. <template slot-scope="scope">
  337. <el-popover-select-v2 v-model="monthGoalMergeDetailsList[scope.$index].custom" title="客户" valueKey="name"
  338. referName="CUSTOMER_PARAM"
  339. :dataMapping="{ customCode: 'code', custom: 'name'}"
  340. :source.sync="monthGoalMergeDetailsList[scope.$index]" placeholder="请输入客户">
  341. </el-popover-select-v2>
  342. </template>
  343. </el-table-column>
  344. <el-table-column label="部门" align="center" prop="dept" width="180">
  345. <template slot-scope="scope">
  346. <el-popover-select-v2 v-model="monthGoalMergeDetailsList[scope.$index].dept" title="部门" valueKey="name"
  347. referName="DEPT_PARAM"
  348. :dataMapping="{ deptCode: 'code', dept: 'name'}"
  349. :source.sync="monthGoalMergeDetailsList[scope.$index]" placeholder="请输入客户">
  350. </el-popover-select-v2>
  351. </template>
  352. </el-table-column>
  353. <el-table-column label="制单人" align="center" prop="creator" width="180">
  354. <template slot-scope="scope">
  355. <el-popover-select-v2 v-model="monthGoalMergeDetailsList[scope.$index].creator" title="负责人" valueKey="name"
  356. referName="CONTACTS_PARAM"
  357. :dataMapping="{ creatorCode: 'code', creator: 'name'}"
  358. :source.sync="monthGoalMergeDetailsList[scope.$index]" placeholder="请输入负责人">
  359. </el-popover-select-v2>
  360. </template>
  361. </el-table-column>
  362. <el-table-column label="科室" align="center" prop="department" width="180">
  363. <template slot-scope="scope">
  364. <el-input v-model="monthGoalMergeDetailsList[scope.$index].department" placeholder="请输入科室"></el-input>
  365. </template>
  366. </el-table-column>
  367. <el-table-column label="一级分类" align="center" prop="oneLevelClassify" width="180">
  368. <template slot-scope="scope">
  369. <el-input v-model="monthGoalMergeDetailsList[scope.$index].oneLevelClassify" disabled></el-input>
  370. </template>
  371. </el-table-column>
  372. <el-table-column label="二级分类" align="center" prop="twoLevelClassify" width="180">
  373. <template slot-scope="scope">
  374. <el-input v-model="monthGoalMergeDetailsList[scope.$index].twoLevelClassify" disabled></el-input>
  375. </template>
  376. </el-table-column>
  377. <el-table-column label="物料" align="center" prop="material" width="180">
  378. <template slot-scope="scope">
  379. <el-popover-select-v2 v-model="monthGoalMergeDetailsList[scope.$index].material" title="物料" valueKey="name"
  380. referName="MATERIAL_PARAM"
  381. :dataMapping="{ materialCode: 'code', material: 'name'}"
  382. :source.sync="monthGoalMergeDetailsList[scope.$index]" placeholder="请输入物料">
  383. </el-popover-select-v2>
  384. </template>
  385. </el-table-column>
  386. <el-table-column label="月份" align="center" prop="num" width="250">
  387. <template slot-scope="scope">
  388. <el-date-picker v-model="monthGoalMergeDetailsList[scope.$index].monthly" value-format="M" type="month" placeholder="选择月份">
  389. </el-date-picker>
  390. </template>
  391. </el-table-column>
  392. <el-table-column label="目标值" align="center" prop="totalGoal" width="220">
  393. <template slot-scope="scope">
  394. <el-input-number @change="computeTotal" v-model="monthGoalMergeDetailsList[scope.$index].goalValue" :precision="2" :step="1" :min="0"></el-input-number>
  395. </template>
  396. </el-table-column>
  397. <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120px" fixed="right">
  398. <template slot-scope="scope">
  399. <el-button
  400. size="mini"
  401. type="text"
  402. icon="el-icon-delete"
  403. @click="handleDeleteDetails(scope.$index, scope.row)"
  404. >删除</el-button>
  405. <el-button
  406. size="mini"
  407. type="text"
  408. icon="el-icon-delete"
  409. @click="handleCopyDetails(scope.row)"
  410. >复制</el-button>
  411. </template>
  412. </el-table-column>
  413. </el-table>
  414. </el-drawer>
  415. <TreeRefers ref="treeQuery" @doSubmit="selectionsToInputForQuery" :single="true"/>
  416. <TreeRefers ref="treeDetails" @doSubmit="selectionsToInputForDetails" :single="true"/>
  417. </div>
  418. </template>
  419. <script>
  420. import {
  421. listMonthGoalMerge,
  422. getMonthGoalMerge,
  423. delMonthGoalMerge,
  424. addMonthGoalMerge,
  425. updateMonthGoalMerge
  426. } from "@/api/business/spd/goal_management/monthGoalMerge";
  427. // 树形参照
  428. import TreeRefers from '@/components/Refers/treeRefer.vue'
  429. import ElPopoverSelectV2 from "@/components/popover-select-v2"
  430. export default {
  431. name: "MonthGoalMerge",
  432. components: {
  433. TreeRefers, ElPopoverSelectV2
  434. },
  435. data() {
  436. return {
  437. // 遮罩层
  438. loading: true,
  439. // 选中数组
  440. ids: [],
  441. // 非单个禁用
  442. single: true,
  443. // 非多个禁用
  444. multiple: true,
  445. // 显示搜索条件
  446. showSearch: true,
  447. // 总条数
  448. total: 0,
  449. // 月销售目标合并表格数据
  450. monthGoalMergeList: [],
  451. monthGoalMergeDetailsList: [],
  452. // 弹出层标题
  453. title: "",
  454. // 是否显示弹出层
  455. open: false,
  456. // 查询参数
  457. queryParams: {
  458. pageNum: 1,
  459. pageSize: 10,
  460. code: null,
  461. goalName: null,
  462. documentDate: null,
  463. annual: null,
  464. monthly: null,
  465. customCode: null,
  466. custom: null,
  467. creatorCode: null,
  468. creator: null,
  469. deptCode: null,
  470. dept: null,
  471. goalCategory: null,
  472. goalSum: null,
  473. documentStatus: null,
  474. deleteStatus: null,
  475. saleZoneCode: null,
  476. saleZone: null,
  477. oneLevelClassifyCode: null,
  478. oneLevelClassify: null,
  479. twoLevelClassifyCode: null,
  480. twoLevelClassify: null,
  481. documentDateRange: null
  482. },
  483. pickerOptions: {
  484. shortcuts: [{
  485. text: '最近一周',
  486. onClick(picker) {
  487. const end = new Date();
  488. const start = new Date();
  489. start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
  490. picker.$emit('pick', [start, end]);
  491. }
  492. }, {
  493. text: '最近一个月',
  494. onClick(picker) {
  495. const end = new Date();
  496. const start = new Date();
  497. start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
  498. picker.$emit('pick', [start, end]);
  499. }
  500. }, {
  501. text: '最近三个月',
  502. onClick(picker) {
  503. const end = new Date();
  504. const start = new Date();
  505. start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
  506. picker.$emit('pick', [start, end]);
  507. }
  508. }]
  509. },
  510. // 表单参数
  511. form: {
  512. id: null,
  513. code: null,
  514. goalName: null,
  515. documentDate: null,
  516. annual: null,
  517. monthly: null,
  518. customCode: null,
  519. custom: null,
  520. creatorCode: null,
  521. creator: null,
  522. deptCode: null,
  523. dept: null,
  524. goalCategory: null,
  525. goalSum: null,
  526. documentStatus: null,
  527. deleteStatus: null,
  528. saleZoneCode: null,
  529. saleZone: null,
  530. oneLevelClassifyCode: null,
  531. oneLevelClassify: null,
  532. twoLevelClassifyCode: null,
  533. twoLevelClassify: null
  534. },
  535. formDetails: {
  536. id: null,
  537. code: null,
  538. saleOrg: null,
  539. saleZone: null,
  540. custom: null,
  541. dept: null,
  542. creator: null,
  543. department: null,
  544. oneLevelClassifyCode: null,
  545. oneLevelClassify: null,
  546. twoLevelClassifyCode: null,
  547. twoLevelClassify: null,
  548. materialCode: null,
  549. material: null,
  550. monthly: null,
  551. goalValue: null
  552. },
  553. // 表单校验
  554. rules: {},
  555. // 目标类型列表
  556. goalCategoryList: [
  557. { value: '客户维度', label: '客户维度' },
  558. { value: '销售区域', label: '销售区域' },
  559. { value: '一级分类', label: '一级分类' },
  560. { value: '二级分类', label: '二级分类' }
  561. ],
  562. // 树形参照
  563. referCondition: {
  564. type: '',
  565. isPage: true,
  566. title: ''
  567. },
  568. classOptions: []
  569. };
  570. },
  571. created() {
  572. this.getList();
  573. },
  574. methods: {
  575. /** 查询月销售目标合并列表 */
  576. getList() {
  577. this.loading = true;
  578. listMonthGoalMerge(this.queryParams).then(response => {
  579. this.monthGoalMergeList = response.rows;
  580. this.total = response.total;
  581. this.loading = false;
  582. });
  583. },
  584. // 取消按钮
  585. cancel() {
  586. this.open = false;
  587. this.reset();
  588. },
  589. // 表单重置
  590. reset() {
  591. this.form = {
  592. id: null,
  593. code: null,
  594. goalName: null,
  595. documentDate: null,
  596. annual: null,
  597. monthly: null,
  598. customCode: null,
  599. custom: null,
  600. creatorCode: null,
  601. creator: null,
  602. deptCode: null,
  603. dept: null,
  604. goalCategory: null,
  605. goalSum: null,
  606. documentStatus: null,
  607. deleteStatus: null,
  608. saleZoneCode: null,
  609. saleZone: null,
  610. oneLevelClassifyCode: null,
  611. oneLevelClassify: null,
  612. twoLevelClassifyCode: null,
  613. twoLevelClassify: null
  614. };
  615. this.resetForm("form");
  616. },
  617. /** 搜索按钮操作 */
  618. handleQuery() {
  619. this.queryParams.pageNum = 1;
  620. this.getList();
  621. },
  622. /** 重置按钮操作 */
  623. resetQuery() {
  624. this.resetForm("queryForm");
  625. this.handleQuery();
  626. },
  627. // 多选框选中数据
  628. handleSelectionChange(selection) {
  629. this.ids = selection.map(item => item.id)
  630. this.single = selection.length !== 1
  631. this.multiple = !selection.length
  632. },
  633. /** 新增按钮操作 */
  634. handleAdd() {
  635. this.reset();
  636. this.open = true;
  637. this.title = "添加月销售目标合并";
  638. },
  639. handleAddDetails() {
  640. let list = {
  641. id: null,
  642. code: null,
  643. saleOrg: null,
  644. saleZone: null,
  645. custom: null,
  646. dept: null,
  647. creator: null,
  648. oneLevelClassifyCode: null,
  649. oneLevelClassify: null,
  650. twoLevelClassifyCode: null,
  651. twoLevelClassify: null,
  652. materialCode: null,
  653. material: null,
  654. department: null,
  655. num: null,
  656. monthly: null,
  657. goalValue: null
  658. }
  659. this.monthGoalMergeDetailsList.push(list)
  660. },
  661. /** 修改按钮操作 */
  662. handleUpdate(row) {
  663. this.reset();
  664. const id = row.id || this.ids
  665. getMonthGoalMerge(id).then(response => {
  666. this.form = response.data;
  667. this.open = true;
  668. this.title = "修改月销售目标合并";
  669. });
  670. },
  671. /** 提交按钮 */
  672. submitForm() {
  673. this.resetQuery()
  674. this.$refs["form"].validate(valid => {
  675. if (valid) {
  676. if (this.form.id != null) {
  677. updateMonthGoalMerge(this.form).then(response => {
  678. this.$modal.msgSuccess("修改成功");
  679. this.open = false;
  680. this.getList();
  681. });
  682. } else {
  683. console.log(this.form);
  684. /*addMonthGoalMerge(this.form).then(response => {
  685. this.$modal.msgSuccess("新增成功");
  686. this.open = false;
  687. this.getList();
  688. });*/
  689. }
  690. }
  691. });
  692. },
  693. /** 删除按钮操作 */
  694. handleDelete(row) {
  695. const ids = row.id || this.ids;
  696. this.$modal.confirm('是否确认删除月销售目标合并编号为"' + ids + '"的数据项?').then(function () {
  697. return delMonthGoalMerge(ids);
  698. }).then(() => {
  699. this.getList();
  700. this.$modal.msgSuccess("删除成功");
  701. }).catch(() => {
  702. });
  703. },
  704. handleDeleteDetails(index, row) {
  705. this.monthGoalMergeDetailsList.splice(index, 1)
  706. this.computeTotal()
  707. },
  708. /** 导出按钮操作 */
  709. handleExport() {
  710. this.download('goal_management/monthGoalMerge/export', {
  711. ...this.queryParams
  712. }, `monthGoalMerge${new Date().getTime()}.xlsx`)
  713. },
  714. // 树形参照
  715. chooseTreeReferForQuery(type, isPage, title) {
  716. this.referCondition.type = type
  717. this.referCondition.isPage = isPage
  718. this.referCondition.title = title
  719. this.$refs.treeQuery.init(this.referCondition)
  720. },
  721. chooseTreeReferForDetails(type, isPage, title) {
  722. this.referCondition.type = type
  723. this.referCondition.isPage = isPage
  724. this.referCondition.title = title
  725. this.$refs.treeDetails.init(this.referCondition)
  726. },
  727. selectionsToInputForQuery(selection) {
  728. this.classOptions.push(selection)
  729. if (this.referCondition.title === '一级物料分类') {
  730. if (selection.code.length !== 1) {
  731. return this.$message.info('请在一级分类下选择')
  732. }
  733. this.queryParams.oneLevelClassifyCode = selection.code
  734. this.queryParams.oneLevelClassify = selection.name
  735. this.form.oneLevelClassifyCode = selection.code
  736. this.form.oneLevelClassify = selection.name
  737. } else if (this.referCondition.title === '二级物料分类') {
  738. if (selection.code.length !== 4) {
  739. return this.$message.info('请在二级分类下选择')
  740. }
  741. this.queryParams.twoLevelClassifyCode = selection.code
  742. this.queryParams.twoLevelClassify = selection.name
  743. this.form.twoLevelClassifyCode = selection.code
  744. this.form.twoLevelClassify = selection.name
  745. }
  746. },
  747. selectionsToInputForDetails(selection) {
  748. this.classOptions.push(selection)
  749. if (this.referCondition.title === '一级物料分类') {
  750. if (selection.code.length !== 1) {
  751. return this.$message.info('请在一级分类中选择')
  752. }
  753. this.formDetails.oneLevelClassifyCode = selection.code
  754. this.formDetails.oneLevelClassify = selection.name
  755. if (selection.code !== this.formDetails.oneLevelClassifyCode) {
  756. this.formDetails.twoLevelClassifyCode = null
  757. this.formDetails.twoLevelClassify = null
  758. }
  759. } else if (this.referCondition.title === '二级物料分类') {
  760. if (selection.code.length !== 4) {
  761. return this.$message.info('请在二级分类中选择')
  762. } else if (selection.code[0] !== this.formDetails.oneLevelClassifyCode) {
  763. return this.$message.error('所选择的二级物料分类不属于一级分类')
  764. }
  765. this.formDetails.twoLevelClassifyCode = selection.code
  766. this.formDetails.twoLevelClassify = selection.name
  767. }
  768. },
  769. // 改变查询表单的目标分类
  770. changeGoalCategory() {
  771. let condition = this.queryParams.goalCategory
  772. if (condition === null) {
  773. this.queryParams.custom = null
  774. this.queryParams.customCode = null
  775. this.queryParams.saleZone = null
  776. this.queryParams.saleZoneCode = null
  777. this.queryParams.oneLevelClassify = null
  778. this.queryParams.oneLevelClassifyCode = null
  779. this.queryParams.twoLevelClassify = null
  780. this.queryParams.twoLevelClassifyCode = null
  781. } else if (condition === '客户维度') {
  782. this.queryParams.saleZone = null
  783. this.queryParams.saleZoneCode = null
  784. this.queryParams.oneLevelClassify = null
  785. this.queryParams.oneLevelClassifyCode = null
  786. this.queryParams.twoLevelClassify = null
  787. this.queryParams.twoLevelClassifyCode = null
  788. } else if (condition === '销售区域') {
  789. this.queryParams.custom = null
  790. this.queryParams.customCode = null
  791. this.queryParams.oneLevelClassify = null
  792. this.queryParams.oneLevelClassifyCode = null
  793. this.queryParams.twoLevelClassify = null
  794. this.queryParams.twoLevelClassifyCode = null
  795. } else if (condition === '一级分类') {
  796. this.queryParams.custom = null
  797. this.queryParams.customCode = null
  798. this.queryParams.saleZone = null
  799. this.queryParams.saleZoneCode = null
  800. this.queryParams.twoLevelClassify = null
  801. this.queryParams.twoLevelClassifyCode = null
  802. } else if (condition === '二级分类') {
  803. this.queryParams.custom = null
  804. this.queryParams.customCode = null
  805. this.queryParams.saleZone = null
  806. this.queryParams.saleZoneCode = null
  807. this.queryParams.oneLevelClassify = null
  808. this.queryParams.oneLevelClassifyCode = null
  809. }
  810. },
  811. changeGoalCategoryForm() {
  812. let condition = this.form.goalCategory
  813. if (condition === null) {
  814. this.form.custom = null
  815. this.form.customCode = null
  816. this.form.saleZone = null
  817. this.form.saleZoneCode = null
  818. this.form.oneLevelClassify = null
  819. this.form.oneLevelClassifyCode = null
  820. this.form.twoLevelClassify = null
  821. this.form.twoLevelClassifyCode = null
  822. } else if (condition === '客户维度') {
  823. this.form.saleZone = null
  824. this.form.saleZoneCode = null
  825. this.form.oneLevelClassify = null
  826. this.form.oneLevelClassifyCode = null
  827. this.form.twoLevelClassify = null
  828. this.form.twoLevelClassifyCode = null
  829. } else if (condition === '销售区域') {
  830. this.form.custom = null
  831. this.form.customCode = null
  832. this.form.oneLevelClassify = null
  833. this.form.oneLevelClassifyCode = null
  834. this.form.twoLevelClassify = null
  835. this.form.twoLevelClassifyCode = null
  836. } else if (condition === '一级分类') {
  837. this.form.custom = null
  838. this.form.customCode = null
  839. this.form.saleZone = null
  840. this.form.saleZoneCode = null
  841. this.form.twoLevelClassify = null
  842. this.form.twoLevelClassifyCode = null
  843. } else if (condition === '二级分类') {
  844. this.form.custom = null
  845. this.form.customCode = null
  846. this.form.saleZone = null
  847. this.form.saleZoneCode = null
  848. this.form.oneLevelClassify = null
  849. this.form.oneLevelClassifyCode = null
  850. }
  851. },
  852. // 关闭抽屉
  853. handleClose(done) {
  854. this.$confirm('确认关闭?')
  855. .then(_ => {
  856. done();
  857. this.resetQuery()
  858. })
  859. .catch(_ => {});
  860. },
  861. // 复制明细
  862. handleCopyDetails(row) {
  863. let list = {
  864. id: row.id,
  865. code: row.code,
  866. saleOrg: row.saleOrg,
  867. saleZone: row.saleZone,
  868. custom: row.custom,
  869. dept: row.dept,
  870. creator: row.creator,
  871. oneLevelClassifyCode: row.oneLevelClassifyCode,
  872. oneLevelClassify: row.oneLevelClassify,
  873. twoLevelClassifyCode: row.twoLevelClassifyCode,
  874. twoLevelClassify: row.twoLevelClassify,
  875. materialCode: row.materialCode,
  876. material: row.material,
  877. department: row.department,
  878. num: row.num,
  879. monthly: row.monthly,
  880. goalValue: row.goalValue
  881. }
  882. this.monthGoalMergeDetailsList.push(list)
  883. this.computeTotal()
  884. },
  885. // 计算主表合计
  886. computeTotal() {
  887. let list = this.monthGoalMergeDetailsList
  888. let sum = 0
  889. for (const listElement of list) {
  890. sum = (sum * 1000000 + listElement.goalValue * 1000000) / 1000000
  891. }
  892. this.form.goalSum = sum
  893. }
  894. }
  895. };
  896. </script>