goods_classify_add_edit.vue 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
  1. <template>
  2. <div class="container add_edit">
  3. <el-form :model="form" ref="ruleForm" :rules="rules" label-width="100px">
  4. <el-form-item label="上级分类">
  5. <el-select class="sele" v-model="form.pid" placeholder="请选择" :disabled="dataId != ''">
  6. <el-option v-for="(item, idx) in classData" :key="idx" :label="item.name" :value="item.id">
  7. </el-option>
  8. </el-select>
  9. </el-form-item>
  10. <el-form-item label="分类名称" prop="name" ref="name">
  11. <el-input v-model="form.name" placeholder="分类名称"></el-input>
  12. </el-form-item>
  13. <el-form-item label="图标">
  14. <uni-file-picker v-model="imageValue" fileMediatype="image" returnType="object"
  15. :image-styles="imageStyle" @select="imgUpload" @delete="imgDelete" />
  16. </el-form-item>
  17. <el-form-item label="排序">
  18. <el-input type="number" v-model.number="form.sort" min="0" placeholder="请输入排序"></el-input>
  19. <div class="remark_txt">此处排序将决定前端模块的位置,数字越小,位置越前</div>
  20. </el-form-item>
  21. <el-form-item label="状态">
  22. <el-switch v-model="form.state" active-color="#ff6a6c" inactive-color="#bbb" active-value="1"
  23. inactive-value="0"></el-switch>
  24. </el-form-item>
  25. <el-form-item>
  26. <el-button class="confirm_btn" @click="submitForm('ruleForm')">确 定</el-button>
  27. <el-button @click="returnPage">返回列表</el-button>
  28. </el-form-item>
  29. </el-form>
  30. </div>
  31. </template>
  32. <script>
  33. import bus from '@/common/bus';
  34. const __name = 'usemall-goods-category';
  35. export default {
  36. props: {},
  37. data() {
  38. return {
  39. dataId: '',
  40. form: {
  41. sort: 0,
  42. pid: '',
  43. name: '',
  44. icon: '',
  45. state: '1',
  46. level:'',
  47. id:'',
  48. },
  49. imageValue: null,
  50. imageStyle: {
  51. height: '150px',
  52. width: '150px'
  53. },
  54. classData: [],
  55. rules: {
  56. name: [{
  57. required: true,
  58. message: '请输入分类名称',
  59. trigger: 'change'
  60. }]
  61. },
  62. now_date:'',//当前时间
  63. };
  64. },
  65. methods: {
  66. loadData() {
  67. this.getNowDate()
  68. //获取依据数据
  69. this.$axios.get("/goodsCategory/open/list",
  70. {
  71. params:{
  72. },
  73. headers:{
  74. }
  75. }).then(response => {
  76. let res = response
  77. if (res.success) {
  78. this.classData = res.data
  79. console.log(this.classData)
  80. } else {
  81. }
  82. }).catch(res =>{
  83. });
  84. // this.$db[__name]
  85. // .where({
  86. // pid: ''
  87. // })
  88. // .tolist({
  89. // page: 1,
  90. // rows: 500
  91. // })
  92. // .then(res => {
  93. // if (res.code == 200) {
  94. // this.classData = res.datas.filter(x => !x.pid);
  95. // this.classData.unshift({
  96. // _id: '',
  97. // name: '请选择'
  98. // });
  99. // }
  100. // });
  101. if (!this.dataId) {
  102. return;
  103. }
  104. // this.$db[__name].tofirst(this.dataId).then(res => {
  105. // if (res.code == 200) {
  106. // for (let item in this.form) {
  107. // this.form[item] = res.datas[item];
  108. // }
  109. // if (this.form.img) {
  110. // this.imageValue = {};
  111. // this.imageValue.url = this.form.img;
  112. // }
  113. // }
  114. // });
  115. },
  116. submitForm(formName) {
  117. this.$refs[formName].validate((valid, obj) => {
  118. // 默认获取第一个未验证 form 属性名
  119. this.$api.set_unvalidated_form_focus(this, obj);
  120. if (valid) {
  121. console.log(!this.form.pid)
  122. console.log(this.form.name)
  123. if(!this.form.pid){
  124. var level=1
  125. }else{
  126. level=2
  127. }
  128. if (!this.dataId) {//新增
  129. this.$axios.post("/goodsCategory/admin/save",
  130. {
  131. 'createBy':uni.getStorageSync("nickName"),//创建人
  132. 'createTime':this.now_date,//创建时间
  133. "name": this.form.name,
  134. "icon": this.form.icon,
  135. "level": level,
  136. 'sort':this.form.sort,//排序
  137. 'state':this.form.state,
  138. 'pid':this.form.pid
  139. },
  140. {
  141. headers:{
  142. 'Mall-Token': uni.getStorageSync("token")
  143. }
  144. }).then(response => {
  145. let res = response
  146. if (res.success) {
  147. this.getOpenerEventChannel().emit('loadData');
  148. this.returnPage();
  149. } else {
  150. }
  151. }).catch(res =>{
  152. });
  153. // this.$db[__name].add(this.form).then(res => {
  154. // if (res.code == 200) {
  155. // this.getOpenerEventChannel().emit('loadData');
  156. // this.returnPage();
  157. // }
  158. // });
  159. } else {
  160. this.$axios.put("/goodsCategory/admin/update",
  161. {
  162. 'createBy':this.form.createBy,//创建人
  163. 'createTime':this.form.createTime,//创建时间
  164. 'updateBy':uni.getStorageSync("nickName"),//更新人
  165. 'updateTime':this.now_date,//更新时间
  166. "name": this.form.name,
  167. "icon": this.form.icon,
  168. "level": this.form.level,
  169. "pid": this.form.pid,
  170. 'sort':this.form.sort,//排序
  171. 'state':this.form.state,
  172. 'id':this.dataId
  173. },
  174. {
  175. headers:{
  176. 'Mall-Token': uni.getStorageSync("token")
  177. }
  178. }).then(response => {
  179. let res = response
  180. if (res.success) {
  181. this.getOpenerEventChannel().emit('loadData');
  182. this.returnPage();
  183. } else {
  184. alert(res.message)
  185. }
  186. })
  187. // this.$db[__name].update(this.dataId, this.form).then(res => {
  188. // if (res.code == 200) {
  189. // this.getOpenerEventChannel().emit('loadData');
  190. // this.returnPage();
  191. // }
  192. // });
  193. }
  194. }
  195. });
  196. },
  197. imgUpload(e) {
  198. this.form.icon = e.tempFiles[0].file;
  199. const file = this.form.icon;
  200. const formData = new FormData();
  201. formData.append('file', file);
  202. // 文件上传
  203. this.$axios.post("/file/open/",formData,
  204. {
  205. headers:{
  206. 'Content-type' : 'multipart/form-data'
  207. }
  208. }).then(response => {
  209. let res = response
  210. if (res.success) {
  211. this.form.icon =res.data
  212. } else {
  213. uni.showToast({
  214. icon:'error',
  215. title: '请重新上传!'
  216. });
  217. this.form.icon =''
  218. this.imageValue = null;
  219. }
  220. }).catch(res =>{
  221. uni.showToast({
  222. icon:'error',
  223. title: '请重新上传!'
  224. });
  225. this.form.icon =''
  226. this.imageValue = null;
  227. });
  228. },
  229. imgDelete() {
  230. this.imageValue = null;
  231. this.form.icon = '';
  232. },
  233. returnPage() {
  234. bus.$emit('tab-close');
  235. this.$router.push('/pages/goods/classify/goods_classify');
  236. },
  237. //获取当前时间
  238. getNowDate() {
  239. var _this = this;
  240. // this.timer = setInterval(function() {
  241. var aData = new Date();
  242. var month = aData.getMonth() < 9 ? "0" + (aData.getMonth() + 1) : aData.getMonth() + 1;
  243. var date = aData.getDate() <= 9 ? "0" + aData.getDate() : aData.getDate();
  244. var date2 = aData.getDate() <= 9 ? "0" + (aData.getDate()-1) : (aData.getDate()-1);
  245. var Hour = aData.getHours() <= 9 ? "0" + (aData.getHours()) : aData.getHours();
  246. var Miunte = aData.getMinutes() <= 9 ? "0" + (aData.getMinutes()) : aData.getMinutes();
  247. var Seconds = aData.getSeconds() <= 9 ? "0" + (aData.getSeconds()) : aData.getSeconds();
  248. // console.log(aData.getTime())
  249. _this.now_date = aData.getFullYear() + "-" + month + "-" + date + ' '+ Hour +":"+ Miunte +":"+ Seconds;
  250. // console.log(aData.getFullYear() + "-" + month + "-" + date2)昨天
  251. // }, 86400000);
  252. },
  253. },
  254. created() {
  255. this.dataId = this.$route.query.id || '';
  256. this.loadData();
  257. this.form.sort=this.$route.query.sort
  258. if(!this.$route.query.pid){
  259. return
  260. }else{
  261. this.form.pid=this.$route.query.pid.slice(0,19)
  262. }
  263. this.form.name=this.$route.query.name
  264. this.form.icon=this.$route.query.icon
  265. this.form.state=this.$route.query.state
  266. this.form.level=this.$route.query.level
  267. if (this.$route.query.icon) {
  268. this.imageValue = {};
  269. this.imageValue.url = this.$route.query.icon;
  270. }
  271. }
  272. };
  273. </script>
  274. <style></style>