index.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349
  1. <template>
  2. <div class="app-container">
  3. <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="120px">
  4. <el-form-item label="票务名称" label-width="70px">
  5. <el-input
  6. v-model="queryParams.goodsName"
  7. placeholder="请输入票务名称"
  8. clearable
  9. style="width: 240px;"
  10. @keyup.enter.native="handleQuery"
  11. />
  12. </el-form-item>
  13. <el-form-item>
  14. <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
  15. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
  16. </el-form-item>
  17. </el-form>
  18. <el-row :gutter="10" class="mb8">
  19. <el-col :span="1.5">
  20. <el-button
  21. type="primary"
  22. plain
  23. icon="el-icon-plus"
  24. size="mini"
  25. @click="handleAdd"
  26. v-hasPermi="['distributionTicketMr:distributionTicketMr:add']"
  27. >新增</el-button>
  28. </el-col>
  29. <!-- <el-col :span="1.5">
  30. <el-button
  31. type="primary"
  32. plain
  33. size="mini"
  34. @click="handleSetTaxRateAdd"
  35. v-hasPermi="['distributionTicketMr:distributionTicketMr:add']"
  36. >佣金税率设置</el-button>
  37. </el-col> -->
  38. <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
  39. </el-row>
  40. <el-table ref="tables" v-loading="loading" :data="dataList" border>
  41. <el-table-column label="序号" align="center" type="index" width="50"></el-table-column>
  42. <el-table-column label="剧目名称" align="center" prop="performName" />
  43. <el-table-column label="票务名称" align="center" prop="goodsName" />
  44. <el-table-column label="座位类型" align="center" prop="seatTypeName" />
  45. <el-table-column label="销售价" align="center" prop="brokerageTotal">
  46. <template slot-scope="scope">
  47. <span v-if="scope.row.originalSalePrice || scope.row.originalSalePrice==0">¥{{ scope.row.originalSalePrice }}</span>
  48. </template>
  49. </el-table-column>
  50. <el-table-column label="分销价" align="center" prop="withdrawTotal">
  51. <template slot-scope="scope">
  52. <span v-if="scope.row.salePrice || scope.row.salePrice==0">¥{{ scope.row.salePrice }}</span>
  53. </template>
  54. </el-table-column>
  55. <el-table-column label="佣金" align="center" prop="brokeragePrice">
  56. <template slot-scope="scope">
  57. <span v-if="scope.row.brokeragePrice || scope.row.brokeragePrice==0">¥{{ scope.row.brokeragePrice }}</span>
  58. </template>
  59. </el-table-column>
  60. <!-- <el-table-column label="佣金单价" align="center" prop="brokeragePriceRate">
  61. <template slot-scope="scope">
  62. <span>{{ brokeragePriceRate(scope.row) }}</span>
  63. </template>
  64. </el-table-column> -->
  65. <!-- <el-table-column label="佣金税率(%)" align="center" prop="brokerageTaxRate" /> -->
  66. <el-table-column label="状态" align="center">
  67. <template slot-scope="scope">
  68. <el-tag type="success" v-if="scope.row.status == 1">己上架</el-tag>
  69. <el-tag type="info" v-if="scope.row.status == 0">未上架</el-tag>
  70. </template>
  71. </el-table-column>
  72. <el-table-column label="添加时间" align="center" prop="createTime" width="160">
  73. <template slot-scope="scope">
  74. <span>{{ parseTime(scope.row.createTime) }}</span>
  75. </template>
  76. </el-table-column>
  77. <el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
  78. <template slot-scope="scope">
  79. <el-button
  80. size="mini"
  81. type="text"
  82. @click="handleUpdate(scope.row)"
  83. v-hasPermi="['distributionTicketMr:distributionTicketMr:edit']"
  84. >修改</el-button>
  85. <el-button
  86. size="mini"
  87. type="text"
  88. @click="ionlineApi(scope.row)"
  89. v-hasPermi="['distributionTicketMr:distributionTicketMr:online']"
  90. >{{ scope.row.status == 1 ? '下架' : '上架' }}</el-button>
  91. <el-button
  92. size="mini"
  93. type="text"
  94. @click="handleDelete(scope.row,scope.index)"
  95. v-hasPermi="['distributionTicketMr:distributionTicketMr:delete']"
  96. >删除</el-button>
  97. </template>
  98. </el-table-column>
  99. </el-table>
  100. <pagination
  101. v-show="total>0"
  102. :total="total"
  103. :page.sync="queryParams.pageNum"
  104. :limit.sync="queryParams.pageSize"
  105. @pagination="getList"
  106. />
  107. <!-- 新增/编辑弹框 -->
  108. <add-and-edit
  109. ref="addAndEdit"
  110. :dict="dict"
  111. @getList="getList"
  112. />
  113. <setTaxRate ref="setTaxRate" @getList="getList" />
  114. <el-dialog
  115. title="查看"
  116. :visible.sync="visibleStatus"
  117. width="600px"
  118. :destroy-on-close="true"
  119. :close-on-click-modal="false"
  120. >
  121. <div v-if="visibleType == 'img'">
  122. <el-image
  123. style="width: 400px; height: 100%"
  124. :src="newObj.mainImg"
  125. fit="cover"
  126. />
  127. </div>
  128. <div v-if="visibleType == 'html'">
  129. <div v-html="newObj.centent"></div>
  130. </div>
  131. <div slot="footer" class="dialog-footer">
  132. <el-button type="primary" @click="visibleStatus = false">确 定</el-button>
  133. </div>
  134. </el-dialog>
  135. </div>
  136. </template>
  137. <script>
  138. import { pageList, deleteById, updateStatus } from '@/api/distribution/ticketMr'
  139. import addAndEdit from "./dialog/addAndEdit.vue";
  140. import setTaxRate from "./dialog/setTaxRate.vue"
  141. import * as mathFun from 'mathjs'
  142. export default {
  143. name: "TicketMr",
  144. dicts: ['distribution_type'],
  145. components: { addAndEdit, setTaxRate},
  146. data() {
  147. return {
  148. // 遮罩层
  149. loading: true,
  150. // 选中数组
  151. ids: [],
  152. // 非单个禁用
  153. single: true,
  154. // 非多个禁用
  155. multiple: true,
  156. // 显示搜索条件
  157. showSearch: true,
  158. // 总条数
  159. total: 0,
  160. // 用户表格数据
  161. dataList: null,
  162. // 弹出层标题
  163. title: "",
  164. // 是否显示弹出层
  165. open: false,
  166. // 日期范围
  167. dateRange: [],
  168. // 查询参数
  169. queryParams: {
  170. pageNum: 1,
  171. pageSize: 10,
  172. type: undefined
  173. },
  174. statusList: [
  175. {id: 1, name: '未发布', value: 0},
  176. {id: 2, name: '发布', value: 1},
  177. {id: 3, name: '下架', value: 2},
  178. ],
  179. visibleStatus: false,
  180. newObj: {},
  181. visibleType: '',
  182. setStatus: false,
  183. setForm: {},
  184. setRules: [],
  185. setLoading: false,
  186. taxRate: null,
  187. };
  188. },
  189. created() {
  190. this.getList();
  191. },
  192. methods: {
  193. /** 查询列表 */
  194. getList() {
  195. this.loading = true;
  196. pageList(this.queryParams)
  197. .then(response => {
  198. this.dataList = response.data.rows;
  199. this.dataList.forEach(item =>{
  200. item.switchValue = item.status;
  201. })
  202. if(this.dataList && this.dataList.length>0 ){
  203. this.taxRate = this.dataList[0].brokerageTaxRate
  204. }else {
  205. this.taxRate = null
  206. }
  207. this.total = response.data.total;
  208. this.loading = false;
  209. }
  210. );
  211. },
  212. // 取消按钮
  213. cancel() {
  214. this.open = false;
  215. },
  216. /** 搜索按钮操作 */
  217. handleQuery() {
  218. this.queryParams.pageNum = 1;
  219. this.getList();
  220. },
  221. /** 重置按钮操作 */
  222. resetQuery() {
  223. this.dateRange = [];
  224. this.$set(this.queryParams, 'goodsName', '');
  225. this.queryParams.pageNum = 1;
  226. this.handleQuery();
  227. },
  228. /** 价格输入事件 */
  229. changePriceAmount(key) {
  230. if(this.setForm[key] * 1 < 0){
  231. this.$message.error("输入需大于或等于0!");
  232. this.$set(this.setForm, key, '');
  233. return false
  234. }
  235. },
  236. /** 新增按钮操作 */
  237. handleAdd() {
  238. this.$refs["addAndEdit"].openDialog("新增数据", null);
  239. },
  240. /** 设置税率 */
  241. handleSetTaxRateAdd() {
  242. this.$refs["setTaxRate"].openDialog("新增数据", {taxRate: this.taxRate});
  243. },
  244. /** 修改按钮操作 */
  245. handleUpdate(row) {
  246. this.$refs["addAndEdit"].openDialog("修改数据", row);
  247. },
  248. /**
  249. * 分析提现
  250. * @date 2023-11-22
  251. * @returns {any}
  252. */
  253. submitForm() {
  254. this.$refs["setForm"].validate(async (valid) => {
  255. if (valid) {
  256. try {
  257. this.setLoading = true;
  258. const { code } = await configUpdate({ ...this.setForm });
  259. if (code === 200) {
  260. this.setLoading = false;
  261. this.$message.success("操作成功!");
  262. this.getList();
  263. this.setStatus = false;
  264. }
  265. } catch (error) {
  266. } finally {
  267. this.setLoading = false;
  268. }
  269. }
  270. });
  271. },
  272. /** 禁用或者启用发布按钮操作 */
  273. ionlineApi(row) {
  274. this.$confirm("是否对剧目名称为" + row.performName + "的数据进行" + (row.status == 1 ? '下架?' : '上架?'), '提示', {
  275. confirmButtonText: '确定',
  276. cancelButtonText: '取消',
  277. type: 'warning'
  278. }).then(() => {
  279. updateStatus({ id: row.id, status: row.status == 1 ? 0 : 1 }).then((res) => {
  280. if (res.code == 200) {
  281. this.$message({
  282. type: 'success',
  283. message: '操作成功!'
  284. });
  285. this.getList();
  286. }
  287. });
  288. }).catch(() => {});
  289. },
  290. /** 置顶或者取消置顶按钮操作 */
  291. resettingApi(row) {
  292. this.$confirm("是否对剧目名称为" + row.performName + "的数据进行密码重置,重置后的密码为123456?", '提示', {
  293. confirmButtonText: '确定',
  294. cancelButtonText: '取消',
  295. type: 'warning'
  296. }).then(() => {
  297. updateStatus({ id: row.id, password: '123456' }).then((res) => {
  298. if (res.code == 200) {
  299. this.$message({
  300. type: 'success',
  301. message: '操作成功!'
  302. });
  303. this.getList();
  304. }
  305. });
  306. }).catch(() => {});
  307. },
  308. /** 删除按钮操作 */
  309. handleDelete(row) {
  310. this.$modal.confirm('是否确认删除数据剧目名称为"' + row.performName + '"的数据项?').then(function() {
  311. return deleteById(row.id);
  312. }).then(() => {
  313. this.getList();
  314. this.$modal.msgSuccess("删除成功");
  315. }).catch(() => {});
  316. },
  317. /** 查看按钮操作 */
  318. seeCenter(obj, type) {
  319. this.visibleStatus = true
  320. this.visibleType = type;
  321. this.newObj = obj;
  322. },
  323. /** 佣金单价 */
  324. brokeragePriceRate(row){
  325. let str = '-'
  326. if(row.brokeragePrice&&row.brokerageTaxRate){
  327. str = mathFun.subtract(row.brokeragePrice,mathFun.multiply(row.brokeragePrice,row.brokerageTaxRate/100))
  328. }else if(row.brokeragePrice||row.brokerageTaxRate==0||row.brokeragePrice==0) {
  329. str = row.brokeragePrice
  330. }else {
  331. str = '-'
  332. }
  333. return str!='-'? '¥' + ( str.toFixed(2) ):str
  334. }
  335. }
  336. };
  337. </script>