index.vue 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429
  1. <!-- 采购订单修订—— 查看 -->
  2. <script>
  3. import {
  4. initColumns,
  5. initDicts,
  6. initRules,
  7. initParams,
  8. } from "@/utils/init/index.js";
  9. // import { Columns, TabColumns } from "../add/column";
  10. import orderApi from "@/api/business/purchase/purchase-order";
  11. import { PRINT } from "@/api/business/purchase/task";
  12. import judgeColumns from "../add/column";
  13. const { Columns, TabColumns } = judgeColumns();
  14. const NewColumns = initColumns(Columns);
  15. const NewTabColumns = TabColumns.map((element) => ({
  16. ...element,
  17. tableColumns: initColumns(element.tableColumns),
  18. }));
  19. //
  20. const SelectColumns = NewColumns.filter(column => column.inputType === 'Select')
  21. NewTabColumns.forEach(column => {
  22. SelectColumns.push(...column.tableColumns.filter(cColumn => cColumn.inputType === 'Select'))
  23. });
  24. export default {
  25. name: "SeePurchaseOrderDrawer",
  26. dicts: initDicts(SelectColumns),
  27. components: {
  28. FileUploadCenter: () => import('../components/FileUploadCenter/index.vue'),
  29. FilePrint:() => import('../print/index.vue'),
  30. },
  31. data() {
  32. return {
  33. visible: false,
  34. loading: false,
  35. columns: NewColumns,
  36. printData:{},
  37. rules: initRules(NewColumns),
  38. params: {
  39. ...initParams(NewColumns),
  40. puOrderItemList: [],
  41. puOrderExecuteList: [],
  42. },
  43. tabColumns: NewTabColumns,
  44. tabName: "puOrderItemList",
  45. };
  46. },
  47. computed: {},
  48. watch: {},
  49. methods: {
  50. setVisible(prop) {
  51. this.visible = prop;
  52. if(!this.visible){
  53. this.$refs['orderSeeForm'].clearValidate();
  54. }
  55. },
  56. //查询详情
  57. async fetchItem(prop) {
  58. try {
  59. this.loading = true;
  60. const { code, msg, data } = await orderApi.details(prop);
  61. if (code === 200) {
  62. this.params = data;
  63. }
  64. } catch (err) {
  65. //
  66. } finally {
  67. this.loading = false;
  68. }
  69. try {
  70. this.loading = true;
  71. const { data, code } = await PRINT({ id: this.params.id || 628 });
  72. if (code === 200) {
  73. this.printData = data;
  74. this.loading = false;
  75. }
  76. } catch (err) {
  77. alert(err);
  78. } finally {
  79. }
  80. },
  81. // 取 消
  82. handleCancel() {
  83. // this.params = initParams(Columns);
  84. this.params = {
  85. ...initParams(this.columns),
  86. puOrderItemList: [],
  87. puOrderExecuteList: [],
  88. }
  89. this.setVisible(false);
  90. },
  91. handleRefresh(){
  92. let {id} = this.params;
  93. this.fetchItem(id);
  94. },
  95. // 发送NC
  96. async handleSendNC(){
  97. console.log('发送NC');
  98. try {
  99. let {code} = await orderApi.toNc({ puOrderId:this.params.id});
  100. if(code == 200){
  101. this.handleRefresh();
  102. }
  103. } catch (error) {
  104. }finally{
  105. }
  106. },
  107. // 判断是否能发送NC
  108. judgeIsToNC(){
  109. let {source,status,deliveryStatus} = this.params;
  110. // 自制 & 状态为:自由态、驳回
  111. // if(source === '3' &&(status === '0' || status === '3')){
  112. if(status === '2'){
  113. // 发送NC之后展示 SUCCESS("0","成功"),SEND_IN("1","发送中"),FAILURE("2","失败");
  114. // 未发送 发送过但未成功
  115. if(!deliveryStatus || (deliveryStatus && deliveryStatus !== '0')){
  116. return true;
  117. }
  118. return false;
  119. }
  120. return false;
  121. },
  122. beforeOpen() {
  123. },
  124. },
  125. created() {
  126. },
  127. mounted() { },
  128. destroyed() { },
  129. };
  130. </script>
  131. <template>
  132. <el-drawer
  133. direction="btt"
  134. size="100%"
  135. :with-header="false"
  136. :visible.sync="visible"
  137. @open="beforeOpen"
  138. @close="$emit('close')"
  139. v-loading="loading"
  140. >
  141. <el-form
  142. size="mini"
  143. label-position="right"
  144. label-width="140px"
  145. :model="params"
  146. :rules="rules"
  147. ref="orderSeeForm"
  148. >
  149. <el-card :body-style="{
  150. padding: '20px',
  151. display: 'flex',
  152. 'flex-wrap': 'wrap',
  153. }" style="margin: 10px">
  154. <div slot="header" style="
  155. display: flex;
  156. justify-content: space-between;
  157. align-items: center;
  158. ">
  159. <h3>查看</h3>
  160. <div style="text-align: right">
  161. <!-- <FilePrint :id="params.id"></FilePrint> -->
  162. <FilePrint v-model="printData"></FilePrint>
  163. <el-button size="mini" @click="handleRefresh">刷新</el-button>
  164. <template v-if="judgeIsToNC()">
  165. <el-tooltip
  166. class="box-item"
  167. effect="dark"
  168. :key="params.deliveryStatus"
  169. :content="params.deliveryMsg"
  170. placement="bottom-end"
  171. >
  172. <el-button
  173. :key="params.deliveryStatus"
  174. :disabled="params.deliveryStatus === '1' "
  175. size="mini"
  176. type="primary"
  177. @click="handleSendNC"
  178. >{{ params.deliveryStatus === '1' ? '发送中' :
  179. (params.deliveryStatus === '2'? '重新发送NC' : '发送NC')
  180. }}</el-button>
  181. </el-tooltip>
  182. </template>
  183. <el-button size="mini" @click="handleCancel">取 消</el-button>
  184. </div>
  185. </div>
  186. <el-row style="display:flex; flex-wrap: wrap;">
  187. <el-col v-for="(column, index) in columns" :key="index" :span="column.span || 6">
  188. <el-form-item :prop="column.key" :label="column.title">
  189. <el-input v-if="column.inputType === 'Input'"
  190. v-model="params[column.key]"
  191. :placeholder="column.placeholder"
  192. :clearable="column.clearable"
  193. readonly
  194. style="width: 100%"
  195. ></el-input>
  196. <dr-popover-select v-if="column.inputType === 'PopoverSelect'"
  197. v-model="params[column.key]"
  198. disabled
  199. :value-key="column.valueKey"
  200. :source.sync="params"
  201. :title="column.title"
  202. :type="column.referName"
  203. :multiple="column.multiple"
  204. :placeholder="column.placeholder"
  205. :data-mapping="column.dataMapping"
  206. :query-params="column.queryParams"
  207. ></dr-popover-select>
  208. <el-input v-if="column.inputType === 'Textarea'"
  209. v-model="params[column.key]"
  210. type="textarea"
  211. :placeholder="column.placeholder"
  212. :clearable="column.clearable"
  213. readonly
  214. style="width: 100%"
  215. ></el-input>
  216. <el-input-number v-if="column.inputType === 'InputNumber'"
  217. v-model="params[column.key]"
  218. :controls-position="column.controlsPosition"
  219. :placeholder="column.placeholder"
  220. :clearable="column.clearable"
  221. :precision="column.precision"
  222. disabled
  223. style="width: 100%"
  224. ></el-input-number>
  225. <el-select v-if="column.inputType === 'Select'"
  226. v-model="params[column.key]"
  227. disabled
  228. size="mini"
  229. :clearable="column.clearable"
  230. :placeholder="column.placeholder"
  231. style="width: 100%">
  232. <el-option
  233. v-for="item in dict.type[column.referName]"
  234. :key="item.value"
  235. :label="item.label"
  236. :value="item.value"
  237. >
  238. </el-option>
  239. </el-select>
  240. <el-select v-if="column.inputType === 'TagSelect'"
  241. v-model="params[column.key]"
  242. multiple
  243. clearable
  244. collapse-tags
  245. :placeholder="column.placeholder"
  246. :clearable="column.clearable"
  247. disabled
  248. style="width: 100%">
  249. <template #prefix>
  250. <el-icon class="el-icon-view"
  251. style="cursor: pointer"
  252. @click.stop="$message.info(234)">
  253. </el-icon>
  254. </template>
  255. <el-option
  256. v-for="item in options"
  257. :key="item.value"
  258. :label="item.label"
  259. :value="item.value"
  260. >
  261. </el-option>
  262. </el-select>
  263. <el-date-picker v-if="column.inputType === 'DatePicker'"
  264. v-model="params[column.key]"
  265. :type="column.type"
  266. :placeholder="column.placeholder"
  267. :clearable="column.clearable"
  268. readonly
  269. :picker-options="column.pickerOptions"
  270. style="width: 100%"
  271. ></el-date-picker>
  272. <el-checkbox v-if="column.inputType === 'Checkbox'"
  273. v-model="params[column.key]"
  274. disabled
  275. true-label="Y"
  276. false-label="N"
  277. ></el-checkbox>
  278. <file-upload-center v-if="column.inputType === 'Upload'"
  279. v-model="params[column.key]"
  280. :file-type="column.fileType"
  281. :disabled="true"
  282. ></file-upload-center>
  283. </el-form-item>
  284. </el-col>
  285. </el-row>
  286. </el-card>
  287. <el-card :body-style="{
  288. padding: '20px',
  289. display: 'flex',
  290. 'flex-wrap': 'wrap',
  291. position: 'relative',
  292. }" style="margin: 10px">
  293. <el-tabs v-model="tabName" style="width: 100%">
  294. <el-tab-pane
  295. v-for="(column, index) in tabColumns"
  296. :key="index"
  297. :label="column.title"
  298. :name="column.key"
  299. >
  300. <el-table
  301. :data="params[column.key].filter(item => item.delFlag === '0')"
  302. style="width: 100%"
  303. :height="params[column.key].filter(item => item.delFlag === '0').length ? 300 : 100"
  304. border
  305. >
  306. <el-table-column label="序号">
  307. <template slot-scope="scope">
  308. {{ scope.$index + 1 }}
  309. </template>
  310. </el-table-column>
  311. <el-table-column
  312. v-for="(cColumn, cIndex) in column.tableColumns"
  313. :key="cIndex"
  314. :prop="cColumn.key"
  315. :label="cColumn.title"
  316. :width="cColumn.width"
  317. >
  318. <template slot="header" slot-scope="scope">
  319. <span v-if="cColumn.require" style="color: #ff4949">*</span>
  320. <span>
  321. {{ cColumn.title }}
  322. </span>
  323. </template>
  324. <template slot-scope="scope">
  325. <el-form-item label-width="0">
  326. <span v-if="!cColumn.inputType">
  327. {{ scope.row[cColumn.key] }}
  328. </span>
  329. <el-input v-if="cColumn.inputType === 'Input'"
  330. v-model="scope.row[cColumn.key]"
  331. :placeholder="cColumn.placeholder"
  332. :clearable="cColumn.clearable"
  333. readonly
  334. size="mini"
  335. style="width: 100%"
  336. ></el-input>
  337. <!-- -->
  338. <dr-popover-select v-if="cColumn.inputType === 'PopoverSelect'"
  339. v-model="scope.row[cColumn.key]"
  340. :source.sync="scope.row"
  341. :title="cColumn.title"
  342. :value-key="cColumn.valueKey"
  343. disabled
  344. :type="cColumn.referName"
  345. :multiple="cColumn.multiple"
  346. :placeholder="cColumn.placeholder"
  347. :data-mapping="cColumn.dataMapping"
  348. :query-params="cColumn.queryParams"
  349. size="mini"
  350. ></dr-popover-select>
  351. <el-input-number v-if="cColumn.inputType === 'InputNumber'"
  352. v-model="scope.row[cColumn.key]"
  353. :precision="cColumn.precision"
  354. :controls-position="cColumn.controlsPosition"
  355. :placeholder="cColumn.placeholder"
  356. :clearable="cColumn.clearable"
  357. disabled
  358. size="mini"
  359. style="width: 100%"
  360. ></el-input-number>
  361. <el-select v-if="cColumn.inputType === 'Select'"
  362. v-model="scope.row[cColumn.key]"
  363. disabled
  364. size="mini"
  365. :clearable="cColumn.clearable"
  366. :placeholder="cColumn.placeholder"
  367. style="width: 100%">
  368. <el-option
  369. v-for="item in dict.type[cColumn.referName]"
  370. :key="item.value"
  371. :label="item.label"
  372. :value="item.value"
  373. ></el-option>
  374. </el-select>
  375. <el-checkbox v-if="cColumn.inputType === 'Checkbox'"
  376. v-model="scope.row[cColumn.key]"
  377. disabled
  378. true-label="Y"
  379. false-label="N"
  380. ></el-checkbox>
  381. </el-form-item>
  382. </template>
  383. </el-table-column>
  384. </el-table>
  385. </el-tab-pane>
  386. </el-tabs>
  387. </el-card>
  388. </el-form>
  389. </el-drawer>
  390. </template>