index.vue 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476
  1. <template>
  2. <div class="app-container">
  3. <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
  4. <el-form-item label="门店名称" prop="shopName">
  5. <el-input
  6. v-model="queryParams.shopName"
  7. placeholder="请输入门店名称"
  8. clearable
  9. size="small"
  10. @keyup.enter.native="handleQuery"
  11. />
  12. </el-form-item>
  13. <el-form-item label="商户名称" prop="merchName">
  14. <el-input
  15. v-model="queryParams.merchName"
  16. placeholder="请输入商户名称"
  17. clearable
  18. size="small"
  19. @keyup.enter.native="handleQuery"
  20. />
  21. </el-form-item>
  22. <!-- <el-form-item label="第三方商户代码" prop="thirdPartyMerchCode">
  23. <el-input
  24. v-model="queryParams.thirdPartyMerchCode"
  25. placeholder="请输入第三方商户代码"
  26. clearable
  27. size="small"
  28. @keyup.enter.native="handleQuery"
  29. />
  30. </el-form-item>
  31. <el-form-item label="第三方商户名称" prop="thirdPartyMerchName">
  32. <el-input
  33. v-model="queryParams.thirdPartyMerchName"
  34. placeholder="请输入第三方商户名称"
  35. clearable
  36. size="small"
  37. @keyup.enter.native="handleQuery"
  38. />
  39. </el-form-item>-->
  40. <el-form-item label="SKU" prop="sku">
  41. <el-input
  42. v-model="queryParams.sku"
  43. placeholder="请输入SKU"
  44. clearable
  45. size="small"
  46. @keyup.enter.native="handleQuery"
  47. />
  48. </el-form-item>
  49. <!-- <el-form-item label="海关代码" prop="cusCode">-->
  50. <!-- <el-select v-model="queryParams.cusCode" placeholder="请选择海关代码" clearable size="small">-->
  51. <!-- <el-option-->
  52. <!-- v-for="dict in cusCodeOptions"-->
  53. <!-- :key="dict.dictValue"-->
  54. <!-- :label="dict.dictLabel"-->
  55. <!-- :value="dict.dictValue"-->
  56. <!-- />-->
  57. <!-- </el-select>-->
  58. <!-- </el-form-item>-->
  59. <!-- <el-form-item label="货品业务类型" prop="goodsBizType">-->
  60. <!-- <el-select v-model="queryParams.goodsBizType" placeholder="请选择货品业务类型" clearable size="small">-->
  61. <!-- <el-option-->
  62. <!-- v-for="dict in goodsBizTypeOptions"-->
  63. <!-- :key="dict.dictValue"-->
  64. <!-- :label="dict.dictLabel"-->
  65. <!-- :value="dict.dictValue"-->
  66. <!-- />-->
  67. <!-- </el-select>-->
  68. <!-- </el-form-item>-->
  69. <!-- <el-form-item label="是否有效" prop="isValid">-->
  70. <!-- <el-select v-model="queryParams.isValid" placeholder="请选择是否有效" clearable size="small">-->
  71. <!-- <el-option-->
  72. <!-- v-for="dict in isValidOptions"-->
  73. <!-- :key="dict.dictValue"-->
  74. <!-- :label="dict.dictLabel"-->
  75. <!-- :value="dict.dictValue"-->
  76. <!-- />-->
  77. <!-- </el-select>-->
  78. <!-- </el-form-item>-->
  79. <el-form-item>
  80. <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
  81. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
  82. </el-form-item>
  83. </el-form>
  84. <el-row :gutter="10" class="mb8">
  85. <!-- <el-col :span="1.5">
  86. <el-button
  87. type="primary"
  88. icon="el-icon-plus"
  89. size="mini"
  90. @click="handleAdd"
  91. v-hasPermi="['biz:mallshopmng:add']"
  92. >新增</el-button>
  93. </el-col>
  94. <el-col :span="1.5">
  95. <el-button
  96. type="success"
  97. icon="el-icon-edit"
  98. size="mini"
  99. :disabled="single"
  100. @click="handleUpdate"
  101. v-hasPermi="['biz:mallshopmng:edit']"
  102. >修改</el-button>
  103. </el-col>
  104. <el-col :span="1.5">
  105. <el-button
  106. type="danger"
  107. icon="el-icon-delete"
  108. size="mini"
  109. :disabled="multiple"
  110. @click="handleDelete"
  111. v-hasPermi="['biz:mallshopmng:remove']"
  112. >删除</el-button>
  113. </el-col>-->
  114. <el-col :span="1.5">
  115. <el-button
  116. type="warning"
  117. icon="el-icon-download"
  118. size="mini"
  119. @click="handleExport"
  120. v-hasPermi="['biz:mallshopmng:export']"
  121. >导出</el-button>
  122. </el-col>
  123. <el-col :span="1.5">
  124. <el-button
  125. type="warning"
  126. icon="el-icon-download"
  127. size="mini"
  128. @click="handlePull"
  129. v-hasPermi="['biz:shopstoreinvemng:pull']"
  130. >拉取</el-button>
  131. </el-col>
  132. <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
  133. </el-row>
  134. <el-table v-loading="loading" :data="mallshopmngList" @selection-change="handleSelectionChange">
  135. <el-table-column type="selection" width="55" align="center" />
  136. <el-table-column label="门店库存编号" align="center" prop="shopInveSn" />
  137. <el-table-column label="门店序号" align="center" prop="shopSn" />
  138. <el-table-column label="门店名称" align="center" prop="shopName" />
  139. <el-table-column label="商户编号" align="center" prop="merchSn" />
  140. <el-table-column label="商户名称" align="center" prop="merchName" />
  141. <el-table-column label="第三方商户代码" align="center" prop="thirdPartyMerchCode" />
  142. <el-table-column label="第三方商户名称" align="center" prop="thirdPartyMerchName" />
  143. <el-table-column label="SKU" align="center" prop="sku" />
  144. <!-- <el-table-column label="海关代码" align="center" prop="cusCode" :formatter="cusCodeFormat" />
  145. <el-table-column label="货品业务类型" align="center" prop="goodsBizType" :formatter="goodsBizTypeFormat" />-->
  146. <el-table-column label="门店库存" align="center" prop="shopInve" />
  147. <el-table-column label="门店可用数" align="center" prop="shopValid" />
  148. <el-table-column label="门店冻结数" align="center" prop="shopFreezeNum" />
  149. <!-- <el-table-column label="门店破损数" align="center" prop="shopDamageNum" />
  150. <el-table-column label="门店灭失数" align="center" prop="shopDestroyLostNum" />
  151. <el-table-column label="门店过期数" align="center" prop="shopExpireNum" />
  152. <el-table-column label="样品展示冻结数" align="center" prop="shopSampleFreezeNum" />
  153. <el-table-column label="门店减扣数,保税展示,易货前,订单减扣数" align="center" prop="shopMinus" />
  154. <el-table-column label="门店增补数,保税展示,易货后,订单补货数" align="center" prop="shopSupp" />
  155. <el-table-column label="进场数量" align="center" prop="inQty" />
  156. <el-table-column label="出场数量" align="center" prop="outQty" />
  157. <el-table-column label="退货数量,保税直营,销售后,客户退货的数量" align="center" prop="returnQty" />
  158. <el-table-column label="销售数量,保税直营,销售数" align="center" prop="saleQty" />
  159. <el-table-column label="移仓转入数量,其它门店转入数" align="center" prop="locInQty" />
  160. <el-table-column label="移仓转出数量,转出到其它门店数" align="center" prop="locOutQty" />-->
  161. <!--<el-table-column label="是否有效" align="center" prop="isValid" :formatter="isValidFormat" />-->
  162. <!--<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
  163. <template slot-scope="scope">
  164. <el-button
  165. size="mini"
  166. type="text"
  167. icon="el-icon-edit"
  168. @click="handleUpdate(scope.row)"
  169. v-hasPermi="['biz:mallshopmng:edit']"
  170. >修改</el-button>
  171. <el-button
  172. size="mini"
  173. type="text"
  174. icon="el-icon-delete"
  175. @click="handleDelete(scope.row)"
  176. v-hasPermi="['biz:mallshopmng:remove']"
  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-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
  190. <el-form ref="form" :model="form" :rules="rules" label-width="80px">
  191. <el-form-item label="门店序号" prop="shopSn">
  192. <el-input v-model="form.shopSn" placeholder="请输入门店序号" />
  193. </el-form-item>
  194. <el-form-item label="门店名称" prop="shopName">
  195. <el-input v-model="form.shopName" placeholder="请输入门店名称" />
  196. </el-form-item>
  197. <el-form-item label="商户编号" prop="merchSn">
  198. <el-input v-model="form.merchSn" placeholder="请输入商户编号" />
  199. </el-form-item>
  200. <el-form-item label="商户名称" prop="merchName">
  201. <el-input v-model="form.merchName" placeholder="请输入商户名称" />
  202. </el-form-item>
  203. <el-form-item label="第三方商户代码" prop="thirdPartyMerchCode">
  204. <el-input v-model="form.thirdPartyMerchCode" placeholder="请输入第三方商户代码" />
  205. </el-form-item>
  206. <el-form-item label="第三方商户名称" prop="thirdPartyMerchName">
  207. <el-input v-model="form.thirdPartyMerchName" placeholder="请输入第三方商户名称" />
  208. </el-form-item>
  209. <el-form-item label="SKU" prop="sku">
  210. <el-input v-model="form.sku" placeholder="请输入SKU" />
  211. </el-form-item>
  212. <el-form-item label="海关代码" prop="cusCode">
  213. <el-select v-model="form.cusCode" placeholder="请选择海关代码">
  214. <el-option
  215. v-for="dict in cusCodeOptions"
  216. :key="dict.dictValue"
  217. :label="dict.dictLabel"
  218. :value="dict.dictValue"
  219. ></el-option>
  220. </el-select>
  221. </el-form-item>
  222. <el-form-item label="货品业务类型" prop="goodsBizType">
  223. <el-select v-model="form.goodsBizType" placeholder="请选择货品业务类型">
  224. <el-option
  225. v-for="dict in goodsBizTypeOptions"
  226. :key="dict.dictValue"
  227. :label="dict.dictLabel"
  228. :value="dict.dictValue"
  229. ></el-option>
  230. </el-select>
  231. </el-form-item>
  232. </el-form>
  233. <div slot="footer" class="dialog-footer">
  234. <el-button type="primary" @click="submitForm">确 定</el-button>
  235. <el-button @click="cancel">取 消</el-button>
  236. </div>
  237. </el-dialog>
  238. </div>
  239. </template>
  240. <script>
  241. import { listMallshopmng, getMallshopmng, delMallshopmng, addMallshopmng, updateMallshopmng, exportMallshopmng ,pullKmallStoreInvemng } from "@/api/mall/mallshopmng";
  242. import {pullKmallInvemng} from "@/api/mall/mallinvemng";
  243. export default {
  244. name: "Mallshopmng",
  245. components: {
  246. },
  247. data() {
  248. return {
  249. // 遮罩层
  250. loading: true,
  251. // 选中数组
  252. ids: [],
  253. // 非单个禁用
  254. single: true,
  255. // 非多个禁用
  256. multiple: true,
  257. // 显示搜索条件
  258. showSearch: true,
  259. // 总条数
  260. total: 0,
  261. // 商户店面库存,包括跨境,一般贸易表格数据
  262. mallshopmngList: [],
  263. // 弹出层标题
  264. title: "",
  265. // 是否显示弹出层
  266. open: false,
  267. // 海关代码字典
  268. cusCodeOptions: [],
  269. // 货品业务类型字典
  270. goodsBizTypeOptions: [],
  271. // 是否有效字典
  272. isValidOptions: [],
  273. // 查询参数
  274. queryParams: {
  275. pageNum: 1,
  276. pageSize: 10,
  277. shopName: null,
  278. merchName: null,
  279. thirdPartyMerchCode: null,
  280. thirdPartyMerchName: null,
  281. sku: null,
  282. cusCode: null,
  283. goodsBizType: null,
  284. isValid: null,
  285. },
  286. // 表单参数
  287. form: {},
  288. // 表单校验
  289. rules: {
  290. }
  291. };
  292. },
  293. created() {
  294. this.getList();
  295. this.getDicts("cus_code").then(response => {
  296. this.cusCodeOptions = response.data;
  297. });
  298. this.getDicts("goods_biz_type").then(response => {
  299. this.goodsBizTypeOptions = response.data;
  300. });
  301. this.getDicts("valid").then(response => {
  302. this.isValidOptions = response.data;
  303. });
  304. },
  305. methods: {
  306. /** 查询商户店面库存,包括跨境,一般贸易列表 */
  307. getList() {
  308. this.loading = true;
  309. listMallshopmng(this.queryParams).then(response => {
  310. this.mallshopmngList = response.rows;
  311. this.total = response.total;
  312. this.loading = false;
  313. });
  314. },
  315. // 海关代码字典翻译
  316. cusCodeFormat(row, column) {
  317. return this.selectDictLabel(this.cusCodeOptions, row.cusCode);
  318. },
  319. // 货品业务类型字典翻译
  320. goodsBizTypeFormat(row, column) {
  321. return this.selectDictLabel(this.goodsBizTypeOptions, row.goodsBizType);
  322. },
  323. // 是否有效字典翻译
  324. isValidFormat(row, column) {
  325. return this.selectDictLabel(this.isValidOptions, row.isValid);
  326. },
  327. // 取消按钮
  328. cancel() {
  329. this.open = false;
  330. this.reset();
  331. },
  332. // 表单重置
  333. reset() {
  334. this.form = {
  335. shopInveSn: null,
  336. shopSn: null,
  337. shopName: null,
  338. merchSn: null,
  339. merchName: null,
  340. thirdPartyMerchCode: null,
  341. thirdPartyMerchName: null,
  342. sku: null,
  343. cusCode: null,
  344. goodsBizType: null,
  345. shopInve: null,
  346. shopValid: null,
  347. shopFreezeNum: null,
  348. shopDamageNum: null,
  349. shopDestroyLostNum: null,
  350. shopExpireNum: null,
  351. shopSampleFreezeNum: null,
  352. shopMinus: null,
  353. shopSupp: null,
  354. inQty: null,
  355. outQty: null,
  356. returnQty: null,
  357. saleQty: null,
  358. locInQty: null,
  359. locOutQty: null,
  360. isValid: null,
  361. createrSn: null,
  362. createTime: null,
  363. moderSn: null,
  364. modTime: null,
  365. tstm: null
  366. };
  367. this.resetForm("form");
  368. },
  369. /** 搜索按钮操作 */
  370. handleQuery() {
  371. this.queryParams.pageNum = 1;
  372. this.getList();
  373. },
  374. /** 重置按钮操作 */
  375. resetQuery() {
  376. this.resetForm("queryForm");
  377. this.handleQuery();
  378. },
  379. // 多选框选中数据
  380. handleSelectionChange(selection) {
  381. this.ids = selection.map(item => item.shopInveSn)
  382. this.single = selection.length!==1
  383. this.multiple = !selection.length
  384. },
  385. /** 新增按钮操作 */
  386. handleAdd() {
  387. this.reset();
  388. this.open = true;
  389. this.title = "添加商户店面库存,包括跨境,一般贸易";
  390. },
  391. /** 修改按钮操作 */
  392. handleUpdate(row) {
  393. this.reset();
  394. const shopInveSn = row.shopInveSn || this.ids
  395. getMallshopmng(shopInveSn).then(response => {
  396. this.form = response.data;
  397. this.open = true;
  398. this.title = "修改商户店面库存,包括跨境,一般贸易";
  399. });
  400. },
  401. /** 提交按钮 */
  402. submitForm() {
  403. this.$refs["form"].validate(valid => {
  404. if (valid) {
  405. if (this.form.shopInveSn != null) {
  406. updateMallshopmng(this.form).then(response => {
  407. this.msgSuccess("修改成功");
  408. this.open = false;
  409. this.getList();
  410. });
  411. } else {
  412. addMallshopmng(this.form).then(response => {
  413. this.msgSuccess("新增成功");
  414. this.open = false;
  415. this.getList();
  416. });
  417. }
  418. }
  419. });
  420. },
  421. /** 删除按钮操作 */
  422. handleDelete(row) {
  423. const shopInveSns = row.shopInveSn || this.ids;
  424. this.$confirm('是否确认删除商户店面库存,包括跨境,一般贸易编号为"' + shopInveSns + '"的数据项?', "警告", {
  425. confirmButtonText: "确定",
  426. cancelButtonText: "取消",
  427. type: "warning"
  428. }).then(function() {
  429. return delMallshopmng(shopInveSns);
  430. }).then(() => {
  431. this.getList();
  432. this.msgSuccess("删除成功");
  433. })
  434. },
  435. /** 导出按钮操作 */
  436. handleExport() {
  437. const queryParams = this.queryParams;
  438. this.$confirm('是否确认导出所有商户店面库存,包括跨境,一般贸易数据项?', "警告", {
  439. confirmButtonText: "确定",
  440. cancelButtonText: "取消",
  441. type: "warning"
  442. }).then(function() {
  443. return exportMallshopmng(queryParams);
  444. }).then(response => {
  445. this.download(response.msg);
  446. })
  447. },
  448. /** 拉取按钮操作 */
  449. handlePull() {
  450. const queryParams = this.queryParams;
  451. const _this=this
  452. // 添加遮罩
  453. this.$confirm('是否确认拉取电商门店所有库存?', "警告", {
  454. confirmButtonText: "确定",
  455. cancelButtonText: "取消",
  456. type: "warning"
  457. }).then(function() {
  458. const loading = _this.$loading({
  459. lock: true,
  460. text: 'Loading',
  461. spinner: 'el-icon-loading',
  462. background: 'rgba(0, 0, 0, 0.7)'
  463. });
  464. return pullKmallStoreInvemng(queryParams,loading,_this);
  465. })
  466. }
  467. }
  468. };
  469. </script>